Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
世界に向けたスマートフォンゲームを支える グリーのテクニカルアーティストについて   Development Department/Japan Studio                Yota Hisamichi              ...
Self-introduction  Yota Hisamichi  RIA 系 Web ゲームコンテンツ会社、  大手コンソールゲーム会社で勤務後、  現在 GREE でスマ —トフォン向け  ネイティブゲームのクライアントサイド開発、  テ...
Animal Days ( TA がいがありそうな、 Unity3D 上で 2D ゲーム)                                              Copyright © GREE, Inc. All Righ...
グリーの TA を取り巻く    近況          Copyright © GREE, Inc. All Rights Reserved.
世界に広がるグリーオフィス      ・・・わずか1年少々で、全世界11オフィス!                       Copyright © GREE, Inc. All Rights Reserved.
さらに増加するグリースタジオグローバルに通用する魅力的なコンテンツラインナップの強化を目的にモバイル向けシミュレーション RPG のリーディングカンパニー   Funzio,Inc(本社:米国カリフォルニア州)を子会社化            ...
グローバルに向けて GREE Platform リリース                          Copyright © GREE, Inc. All Rights Reserved.
時代の要請と、それに伴う開発環境の充実       Automatic convert                           Copyright © GREE, Inc. All Rights Reserved.
求められるテクニカルアーティストこのように、大きな舞台と準備が整いました!そのため、① 大量の asset を② 高速かつ③ どのスタジオ環境下でも開発促進できる TA が、数多く必要です。                  Copyright...
=可能な限り自動化  高速・高品質・言語の超越                 Copyright © GREE, Inc. All Rights Reserved.
実際のゲーム開発における     具体例         Copyright © GREE, Inc. All Rights Reserved.
あまり語られてこなかった弊社のサーバーサイド以外の話          Copyright © GREE, Inc. All Rights Reserved.
… 全部説明は無理なので  何をお見せするか、          Copyright © GREE, Inc. All Rights Reserved.
1 Image      toNative Game UI            Copyright © GREE, Inc. All Rights Reserved.
1 枚の画像ファイルから、自動で ネイティブゲーム UI を作る。     (までの流れ)             Copyright © GREE, Inc. All Rights Reserved.
UI コンバートシステム (UIsmash) の全体概要                                                                            ajustment   画像    ...
PhotoShop layer name setting      layer setting について               (ここだけ手動)                               Copyright © GREE...
PhotoShop layer name setting    Button_CloseButton_ShowGameMap                               Copyright © GREE, Inc. All Ri...
Layer 名で UI を指定・設定                        callBack 名 UI のタイプ    変数名          (state 名 )   Button_CloseButton_ShowGameMap  ...
Layer 名で UI を指定・設定                        callBack 名 UI のタイプ    変数名          (state 名 )   Button_CloseButton_ShowGameMap  ...
Layer 名で UI を指定・設定    List_Body_2_3_horizontal                        Copyright © GREE, Inc. All Rights Reserved.
Layer 名で UI を指定・設定                   column 数                              縦 or 横の指定 UI のタイプ   変数名   row                  ...
Layer 名で UI を指定・設定                   column 数                            縦 or 横の指定 UI のタイプ   変数名   row                  数 ...
Layer 名で UI を指定・設定   (convert 後の Flash 上 )                                        Copyright © GREE, Inc. All Rights Reserv...
make fla           PhotShop script (.jsx)                Psd to Fla           早い。ズレない。誰でも使える                              ...
to Flash           Flash   (R)   (.xfl or .fla)            swf 生成より後々変更容易           後でモーション演出付与可能                         ...
swf publish              flash script (.jsfl)      エラーチェック・最適化・ swf 生成                                     Copyright © GRE...
減色 & like CSS Sprite               color reduction         (such as 16bit RGBA4444, gradation)                     &      ...
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 上で...
Build for multi device.          iPhone & Android                   各種端末に対応                             Copyright © GREE, ...
Complete!    ほぼすべて自動化可能かつ、途中からマニュアルで修正・追加可能な状態                Copyright © GREE, Inc. All Rights Reserved.
Shop UI sample                 Copyright © GREE, Inc. All Rights Reserved.
生成可能な UI1. Img (MovieClip,parenting)2. Text (Dynamic text)3. Button (interactive motion)4. Toggle5. List (vertical,horizon...
How making   other object?  (such as Character, Building)    UI と同じく、すべて LWF( 仮 ) で実現 2D 向きでない 3D ゲームエンジンで、従来と同じWeb アセットで、...
GREE-TA の必要スキル・ Flash(R) オーサリングの基礎・ ActionScript 1.1 の基礎 ( フィーチャーフォン )・ PhotoShop の基礎・減色・ TexturePacking の基礎・自動化の基礎( jsfl,...
TA に必要なマインド・多様性を吸収してパワーにできる人(様々なスペシャリストと関われます。コンソールと Web 、クライアントサイドとサーバサイド、大規模開発と小規模開発、ベンチャーと大手などなど、多様な職種出身者と常識が溢れています。国籍も...
根本にあるもの・ユーザー視点  なによりユーザーに喜んで頂けるプロダクト開発を目指 しています。 特にテクニカルアーティストの 場合は、エンジニアや アーティストも、自分のユーザー / お客様となります。 さらに社内だけでなく、外部の協力会社も...
テクニカルアーティストが活躍できる規模感・より多くの人に使ってもらえる。 ➡国内数千万、世界数億ユーザー、それにともなう多くのゲーム・より頻繁に使ってもらえる ➡ハイスピードなリリース、イベント・使われ続ける ➡売り切りモデルではない。人気が続...
他にないやりがいについて世界中に、これだけの量とスピードでゲームを出している環境に関われる場所はなかなかないと思います。スマフォを通じて爆発的にゲームが広がっている、希有で重要な勝負の時期だからかもしれません。そのため今を逃したら、将来この規模...
テクニカルアーティストとは?           Copyright © GREE, Inc. All Rights Reserved.
銀の弾丸に挑戦し続ける人!       Copyright © GREE, Inc. All Rights Reserved.
Go global!!ご興味を持たれた方、一緒に世界に向けたスマートフォンゲームをつくりましょう!                  Copyright © GREE, Inc. All Rights Reserved.
Copyright © GREE, Inc. All Rights Reserved.
Upcoming SlideShare
Loading in …5
×

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

2,072 views

Published on

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

  • Be the first to comment

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

  1. 1. 世界に向けたスマートフォンゲームを支える グリーのテクニカルアーティストについて Development Department/Japan Studio Yota Hisamichi Copyright © GREE, Inc. All Rights Reserved.
  2. 2. Self-introduction Yota Hisamichi RIA 系 Web ゲームコンテンツ会社、 大手コンソールゲーム会社で勤務後、 現在 GREE でスマ —トフォン向け ネイティブゲームのクライアントサイド開発、 テクニカルアーティストやってます。 ( Web とコンソール業界の両方を見て来た、もと Flasher ) 先日、海外の複数カ国で「 Animal Days 」 β 版リリースしました。 Copyright © GREE, Inc. All Rights Reserved.
  3. 3. Animal Days ( TA がいがありそうな、 Unity3D 上で 2D ゲーム) Copyright © GREE, Inc. All Rights Reserved.
  4. 4. グリーの TA を取り巻く 近況 Copyright © GREE, Inc. All Rights Reserved.
  5. 5. 世界に広がるグリーオフィス ・・・わずか1年少々で、全世界11オフィス! Copyright © GREE, Inc. All Rights Reserved.
  6. 6. さらに増加するグリースタジオグローバルに通用する魅力的なコンテンツラインナップの強化を目的にモバイル向けシミュレーション RPG のリーディングカンパニー Funzio,Inc(本社:米国カリフォルニア州)を子会社化 Copyright © GREE, Inc. All Rights Reserved.
  7. 7. グローバルに向けて GREE Platform リリース Copyright © GREE, Inc. All Rights Reserved.
  8. 8. 時代の要請と、それに伴う開発環境の充実 Automatic convert Copyright © GREE, Inc. All Rights Reserved.
  9. 9. 求められるテクニカルアーティストこのように、大きな舞台と準備が整いました!そのため、① 大量の asset を② 高速かつ③ どのスタジオ環境下でも開発促進できる TA が、数多く必要です。 Copyright © GREE, Inc. All Rights Reserved.
  10. 10. =可能な限り自動化 高速・高品質・言語の超越 Copyright © GREE, Inc. All Rights Reserved.
  11. 11. 実際のゲーム開発における 具体例 Copyright © GREE, Inc. All Rights Reserved.
  12. 12. あまり語られてこなかった弊社のサーバーサイド以外の話 Copyright © GREE, Inc. All Rights Reserved.
  13. 13. … 全部説明は無理なので 何をお見せするか、 Copyright © GREE, Inc. All Rights Reserved.
  14. 14. 1 Image toNative Game UI Copyright © GREE, Inc. All Rights Reserved.
  15. 15. 1 枚の画像ファイルから、自動で ネイティブゲーム UI を作る。 (までの流れ) Copyright © GREE, Inc. All Rights Reserved.
  16. 16. UI コンバートシステム (UIsmash) の全体概要 ajustment 画像 layer make fla Flash(R) publish(PhotoShop) setting ( jsx ) ( jsfl ) color texture localize swf png packing reduction data lwf ( 仮 ) C# convertor LWF   ) (仮 (or JavaScript) git jenkins Device1 全 16 工 ( iPhone ) Unity3D (or HTML5) Device2 ( Android ) 程! Copyright © GREE, Inc. All Rights Reserved.
  17. 17. PhotoShop layer name setting layer setting について (ここだけ手動) Copyright © GREE, Inc. All Rights Reserved.
  18. 18. PhotoShop layer name setting Button_CloseButton_ShowGameMap Copyright © GREE, Inc. All Rights Reserved.
  19. 19. Layer 名で UI を指定・設定 callBack 名 UI のタイプ 変数名 (state 名 ) Button_CloseButton_ShowGameMap Copyright © GREE, Inc. All Rights Reserved.
  20. 20. Layer 名で UI を指定・設定 callBack 名 UI のタイプ 変数名 (state 名 ) Button_CloseButton_ShowGameMap Copyright © GREE, Inc. All Rights Reserved.
  21. 21. Layer 名で UI を指定・設定 List_Body_2_3_horizontal Copyright © GREE, Inc. All Rights Reserved.
  22. 22. Layer 名で UI を指定・設定 column 数 縦 or 横の指定 UI のタイプ 変数名 row 数 List_Body_2_3_horizontal Copyright © GREE, Inc. All Rights Reserved.
  23. 23. Layer 名で UI を指定・設定 column 数 縦 or 横の指定 UI のタイプ 変数名 row 数 List_Body_2_3_horizontal Copyright © GREE, Inc. All Rights Reserved.
  24. 24. Layer 名で UI を指定・設定 (convert 後の Flash 上 ) Copyright © GREE, Inc. All Rights Reserved.
  25. 25. make fla PhotShop script (.jsx) Psd to Fla 早い。ズレない。誰でも使える Copyright © GREE, Inc. All Rights Reserved.
  26. 26. to Flash Flash (R) (.xfl or .fla) swf 生成より後々変更容易 後でモーション演出付与可能 Copyright © GREE, Inc. All Rights Reserved.
  27. 27. swf publish flash script (.jsfl) エラーチェック・最適化・ swf 生成 Copyright © GREE, Inc. All Rights Reserved.
  28. 28. 減色 & like CSS Sprite color reduction (such as 16bit RGBA4444, gradation) & texture packing (margin adjustment, draw call reduction.) 軽くなる。早くなる。奇麗になる。 Copyright © GREE, Inc. All Rights Reserved.
  29. 29. localize data bitmap text (14 language) あらかじめ指定しておけば、 ローカライズも容易 Copyright © GREE, Inc. All Rights Reserved.
  30. 30. make lwf lwf( 仮 ) convertor (binary, C#, JavaScript) 各種フォーマットに書き出し可能。そして高速 Copyright © GREE, Inc. All Rights Reserved.
  31. 31. version control git & jenkins (.apk .ipa) (for QA, Dev, Staging, Product) ソースとバイナリのバージョン管理 自動ビルド Copyright © GREE, Inc. All Rights Reserved.
  32. 32. GameEngine Unity3D or HTML5 (or Flash(R) Air(R)) (and Unity3D EditorScript) Unity 上でも 2D を実現。同時に HTML5 も。 エディタスクリプトが扱えれば、開発がよりスムーズに。 Copyright © GREE, Inc. All Rights Reserved.
  33. 33. Build for multi device. iPhone & Android 各種端末に対応 Copyright © GREE, Inc. All Rights Reserved.
  34. 34. Complete! ほぼすべて自動化可能かつ、途中からマニュアルで修正・追加可能な状態 Copyright © GREE, Inc. All Rights Reserved.
  35. 35. Shop UI sample Copyright © GREE, Inc. All Rights Reserved.
  36. 36. 生成可能な UI1. 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 Copyright © GREE, Inc. All Rights Reserved.
  37. 37. How making other object? (such as Character, Building) UI と同じく、すべて LWF( 仮 ) で実現 2D 向きでない 3D ゲームエンジンで、従来と同じWeb アセットで、 2D ネイティブゲーム Map を描画 Copyright © GREE, Inc. All Rights Reserved.
  38. 38. GREE-TA の必要スキル・ Flash(R) オーサリングの基礎・ ActionScript 1.1 の基礎 ( フィーチャーフォン )・ PhotoShop の基礎・減色・ TexturePacking の基礎・自動化の基礎( jsfl, jsx )・ Unity3D の基礎・ HTML5 の基礎・スマ —トフォンゲーム・アプリ開発の基礎・今回お話した TA 業務への興味・適正 Copyright © GREE, Inc. All Rights Reserved.
  39. 39. TA に必要なマインド・多様性を吸収してパワーにできる人(様々なスペシャリストと関われます。コンソールと Web 、クライアントサイドとサーバサイド、大規模開発と小規模開発、ベンチャーと大手などなど、多様な職種出身者と常識が溢れています。国籍も様々です。それを整理・吸収したい方)・言語の壁を吸収できる人(英語のドキュメントを読んで最先端の技術を吸収したい方、英語に耳が慣れる環境に身を置きたい方。)・成功するまで諦めない人!(困難な局面に直面しても、技術と発想とアートへの理解により、それを乗り越えられる人。) Copyright © GREE, Inc. All Rights Reserved.
  40. 40. 根本にあるもの・ユーザー視点  なによりユーザーに喜んで頂けるプロダクト開発を目指 しています。 特にテクニカルアーティストの 場合は、エンジニアや アーティストも、自分のユーザー / お客様となります。 さらに社内だけでなく、外部の協力会社もユーザーになり  えます。そのため、社外でも問題なく扱える技術開発が できるかどうかも重要です。 Copyright © GREE, Inc. All Rights Reserved.
  41. 41. テクニカルアーティストが活躍できる規模感・より多くの人に使ってもらえる。 ➡国内数千万、世界数億ユーザー、それにともなう多くのゲーム・より頻繁に使ってもらえる ➡ハイスピードなリリース、イベント・使われ続ける ➡売り切りモデルではない。人気が続く限り永久・膨大かつ正確なデータで反響を得られる  ➡正しい評価、正しいイテレーション Copyright © GREE, Inc. All Rights Reserved.
  42. 42. 他にないやりがいについて世界中に、これだけの量とスピードでゲームを出している環境に関われる場所はなかなかないと思います。スマフォを通じて爆発的にゲームが広がっている、希有で重要な勝負の時期だからかもしれません。そのため今を逃したら、将来この規模のチャレンジは、やってこないかもしれないかもしれません。そしてそのチャレンジ成否が少なからず、 TA の手腕にかかっていると言えます。 Copyright © GREE, Inc. All Rights Reserved.
  43. 43. テクニカルアーティストとは? Copyright © GREE, Inc. All Rights Reserved.
  44. 44. 銀の弾丸に挑戦し続ける人! Copyright © GREE, Inc. All Rights Reserved.
  45. 45. Go global!!ご興味を持たれた方、一緒に世界に向けたスマートフォンゲームをつくりましょう! Copyright © GREE, Inc. All Rights Reserved.
  46. 46. Copyright © GREE, Inc. All Rights Reserved.

×