Project Overview
SEPTEMBER 2025
担当範囲
Web Development
制作期間
ヒアリング・技術選定 5日
コーディング 30日
調整・テスト・公開 15日
使用したテックスタック
Next.js / Sanity / TypeScript / Tailwind CSS
课题
作品のアーカイブ性
クライアントは、スタジオの全作品をまとめたアーカイブとして活用できるWebサイトを求めていました。対外的な紹介やプレゼンテーション時にも利用できることが重要でした。
独自のデザイン再現
クライアントから提供したウェブデザインは。一般的なポートフォリオサイトというより、ドキュメントのように縦に連なる独特なレイアウトで、「距離感」をあえて演出する構成でした。そのデザイン意図を正しくWeb上で表現することも課題のひとつでした。
自己更新可能な仕組み
クライアント自身がコンテンツを簡単に更新できるよう、CMSを導入する必要がありました。
デザイン実装
サイト全体ではセリフ体を使用しており、マウスをホバーするとサンセリフに切り替わります。レイアウトに影響を与えることなく、まったく異なるフォントへの変換を実装しました。
UX デザイン・01/03
書籍の構造をヒントに、ブラウザー上の体験を設計しました。
サイトには「List」と「Image」の2つのモードがあります。Listは作品タイトルの索引、Imageはその索引順に画像を並べるビューです。
サイトには「List」と「Image」の2つのモードがあります。Listは作品タイトルの索引、Imageはその索引順に画像を並べるビューです。
コミュニケーション
各段階でデザイナーと確認を重ね、意図のずれを防止しました。最終的に公開まで方向性を共有しながら完成度を高めました。