ブログ

無料アプリ「合成スタジオ」で缶バッジデータ作成【ニプリドットコムブログ】

無料アプリ「合成スタジオ」で缶バッジのデータ作成

缶バッジのデータ作成におすすめアプリ「合成スタジオ」です。業者のようにPhotoshopMIXを押してきましたが、やはり登録(しかも英語)で躊躇してしまうと思います。「合成スタジオ」は日本語(iOSのみ)でしかも登録不要、無料ではPhotoshopMIXのように4000×4000という高画質が出来ない、ところどころ課金が必要ですが、75mmくらいまでの缶バッジなら十分の画質サイズで作成できますし無料の編集機能も優秀です。長方形と100mmはなんとかなるレベルくらいでしょうか・・・PhotoshopMIXではスライダーでの紹介をしておりますが、あまり評判よくないみたいなのでブログのみでガッツリ紹介します。

アプリの用意とアタリデータ・制作データの用意

iPhone・iPad用

日本企業が制作(リメイク?)しているので日本語で丁寧な説明がつきます

合成写真 合成スタジオ-写真の合成と背景透過画像を作成

合成写真 合成スタジオ-写真の合成と背景透過画像を作成
開発元:KALEIDOSCOPE Inc.
無料
posted withアプリーチ

Android用

Android持っていないので説明画面を見ただけですが、基本的な機能は同じみたいです。文字入力ができないみたいですし、他にもiOS版と機能が違う所があるかもしれません。

合成スタジオ

合成スタジオ
開発元:handyCloset Inc.
posted withアプリーチ

画像テンプレート

