ペーパープロトタイピングをモレスキンで。

LINEで送る
Pocket

こんにちは、JAGA(@ja_gaimopotato)です。
iPhoneのアプリを開発するときに、機能やユースケースを考えるということはもちろんあるのですが、やっぱりUIが大事ですよね。
ぼくは、モレスキン(Moleskine)を日々持ち歩いていて、空き時間などにモレスキンにペーパープロトタイピングすることがあります。

ペーパープロトタイピングをモレスキンでするというタイトルの通り、ぼくのモレスキンでのペーパープロトタイピングのスタイルを書きます。

Moleskine iphone type 1

準備をしよう

まずは準備、ということで一応必要なものをあげます。

  • モレスキンのEvernote スマートノートブック スクエア
  • ペン
  • ものさし

モレスキンのEvernote スマートノートブックのスクエア限定です。
ドットでスクエアがデザインされていることが重要です。

ものさしは何でもいいのですが、モレスキンと一緒に持ち歩けるようにクリップルーラーがおすすめです。

クリップルーラーを買った、小さくて、かわいいやつ。

作図しよう!

モレスキンへiPhoneの画面に見立てた長方形を作図します。

作図の方法ですが、下記を参考にしてください。

1.まず左上辺りの1点を選んでください。

Moleskine iphone type 2

2.その点から下に18マス移動し、上へ2目盛りあがったところに点を書きます。

Moleskine iphone type 3

3.1番最初の点と2番目の点から右方向へ10マス移動したところに点を書きます。

Moleskine iphone type 4

4.全ての点を結んで長方形になるようにしてください。

Moleskine iphone type 5

これでほぼ、iPhone5sの画面サイズと同じ長方形が完成します。

マスで大体でもUIのサイズを把握できるのが嬉しいです。

Moleskine iphone type 6

一つのマスの1辺が約32ポイントになります。
1つのドット間が約6.5ポイントです。

例えばUINavigationBarをステータスバーの高さを含めると64ptになるので2マスでちょうど良いです。
44ptなら1マスと2目盛りでOKとしています。

手書きで、いつでも始められることがモレスキンを使ってペーパープロトタイピングするメリットなので精度はそこまで高くないですが、それでもある程度の満足は得られています。

モレスキンを普段からお使いの方で、アプリのUIを考えている方は一度試してみてください。

これからも更新を続けていきますので、Feedlyへの登録をお願いします!

follow us in feedly

LINEで送る
Pocket

ペーパープロトタイピングをモレスキンで。」への3件のフィードバック

  1. YOKO

    JAGAさん、はじめまして。私はモレスキンファンサイト[モレスキナリー]をしています、YOKOと申します。JAGAさんのモレスキンにペーパープロトタイピングをする記事を拝見し、ぜひ私のブログでご紹介させて頂きたいと思い、コメントさせて頂きました。

    突然のお願いで恐縮ですが、メールへお返事頂けると嬉しいです。どうぞ宜しくお願い致します!YOKO

    返信
    1. JAGA 投稿作成者

      YOKOさん、どうもはじめまして。メールへご連絡させていただきましたのでご確認いただけると嬉しいです!

      返信
  2. ピンバック: JAGAの“ペーパー”プロトタイピング | Moleskinerie

コメントを残す