いとう（WEB・デザインチーム所属）、アニメよりマンガ派。
どうも僕です。
前回は、Adobe Illustrator（イラレ）の「生成再配色」をという機能に触れてみました。
さらに深掘りしてみようかなとも思いましたが、何度やってもなかなか言うことを聞いてくれないので、諦めて別の機能を触ってみることにしました。
今回は、「モックアップ（Beta）」です。
トキ・テックでは企業ロゴやパッケージのデザインなども手がけていますので、これが使いこなせれば提案の幅も広がるかもしれないという淡い期待を胸に挑んでみようかなと。
ちなみにモックアップとは、直訳すると「実物大の模型」とのこと。
元々はプロダクトデザイン界隈の言葉のようですが、グラフィックだと実際の使用を想定した合成写真だったり、ウェブだとワイヤーフレームとプロトタイプの間でデザイン検証用に作られたりします。
イラレの機能としては
イラレのモックアップ（Beta）はグラフィックの使用用途に近いようです。
例えばロゴを制作して、ステーショナリーやTシャツに印刷した際どのように見えるかといった感じでしょうか。
今まではそれっぽい素材を用意して、変形を駆使したりPhotoshopで合成していたものを自動でやってくれるんだと思います。
ウインドウを呼び出す
まずはツールウインドウを見てみましょう。場所は上部メニューから［モックアップ（Beta）］を選択し、表示。
こんな感じのウインドウが開きます。
オプションも見てみる
サンプル表示されている写真にカーソルを合わせるとカートアイコンが出現します。どうやらアドビストックと連携していて、合成したい写真を選べるようです。
さらにセレクトボックスを見てみるとアパレルだとかブランディングだとかが出てきますね。目的別にある程度振り分けてくれているのでしょうか。今回はとりあえず「アパレル」を選んでみました。
シャツとかが出てきました。シワや段差などの処理をいい感じにやってくれると良いのですが。散々悩んだ結果、Tシャツを着た男の子の写真をライセンス購入。
合成するもの
せっかくなので最近小学２年生にプレゼントされたイラストを合成してみようと思います。近々印刷しようと思っていたのでちょうど良さそうです。
モックアップボタンをポチッ！
ん？あれ？全部反映されとる。。。
どうやら素材のライセンス購入は必要なかったようです。
自分で確認するだけのために購入は嫌だなと思っていたのですが杞憂でした。
さて、気を取り直して、ちょっとサイズ感が微妙なので調整していきたいと思います。
合成された画像にカーソルを合わせると、何やらアイコンが出現します。ヒント上には「カンバス上で編集」と書いてあります。編集ボタンのようなので押してみます。
カンバス上で調整
編集ボタンを押すとカンバス上に合成画像が配置されます。イラスト上にある円形のツールを使用して調整するようです。
素材写真の影や形状とかを認識して変形がかかるようになっているのでしょうか。
変形も画像サイズに対して直接かかるので歪みが極端です。色々と動かしてみましたが、なかなかうまく合成できませんね。
イラストに空白スペースを作ってみる
変形がビタサイズにかかるのであれば、ちょっと余白を作ってみたらどうだろうか？
塗りなしの正方形を作ってグループ化。こいつで再度トライ。
おや、これはイケるのでは？最初よりも円形ツールの内側に収まっています。
そして出来上がったのがこちら！
・・・正直微妙ですね。
多少改善されたものの、やっぱり変形しすぎだし不自然ですね。綺麗に仕上げたいなら、それ相応の調整が必要になりそうです。
ちなみに正方形を外すとこんな感じ
さっきよりはるかに良いですね。正方形を綺麗に合成するのが難しいのか。
おまけ
エプロンが結構可愛いかもしれない。
