ワイヤーフレームの観察 vol.3
今回は、以下のサイトのアドバイスしたがって、WEBサイトのワイヤーフレームを書き出してみます。
https://www.webcreatorbox.com/tech/improve-design-skills
書き出すサイト
「WEBサイトのデザインを観察する vol.2」のワイヤーフレームを書き出しました。紙に手書きで書いたので、写真を載せます。
右側に箇条書きしているのは、サイトの内容です。vol.2の内容と、vol.4の内容も記載しちゃってます～。
《気づいたこと》
・画像がリンクになっていて、画面がほぼ画像。
・サイドバーがロゴ＋文字。サイドバーにどの情報を載せるかが大事そう…
・ハンバーガーメニュー押すと、画面全部がメニュー画面になる。背景が黒地でTOP画面が透過している。
・左半分と右のサイドバーが固定で、スクロールできるのは画像部分だけだったので、思いのほかワイヤーフレームがすぐ書き終わった。
※ 今回のサムネは、サムネの配色は観察したサイトと関係ない配色にしました。配色のサイトから、適当に選んでみた！
この記事が気に入ったらサポートをしてみませんか？