PPTのラフスケッチを添削していただく。
疑問点としてあった、ヘッダーフッダーの使い方について教えていただく。
・人の目線の動きはZに動くので左上は企業のロゴ、右上に検索、その下にタイトル、その下にサイトのメニュー。
Topページの左右に他のページへのリンク(RSS的なもの)は、クリックされやすいので避けた方がよい。
バナーは左右の下側のほうがいい。
・更新される記事には、「前の記事へ> <後ろの記事へ」を入れる。
・ロゴについて「なじらね通信」だけでは、どこのなんのサイトかわからないため、企業ロゴを入れることにこだわっていたが、
タイトルタグに入れるのでも表現できる。
・代表的な企業サイトとして
- docomo:http://www.nttdocomo.co.jp/
- 日産:http://www.nissan.co.jp/
- panasonic:http://panasonic.jp/
- sony:http://www.sony.co.jp/
どれも上記に書いたとおりになっている。どのサイトもほぼ同じレイアウトになっている。
見た目のデザインにとらわれすぎていて、使いやすさ、見やすさのことを一切考えていなかった。
今後は、ユーザービリティを意識して作成しよう。
○次の課題
今回教えていただいたことを元に、ラフスケッチPPTを修正する。
そのあとのこととして、webデザインをそっくりそのままイラストレータなどに起こすとのこと。
Dwでそのまま作っていくと思っていた。Dwでは画像をあとで調整することなどが困難なため、
先に全てを画像にしてサイズなどを決めてしまうとのこと。
ユーザービリティについてわかりやすい。
ヤコブ・ニールセンの考えをまとめたWebユーザビリティガイドライン
http://oalp.org/doc/nilesen/
ラフ作成3
ここまでの手順
1,アイディアを頭でふくらませる。紙に書いてもいい。
2,参考になりそうなのを探す。本、webから。webだったら、クリップするかキャプチャにとる。本には付箋。
3,紙にラフスケッチのラフスケッチ。できるだけたくさん。
4,PPTにラフスケッチのラフスケッチを起こす。
○疑問や感じたこと
・3〜4で自分のアイディアも入れることができた。
参考のサイトとそっくりになってしまう不安もあったけど、そうでもなかった。
・実態のないもの(サービスとか)では、イメージ画像が大きい(多い)ものは難しい。
・レイアウトのスタイルってほぼ決まっている。(レイアウトのセオリーの本を読んでいるから当たり前。)
・ヘッダーフッターの部分は何を配置すべきか?よくわからなかった。
・「グリッドレイアウト」バランスが良くていい。
ラフ作成2
とっておいたキャプチャーを参考にラフを作成。
1から自分で作ろうと思っていたけど、
いいと思ったサイトを自分のサイトに当てはめて作った方が
うまく行くように思う。
まねて作るうちに、自分の思うようにできてきそう。
レイアウト・セオリー・ブックとデザイン見本帳も参考にしながら、
PPTにラフを描いていく。
買った本
デザインを考える上で役立ちそうな本を購入
webレイアウト・セオリー・ブック
http://goo.gl/4QnuD
webデザイン見本帳
http://goo.gl/WWfxc
webデザインの本っていっぱいありすぎる。
今回はこんなのつくりたいという見本が載っている本にした。
質問
webサイトを作っている先輩に質問
webサイト作成時に参考にしているものを聞く。
1,「良いデザインサイト」をカテゴリー別に探せる便利なサイト
http://www.ysig.jp/
2,タグからWebデザイン関連の情報収集できるサイト
http://feed.designlinkdatabase.net/tag/
全くどこから手をつけてよいかわからなかったが、
少しきっかけをつかめた。
目にとまったサイトを片っ端からキャプチャーして保存。
ラフ作成
まずはどういう風にしたいか
デザインのラフを作成。
当初からイメージにあるサイト
http://www.postal-club.com/enjoy/pcnp/
はあるけど、そっくりにしてはいけないし。
しょっぱなからとまどう。