【Kinesys】VirtualFashionをもっと素敵に使う方法ー画像加工編ー

シェアする?

howtovirtualfashion

みなさまこんにちは。最近ジムに通い始めましたネクストシステムの広報担当田中です。

弊社のサービスの「Kinesys」に入っている『Virual Fashion』の機能について,

「Virtual Fashionを一番ベストな状態で設置いただきたい!」という思いを胸に、4つに段階を分けて、詳しくご説明をしています。

前回はこの中から写真撮影のコツをお届けしました。

今回は写真撮影の次のステップ、画像加工についての手順やコツをお届けしたいと思います。

導入をご検討されている方、導入がお決まりの方のご参考になれば幸いです。

Virtual Fashionとは?

弊社進化型ARサイネージシステムのKinesysに導入されている機能の1つでリアルタイムでのバーチャル試着が可能です。

詳しくは下記でまとめてます。

■Kinesys

こんなお悩みをお持ちではないでしょうか?「ブランドイメージをUPしたい」「多くのお客様の目を引きたい」「アトラクションスペースを盛り上げたい」「地域・地元の魅力を最大限に発信したい」「発信情報の効果を確かめたい」「ビッグデータを収集、最大限に活かしたい」企画担当者様の頭を悩ませることの1つが、ズバリ『集客』。

■Virtual Fashion 2.5D

こんにちは。ネクストシステムの広報担当田中です。以前弊社の進化型ARサイネージシステム『Kinesys』について紹介しました。 しかしその中のコンテンツ『Virtual Fashion 2.5D(バーチャルファッション)』については、正直話し足りない・・・!という訳で、今日は『Virtual Fashion 2.5D』についてご紹介したいと思います^^

切り抜く際は自動選択ツールではなく、パスツールがオススメ

まずは撮影した画像から服の部分を切り抜く必要があります。

その際、自動選択ツールで切り抜くより、パスを使って切り抜くことをオススメしています。

パスを引いてるところ

自動選択ツールを使う場合、どうしても背景部分が淵に残ってしまったり、半透明な部分が残ってしまうことが多く、その修正に時間がかかってしまうんですよね。

少し面倒かもしれませんが、パスツールを使ってしっかり切り取る線を決めた方が素敵なバーチャルファッション体験が可能です。

※服の切り取りはネクストシステムでも可能です。(要追加費用)

※切り抜く時は撮影した際の画像サイズのまま切り抜いてください。

しかし『Photoshopがない!』というお客様もいらっしゃると思います。

そんな時は無料で高機能な画像編集ソフト『GIMP』でも可能なのでオススメです。

■GIMPダウンロードサイト

