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

想定用途

• 年表や歴史的出来事を視覚的に魅力的なタイムラインとして表現したい
• 企業の発展史やプロジェクトの進捗を時系列で見せたい
• 宇宙・天文学に関連するコンテンツをテーマに沿って表現したい

プロンプト本文

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

## 目的
以下の内容を、宇宙をテーマとした幻想的でポップな雰囲気のタイムライン形式グラフィックレコーディングHTMLに変換してください。

## デザイン仕様
### 1. カラースキーム
- イラスト-1: #5BA67B
- イラスト-2: #F2BB13
- イラスト-3: #F2DB94
- イラスト-4: #BF8665
- イラスト-5: #BF190A

### 2. 宇宙テーマの視覚効果
- 暗い宇宙背景（#080808）に小さな星を散りばめる
- 左上に大きな「太陽」のような光源を配置
- 円形マーカーはカラフルな「惑星」のようなデザイン
- アニメーションで光源に呼吸するような動きを与える

### 3. タイムライン構造
- 中央に垂直のタイムラインを設置
- 項目を左右交互に配置
- 各項目に惑星風の丸いマーカーを追加
- 底部または右側にクイックナビゲーションセレクターを配置

### 4. タイポグラフィとテキスト処理
- タイトル：夜空に輝く星のような発光効果
- 日付：白背景に浮かぶ形で強調
- イベントタイトル：パレットの明るい色で表示
- フォント指定：
  ```html
  <style>
  @import url('https://fonts.googleapis.com/css2?family=Kaisei+Decol&family=Yomogi&family=Zen+Kurenaido&display=swap');
  </style>

5. 視覚的要素と強調

• Font Awesome アイコンで各イベントの内容を視覚化
• キーワードのハイライト（グラデーション下線効果）
• 半透明エフェクトとブラーで深度感を演出
• ホバー時のアニメーションで項目を浮き上がらせる

変換するコンテンツ

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

## 使い方

1. プロンプトをコピーしてAIに貼り付け
2. タイムライン化したいテキストを「変換するコンテンツ」の後に貼り付け
3. 生成されたHTMLを保存してブラウザで表示

## 入力例

2020年1月 - プロジェクト立ち上げ 2020年6月 - 最初のプロトタイプ完成 2021年3月 - ベータ版リリース 2021年12月 - 正式版ローンチ 2022年6月 - 10万ユーザー達成

## 出力例

宇宙空間を漂うようなユニークで魅力的なタイムラインインフォグラフィックが生成されます。

## 注意点

- 背景が暗いので、テキストは明るい色で表示されます
- アニメーション効果があるため、ブラウザで動作を確認してください
- 日付情報を明確に指定してください