Back to Home
Next.js, Tailwind CSS, WebGL

インダストリアルアート学科・学域 卒業・修了制作研究展2026 Webサイト

インダストリアルアート学科・学域 卒業・修了制作研究展2026 Webサイト - image 1
インダストリアルアート学科・学域 卒業・修了制作研究展2026 Webサイト - image 2
インダストリアルアート学科・学域 卒業・修了制作研究展2026 Webサイト - image 3
インダストリアルアート学科・学域 卒業・修了制作研究展2026 Webサイト - image 4

Overview

東京都立大学インダストリアルアート学科・学域の卒業・修了制作研究展2026の公式Webサイト。フロントエンド実装を担当し、本年度の展示コンセプトである「もや」を表現するため、シェーダーを用いた動的なビジュアル表現を取り入れた。従来のWeb展では外部サービスのNotionを利用していたが、本年度は初の試みとしてサイト内での完全な独自実装を行っている。

The official website for the Tokyo Metropolitan University Industrial Art Graduation/Completion Exhibition 2026. As the lead frontend developer, I incorporated dynamic visual expressions using shaders to convey the exhibition's theme, 'Moya' (haze). While previous online exhibitions relied on external platforms like Notion, this year marked the first attempt at a complete internal implementation within the site.

Concept

メインビジュアルのトーンを継承しつつ、実装と並行してデザインのブラッシュアップを行った。独自実装への切り替えにより、作品同士のレコメンド機能、会場地図との動的な連携、高度なソーティングやフィルター機能など、鑑賞体験を向上させる挑戦的な機能を多数盛り込んでいる。情報提供に留まらず、Webサイト自体が展示の質感を伝える一つのインターフェースとなることを目指した。

While maintaining the tone of the main visual, the design was refined in parallel with implementation. By shifting to a custom implementation, we integrated various challenging features to enhance the viewing experience, such as a work recommendation system, dynamic venue map integration, and advanced sorting and filtering functions. The goal was for the website itself to serve as an interface that conveys the tangible quality of the exhibition.