黒蜜ときなこの専門店 六角堂(架空サイト)

OVERVIEW

ポートフォリオ用に作成した架空のWebサイト。 ユーザーの使いやすさを重視しながらも、サイトのイメージを損なわないよう 意識して作成した。

YEAR 2020



■担当箇所:

 企画・ワイヤーフレーム・デザインカンプ・コーディング(レスポンシブ含む)

 バナー作成・ロゴ作成

■作成ページ:ホーム・六角堂について・六角カフェ・最新情報

 (それ以外のページは未作成)

■使用ソフト: Excel・PhotoshopCC・IllustratorCC・Dreamweaver2020

■使用言語: HTML・CSS・jQuery

【制作期間】:3ヶ月


■コンセプト

 きなこと黒蜜の魅力を知ってもらう事と、実際に店舗を訪れてもらい、

 商品を購入したり併設カフェを利用してもらう事をコンセプトに作成した。

 (使用ソフト:Excel)


■ワイヤーフレーム・デザインカンプ作成

 サイトのイメージを損なわず、サイトを訪れるユーザーが使いやすいような

 配置を意識してデザインした。(使用ソフト:PhotoshopCC・IllustratorCC・Excel)


■ロゴ・バナー作成

 メインカラー、ベースカラーを和色(日本の伝統色)の中から、きなこと黒蜜に

 近い色を選んだ。

ロゴは店名の『六角堂』がイメージできるよう六角形を6個配置し、和の雰囲気を出した

バナーは無料の写真・画像素材をベースに加工を行いながら作成した。

また、架空アニメ作品のバナーについては、無料の画像素材を用いながらロゴ作成も行った。


■コーディング

  HTML、CSS共にあまり複雑にならないように意識してコーディングした。

 また、Dreamweaverを使用し、エメットを使用しながら作業しました。

(使用ソフト:Dreamweaver2020

 使用言語:HTML・CSS・jQuery(プラグイン:bxSlider))

WEBSITE