塚谷医院ホームページデザイン案

A案いと

やわらかく、あたたかく、親しみやすい印象

生成りの桃色の地に、角を大きく丸めた白い面を重ねました。全体の雰囲気・文字の形・動きは、参考サイト doodlemama.jp を参考にしています
えんじ色の細い「糸」が画面に描かれていき、小さな丸い写真のまわりで、ロゴと同じハートの形を結びます。糸はページの下へもつながっていきます
メインの写真はアーチ形の窓の中で、ゆっくり溶けるように入れ替わります（婦人科の相談・窓辺の女性・窓辺の子ども）
婦人科をいちばん大きく載せ、お悩みの言葉を札で並べました。「10歳代から」「40歳を過ぎると」「更年期」「70歳、80歳」と、年代ごとの説明を糸でつないでいます
院内の写真は横に並べ、パソコンでもつかんで送れます。スマートフォンでは、画面の下に「診療時間」と電話番号の帯がいつも出ています

上品で、落ち着いた、大人の女性の印象

細い明朝体の文字と、淡い桜色。写真を大きく使い、余白をたっぷりとりました。並び・文字の形・写真の使い方は、参考サイト tsc-h.com を参考にしています
ページを開くと、えんじ色の一滴が落ちて波紋が広がり、その輪の中からメインの写真が開きます（ロゴのハートの中の「しずく」から考えました）。写真はゆっくり寄りながら入れ替わります
診療時間を写真のすぐ下に置き、来院の前に知りたいことがすぐ分かるようにしました
婦人科は写真を画面の端まで大きく。下に、婦人科で診ている内容の言葉がゆっくり流れます
院内の写真は大きい1枚と小さい3枚で並べ、マウスを乗せると説明が浮かびます。最後に医院の外観を大きく、お電話番号と一緒に載せています

「A案を見る」などから、実際の画面をご覧いただけます。動きもそのままご確認いただけます。
スマートフォンでこのページを開くと、そのままスマートフォン用の表示でご覧いただけます。
画面上部の黒い帯は、案を切り替えるための案内です。実際のホームページには入りません。
確認用のため、メニューやボタンは押しても移動しません（マウスを乗せた時の動きはご覧いただけます）。A案の院内の写真の「前へ・次へ」と、右下の「ページの先頭へ戻る」は、そのままお試しいただけます。

載せている内容は同じです（並び順は案ごとに変えています）。ごあいさつの一節／婦人科／小児科・内科／院長のご挨拶／院内のご案内／お知らせ／診療時間／アクセス
文章・住所・電話番号・FAX番号・診療時間・休診日・お知らせ・院内の説明・ロゴは、現在のホームページの内容をそのまま入れています（お知らせは、現在のホームページに載っていた最新の5件です）。
写真は、いただいた写真と、現在のホームページの写真を使っています。
メニューは、現在のホームページと同じ（ホーム・医院のご案内・診療科目・個人情報保護）にしています。
ダミーの印がある所は、原稿が無いため仮に入れたものです（トップのキャッチコピー、休診日カレンダーの場所）。画面上部の「ダミーの印を隠す」で、印の無い見え方もご覧いただけます。
休診日カレンダーは、制作の時に、アソビットの予定表のプラグイン（ASB Calendar）に置き換えます。
画面右下の「ページの先頭へ戻る」ボタンは、案ごとに形を変えています（A案＝丸の中が読み進めた分だけ満ちていく、B案＝縦の文字と細い線）。組み合わせも自由です。

トップのキャッチコピー A案「からだの小さなゆらぎに、そっと寄りそう。」、B案「年齢をかさねる、そのすべての日に。」は、こちらで考えた仮の文です。お好きなもの・直したい所があればお知らせください。
診療時間・お知らせ・内容現在のホームページから写しています。変わった所があればお知らせください（例：午後の診療時間の書き方、予防接種の内容など）。
「順番待ち確認」のボタン現在のホームページにあるボタンを残しています。今もお使いかどうか、お知らせください。
トップに載せる内容と順番足したい内容・減らしたい内容があればお知らせください。

アソビット合同会社