見出し画像

サイトレビュー#8「山崎医院」様

1.概要

女性向けサイトを制作中に、「ナチュラル」「女性らしさ」はデザインのどこから感じるのか?と疑問を持ったので、産婦人科の病院サイトをレビューすることにしました。


2.サイトの目的

・問い合わせ先の案内

・安心して病院に来てもらう

・病院について知ってもらう

・ネット予約への誘導


3.デザインと印象

・ナビゲーションメニューはゆるやかなカーブを描いて配置することで、柔らかい動きのある印象。

・ネット予約ボタンは上から吊り下げられているデザインで、枠をつけることで目立つようになっている。枠はクレヨン風で柔らかい印象。

・背景はベタ塗りではなく紙のような質感

・メインビジュアルの写真は、花のフレームの中で文章と共にフワッと切り替わる。写真の周りをぼかして背景と同化している。

・「私たちのこと」では、背景にメインビジュアルのフレームの花を散らして一体感が生まれている。

・「フォトギャラリー」「医師・スタッフ紹介」では写真をリボンのような線の上にのせて続きを感じさせる。

・「お知らせ・イベント情報」は背景を変えて、コンテンツの境目が分かりやすくなっている。

・SNSはお知らせの中でも目立つように折り込みのような背景に。

・診療受付の表をクレヨンのようなタッチで線が描かれている。

・全体的に四角い物は角を丸くしている。

・区切り線は直線ではなく点線にすることで柔らかい印象に。

・サイト全体に花のイラストがあしらわれていて、女性らしさが表現されている。


4.Color

Gold、Mint Green、Pink、Yellow

パステルカラーで優しい印象


5.Font

・イメージ画像にしているところが多い

・明朝体と筆記体を組み合わせて使用

・Century:装飾がなくシンプル

・ヒラギノ角ゴ Pro W3:可読性に優れる


6.レスポンシブ

・ナビゲーションはハンバーガーメニューになり、産科・婦人科・住所・電話番号・予約ボタンもメニューに含まれて、タッチしやすくなっている。

・PC版では1番最後に配置されていた病院の詳細をメインビジュアルのすぐ後に置くことで、ページにきてすぐに電話や予約ができるようになっている。

・コンテンツは縦並びになり、区切りに分かりやすく点線が引かれている。

・並列の情報は横に流れるようにして、縦並びでも画面が長くなりすぎないように工夫されている。


7.おわりに

今回は女性らしさ・柔らかさが、フォント・色・丸みを帯びた形・花のイラストなどから感じることを学ことができました。

また、スマホで見たときにページにきてすぐ連絡ができるよう工夫されている箇所や、縦並びになっても画面を長くならないようにする方法を知ることができました。

最後まで読んでいただきありがとうございました。


山崎医院20200624

この記事が気に入ったらサポートをしてみませんか?