CS50x Final Project ：Visualizing Hyakunin Isshu

3D世界で蘇る『百人一首』の魅力

皆さんは『百人一首』とどのように関わったことがありますか？
子どもの頃にかるた遊びで耳にしたり、学校で暗唱したりした記憶がある方も多いでしょう。あるいは、近年の漫画やアニメをきっかけに、その世界観に触れた方もいるかもしれません。

しかし、美しい和歌の数々を、ただ「昔のもの」や「かるたの一部」として片付けてしまっていませんか？
このプロジェクトでは、『百人一首』を現代の技術で新たに甦らせ、3Dのインタラクティブな世界で体験するという新しい形を提案しました。古典文学に親しむハードルを下げるとともに、特に若い世代や日本文学に馴染みのない海外の方々にも、その魅力を伝えたいという想いを込めています。また、日本の古き良き時代の情景や感性を体験できる機会を提供したいと考えています。 

アイデアのきっかけ

私は古典文学が好きです。古の人々が自然や日常の中で紡ぎ出した繊細な表現や感情には、現代の効率や便利さを求める生活の中で忘れられてしまった大切なものがあると感じています。一方で、コンピューター技術を用いることで、かつては不可能だった新しい表現が可能になりました。

今だからこそ、詩や文学に心を向ける時間が必要ではないでしょうか。そこで、テクノロジーを使って百人一首の抒情的な世界を「体験」できる形にすれば、その奥深い感情や情景をより深く理解し、心を豊かにするきっかけになるのではと思いました。

プロジェクトの内容

このプロジェクトでは、ReactとThree.jsを使い、『百人一首』の和歌をテーマにしたインタラクティブな3D空間を作り上げました。以下のような仕組みを取り入れています：

• 五つの和歌が織りなす世界

選んだのは、『百人一首』の中でも特に印象的だと感じた5つの和歌。それぞれの詩が持つ「情景」や「感情」を、花びらや落ち葉、粒子、月と雲、ライトの演出で表現しました。
例えば、儚さを表現するために花びらが散るエフェクトを取り入れたり、無常観を感じさせるために光のトーンや動きのスピードを調整して、ゆったりとした雰囲気を作り出しました。

• ポータルを使った詩の旅

3D空間にはポータルが配置されており、クリックすることでカメラが移動し、新たな詩の世界が広がります。まるで現実と詩の間を旅しているような体験が楽しめます。

• リアルタイムUIの活用

Levaというツールを活用し、五つの和歌の言葉が粒子となって変化する演出を実現しました。

制作中の挑戦

プロジェクトの進行中には、いくつもの技術的な課題に直面しました。

まず、粒子文字の作成と環境設定。初めて使うBlenderでは試行錯誤を繰り返しながら、文字を完成させ、球体の内側に広重の絵を焼き付けるという工夫をしました。

次に難しかったのは、詩の持つ繊細な感情を「形」にすることです。限られた時間の中で、コードのライブラリやさまざまな作品の例を参考にしながら、情景や感情を表現する最適な方法を模索しました。また、3D空間でのスムーズな移動やインタラクションを実現するため、Reactの状態管理やThree.jsのパフォーマンス最適化にも多くの時間を費やしました。

その結果、思い描いていた詩の世界を体験できる没入感のある空間を作り上げることができました。ただし、まだ改善の余地があるため、時間を見つけながら、引き続き修正を重ねていきたいと思っています。

最後に

このプロジェクトは単なる技術デモではありません。『百人一首』の持つ文化的価値や、その詩の持つ感情を、より多くの人々に感じてもらいたいという願いを込めています。

この記事から、『百人一首』の詩人たちがどのような情景を眺め、どんな思いで詩を紡いだのか、その一端を感じていただけたら嬉しいです。

こちらにデモ動画をご用意しました。
ぜひ、3Dで広がる詩の世界を体験し、あなただけの『百人一首』の新たな魅力を見つけてみてください。

次の記事では、CS50がどのようにして世界中で受け入れられ、多くの学習者に影響を与えているかをご紹介します。