1ヶ月の成果
【Three.js自習】
WebGLを学ぼうと調べてたのですが、Blenderのモデルが読み込めるThree.jsを使ってみることに。ガッツリ学ぶつもりは無いので雰囲気を知るために一ヶ月位の短期で。来週からサンプルを作っていくよ。— 柳澤@ゲーム作るよ (@designdrill) 2017年9月1日
でもって1ヶ月で以下のような習作を作っていました。
jquerystudy.info/three/
派手な演出は必要か?
Flash全盛の頃と比較して派手な演出のサイトは減りました(コンテンツ本位で正しい傾向だと思う)。またモバイルではブラウザの表示面積がPCと比較して小さいため(解像度的には大差が無くても面積が小さいので、フォントやUIはある程度の大きさを確保する必要がある)、余分な賑やかしを入れるスペースはありません。
しかし、それでも「印象づけ」において派手な演出が有用なケースもあると思います。例えば以下の動画で紹介しているサイトは訪れた人に強い印象を残し、友人に「このサイトすごくない?」と伝えたくなります。ブランド的にもあっていると思いますし。
逆にブランドと合っていなかったりコンテンツ本位でない演出に走ると敬遠されてしまいます。
ソースを見るとthree.jsではなくcreate.jsなのですが、両方とも「演出」を作るのには良いjsライブラリだと思います。
学習コストに見合うのか?
ということでthree.jsやcreate.jsのような演出系?のjsライブラリを学ぶ価値はあると思う。ただし利用頻度や学習コストを考えるとコストパフォーマンスは良いとは思えません。
しかし3Dソフトをすでに習得しているのであれば、少し事情が変わってきます。3Dソフトで作成した素敵なモデルやモーションをthree.jsに読込むことで、複雑なプログラムを習得せずに、印象づけに十分な演出を作成できると思うからです。
あと数学的な知識が豊富な方は、3Dソフトが無くても魅力的な演出が作れると思う。
コンテンツの中心は目指さない
とはいえthree.jsはメインコンテンツの制作には向かない(機能的にではなく経済的に)とも思います。メインコンテンツとはコンテンツの主体であり欠かせない部分、演出は無くてもサイトは成立するがメインコンテンツがないサイトは成立しない。具体的には本家サイトで紹介している実例の大半のようなもの。
3Dが外せないという意味ではthree.jsの実例としては正しい。
three.jsは高機能なので、もちろんメインを張るコンテンツも作成できますが、オーサリング的な仕組みが無いため、大規模なコンテンツ作成には大きなコストがかかってしまいます。
もし、将来的に3Dでメインコンテンツを作成したいならUnityを習得した方が良いと思う。現状のUnityはWebGLでのコンテンツ制作に対応しているものの、オーバーヘッドが大きくWebコンテンツには向かないかもしれません。しかしUnityの進化速度は目を見張るものがあり、今後はWebコンテンツ制作にも大きな影響力を持ってくると思うのです。
あくまでも「メインコンテンツ」での話です。前述の演出系の用途ではUnityは使えないと思います(html側との密な連携も必要ですし)。
これから(個人的な意味で)
今の私はthree.jsと相性の良さそうなローポリモデリングやモーションの作成については疎いため(脱出ゲームに必要な技術を中心にBlenderを学んでいたので…)、three.jsの魅力を十分に引き出すことはできなさそうです。なのでローポリモデリングやモーションを習得してから再びthree.jsの勉強を始めたいと思います。
しかしモチベーションは低めなので、再開するにしても来年以降ですね…たぶん。
twitterを本格的に初めてみた。ブログの更新記事をつぶやくのがメイン。あとCocos2dやUnity、その他アプリ開発に関連するツイッターの方をフォローして情報も集められたらなぁと思います。
— 柳澤@ゲーム作るよ (@designdrill) 2015, 12月 28