注意点
Adobe Protoでのワイヤーフレーム作成において、いくつかの注意点を以下に記載しておきます。
- 「.pro」ファイルを開く度に、Dreamweaverでのサイト定義が新しくできてしまいます
- 「Page 1.html」のファイルにはスペースが入っています。ファイル名中の半角スペースは好ましくありません
まとめ
以上、Adobe Protoを使ってワイヤーフレームを作成し、Dreamweaverで開くという流れを解説してきました。私自身、タブレットでワイヤーフレーム！？と思ったのですが、ストロークジェスチャーが使って楽しいUIというだけでなく、ちょっとした修正も苦労なく行えます。逆に、カンタンすぎて、クライアントと一緒にAdobe Protoを使ってワイヤーフレーム作成を行うと、「カンタンなんでしょ！」と、好ましくない誤解が生じてしまうことが心配です。
最後に、良いことばかりではなく、少しシビアな意見で〆ます。
- ページ遷移を確認できるプロトタイプとしては十分だが、そのままサイト制作に移行できるレベルのソースコードではない。となると「Adobe Proto → Dreamweaver」だけでなく、「Adobe Proto → Fireworks」と流れがあっていいのでは？ つまり、Adobe Protoでワイヤーフレームを作成、Fireworksでカンプを作り込む、という流れが欲しい
- 現状では、いったんローカルに「.pro」ファイルをダウンロードする必要があります。近い将来、DreamweaverからAdobe Creative Cloudのファイルスペースに直接アクセスし、「Adobe Proto → Dreamweaver」だけでなく「Dreamweaver → Adobe Proto」のように双方向のやりとりができるとよさそう
- iOSのUIではタップだけでトグル（ON／OFFなど）が切り替わるが、Adobe Protoの場合、ドラッグしなければならない
何はともあれ、ストロークジェスチャーが楽しいので、ぜひ一度触ってみてください！
最新版「Adobe Proto 1.5」について
先日、Adobe Proto 1.5がリリースされ、大幅に機能が強化されました。CodeZineでは、新しいバージョンではどんな機能が追加されたのか、その差分やメリットについて、後日記事として公開する予定です。お楽しみに！
アドビの最新技術情報はADCで！
