猫カフェNöpö【Webサイト】

課題

1. 1. 動画を組み込んだWebサイトを制作する。
2. 2. ワイヤーフレームはFigmaを用いて設計する。
3. 3. ロゴや地図などの素材はIllustratorで作成する。

目的

みなとみらいという観光地にある猫カフェなので、Web関連ワード検索でやってくる顧客を確保したい。 おしゃれで猫を触りたくなるような動きのあるデザインのWebページを制作して集客する。

ターゲット

25歳独身女性

• ・猫が好きだが、自宅では飼えない。
• ・みなとみらいの雰囲気が好きで、おしゃれな場所に惹かれる。
• ・動物は好きだが、清潔感のある空間を重視している。
• ・写真をたくさん撮りたい。映えるおしゃれな空間を好む。

情報設計

• ・動画を配置し、動きのあるサイト設計にした。
• ・動画をフレームの中に入れ込み、猫をイメージした柔らかさを表現した。

デザイン

• ・北欧をイメージした配色にした。

制作範囲

企画、デザイン、コーディング

制作期間

• ・ワイヤーフレーム作成：

  2週間

• ・デザイン作成：

  5日

• ・コーディング：

  2週間

使用ツール

• ・コーディング：

  HTML/CSS/JavaScript/jQuery

• ・デザイン：

  Figma

• ・ロゴ：

  Adobe Illustrator

• ・動画/画像素材：

  canva

• ・文章作成：

  ChatGPT

使用色