The official download page for all things GIMP! Please only use the official binaries provided here unless you really, really know what you’re doing (it’s the o...

■GIMP (ギンプ)最新日本語版のダウンロード・インストール方法

非接触・非対面だから衛生的。ひらり、軽やかに。手をかざしてスタイルチェンジ。まるで、本物のようにフィットする仮想試着を。画像を取り込むだけで、服を着たようなリアルな仮想試着(バーチャルフィッティング/バーチャルファッション)が体験できます。結婚式の試着や体験イベントなど幅広い活用が可能です。非接触・非対面だから衛生的

切り抜く際のコツ色々

シワで大きく凸凹している部分はカットしてOK!

撮影時にできるだけシワやたるみができないようにご撮影いただいたと思いますが、
どうしても発生してしまうシワやたるみってありますよね。

そんな時は大きくはみ出た服をカット!

生地が硬めの服だと、腕を開いた際に肩の生地が盛り上がってしまうことがあるんですが、

その通りに切り抜いてしまうとおしゃれな服が、

サ○ヤ人の戦闘服のようになってしまうという悲しいケースもありますので、
そこは潔く綺麗な肩の形に切り取ることをおすすめします。

次回の記事でご説明しますが、切り抜いた次の工程でKinesys管理アプリを使い、切り抜いた画像を下図のようなモデルの中に収まるようにして設定します。

最終的にだいたいこのモデルに合うよう切り取っていただきたくようお願いします。

パンツスタイル

パンツスタイルのモデル。他にも服によってモデルが違います。

着物を切り取る際は袖の上部分は平らにする

着物を切り取る際には袖の上部分を右腕と左腕共にできるだけ平らにしてください。

前袖の画像の上部分を軸に後袖を生成するため、

着物の場合モデルの上部に、切り抜いた袖の上部をぴったり合わせる必要があるんです。

そのため、前袖と後袖が合わせやすいように、できるだけ平らに切り取ってください!

※平らでないと肩に謎の空間が生まれます。

kinesysの管理画面(着物)

VirtualFashionの設定画面

襟部分を切り抜く時は、丸みをもたせて切り取る!

襟の首元を切り抜く時、普通に切り取ってしまうと尖ってしまうんです。

襟は丸みをもたせて切り取りましょう

このままではVirual Fashionに組み込んだ際に、襟が首に刺さるというバイオレンスな事件が起きてしまう・・・!

そんな悲しい事件を防ぐためにも、少しだけ丸みを持たせながら切り取りましょう。

襟の形

左右の芯がズレてる?そんな時はパペットワープ!

撮影の際にまっすぐ垂直に撮影したつもりでも、服が少し曲がってしまうことってありますよね。

そんな時、もしPhotoshopをお持ちの方は『パペットワープ』を使用して、細部を修正していきましょう。

※GIMPの場合『ケージ変形ツール』が一番近いようです。

パペットワープ修正前

パペットワープ修正前

調整すると下図のような形に!できるだけ左右対称に調整します。

パペットワープ修正後

パペットワープ修正後

あ、カメラで取った時に服が傾いていたら垂直になるよう少しだけ回転してくださいね!

切り抜き前と切抜き後比較

切り抜いた後、パペットワープで左腕と右腕が平らになるように修正して傾きも修正してます

最後に切り残しがないかチェック!

うまく切り抜けましたか?

最後に切り残しがないかチェックしましょう。

オススメは切り抜いた服の下のレイヤーに、背景の反対色などハッキリした色味を置くこと!

切り残しをチェック

背景を黒やビビッドカラーにすることで、縁に切り残しがないかチェック!

これで背景の切り残しが残っているかいないか一目瞭然ですね。

ぜひ試してみてください〜!

データのご共有方法

切り抜いた画像データは一度psdなどで保存し、

別途2048×2048の正方形のPNGデータで書き出すことを推奨します。

切り抜く前に2048×2048に画像サイズを変更してしまうと、修正時に画像が荒くなってしまったりします。

さて、書き出した画像データを使ってKinesys管理アプリで調整をするわけなのですが、設定方法は次回の記事で詳しくご紹介します。

また、Kinesys上での設定をネクストシステムにご依頼されている場合、下記のようにデータをお送りくださいませ!
いただけると弊社のKinesys担当がちょっと嬉しそうにします。

【推奨するデータの送り方】

■解像度

2048×2048px

■データ形式

.PNG(PSDやXCFなどパスを引いた後の元データがあると修正時にありがたいです)

■命名規則

特にありませんが、一意のわかりやすい名前に設定をお願いします。

■送信方法

フォルダに画像をまとめ、お好きなファイルアップローダーでアップロード。(firestorage、ギガファイル便、クライアント様独自のファイルアップローダー、枚数少なければメールなど)

Kinesysの製品仕様についてはこちらから。当システムはモーションセンサー・PC・ディスプレイだけで実現できます。すでにデジタルサイネージ機器をお持ちの場合は、「基本パッケージ」のみの購入でのご利用も可能です。 また、短期間での利用をご希望のお客様へ、オススメのレンタルプランサービスがございます。全てのハードウェアと...

まとめ

引き続きVirtual Fashionをもっと素敵に使っていただけるよう、

次回は管理アプリの設定をご紹介しますのでお楽しみに〜

kinesysお問い合わせ

ネクストシステムは、AI(人工知能:DeepLearning)・VR(仮想現実)・MR(複合現実)・AR(拡張現実)・iPhone・Android開発を得意とする東京・福岡のシステム開発会社です。開発のご相談はお気軽にお問い合わせください。
トップへ戻る