こんにちは。ロックウェーブの岡本です。
今月の休日の予定をことごとくゲリラ豪雨に潰されています。
今回紹介するのは、Cacoo以上に便利なモックアップ作成ツール「balsamiq」です。
モックアップとワイヤーフレーム
そもそも「モックアップ」とはどういったものなのでしょうか。
直訳すると「模型」という意味になり、メーカー・工場などでは「原型」という意味でも使用されています。
ワイヤーフレームが「サイトの骨組み」を決定するものだとすれば、モックアップは「サイトの完成イメージ」を共有するために作成するものだといえます。
Cacooとbalsamqの違い
balsamqはCacooと異なり、「モックアップ作成に特化したツール」です。
そのためかCacooでは可能な「psd/svgでの出力」は対応していません。
その代わりに実装されているのが、「xml出力」です。
「Export Mockup XML」もしくは「Ctrl + E」をクリックすると、xmlタグがクリップされます。
クリップされたタグをエディタに貼り付けて、xmlファイルを完成させましょう。
PhotoShopなどでデザインラフを作成したいのであれば、Cacooでのワイヤーフレーム作成を。
大まかなサイトの動きなどを共有したい場合は、balsamiqでのモックアップ作成を行うというのが、制作業務を捗らせる使い分け方ですね。
豊富なステンシル・パーツ類
モックアップ作成ツールということもあり、使用出来るパーツの種類はCacoo以上に豊富です。
iPhoneをイメージしたキーボードや、アラートボックス・付箋風のコメント欄や☓マークなども取り揃えられています。
例によってパーツをひと通り並べてみたのですが、10分足らずでPC→スマホのモックアップが完成しました。
今回は省略しましたが、ブラウザのサイズを調整することでタブレット・ファブレット用画面なども作成が可能です。
もちろんサイズ調整はドラッグで可能。しかもpxでサイズも表示してくれます。
製品版では、共同編集作業もOK
無料体験版は7日間のみの利用なのですが、製品ライセンスを入手すれば共同編集なども可能になります。
付箋や取り消し線パーツを活用することで、クライアントとのミーティングの際に変更点の共有がよりわかりやすくなるのではないでしょうか。
まとめ
製品版は最も安いもので17米ドルから。ブロガーや開発者など、一部には無料ライセンスも発行している様子ですので、ぜひ無料体験版でいろいろ試してみてはいかがでしょうか?
ちなみにWordPressの管理画面風のテンプレートなどもアドオンでありますので、WordPressでサイトを作る際にはかなり重宝するかもしれません。
WORDPRESS POST EDITOR FOR BALSAMIQ
http://tri.be/update-wordpress-post-editor-for-balsamiq/
[browser-shot width=”600″ url=”http://balsamiq.com”]