VRアプローチで「想い出を残す」山形県立楯岡高校メモリアルWEBサイト制作 S.E.Onetop様受託案件

S.E.Onetop様からのご依頼で、山形県立楯岡高校メモリアルウェブサイトの制作を担当しました。閉校を記念し、思い出を残すためのアーカイブサイトの構築として、ディレクション・デザイン・コーディング・VR実装まで一貫して対応しました。
VRで巡る楯岡高校

サイト構築の概要

本案件は、取り壊しが決まった校舎のVR写真をウェブ上に保存し、卒業生や関係者がいつでも閲覧できるメモリアルサイトです。“懐かしさと温かみ”を感じられるデザイン・体験設計を意識しました。

対応範囲

• 全体ディレクションと構成設計 (カッツプロダクション 菅原)
• ビジュアルデザイン (カッツプロダクション 菅原)
• HTML/CSS/JavaScriptによるコーディング (カッツプロダクション 菅原)
• 360°VRコンテンツの撮影+加工 (S.E.Onetop様)
• Webサイト内への360°VRコンテンツ組み込み (カッツプロダクション 菅原)

VR素材の制作と実装

今回の特徴は、360度VRコンテンツをWebサイト上で閲覧できるようにした点です。

私自身も趣味で360度カメラを使うことがありますが、VR素材写真は撮影も編集とにかく大変です。
私が以前に開設したVRデモサイト

VR撮影と加工はS.E.Onetop様が担当されましたが、その作業は非常に大変だったと伺いました。

VR制作の裏側

• 全天球カメラによる360°撮影素材の収録
• Webでの軽量表示に最適化するためのデータ圧縮

VRコンテンツをWebにどう活かすか

VRを「サイトの中にどう自然に溶け込ませるか」GoogleストリートビューライクなJSライブラリはパフォーマンス難あり、SaaSはサービス終了のリスクがあったりと、実装方法には独自の工夫を凝らしました。

実装の工夫

• VRコンテンツ展開には軽量かつ実績のあるJSライブラリで実装
• スマートフォンでも操作しやすいUI設計
• 室内の遷移は単純なHTMLで実装

制作を通して感じたこと

今回の案件は、通常のWeb制作とは異なり「体験を残すためのWebデザイン」という新しいアプローチでした。ページ構成やUI設計だけでなく、感情を呼び起こす導線設計の重要性を実感しました。
　

得られた知見

• VR素材の編集・圧縮・埋め込みに関する実践的な知識
• メモリアル系サイトにおける感情的UX設計のポイント
• WebでのVR表現を軽量化しつつ自然に統合する方法

結び

山形県立楯岡高校メモリアルサイトの制作は、地域の思いと情報技術を融合させた意義深い案件でした。S.E.Onetop様との連携を通じ、VRを用いたWeb体験の新たな可能性を感じることができました。

「想い出をデジタルで残す」というテーマにふさわしい仕上がりとなり、技術的にも感情的にも得るものの多いプロジェクトでした。