Webサイトのワイヤーフレームを作成するときのツール選びのお話。
今の仕事でやっているワイヤーフレームの定義は
- ページに配置する要素を決める
- 要素のテキストや画像素材の配置
までを行い、デザインがイメージできる内容を作成する
ということだ。
デザイナーが作りたいWebサイトの1枚の絵を描けるように
するためのものと言うこともできる。
そこで、そのワイヤーフレームをどういうツールでつくるか検討したのだけど
調べるといまは、ワイヤーを作るためのWebサービスがいろいろある。
以前使ったことのあるprottは使いやすかったのだが、無料サービス期間が終わり、有料になって使うのをやめてしまった。普段の仕事では、ワイヤーフレームの作成は行わないが、ごくたまに、発生する程度の頻度だったので、有料で使い続けるまでもなかった。
そこでまた、今回ツール選びのお話ということだ。選定基準を挙げておく。
- シンプルで使いやすい
- 共有しやすい（エクスポートが画像またはPDFで可能）
- 無料であること
keynote
keynoteも非常に使いやすいかもしれない。
スライドのサイズをカスタムで作るのだけど、高さが足りなくなって追加する場合、
並べていた要素が大きく崩れてしまう点でやめておこうという判断になった。
しかし、高さを変更する前に、並べている素材をすべてコピーしておけば問題ない。
ということにさっき気づいた。下記手順で問題なく作業できる。
高さ変更をする場合の手順
1. 並べている要素を全てコピー
2. 高さの変更
3. 並べている要素を全て削除
4. コピーしていた要素をペースト
Google Drawings
今回、使っていたサービスは
Google Drawings
メニューのしたの方に隠れていてわからなかったけど
keynote同様に、カスタムサイズで作り始めよう。
ファイル＞ページ設定＞カスタム
これで良さそうだ。
仕上がり
今後は
- keynote
- Google Drawings
のどちらかで
さっき上に書いた「高さ変更をする場合の手順」
を使いつつワイヤーフレームをつくることになりそうだ。
