アイデアを思いついた時、いつでもどこでもすぐその場で形にできたら…クライアントとの打ち合わせ時など、そんな風に思ったことはありませんか？ この記事では、アドビ社の2つのツール「Adobe Dreamweaver」と「Adobe Proto」を連携させて、頭の中のひらめきを瞬時にワイヤーフレームとして作成・表示する方法をお伝えします。
-
- Page 1
Adobe Protoとは？
「Adobe Proto」は、iPadやAndroidタブレット対応のAdobe Touch Appsの1つです。手軽な操作で、アプリ上でのワイヤーフレーム作成を完結できます。
iPad／Androidともに850円。iTunes storeまたはGoogle Playで購入します。
Adobe Protoを起動する
起動すると、次のような画面が表示されるため、「View Samples」（サンプルを見る）または「Begin a Project」（プロジェクトを始める）のいずれかをタップします。
「View Samples」をクリックすると、あらかじめ用意されているサンプルのサムネイルが表示されます。
例えば「Travel」をタップすると、次のようなワイヤーフレームが表示されます。
上部にある
（目のアイコン）をタップすると、プレビューモードになり、リンク先が設定されている場合には、プロジェクト内のページを行き来することもできます。
Protoには、ワイヤーフレーム制作に必要な一通りのアイテムが揃っていますが、次の制約があります。
- グレースケールのみ。カラーで着色することはできない
- 実際の画像やムービーを挿入することはできない
ただし、これらはワイヤーフレームという性質上、妥当な制限と言えます。
この記事は参考になりましたか？
- この記事の著者
-
鷹野 雅弘（タカノ マサヒロ）
株式会社スイッチ Webサイトの構築やコンサルティングを中心に、WebやDTPに関しての講演やトレーニングのほか、書籍の企画や編集、スクールなどのカリキュラム開発も手がける。 2005年からCSS Niteを主宰。日本全国、および海外に展開し、260回を超える関連イベントを通し、のべ36,000名を超える方が参加している。 テクニカルライターとして20冊以上の著書を持ち、総販売数は14万部を超える。主な著書に『よくわかるDreamweaverの教科書』（共著、マイナビ）、企画編集を行った書籍に『現場のプロから学ぶXHTML+CSS』（マイナビ）など。
※プロフィールは、執筆時点、または直近の記事の寄稿時点での内容です
【AD】本記事の内容は記事掲載開始時点のものです 企画・制作 株式会社翔泳社
この記事は参考になりましたか？
この記事をシェア
