By: winnifredxoxo – CC BY 2.0

受け仕事をしてお金をもらうために避けて通れない見積。

高過ぎると仕事にならないかもしれない怖さ、安すぎると削られていくキツさ。せめぎあいを乗り越えて、この値段でしか仕事しないっていうところまで、突き抜けられるかどうかの違いはどこにあるのだろう？ 続きを読む

ウェブサイト制作でお客様やスタッフ感でサイトのイメージを共有するために絶対必要なワイヤーフレーム。なれないと書く事自体がかなりストレス。でも重要。

必要な要素がきちんと入っていることが大事だけど、何が必要かを考える解像度があってるかどうか。細かすぎても駄目だし、荒すぎてもダメ。

By: Priit Tammets – CC BY 2.0

ワイヤーフレームの考え方

今すぐワイヤーの品質UP！ダメワイヤーフレームを改善する4つのポイント | BITA Blog – 株式会社ビットエー

考え方を学ぶのが一番大事。見た目はそのつぎ。

何でワイヤーフレームを書くのか

ワイヤーフレーム作成時に役立ちそうなサイトや記事のまとめ | バンクーバーのうぇぶ屋

よく見るツールがひと通りおさえてあるので、まずはこれを見て途方にくれるといい。

全部無料で試せる！厳選ワイヤーフレーム作成ツール10 | Find Job ! Startup

 無料ツールもいっぱい。

でも日本語の扱いを考えると、 cacoo か power point に落ち着くはず。

C.ROWE – Wireframe Kit

ちょっと毛色が違うワイヤフレームテンプレート。単純なボックスモデルではなく、もうちょっと要素のイメージが伝わるものにした方がいいんじゃないかっていうアプローチ。手書きに近いニュアンスを伝えられるこういうがいい場面もある。

でもやっぱり手書きが一番いいんだよねぇ・・・修正が大変だけど。

Web Design Sketchbook – Web Design Sketchbook

こちらではワイヤーフレーム専用のスケッチブックも。印刷用のデータは無料ダウンロードできます。 

いいものを見てモチベーションを上げる

あとはどんどん作例を見るとワイヤー書きたくなってくる。全部英語だけど、こんなふうに書きたいなぁと思わせてくれる作例がある。

30 Great Examples of Web Design Sketches | Designbeep

いい感じの30サイト。

Alexis Antonelli | User Experience Consulting | Activision.com

実績とワイヤーを並列で紹介。これはナイスアイデア。

Wireframe Showcase

I ♥ wireframes – The ultimate source of inspiration and collection of resources for wireframes

ワイヤーフレーム専門サイト２つ。日本のサイトもあって良さそうだけど、あんまり公開されてないのかなぁ。