あらすじ
※この商品はタブレットなど大きいディスプレイを備えた端末で読むことに適しています。また、文字だけを拡大することや、文字列のハイライト、検索、辞書の参照、引用などの機能が使用できません。
目で見て学べる!
実在する37サイトのワイヤーフレームとデザインを比較解説
・実在のWebサイトのワイヤーフレームをたっぷり掲載!
・成果につながるサイト作りのコツがわかる
・困ったときに役立つ! 世界観やイメージ作りの参考にも
Webサイトの「ワイヤーフレーム」と「デザイン」の実例を
たっぷり掲載した「見本帳」です。
ワイヤーフレームからデザインに落とし込む際のポイントや、
サイト全体のイメージ作り、ちょっとした遊び心まで、
なぜ、このデザインになったのかを丁寧に解説しています。
こんな人におすすめ!
・たくさんの実例を見たい人
・デザインのアイデアをインプットしたい人
・Webデザイン制作の考え方を学びたい人
・Webデザイナーとしてステップアップしたい人
感情タグBEST3
Posted by ブクログ
ノーコードツールやローコードツールが出てきて久しく、生成AIによるコーディングで誰もがWeb制作に着手することができるようになった時代。
限られた職種が当たり前に踏まえている行程がそぎ落とされた乱造されたWebページも、多く見受けられるようになってきました。
そんな中で、自社事業であってもクライアントワークであっても、「目的/ゴール」をきちんと言語化したうえで、各行程における「現場を理解している人が、目的/ゴールを自身のタスクに落とし込む」ことがさらに求められていくのではないかと思います。
特にワイヤーフレームは非常に重要です。
ワイヤーを基に、サイトを通して実現したいことと、見てほしい内容を構造化し、優先順位付けをおこない、センスとロジックがかみ合うポイントを視覚化することに繋がるからです。
また、ワイヤーを基にしてデザインを制作することで、Webディレクションとデザイナーの間で「意図に合った工夫」をお互いにどの程度許容/否定できるのか、その意思疎通を図るための基準を作ることも求められるため、この本に記載されているような丁寧な「意図」のくみ上げと表現が可能となるからです。
しかし、実際に世の中にワイヤー→デザインの流れが「他人の目に触れる」と言うことはそうそうないため、コーディングやシステム開発と比べてよりアーティスティック(に見える)領域かもしれません。つまり、現場感覚を磨いてノウハウを吸収することでしか、なかなか学べない領域であると言えます。
この点、本にするまでに様々なすり合わせが必要だったでしょうが、現場におけるやり取りが目の前で行われているような”比較”形式でのワイヤー見本を手に取れたことは非常に幸運でした。
参考資料や勉強になることはもちろんですが、Webディレクターやデザイナーなど、特に駆け出しの方にとっては良い仕事仲間になるのではないでしょうか。