Kyosuke Sato

担当制作範囲

ディレクション / 企画・ワイヤーフレーム / デザイン / 実装

使用ツール

Figma / Visual Studio Code

選定技術

Next.js / Tailwind CSS / GSAP

制作の意図等

本プロジェクトの目的は、SNS運用だけでは不十分だった「ファン化（リピート層の獲得）」と「独自のブランディング」の強化です。
SNSのタイムラインでは埋もれがちなブランドコンセプトを、一つのWeb体験として再構築しました。特に、ブランディングにおいて「表示の遅延」はユーザー体験を著しく損なう要因となります。 そこで、モダンフレームワークでの実装を行い、ストレスのない快適な閲覧環境を構築することで、ブランドへの信頼感を醸成し、離脱率の低減と予約へのスムーズな誘導を図っています。

中間課題でのパフォーマンスへの問題意識から、本プロジェクトではNext.jsを採用しました。next/imageによる画像最適化などを活用し、ハイパフォーマンスなサイトの構築を意識しました。
下層ページまで含めた実装は初めての経験でしたが、Reactでコンポーネント設計を学んでいたおかげで、App RouterのLayoutによる共通コンポーネント管理の便利さを自然に活かすことができ、開発体験の重要性を実感しました。

また、当時の学習リソースはYouTubeやUdemyが中心でしたが、App Routerに関する情報が少なく、公式ドキュメントを中心にキャッチアップしました。それまでドキュメントは確認程度にしか読んでいませんでしたが、この経験を通じてドキュメントを読む重要性と、一次情報から学ぶ習慣を身につけました。

制作期間

2ヶ月