デザインネタをWebで探す人が知っておきたい、日ごろのネタ収集と活用を効率化する4つのアプリ：スマホカメラとタッチで変わる制作現場（1）（1/3 ページ）

Creative Cloudのスマホ向けアプリAdobe Shape／Brush／Colorを使って、それぞれ形状、ブラシ、色の組み合わせをデザインの素材として日ごろから収集しておくと、アイデアを形にしてWebデザインなどに生かすのが効率的になる。その実例を紹介しながら、日ごろのデザインネタ収集の方法がどのように変わるのかを紹介しよう。

[岡本紳吾，hatte Inc.]

連載目次

Creative CloudとスマートフォンでWebデザインのワークスタイルはどう変わるのか

　Webデザインや制作をしている方は、普段のネタ収集はどのようにやっているのだろうか？ 例えば、Webや図書館、映画を見にいくなどさまざまな方法があると思うが、それらのネタをデザインに落とし込む作業はどのようにしているだろうか？ デスクに座ってPhotoshopやIllustratorを使っているのだろうか？

　アドビ システムズ（以下、アドビ）がリリースしているスマホ向けアプリ群と「Adobe Creative Cloud」（以下、Creative Cloud）を利用すると、このようなネタから素材への落とし込みが非常にスマートに行えるようになる。

　今回は、その実例を紹介しながら、日ごろのデザインネタ収集の方法がどのように変わるのか、2回に分けて紹介していこう。

Creative Cloudのモバイルアプリ

　また、デザインを依頼するディレクターやプロデューサー、さらには開発者／プログラマーでも、普段「かっこいいデザインを思いつけない」「この前見た、あの感じでデザインしてほしいのに……」と悩んでいる方は少なくないだろう。Web上でネタを探すよりも、今回紹介する方法で日ごろからネタ収集をしておき、IllustratorやPhotoshopで使いやすいようにしておけば、デザイナーとのコミュニケーションもかなり効率的になるので参考にしてほしい。

※編集部中：ここから紹介するアプリは2015年10月に一つのアプリ「Adobe Capture CC」として統合されたが、使える機能に変わりはない（参考：Adobe MAX 2015基調講演：Dreamweaver、Photoshop、Muse、Creative Sync、Typekit、Project Comet――アドビが示したUXデザイン／Web制作ワークフローの未来とは）。

スケッチ、トレースすら不要になるAdobe Shapeを使って「形状」の素材を手に入れる

　例えば街を歩いていると、さまざまなピクトグラムに遭遇する。広告を見ると斬新なレイアウト、文字組、商品パッケージデザインなど、参考になるものがあふれている。これまでも、そのようなものを見かけたら写真を撮るなどしていたが、素材として活用するにはスケッチをしたり、トレースをしたりする必要があった。

　「Adobe Shape CC」（以下、Shape）は精度の高いエッジ検出アルゴリズムが搭載されており、写真からきれいな「形状」のベクターデータを生成できる。面倒なトレースが不要になるばかりか、移動中のちょっとした時間でも手に入れたデザインからデータを起こすことができるようになるのだ。

　Shapeはトレースしたいものにカメラを向けて、境界線の閾値をスライダーで設定して撮影ボタンをタップするだけだ。

　不要な「形状」を指でなぞって削除して、必要な部分だけ残すことができる。もちろん、間違えて消した「形状」を戻すこともできる。

　また「形状」にしたアセットデータはIllustratorやPhotoshop、iPad用ベクトルグラフィックデザイン＆描画アプリ「Adobe Illustrator Draw」でそのまま利用できる。