Html5conference2012 yota hisamichi_世界に向けたスマートフォンゲームを支える、 greeのテクニカルアーティストについて。

Copyright © GREE, Inc. All Rights Reserved.Copyright © GREE, Inc. All Rights Reserved.

世界に向けたスマートフォンゲームを支えるグリーのテクニカルアーティストについて

Development Department/Japan StudioYota Hisamichi

Copyright © GREE, Inc. All Rights Reserved.

Self-introduction

Yota Hisamichi

RIA 系 Web ゲームコンテンツ会社、大手コンソールゲーム会社で勤務後、

現在 GREE でスマ—トフォン向けネイティブゲームのクライアントサイド開発、テクニカルアーティストやってます。（ Web とコンソール業界の両方を見て来た、もと Flasher ）

先日、海外の複数カ国で「 Animal Days 」 β 版リリースしました。


Animal Days （ TA がいがありそうな、 Unity3D 上で 2D ゲーム）


グリーの TA を取り巻く

近況


世界に広がるグリーオフィス

・・・わずか１年少々で、全世界１１オフィス！


さらに増加するグリースタジオ

グローバルに通用する魅力的なコンテンツラインナップの強化を目的にモバイ

ル向けシミュレーション RPG のリーディングカンパニー Funzio,Inc（本社：米国カリフォルニア州）を子会社化


グローバルに向けて GREE Platform リリース


時代の要請と、それに伴う開発環境の充実

Automatic convert


求められるテクニカルアーティスト

このように、大きな舞台と準備が整いました！

そのため、

① 大量の asset を② 高速かつ③ どのスタジオ環境下でも

開発促進できる TA が、数多く必要です。


＝可能な限り自動化

高速・高品質・言語の超越


実際のゲーム開発における具体例


あまり語られてこなかった弊社のサーバーサイド以外の話


… 全部説明は無理なので何をお見せするか、


1 Imageto

Native Game UI


1 枚の画像ファイルから、自動でネイティブゲーム UI を作る。

（までの流れ）


UI コンバートシステム (UIsmash) の全体概要

画像 (PhotoShop)

Device1( iPhone )

Device2( Android )

Unity3D(or HTML5)

ajustment publish

( jsfl )

make fla( jsx )

Flash(R)

lwf (仮 ) convertor

swf pngtexturepacking

LWF C#(or JavaScript)

localizedata

jenkinsgit

layersetting

colorreduction

全 16工程！

(仮 )


PhotoShop layer name setting

layer setting について（ここだけ手動）


PhotoShop layer name setting

Button_CloseButton_ShowGameMap


Layer名で UI を指定・設定


UI のタイプ変数名callBack名(state名 )




UI のタイプ変数名callBack名(state名 )



List_Body_2_3_horizontal




UI のタイプ変数名 row数

column 数縦 or 横の指定




UI のタイプ変数名 row数

column 数縦 or 横の指定


Layer名で UI を指定・設定 (convert 後の Flash 上 )


make fla

PhotShop script (.jsx)Psd to Fla

早い。ズレない。誰でも使える


to Flash

Flash(R)(.xfl or .fla)swf生成より後々変更容易

後でモーション演出付与可能


swf publish

flash script (.jsfl)エラーチェック・最適化・ swf生成


減色 & like CSS Sprite

color reduction(such as 16bit RGBA4444, gradation)

&texture packing

(margin adjustment, draw call reduction.)

軽くなる。早くなる。奇麗になる。


localize data

bitmap text(14 language)

あらかじめ指定しておけば、ローカライズも容易


make lwf

lwf(仮 ) convertor(binary, C#, JavaScript)

各種フォーマットに書き出し可能。そして高速


version control

git & jenkins(.apk .ipa)

(for QA, Dev, Staging, Product)

ソースとバイナリのバージョン管理自動ビルド


GameEngine

Unity3D or HTML5(or Flash(R) Air(R))

(and Unity3D EditorScript)

Unity 上でも 2D を実現。同時に HTML5 も。エディタスクリプトが扱えれば、開発がよりスムーズに。


Build for multi device.

iPhone & Android各種端末に対応


Complete!

ほぼすべて自動化可能かつ、途中からマニュアルで修正・追加可能な状態


Shop UI sample


生成可能な UI

1. Img (MovieClip,parenting)

2. Text (Dynamic text)

3. Button (interactive motion)

4. Toggle5. List (vertical,horizontal)

6. AttachTarget (Character, Item)

7. Frame8. Gauge9. RareRateStar10. localize text target


How makingother object?

(such as Character, Building)

UI と同じく、すべて LWF(仮 ) で実現

2D 向きでない 3D ゲームエンジンで、従来と同じWeb アセットで、 2D ネイティブゲーム Map を描画


GREE-TA の必要スキル

・ Flash(R) オーサリングの基礎・ ActionScript 1.1 の基礎 ( フィーチャーフォン )・ PhotoShop の基礎・減色・ TexturePacking の基礎・自動化の基礎（ jsfl, jsx ）・ Unity3D の基礎・ HTML5 の基礎

—・スマトフォンゲーム・アプリ開発の基礎

・今回お話した TA 業務への興味・適正


TA に必要なマインド

・多様性を吸収してパワーにできる人（様々なスペシャリストと関われます。コンソールと Web 、クライアントサイドとサーバサイド、大規模開発と小規模開発、ベンチャーと大手などなど、多様な職種出身者と常識が溢れています。国籍も様々です。それを整理・吸収したい方）

・言語の壁を吸収できる人（英語のドキュメントを読んで最先端の技術を吸収したい方、英語に耳が慣れる環境に身を置きたい方。）

・成功するまで諦めない人！（困難な局面に直面しても、技術と発想とアートへの理解により、それを乗り越えられる人。）


根本にあるもの

・ユーザー視点　　なによりユーザーに喜んで頂けるプロダクト開発を目指　しています。

　特にテクニカルアーティストの場合は、エンジニアや　アーティストも、自分のユーザー / お客様となります。

　さらに社内だけでなく、外部の協力会社もユーザーになり　　えます。そのため、社外でも問題なく扱える技術開発が　できるかどうかも重要です。


テクニカルアーティストが活躍できる規模感

・より多くの人に使ってもらえる。 ➡

・より頻繁に使ってもらえる ➡

・使われ続ける ➡

・膨大かつ正確なデータで反響を得られる ➡


他にないやりがいについて

世界中に、これだけの量とスピードでゲームを出している環境に関われる場所はなかなかないと思います。

スマフォを通じて爆発的にゲームが広がっている、希有で重要な勝負の時期だからかもしれません。そのため今を逃したら、将来この規模のチャレンジは、やってこないかもしれないかもしれません。

そしてそのチャレンジ成否が少なからず、 TA の手腕にかかっていると言えます。


テクニカルアーティストとは？


銀の弾丸に挑戦し続ける人！


Go global!!

ご興味を持たれた方、一緒に世界に向けたスマートフォンゲームをつくりましょう！


Documents

Html5conference2012 yota hisamichi_世界に向けたスマートフォンゲームを支える、 greeのテクニカルアーティストについて。