<自主制作>ハンドメイドカフェのサイト(架空)

OVERVIEW

自主制作として、ハンドメイド商品の購入、体験とカフェを楽しむことができるハンドメイドカフェのサイトを作成しました。 *X(旧Twitter)の固定ツイートにこのサイトの動画ございます。(サーバーには上げておりません) ぜひご覧いただけますと幸いです。

YEAR 2021

ターゲット

・日常(仕事や家事など)を忘れて癒されたい女性。(メイン20~30代)

・昔編み物をやっていた祖母や母がいる方。              

・ハンドメイドもカフェも好きな方

サイトの概要・制作目的

・ハンドメイド商品や体験×カフェのサイト→ハンドメイドの商品購入や体験をしたり、ちょっと一息つきたい際に立ち寄ってもらうことが目的。                      

・くつろぎの時間や同じ趣味の人に出会える                                                    ・昔編み物などを趣味でされていた方がほかの方に教えることもできる→年齢問わず!                                    ・QOL(クオリティ・オブ・ライフ)の向上につなげる

【使用ツール】

デザインカンプ:photoshop

コーディング:vs.code

【制作期間】8ヶ月(要件定義~スマホのレスポンシブまで)

写真素材:フリー素材サイト(メインビジュアル・MENUセクション)

     自己にて用意(キツネの編みぐるみ・毛糸・HANDMADEセクション)

制作したホームページ

PC用


SP用


SPハンバーガーメニュークリック時


工夫した点

・落ち着ける雰囲気を出したかったため、アクセントカラーを深めの緑にして、サイト全体に散りばめました。

・キツネの編みぐるみや毛糸の切り抜きなどで、ハンドメイドの中でも編みぐるみメインだと分かるようにしました。ちなみに、編みぐるみは過去に私が作成したものです。

・メインビジュアルで、複数の写真を使いたかったため、ふわっと変化するようなアニメーションを入れました。縦書きのキャッチコピーの位置調整がとても難しかったです。

・全体的に四角いレイアウトが多いため、ボタン部分は目立つように六角形にしてみました。