Paper Browser

 Twitterでも簡単に紹介したのですが、やっぱりブログでも紹介しておきます。

 先日、レンタルサーバー(ホスティングサービス)のCPIから御歳暮(?)としてノートが届いたのですが
 「デジタルサービスのサーバー屋さんがアナログのノート?」
と思いました。もちろん、アナログが悪いわけではなく、素直に「なぜ?」と思ってしまったのですが、そのノートを開けてみて納得です。「何と、素晴らしいノートを送ってくれたんだろう」と思っちゃいました!

 そのノートの名前は「Paper Browser」です。詳細は以下に。

 「どんなノートなんだろうな?」

と、思いながらノートを開くと方眼紙のように縦横にマス目があります。

方眼紙のようなマス目

方眼紙のようなマス目

 そして、上部(ヘッダー部)にはまるでブラウザを思わせるような「進む」「もどる」「リロード」「中止」「ホーム」のようなボタンとアドレスバー、検索ウィンドがあります。

左から「進む」「もどる」「リロード」「中止」「ホーム」ボタンと「アドレスバー」「検索ウィンド」

左から「進む」「もどる」「リロード」「中止」「ホーム」ボタンと「アドレスバー」「検索ウィンド」

 その下には「800px」「960px」「1024px」の文字がマス目(グリッド)に会わせて書かれています。

「800px」「960px」「1024px」の文字

「800px」「960px」「1024px」の文字

 左側には「600px」「768px」「1024px」の文字が。

左側には「600px」「768px」「1024px」の文字

左側には「600px」「768px」「1024px」の文字

 そして、一番下であるフッター部には

Grid Size: 32px × 32px

と書かれています。

フッターに「Grid Size: 32px × 32px」の文字

フッターに「Grid Size: 32px × 32px」の文字

 もうここまで見れば、わかる人にはわかりますよね。Webページをデザインや設計時に書くワイヤーフレーム用のノートです。

 ワイヤーフレームとは簡単に言ってしまうとWebページの設計図のようなものです。各ページにはヘッダーがあったり、メニューバーがあったり、コンテンツやフッターなどもあります。それらパーツをどの場所にどの様に配置し、デザインはどの様にするなどをイメージさせるためのメモ、デザイン画、設計図といったところです。

手書きのワイヤーフレーム画

手書きのワイヤーフレーム画

 自分は絵心がないので「デザイン」というものは書けませんが、「メモ」として書くことぐらいはできると思います。

 自分もこんなノートがほしいと思う人がいるかもしれませんが、おそらく、このノートは非売品です。しかし、諦めることはありません。Paper Browserは下記のサイトで配布されています。

Paper Browser: It’s a Browser only in Paper
Web Design Sketchbook

 別になくても困らないけど、持っているとうれしいGoodsでした。

Webデザインの基本ルール -プロに学ぶ、一生枯れない永久不滅テクニック-[デザインラボ](Design Lab+ 1-3)

価格¥1,980

順位479,866位

デザインラボ編集部

編集デザインラボ編集部

発行SBクリエイティブ

発売日2009/03/27

Amazonを開く

Supported by amazon Product Advertising API