美容室の架空サイト

ウェブサイト

概要

  • 内容:自主制作
  • 制作時期:2024年6月
  • 制作期間:デザインに3日、コーディングに4日
  • 使用ツール:
WEB上のお題を用いた自主制作サイトです。
 
お題は以下のリンクより頂戴しました。
ありがとうございました!
 

実際のサイトはこちらよりご覧いただけます。

デザイン(ロゴ)

● 植物が飾られた店内を彷彿とさせるモチーフ

上記をコンセプトにロゴ案を4つ作成しました(下記参照)。ターゲットが女性ではありながら、その家族にも来店してもらいたいとの意向より、性別関係なく親しんでもらいやすいデザインである3つめの案を採用しています。

デザイン(サイト)

以下の点にこだわって制作しました。

● 店内の「くつろぎ感のある」「植物が飾られている」を象徴するような優しい印象のデザイン

女性を主要ターゲットとしつつも、その家族にも来店してもらいたいとのことから、女性向けのあしらいを少なめとし、シンプルなデザインに仕上げました。WEB予約を受け付けるボタンは必ずヘッダーまたは下部のフローティングメニューに表示させるようにし、ユーザーが予約までの導線を迷わないようにしています。また、ワイヤーフレームでは指定がなかったものの、Instagramへのリンクをヘッダーに常時配置するようにし、簡便にスタイリング例を深堀りできるようにしました。

● Adobe Fireflyを利用したAIによる画像生成

今回のサイト制作にあたっては、利用しているすべての画像データ(イラスト素材は除く)をAdobe FireflyによるAI生成で得た画像を利用しています。「日本人」と打つと着物の人物ばかりが表示されたり、鏡の中の人物があらぬ方向を向いていたり、なかなか思い通りの画像を生成することが難しい場面もありましたが、プロンプトの指定をするよい勉強になりました。

● きめ細やかなレスポンシブ対応

PC・タブレット・スマホのレスポンシブ対応として、各セクションごとに最適な表示幅でのデザイン切り替えを行っています。ぜひウィンドウサイズを変更してご確認いただけると嬉しいです!