サイトレビュー No.15
2日ほどお休みしてしまいました。。。
本日からまたコツコツ頑張っていこうと思います。
■会社概要
・長野県で調剤薬局を経営する会社
■ターゲット
・病院にかかることが多い高齢者の方や小さなお子さんの保護者。
・病院の近くでどこの薬局でいいというわけではなく地元密着で安心した薬を提供してくれる信頼を持てる薬局を探しているかた。
■ゴール
・経営している薬局の所在地を知ってもらう。
・会社の取り組みを知ってもらい信頼のおける薬局として認知。かかりつけの薬局として選んでもらう。
・地域密着で薬剤師の顔や薬局の雰囲気を知ってもらい安心感をあたえる。
■サイト構成
・TOP
・吉田薬業の取り組み
・採用情報
・会社概要
・店舗
・お問い合わせ
■ファーストビュー
・メインビジュアルは薬剤師さんと地域の方の笑顔の写真が使われている。
→地域の方と近い印象を受ける。数枚フェードイン、フェードアウトでじんわり切り替わる。
・左側背景には所在地のイラストの地図。近くの人にはここでも所在地をなんとなく知ることができるのと数店舗あることがわかる。
・地図の上に緑の背景色を重ね英文のひとことメッセージをあしらいにしている。ゴシック体で見やすく日本語で会社のキャッチコピーを掲載。
・メインビジュアルと地図の背景及びメッセージはPCでは横並びSPでは縦並びに変更。
・ナビは画面上部にピッタリとくっついた形ではなく独立した形。最近よくみる。スクロールすると画面上部にピッタリとくっつく。スクロールした時にほかセクションが見やすくするためだと思う。
・左にロゴがあり。吉田薬業の取り組み→採用情→会社概要→店舗一覧→お問い合わせの順に並ぶ。店舗一覧とお問い合わせはボタンとして配置しユーザーにわかりやすくしている。視認性も高い。
・SPのナビはロゴ→店舗一覧→お問い合わせはメールアイコンで表示→ハンバーガーボタン（エリアを黒で背景色をつけることでわかりやすい）
ドロワーメニューの中身は採用情報の目次を表示している。スマホで見る人は若年層で就活をしている人を想定しているのだと思った。
・メインビジュアルのすぐ下にあなたの町のかかりつけ薬局店舗一覧をボタンで配置→すぐに近くの店舗を検索できる。
■全体
・背景色はクリーム色を使いボタンやタイトルには緑、ブラウンを使う→ナチュラルで優しい印象。
・取り組み部分はタイトル周りは太字で誰にでも見やすいように。筆記体のタイトルをあしらいに使うことでより柔らかい印象がでる。01から03の取り組みはPCではイメージ画像と文章を交互に反転させて配置。視線の動きを配慮した配置と思った。SPはカード型モジュールで縦に配置。
・リクルート部分は各店舗で働く薬剤師さんの写真を載せることで会社のイメージを伝えている。
・フッターはフッターナビがあり本社住所と店舗の一覧を載せいている。
■フォントとカラー
フォント
メイン：Noto Sans JP
英文筆記体：画像
カラー
ベースカラー：#fff7ec
メインカラー：#89cf71、#c6a471
アクセントカラー：#303030
■学び
メインビジュアルにイラストの地図をのせることでデザインとしても使えるがどこに店舗があるのか近くの人ならわかるようにしているし店舗一覧を大きくボタンとして配置してすぐに近くの店舗を検索できる。薬局の会社のホームページを見る人は安心して信頼できるかかりつけの薬局を探している人なので安心感を与える取り組み部分を中心にトップページに掲載しているのはそういったユーザーにとっては安心感を持てると思ったし、その情報を見てナビにある店舗情報をすぐに見て検索できるのでユーザーの次の行動を意識しているように思った。
#サイトレビュー #デザインの言語化 #デザイン貯金
この記事が気に入ったらサポートをしてみませんか？