ワイヤーフレーム模写 ２
こんにちは◎
ご覧頂きありがとうございます。
WEBデザイン勉強中のやましたです。
先日に続きWEBサイトのワイヤーフレームの模写をさせて頂いたので記録として残させて頂きます。
参考にしたサイトがこちらです。
きっかわ法律事務所さんのサイトです。
こちらのTOPページを模写させて頂きました。
まず初めにHPでデザインを見た際に思ったのが
「シンプルなサイトで画像が多くガチャガチャもしていない。
その分しっかり伝えたいキャッチコピーなどがユーザーに伝わりやすく
誠実さが出ているサイトだな。」
でした。
ワイヤーフレームを作っていてまず最初のヘッダーのところからMVまで無駄な装飾などなく、MVのロゴも会社名のみになっており常に絶対表示になっていますが主張が強すぎることもなく風の通り道（通っているような心地よい余白）があるので右にあるリード文をスクロールして読むのが疲れないので頭に入ってきやすいです。
また、色味も淡いグレーと青・白でシンプルかつアクセントカラーの青が「信頼・誠実・知性」など法律事務所に適したカラーなこともあり洗練された印象を受けました。
各セクションごとにシンプルでかつ余計なものがないので読みたい情報をみつけやすいです。
また画像をホバーして選択すると横幅いっぱいに広がったりカラーに青いオーバーカラーがかかったりなど多少の遊び心をつけるだけで硬すぎる印象が無くなり、ユーザーも親しみやすさを感じられるようになっています。
また、対象ユーザー自体の年齢なども考えると敢えて流行りの綺羅びやかで動きが常にあるサイトなどより、昔ながらのベーシックな印象を与えつつ所々で動きがあったりするこちらのサイトこそがクライアントにとってもユーザーにとっても相応しい素敵なサイトだと感じました。
トピックスも左に見たい種類を選べるようボタンがあったりして全てを遡らず忙しいユーザーにとってもすぐ自分が欲しい情報を手に入れることが出来ます。
必要な情報など自分で選択して得られるので、法律事務所を【ゆっくり気兼ねなく楽しんで見る】ユーザーよりも【何か事情などがあって弁護士を探している】忙しいユーザーの方が多いと思うのでそういった面でもペルソナに合った素敵な構造になっていると感じました。
ユーザーにとってもクライアントにとっても伝えたい情報と受け取りたい情報がマッチしている素敵なサイトでした。
また次回も素敵なサイトさんを見つけて模写出来るように努めます。
ご覧頂きましてありがとうございました。
この記事が気に入ったらサポートをしてみませんか？