Skip to content

ギャラクシータイムライン付きグラレコ V3a

想定用途

  • 宇宙をテーマとした幻想的でポップな雰囲気のタイムラインを作成したい
  • トロピカルフルーツパンチカラーパレットを使用した鮮やかなタイムラインを作りたい
  • 惑星風マーカーと星屑背景の神秘的なタイムラインを生成したい

プロンプト本文

text
# ギャラクシータイムライン付きグラフィックレコーディング (グラレコ) HTML 作成プロンプト V3

## 目的
以下の内容を、宇宙をテーマとした幻想的でポップな雰囲気のタイムライン形式グラフィックレコーディングHTMLに変換してください。情報設計とビジュアルデザインの両面で最高水準を目指します。手書き風の要素と宇宙の背景を活用して、神秘的かつ視覚的に魅力的なタイムラインを作成します。

## デザイン仕様
### 1. カラースキーム(トロピカルフルーツパンチ)
```

2. 宇宙テーマの視覚効果

  • 暗い宇宙背景(#080808)に小さな星を散りばめる
  • 左上に大きな「太陽」のような光源を配置(パレットの主要色を使用)
  • アニメーションで光源に呼吸するような動きを与える
  • 円形マーカーはカラフルな「惑星」のようなデザイン
  • 全体に星屑のような微細な背景テクスチャを適用

3. タイムライン構造

  • 中央に垂直のタイムラインを設置
  • 項目を左右交互に配置
  • 各項目に惑星風の丸いマーカーを追加
  • 年代表示を浮き上がるカードのようにデザイン
  • 底部または右側にクイックナビゲーションセレクターを配置
  • マーカーとセレクターに輝く効果を追加

4. タイポグラフィとテキスト処理

  • タイトル:夜空に輝く星のような発光効果を追加
  • 日付:白背景に浮かぶ形で強調
  • イベントタイトル:パレットの明るい色(Tropical-Fruit-Punch-3, 4)で表示
  • 詳細テキスト:半透明の背景に明るいテキスト
  • フォント指定:Kaisei Decol, Yomogi, Zen Kurenaido

5. 視覚的要素と強調

  • Font Awesome アイコンで各イベントの内容を視覚化
  • キーワードのハイライト(グラデーション下線効果)
  • 項目間に適切な余白を設け視認性を確保
  • 半透明エフェクトとブラーで深度感を演出

変換するコンテンツ

[ここにタイムライン化したいテキストコンテンツを入力]


## 使い方

1. プロンプトをコピーしてAIチャットツールに貼り付け
2. 変換するコンテンツ部分にタイムライン化したいテキストを入力
3. 生成されたHTMLをブラウザで表示・保存

## 入力例

変換するコンテンツ

プロジェクト履歴

2020: プロジェクト開始 - チーム結成 2021: 初期リリース - MVP公開 2022: バージョン2.0 - 機能拡張 2023: グローバル展開 - 多言語対応


## 出力例

トロピカルフルーツパンチカラーパレット(緑#44803F、黄#FFEC5C、オレンジ#FF5A33)を使用した、宇宙テーマのタイムライン形式グラレコHTMLが生成されます。

## 注意点

- 暗い宇宙背景に鮮やかなカラーが映えます
- 惑星風マーカーがカラフルに配置されます
- 光源アニメーションが呼吸するように動きます