Solo wedding
site “AMUNA”

ROLE
Web Design / Movie / Photo
TOOLS
Figma / VS Code / Photoshop / Firefly
PERIOD
100 Hour
amunaジャケ

「今だけの自分を残す」という新しい価値観を提案するソロウェディングの特設サイト。
既存の結婚式サイトにある「煌びやかさ」をあえて抑え、
一人の決意に寄り添う「楽しさ」と「親しみ易さ」をデザインの軸に据えました。

01 / CONCEPT LAYER

余白で語る、
静寂な世界観。

ターゲットは「自立した女性」。
情報を詰め込むのではなく、余白(ホワイトスペース)を大胆に使うことで、 ユーザーが自分自身の気持ちと向き合える「間」を作りました。
明朝体とゴシック体を使い分け、感情と情報を整理しています。

02 / UI DESIGN LAYER

迷わせない
直線的な導線設計。

感情の高まりを阻害しないよう、導線は極めてシンプルに設計しました。
スクロールに合わせて要素がふわっと浮き上がるインタラクションを採用し、 物語を読み進めるような体験を提供します。

03 / CODING LAYER

CSS Gridによる
自由なレイアウト。

雑誌のようなレイアウトを実現するために、CSS Gridを駆使しました。
また、画像の遅延読み込み(Lazy Load)とWebP形式の採用により、 高画質な写真を多用しながらも、PageSpeed Insightsで90点以上のスコアを記録しています。

コンセプト解説の画像 デザイン解説の画像 コーディング解説の画像