TimelineJS:スプレッドシートで作るインタラクティブ年表ガイド
はじめに 歴史的な出来事の流れや、プロジェクトの進行過程を分かりやすく伝えるには、年表(タイムライン)が最も効果的な手段の一つです。しかし、見栄えの良いインタラクティブな年表を作成するには、通常はプログラミングの知識が必要とされます。 TimelineJS は、ノースウェスタン大学の Knight Lab が開発したオープンソースのタイムライン作成ツールです。Google スプレッドシートにデータを入力するだけで、美しいインタラクティブな年表を自動生成できます。ライセンスは MPL-2.0 で、無料で利用可能です。 TimelineJSの特徴 1. プログラミング不要 TimelineJSの最大の魅力は、コードを一切書かずにタイムラインを作成できることです。Knight Labが提供するGoogleスプレッドシートのテンプレートにデータを入力し、公開設定を行うだけで完成します。 2. メディアの統合 各イベントには、画像、動画、音声、ツイート、Wikipedia記事など、さまざまなメディアを埋め込むことができます。URLを指定するだけで自動的にメディアが表示されるため、視覚的にリッチなタイムラインを簡単に作れます。 対応メディアの例: 画像(JPEG、PNG、GIF) YouTube / Vimeo の動画 SoundCloud の音声 Twitter のツイート Wikipedia の記事 Google Map の地図 Flickr の写真 3. 美しいデザイン 生成されるタイムラインは、モダンなデザインで視覚的に洗練されています。レスポンシブ対応のため、PCでもスマートフォンでも快適に閲覧できます。スライド間のアニメーション遷移も滑らかです。 4. 多言語対応 TimelineJSは60以上の言語に対応しており、日本語でのインターフェース表示も可能です。日付フォーマットも各言語に合わせて自動調整されます。 作成手順 ステップ1:テンプレートの準備 TimelineJS公式サイトにアクセス 「Make a Timeline」セクションの「Get the Spreadsheet Template」をクリック Google スプレッドシートのテンプレートが開くので、コピーを作成 ステップ2:データの入力 スプレッドシートの各列にデータを入力します。主要な列は以下の通りです。 列名 説明 例 Year 年 1868 Month 月(任意) 1 Day 日(任意) 3 Headline イベントのタイトル 明治維新 Text 説明文 日本の近代化の始まり… Media メディアURL https://example.com/image.jpg Media Credit メディアのクレジット 国立国会図書館 最初の行(Title slide)はタイムライン全体のタイトルスライドになります。 ...


