ふたつきびん ホームページ

やさしく静かな世界観を大切にした、架空の小さなお店のWebサイトを制作しました。
瓶に詰めた焼き菓子や雑貨、店主の手しごとまでを一枚のページにまとめ、
まるで1冊のZINEのように、ページをめくるような感覚で楽しめる構成にしています。

( コンセプト )

"なつかしさを、瓶につめて。"
「瓶」と「記憶」をテーマにした、小さな架空店舗「ふたつきびん」。
どこか懐かしく、でも今の暮らしにもそっと馴染むような、
古いものと新しいものが共存するような世界観を意識しました。

写真やタイポグラフィ、色味も落ち着いたトーンで統一し、
静かな午後の店内でひとり過ごすような時間を表現しています。

( デザインのポイント )

構成：ファーストビュー・About・Items・Gallery・Access・Creatorなど、1ページ完結型の流れに。

デザイン：Figmaでレイアウトを設計、レトロ×生成りカラーで統一。

コーディング：FLOCCSで命名、レスポンシブ対応／Masonry風レイアウトもCSS Gridで調整。

演出：ページトップボタンやモーダル、オーバーレイなど、さりげない動きを意識。

( 制作期間 )

2025年4月

( URL )

https://demo-8.chinatsugoto.com

ユーザー名：demo

パスワード：demo