ただサイトを模写するだけでなくレビューを一緒に行うことで、
デザインのトレンドやサイトの構造を学びたかったため、記録に残すことにしました。
■今回のサイト
■Fonts
-本文:
UD Shin Go Regular
https://fonts.adobe.com/fonts/a-otf-ud-shin-go-pr6n
-英数字:
Roboto
https://fonts.google.com/specimen/Roboto
■Color
■ターゲット(予想)
年代は老若男女問わず
地域に住んでいてかかりつけの病院を探している人
病院は知っているが来院したことがない人
既に病院を利用している人へのお知らせの公開
■印象
シンプル、信頼感、清潔感
文字量もページ数もがかなり多いが必要な情報が分かりやすくまとめられている
■ファーストビュー
複数枚の外観、内観の写真がフェードでズームアウトしながら切り替わる動き
明治40年から存在する歴史ある病院だが、清潔感のある内観や、老人と手を重ねている写真で安心感が伝わる
プラグインは使わずピュアなJSで実装されている
■コンテンツ
写真やボックスを少し角丸にしたり、文字色をグレー寄りの黒にすることで柔らかさや優しさを演出している
新着情報欄は、一目で大事なお知らせが目に入るようになっていて分かりやすい
ピックアップ、コラムはタイトル、写真、内容がカルーセルで表示されていて綺麗に情報整理されている
■アニメーション
見やすさを重視しているためか大きく動くアニメーションなどはないが、
アイコンの後ろで動いている液体のアニメーションが印象的。
SVGのpathをピュア なJSでランダムに動かしている。
(ソースを見たが詳しいことは解読できなかった。。)