2016年3月31日木曜日

SceneKit - 楽しいけど難しいパーティクル

SceneKitシリーズ 第三弾。今回はパーティクル編です。




Standlandでは、深々と雪が降っている雪国や、キラキラ光るGemmyなどで使ってます。
この効果はパーティクルといいます。

UIKitでもCAEmitterLayerを使用すれば同様な事ができるので、使った事がある人もいるのでは?

UIKit Particle Systems in iOS 5 Tutorial | Ray Wenderlich
UIKit上でパーティクルエフェクトを表示する - Over&Out その後
Swiftでパーティクルの描画☆*:.。.([CAEmitterLayer / CAEmitterCell] 

SceneKitのParticleと、CAEmitterLayer。設定する内容もほぼ同じで、

  • パーティクルの画像
  • Birth rate
  • Life span
  • Velocity
などを設定していきます。

パーティクルの難しさは、組み込む方法よりも、パラメータを調整して "いい感じ" にすることだと思います。
なんというか....やっぱりここにもセンスがいるし、チマチマとした調整を始めると結構時間がかかる。

CAEmitterLayerで、さらに難しくしている要因としては専用エディタがないことなのですが、SceneKit/SpriteKit ではエディタがあるんですよ!


XCodeのファイルの作成でSceneKit Particle Systemを選ぶとテンプレートがいくつか選べます。
作成したファイルを開くと、エディタの表示になります。


PreviewをみつつAttributes Inspectorでパラメータをいじることができます。
SpriteKit(2D)でも同じように作成できますが、SceneKit(3D)のほうが当然ながら設定パラメータが多いです。

エディタがあるということは....つまり.....
こういう作成が得意な人に調整をお願いすることができる
というメリットが! 

このパーティクルのファイルを、CAEmitterLayerにも使えないかと探ってみたのですが方法が見つからず.....残念。

「得意な人はいないけど、凝ったパーティクルを作りたいのだ」
という人は、ツールでカバーする方向も。

購入して試していないので、どこまで連携できるかはわからないのですが...
連携が出来なかったとしても、Particle Designer のように、いろいろサンプルがあると助かると思う。
何事も真似から学びますしw


パーティクルって "こんな感じ" と言葉に表して伝えるのは難しい。
「キラキラしたい」とか「ゴーッと燃える」とか?
そもそもの話として、どんなものがよさそうか? を、自分でイメージが明確になってなかったりもしますよね。
人にお任せで頼むとしても、「こんな感じに近いもの」というイメージを自分で探して、できるだけ伝えるべきと思う!

たとえばー「派手目のおめでとう感」といってもいろんな表現があります。

AngryBird2のスコア表示画面をみてみると....


紙吹雪、星が大きくなった時に弾き出される小さな光、背景でぐるぐる回っているSumbeamや星、明るいところの増減などなどいろいろ効果組み合わさっているのがわかります。
手馴れている感がありますよね....さすが!

紙吹雪のパーティクルを作成するという一つをとっても、
上からパラパラ降ってくるのか
下から吹き上げられるものなのか
AngryBirdみたいにパーン!と弾きだされるものなのか
などによってパラメータが全然違ってきます。

正直、Standlandはキラと光るシンプルなパーティクルだけで逃げてしまった感があります。
いろんなパターンを試してみたのですが、いい感じのものがなかなかできず... 結局、ばっさり捨てて無難なものに。

雪が降っている ようなリニアなパーティクルは簡単ですが、パーン!とはじき出されるような動きがあるものについては、パーティクルだけだとナカナカ難しい。
AngryBirdのようにパーティクル以外の効果を組み合わせて....パーティクルは補助的な役割で....考えたほうがよさそうというのがいまのところの感想です。

センスがいいものを作るのには、アニメーション同様ハードル高めではありますが、うまく使えるようになって、他のアプリにも効果的に使ってみたい。


さて、次は.... Gemmyを歩かせる(衝突判定) の話でもー。





作成したアプリはこちら↓


Standland - 座りすぎ解消!スタンドランド


• • •