WORKS

実際に制作したものや架空に存在すると仮定して制作したサイトなどご紹介します。

リラクゼーション施設「汐戸」(架空)

  • 製作期間:1週間
  • 担当:ディレクション・コーディング
  • 使用ソフト:vscode・adobexd
  • サイトurl:https://sample01.monster/sample04/
  • ※basic認証をしています。IDはsample2、passはtest2です。
  • ※デザインは株式会社パノラマ様が制作している「ATAMI せかいえ」を参考に制作しています。

背景

広島県呉市警固屋に所在すると仮定したリラクゼーション施設のwebサイトです。 呉市は昔から造船・製鉄で栄えた街ですが、造船・製鉄業界は近年の中国、韓国の価格競争に追い付かず新規での製造に終止符を打ち修繕のみに特化を余儀なくされる造船会社が存在するなど厳しい状況となっております。

また大手である製鉄場が生産停止を発表し少なくとも1500名の従業員がリストラされ、時期を同じくしてコロナが流行するなど地元経済に大きな打撃が降りかかっています。 そんな背景を前提に瀬戸内を一望できる立地で温泉をメインとしたリラクゼーション施設のwebサイト制作しました。

近年では呉市と橋を跨いだ先にある江田島市が地元の観光資源を武器に観光客を多く募っているので、本サイトのメインターゲットを江田島を観光する・里帰りする人に選定しました。

  • ターゲット:江田島へ観光・里帰りする人
  • 移動手段:車・バイク・自転車

サイト構成

サイト訪問者にどのような施設であるかを伝えるために初めに「About us」を設け概要説明を始めます。 次に目玉となる温泉を紹介、以降は滞在プランや細かな詳細をそのイメージを象徴した写真を用いて紹介しています。 強みとなる要素が景色で瀬戸内海を一望できる立地に所在しているので、メインビジュアルは施設が所在している場所から見える風景を採用しました。

問題点・改善点

実際にデザインしコーディングまで終わってしばらくした後にすぐに予約をしたい訪問者向けにspではフッターに追随型のctaを設けるのがいいと思いました。加えて予約サイトや現在の空き部屋状況など他のプラットフォームを活用してサイトに盛り込むのがよりユーザービリティを向上させるのではないかと思いました。

全体のデザイン