作りたい缶バッジのアタリデータ・制作データを入手

  • 今回はハート型の缶バッジデータを作成したいと思います

    一覧から画像を保存すると300×300のサイズになります。欲しい画像をクリックしてから保存すると1000×1000の画像になります。位置のテンプレートなのでどちらでも大丈夫です。

    画像の用意

    缶バッジにしたい画像を用意します

    • 撮影した写真画像
    • 解像度は問題ありません。明るさ調整は「合成スタジオ」は有料機能なので他アプリでしていただくか、入稿時「少し明るくしてください」とご指示ください。

    • 作成したイラスト
    • イラストアプリの環境によっては低画質になりますので、「合成スタジオ」配置前に必ず拡大して画質を確認してください。

    • スクショ(画面キャプチャ)
    • 元の画像+スマホの画面解像度が影響します。「合成スタジオ」配置前に必ず拡大して画像を確認してください。

    • ネットで拾ったイラストや画像
    • スクショの説明と同じです。アイコンを缶バッジにしたい方も多いですが、アイコンは結構低画質ですので缶バッジにできるのはせいぜい25mmか32mmくらいです。画像は元サイズより大きくすればするほどギザギザになります。

    缶バッジにしたい画像を背景かレイヤーに配置する

    なぜにレイヤーと思われるかもしれませんが、レイヤーに配置しておけば後で背景を追加したくなった時に追加できるからです。編集しない場合や背景を追加する予定が無い場合は背景に配置してください。
    今回は位置指定のみの配置なので背景に画像を配置してみます

    • アプリ起動後「新規作成」を選び、左下の背景をタップしてライブラリからをタップ
    • 缶バッジにしたい画像を選びます


    • 選択した画像をトリミングできます。大きな写真で対象物が小さい場合などは必ずトリミングしてください。
    • 今回対象のワンコが大きいのでトリミングせずそのまま配置しました

    アタリデータを配置して合わせる

    • 下メニューのレイヤーをタップ、ライブラリからをタップします
    • ニプリの画像テンプレート、アタリデータを選択します。制作データでは位置合わせできないのでアタリデータを先に配置します。


    • アタリデータのトリミングですが必要ないので右上の完了をタップ
    • 缶バッジの位置を合わせていきます。均等の拡大縮小・回転は自由にして下さい。均等でない左と下の矢印で縮小拡大してしまった場合はリセットボタンで戻してください。

    位置が決まったら「ロック」してください。紹介画像では「ロック」しませんでしたが「ロック」して動かなくしたほうが安心です

    アタリデータに制作データを重ねる

    アタリデータの配置と同じようにレイヤー>ライブラリから>制作データを選択して配置します
    位置見本と画像データを一緒に入稿する場合はアタリデータ云々の作業は必要ないです。ぶっちゃけなんの為にとおっしゃいますと「合成スタジオ」で合成や変形、文字入れ等した場合は制作データでの入稿もしくは編集後のデータでアタリデータを削除した画像が必要になります。もし、編集前の画像データと「合成スタジオ」で編集後の位置見本データを入稿された場合は編集前の画像データで製造されてしまいますので注意してください。

    • アタリデータにぬりたし線(青色の線)を重ねていきます。うまく合わせられない場合はここまでのデータを位置見本データとして保存し、元画像とアタリデータまでの画像を一緒に入稿してください。「合成スタジオ」で編集された場合はアタリデータ有りの保存をしてアタリデータを削除した画像データと一緒に入稿してください。
    • 合わせる前のスクショを撮り忘れてしまったので合わせた後です。

    アタリデータを削除する

    アタリデータが入ったままだと点線が入ったまま製造されてしまうので削除します。データチェックで気が付くので製造されることは100%ないのですが、データ不備となってオペレーターから再入稿の催促メールが来ますので注意です。

    • アタリデータを削除
    • 削除されたのを確認して保存します。アタリデータは線データのみで見えずらいですので間違って制作データを削除したりしまわないように注意です
    • 下のメニューから保存/シェア>保存を選びます
    • たまにメモリ不足とか出る時ありますが無視して保存完了すると無料版の場合広告が出ます・・・タップしないで(×)で閉じましょう😆

    入稿データの完成後、確認する【重要】

    保存後の確認です。スマホ画面で見るとキレイでもパソコンで配置すると低画質独特のギザギザしていたりぼやけていたりしていたりするので必ず拡大して確認してください。弊社では印刷会社の厳しいチェックを行っていますので「読める程度」「見える程度」ではデータ不備扱いになります。

    • 写真ライブラリに保存されたか確認します。
    • 画像が低画質でないか確認するため、拡大してください。

    無料の編集機能を使ってカスタマイズしてみた

    ページが画像で重くなってしまいそうなので少し小さめの画像です。

    • 合成するので背景ではなくレイヤーに画像を配置します。合成する時は余分な箇所をトリミングで取り除いた方が後々楽です
    • 「スムース/透かし」を使って見ましたが良いですコレ!
    • レイヤーが選択された時の左上が回転ボタンみたいです、スマホだと横向きにした時なんか天地が逆になっていたりするのでワンタップで回転できるのは便利です
    • 左と下の矢印は変形するみたいで、写真には使えない気がしますが文字やイラストには便利ですね
    • 一度変形してしまうと縦横対比を元に戻せる気がしないのでリセットします
    • メニューの「調整」は透明度以外有料版のみみたいです。プロにするのは¥240円と安いのですが、無課金派なのでしません。ごめんなさい。


    • ダブルタップすると画面を拡大できます
    • メニュー「切取り」を選択するとなにやら使えそうな機能がいっぱい
    • 「自動削除ツール」を使ってみましたが、複雑な絵柄には不向きですが、イラストの白い背景を取る時なんか便利ですね。イラストでも試しましたが精度は「まあまあ」悪くもないけど良くもない感じでした。太めの黒いフチがあるイラストなんかにはいいです。

    画像撮り忘れましたが、修復ツールで戻した後消しゴムツールでわんこの外側を消そうとし炊けどあまりうまく行かず、消しゴムで全て消してから修復で必要な所だけをなぞって輪郭を作りました

    • 先ほどの「スムース/透かし」をしたかったので少し多めに輪郭をとっていました
    • 背景に色をつけます。単色の物から画像まであります。左上のカートアイコンがあったので有料かと思いましたが無料でした
    • 「テキスト」の追加で文字入れしてみます。配置は画像と同じですので省略します
    • だいたい出来上がったのでアタリ画像を配置して位置合わせします
    • テキストの注意点があったので再度「テキスト」の入力画面です。ローマ字入力すると小さいフォントがあります。
    • そのまま配置すると小さいです。右目の眉毛みたいなのが文字です
    • 拡大するとギザギザで画質酷いです
    • その場合はテキスト入力時にオリジナルサイズで大きくしてください。
    • 高画質な文字になりました。このアプリは書体がいっぱい選べるので文字入れするのも便利です

    画像も文字も全てに共通するのですが、小さい物を大きくすると画質が悪くなります

    • 制作データをアタリデータに貼り付け配置してアタリデータを削除します。全てのレイヤーを動かないようにロックしてあります
    • アタリデータを削除して保存しますー
    • 写真ライブラリから保存した画像の拡大チェックして見ると・・・口元が透けてました
    • 輪郭を消す作業で、消してから修復した為に修復の甘い所が透けてしまったらしいです。「切取り」でダメもとで「修復」をしてみたらなおりました。後からでも修復できるって結構いい機能です。
    • 保存してデータ制作完了です
    • 再度確認します。保存データも透けてません

    画像の用意

    お客様による制作事例です

    全てアプリで作成:H様(北海道)

    無料アプリでここまでデータを仕上げられるとはスタッフも驚きでした。使用したアプリは「合成スタジオ」の他に「phonto」、「Assembly」、「写真(iPhone標準アプリ)」で作成したらしいです。他アプリの使用方法は弊社では紹介しておりませんので各々検索してみてください。最初に入稿いただいたデータは流用画像に低画質な画像を使用してしまったらしく、全てが低画質で仕上がってしまっていました。低画質は高画質にできませんので再度高画質でお作りいただくことに・・・13種類ありましたが全部です。最初に低画質で作られてしまうと複数のアプリで加工する時も低画質になってしまいますのでご注意ください。

    ここまで凝ると作成時間がかかりそうですが、アプリのみでもここまでデザインできるという紹介でした。

    以上でアプリ「合成スタジオ」の紹介を終わります

    使ってみた印象はPhotoshopMIXと同等の操作性や機能、画質など劣る所もあるけど操作性は「合成スタジオ」の方が使いやすいカモです。透かし機能と消しゴムツール・修復ツールは良いですね、AdobeのアプリはAdobe製アプリ同士で互換性があり、連携して使用すると間違いなく世界一なのですが、「合成スタジオ」はアプリ単体でできることが多いという印象でした。透明化PNGデータも使えるので是非使って見てください。

    PhotoshopMIXでのデータ作成方法をブログで紹介

    ニプリスタッフブログ一覧

    アーカイブ

    pagetop