
開発の流れ
設計
目的(実績・強みを素早く伝える)を軸に、情報設計とナビゲーション動線を整理
開発・実装
Next.js / React / TypeScript / Tailwind CSS を用いた実装
公開
Vercel でプレビュー & 本番デプロイ
ターゲット
自身の活動やスキルを伝えるポートフォリオとして設計。クライアントに直感的に内容が伝わるUIを重視。
課題
情報量が多くなると閲覧者が迷子になりやすい。カテゴリー分けと視覚的な導線が必要。
目的
制作物や経歴を整理して見せることで、自分のスキルセットを効果的にアピールする。
レスポンシブ対応で、PC/スマホどちらでも快適に閲覧できるよう設計。
使用言語 / 技術
Next.js / React / TypeScript / Tailwind CSS / Vercel
デザイン・実装上の工夫
スクロール時のアニメーションを実装。
再利用可能なUI片をコンポーネント化し、スケールしても保守しやすい構造に。