
Mock作りに便利なPencil
iloveubuntuにてWebサイトやアプリなどのモック作りに便利そうな「pencil」というアプリ紹介されていたのでちょっと試してみました。
Pencil, versatile GUI prototyping tool

\もしよかったらお願いします。/
●受取人の欄にmoebuntu★gmail.com(「★」は「@」に置き換える)で寄付(15円〜)できます。
Amazonギフト券(Eメールタイプ)
以下の動画ではチャートを作る例みたいなものを見ることができます。このチャートの素材なんかはサイトの構成作りとかに役立ちそうです。
実際にサイトのモックづくりを試してみたのが以下の図です。使い勝手を見るだけなのでかなり適当ですがmoebuntuサイトを想定してみました。

サイトのサイズなども画面上で右クリックから「Properties」から指定することができます。色の設定などもアイテム上で右クリックから「Properties」で設定できます。「Advance mode」にチェックを入れるとカラーホイールがでてそこから色を作ることもできます。画像なども自由に張り込めます。ここのmoebuntuのロゴはWebサイト上からコピペしたものです。

Webサイト以外にもアプリのモック作りに使える例として以下を上げておきます。iPhoneやiPadの筐体やパーツが登録されていているのでそのまま取り込んで作っていくことができます。Android用はWindows用などのパーツもあります。

PencilはこちらからDebパッケージをダウンロード&インストールできます。
ちなみにInkscape慣れしている人はこれらのパーツをコピペでInkscapeに持って行ってパーツとして使うこともできます。
実際にサイトのモックづくりを試してみたのが以下の図です。使い勝手を見るだけなのでかなり適当ですがmoebuntuサイトを想定してみました。

サイトのサイズなども画面上で右クリックから「Properties」から指定することができます。色の設定などもアイテム上で右クリックから「Properties」で設定できます。「Advance mode」にチェックを入れるとカラーホイールがでてそこから色を作ることもできます。画像なども自由に張り込めます。ここのmoebuntuのロゴはWebサイト上からコピペしたものです。

Webサイト以外にもアプリのモック作りに使える例として以下を上げておきます。iPhoneやiPadの筐体やパーツが登録されていているのでそのまま取り込んで作っていくことができます。Android用はWindows用などのパーツもあります。

PencilはこちらからDebパッケージをダウンロード&インストールできます。
ちなみにInkscape慣れしている人はこれらのパーツをコピペでInkscapeに持って行ってパーツとして使うこともできます。
- 関連記事