SlideShare a Scribd company logo
グリーのクライアント技術戦略
    グリー株式会社
    開発本部 CTO室
     芳賀   洋行
1
/124
        自己紹介:芳賀洋行

        どうぶつフレンズ                                     CTO室
        エンジニアリーダー             2012              イマ
                                                ココ
         どうぶつフレンズ
        プロダクトマネジャー              2012


                グリー
                                     2012
 オートデスク                2011                   ロンドンスタジオ
                                             エンジニアマネジャー
                2006

                              2010
         2003
                 エイリアス                      グロービス経営大学院
 2003
           会津大学コンピュータサイエンス



                                              #greetech01
2
/124
       アジェンダ

 1.    今日までのクライアント技術のまとめ
 2.    グリーのクライアント技術戦略
 3.    クライアント技術におけるLWFの役割
 4.    グリーのオープンソース活動




          質問、コメントなどございましたら
        #greetech01までつぶやきお願いします

                         #greetech01
3
/124
        ゲームシステムにおける本日の話の位置づけ


        インターネット
                                計算        データ       分析


                                 コード

 U                               コード            E
                                                    企画
                  マーケット   アプリ
                                     画像                  D
                  プレース
       アプリ
                                SWF             A




                                          #greetech01
4
/124
       本セッションでお伝えすること

 • 将来、手詰まりにならないために、
   幅広い範囲をカバーできる技術選択も1手!

 • LWFは幅広い技術範囲をカバーできます!

 • グリーはエンジニアの
   オープンソース貢献を応援しています!




                        #greetech01
5
/124
       アジェンダ

 1.    今日までのクライアント技術のまとめ
 2.    グリーのクライアント技術戦略
 3.    クライアント技術におけるLWFの役割
 4.    グリーのオープンソース活動




                       #greetech01
①これまでのクライアント
   経緯とまとめ
7
/124
       ここまでクライアント技術要諦

 • 1つの分け方として
   「ブラウザを中核とするクライアント技術」と
   「ブラウザを中核としないクライアント技術」

 • ブラウザ中核技術の肝は「標準化」/
   非ブラウザ技術の肝は「差別化」

 • 「標準化」と「差別化」の両方を満たす
   「HTML5ブラウザ」は未だ安定していない技術


                        #greetech01
8
/124
       本日の枠組み




 制作工程     制作物     ロジック    出力前処理      出力



                    ゲーム
                          実行結果を
  制作物を   制作物種類を   ロジックを            ハードウェア
                          出力する前の
   作る    増やす/絞る    記述する             で描画する
                            処理
                  場所と方法




                            #greetech01
順を追っていきましょう
5年前
2007   2008   2009   2010   2011   2012    2013


                                          イマココ


              2007年
12
/124
       2007年釣りスタサービス開始!




                          #greetech01
13       ブラウザ中心
/124
         クライアント関連技術のまとめ

  制作工程       制作物   ロジック   出力前処理    入出力


                          ブラウザ     CPU
                          FLASH
       アート                Player




                   サーバー

                   PHP



                           #greetech01
14     ブラウザ中心
/124
       クライアント関連技術のまとめ

  制作工程     制作物      ロジック     出力前処理      出力
 2D静止画
マークアップ制作
            画像     サーバーサイド   サーバーサイド   ネットワーク

           テキスト
 FLASH制作            ブラウザ      ブラウザ
                                        CPU
           配置情報
                    ブラウザ      ブラウザ
2D動画制作
           2Dアニメ    プラグイン     プラグイン
            データ                         GPU
3D動画制作             ミドルウェア    ミドルウェア
            動画

3Dデータ制作    3Dデータ    ネイティブ     ネイティブ    サウンド



                               #greetech01
15     ブラウザ中心クライアント技術のまとめ
/124
       標準化による短い開発期間の実現

  制作工程     制作物      ロジック       出力前処理      出力
 2D静止画
マークアップ制作
            画像     サーバーサイド     サーバーサイド   ネットワーク

           テキスト
 FLASH制作            ブラウザ         ブラウザ
                                          CPU
           配置情報
                    ブラウザ        ブラウザ
2D動画制作
           2Dアニメ    プラグイン       プラグイン
            データ                           GPU
3D動画制作             ミドルウェア       ミドルウェア
            動画                 クライアント側は
      サーバーサイドの
3Dデータ制作ロジック実装、
          3Dデータ ネイティブ
                             ブラウザ/Flash Playerに
                                ネイティブ    サウンド
 コンテンツ開発に全力を注ぐ!                    任せる


                                  #greetech01
4年前
17
/116




2007   2008   2009   2010   2011   2012    2013


                                          イマココ


              2008年
18
/124
       2008年

 • はじめて国内のコンソールゲーム市場が
   縮小に転じる




2008年国内ゲーム市場規模は約5826億1000万円(エンターブレイン調べ)
                                               #greetech01
http://www.famitsu.com/game/news/1221045_1124.html
19       非ブラウザネイティブのクライアント技術
/124
         差別化(特殊化)による長い開発期間

  制作工程        制作物    ロジック    出力前処理   入出力

               独自                    CPU
                             独自描画
              データ            エンジン
       アート


                             独自ゲーム
   独自         独自                     GPU
                             エンジン
   ツール       コンバータ


ネイティブ        ネイティブ   ネイティブ   ネイティブ
       C++    C++     C++     C++


                              #greetech01
20     非ブラウザコンソールの
/124
       クライアント関連技術のまとめ

  制作工程     制作物      ロジック     出力前処理      出力
 2D静止画
マークアップ制作
            画像     サーバーサイド   サーバーサイド   ネットワーク

           テキスト
 FLASH制作            ブラウザ      ブラウザ
                                        CPU
           配置情報
                    ブラウザ      ブラウザ
2D動画制作
           2Dアニメ    プラグイン     プラグイン
            データ                         GPU
3D動画制作             ミドルウェア    ミドルウェア
            動画

3Dデータ制作    3Dデータ    ネイティブ     ネイティブ    サウンド



                               #greetech01
21     非ブラウザコンソールの
/124
       クライアント関連技術のまとめ

  制作工程     制作物     ロジック     出力前処理     出力
   2D静止画
 ハードウェアの限界性能を引き出せるが
マークアップ制作
          画像  サーバーサイド サーバーサイド        ネットワーク
  広い技術領域、高い難易度、プラット
         テキスト
  フォームごとに異なるデバイス特性に ブラウザ
FLASH制作         ブラウザ
 あわせたエンジニアリングが必要になる                   CPU
         配置情報
                   ブラウザ     ブラウザ
2D動画制作
           2Dアニメ   プラグイン    プラグイン
            データ                       GPU
3D動画制作             ミドルウェア   ミドルウェア
            動画

3Dデータ制作    3Dデータ   ネイティブ    ネイティブ    サウンド



                              #greetech01
22
/116




2007    2008   2009   2010   2011   2012    2013


                                           イマココ


       2008年 7月 10日
23
/124
        2008年7月10日

  • App Store開始




http://en.wikipedia.org/wiki/App_Store_(iOS)
                                               #greetech01
24       ブラウザ中心
/124
         クライアント関連技術からの視点

  制作工程          制作物       ロジック   出力前処理    入出力
             FLASH Playerの対応が
             参入の時期の決定要因
                                 ブラウザ     CPU
                                 FLASH
       アート                       Player




                        サーバー

                         PHP



                                  #greetech01
25       非ブラウザコンソールの
/124
         クライアント関連技術の視点

  制作工程        制作物    ロジック    出力前処理 入出力
                        巨大な開発コストを賄えるか
                          どうかが参入の決定要因
               独自                  CPU
                             独自描画
              データ            エンジン
       アート


                             独自ゲーム
   独自         独自                     GPU
                             エンジン
   ツール       コンバータ


ネイティブ        ネイティブ   ネイティブ   ネイティブ
       C++    C++     C++     C++


                              #greetech01
約2年後
27
/116




2007   2008   2009   2010   2011   2012    2013


                                          イマココ


         2010年 4月
アップル声明文
29
/124
         Apple FLASHプレイヤーに

  • Apple FLASHプレイヤーに対応しないことを正式
    に表明




http://www.apple.com/hotnews/thoughts-on-flash
                                                 #greetech01
( ;゚Д ゚)
31       ブラウザ中心
/124
         クライアント関連技術からの視点

  制作工程          制作物       ロジック   出力前処理    入出力
             FLASH Playerの対応が
             参入の時期の決定要因
                                 ブラウザ     CPU
                                 FLASH
       アート                       Player




                        サーバー

                         PHP



                                  #greetech01
32       (ゲームに関連する)
/124
         クライアント関連技術のまとめ

  制作工程       制作物   ロジック   出力前処理    入出力


                          ブラウザ     CPU
                          FLASH
       アート                Player




                   サーバー

                   PHP



                           #greetech01
33     ブラウザ中心
/124
       クライアント関連技術のまとめ

  制作工程     制作物      ロジック       出力前処理      出力
 2D静止画
マークアップ制作
            画像     サーバーサイド     サーバーサイド   ネットワーク

           テキスト
 FLASH制作            ブラウザ         ブラウザ
                                          CPU
           配置情報
                    ブラウザ        ブラウザ
2D動画制作
           2Dアニメ    プラグイン       プラグイン
            データ                           GPU
3D動画制作             ミドルウェア       ミドルウェア
            動画                 クライアント側は
      サーバーサイドの
3Dデータ制作ロジック実装、
          3Dデータ ネイティブ
                             ブラウザ/Flash Playerに
                                ネイティブ    サウンド
 コンテンツ開発に全力を注ぐ!                    任せる


                                  #greetech01
34     ブラウザ中心
/124
       クライアント関連技術の視点

  制作工程     制作物      ロジック     出力前処理      出力
 2D静止画
マークアップ制作
            画像     サーバーサイド   サーバーサイド   ネットワーク

           テキスト
 FLASH制作            ブラウザ     ブラウザ
                                        CPU
           配置情報
                    ブラウザ      ブラウザ
2D動画制作
           2Dアニメ    プラグイン     プラグイン
            データ                          GPU
3D動画制作             ミドルウェア    ミドルウェア Playerの
                             FLASH
            動画
  2Dアニメーションデータ(swf)           代替となる高い
 をブラウザで表示するための変換
3Dデータ制作  3Dデータ ネイティブ         パフォーマンスの
                              ネイティブ     サウンド
        方法の模索                プレイヤーの模索


                                #greetech01
2か月後
36
/116




2007    2008   2009   2010   2011   2012    2013


                                           イマココ


       2010年 6月 24日
37
/124
       iPhone4 リリース




                      #greetech01
6か月後
39
/116




2007    2008   2009   2010   2011   2012    2013


                                           イマココ


       2010年 12月 9日
40
/124
         2010年 12月 9日

  • インフィニティブレードがリリースされる




Infinity Blade © 2011-2012 Chair Entertainment Group, LLC
http://en.wikipedia.org/wiki/Infinity_Blade                 #greetech01
41       非ブラウザ・ネイティブ系
/124
         クライアント関連技術の視点

  制作工程        制作物    ロジック    出力前処理   入出力

               独自                    CPU
                             独自描画
              データ            エンジン
       アート


                             独自ゲーム
   独自         独自                     GPU
                             エンジン
   ツール       コンバータ


ネイティブ        ネイティブ   ネイティブ   ネイティブ
       C++    C++     C++     C++


                              #greetech01
42       非ブラウザ・ミドルウェア
/124
         クライアント関連技術のまとめ

  制作工程       制作物   ロジック    出力前処理    入出力

             汎用                      CPU
              3D
             データ     ミドルウェア
       アート
                   スクリプト
                     言語
                                     GPU




                              #greetech01
43     非ブラウザ・ミドルウェア
/124
       クライアント関連技術のまとめ
                クライアント側の
  制作工程     制作物 出力まわりの処理は
                  ロジック 出力前処理            出力
              ミドルウェアにまかせる
 2D静止画
マークアップ制作
            画像     サーバーサイド   サーバーサイド   ネットワーク

           テキスト
       クライアントサイドのブラウザ
 FLASH制作                      ブラウザ
       ロジック実装、                          CPU
         配置情報
               ブラウザ
  コンテンツ開発に全力を注ぐ!              ブラウザ
2D動画制作
           2Dアニメ    プラグイン     プラグイン
            データ                         GPU
3D動画制作             ミドルウェア    ミドルウェア
            動画

3Dデータ制作    3Dデータ    ネイティブ     ネイティブ    サウンド



                               #greetech01
その3か月後
45
/116




2007   2008   2009   2010   2011   2012    2013


                                          イマココ


       2011年 3月1日
46
/124




 • グリー、マルチOS開発を支援する3Dゲーム開発
   ツール「Unity」を提供するUnity
   Technologiesと技術提携




                   #greetech01
47     非ブラウザ・ミドルウェア
/124
       クライアント関連技術のまとめ

  制作工程     制作物       クライアント側の
                      ロジック   出力前処理      出力
                    出力まわりの処理は
 2D静止画
            画像     ミドルウェアにまかせる
                     サーバーサイド サーバーサイド   ネットワーク
マークアップ制作

           テキスト
       クライアントサイドのブラウザ
 FLASH制作                       ブラウザ
       ロジック実装、                          CPU
         配置情報
               ブラウザ
  コンテンツ開発に全力を注ぐ!              ブラウザ
2D動画制作
           2Dアニメ      プラグイン   プラグイン
            データ                         GPU
3D動画制作               ミドルウェア   ミドルウェア
            動画

3Dデータ制作    3Dデータ      ネイティブ    ネイティブ   サウンド



                                #greetech01
48     非ブラウザ・ミドルウェア
/124
       どうぶつフレンズまとめ

  制作工程     制作物      ロジック     出力前処理      出力
 2D静止画
マークアップ制作
            画像     サーバーサイド   サーバーサイド   ネットワーク

           テキスト
 FLASH制作            ブラウザ      ブラウザ
                                        CPU
           配置情報
                    ブラウザ      ブラウザ
2D動画制作
           2Dアニメ    プラグイン     プラグイン
            データ                         GPU
3D動画制作             ミドルウェア    ミドルウェア
            動画

3Dデータ制作    3Dデータ    ネイティブ     ネイティブ    サウンド



                               #greetech01
その7か月後
50
/116




2007   2008   2009   2010   2011   2012 2013


                                     イマココ


       2011年10月12日
世界同時
52
/124
         iOS5.0配布開始

  • Safari

       “Super fast HTML5 draw support.”




http://en.wikipedia.org/wiki/IOS_version_history
                                                   #greetech01
ヾ(*゚∀゚*)ノ♪
さらに2か月後
55
/116




2007    2008   2009   2010   2011   2012    2013


                                           イマココ


       2011年 12月16日
56
/124   Android 4.0

 • CanvasのGPU対応がもりこまれる




                     #greetech01
ヾ(*゚∀゚*)ノ♪
58     ブラウザ中心
/124
       クライアント関連技術の視点

  制作工程     制作物      ロジック     出力前処理      出力
 2D静止画
マークアップ制作
            画像     サーバーサイド   サーバーサイド   ネットワーク

           テキスト
 FLASH制作            ブラウザ     ブラウザ
                                        CPU
           配置情報
                    ブラウザ      ブラウザ
2D動画制作
           2Dアニメ    プラグイン     プラグイン
            データ                         GPU
3D動画制作             ミドルウェア     ミドルウェア
            動画
  2Dアニメーションデータ(swf)             HTML5で
     をブラウザで再生できる             高いパフォーマンス
3Dデータ制作  3Dデータ ネイティブ          ネイティブ   サウンド
    データへの変換方法の模索              が期待できる!


                                #greetech01
1年前
60
/116




2007   2008   2009   2010   2011   2012    2013


                                          イマココ


2011年のスマートフォン市場
61
/124




       #greetech01
62
/124
         日経BPコンサルティング

  • 2011年スマートフォンの国内普及率は9.5%、
    20歳代が市場を牽引




http://consult.nikkeibp.co.jp/consult/news/2011/0801mobile/
                                                              #greetech01
( ´_ゝ`)フーン
4か月前
65
/116




2007   2008   2009   2010   2011   2012    2013


                                          イマココ


       2012年 7月25日
66
/124




       #greetech01
67
/124
         日経BPコンサルティング

  • スマートフォンの国内普及率は18.0%、1年でほ
    ぼ倍増




http://consult.nikkeibp.co.jp/consult/news/2011/0801mobile/
                                                              #greetech01
( ;゚Д ゚)
69       非ブラウザコンソールの
/124
         クライアント関連技術の視点

  制作工程        制作物    ロジック    出力前処理 入出力
                        巨大な開発コストを賄えるか
                          どうかが参入の決定要因
               独自                  CPU
                             独自描画
              データ            エンジン
       アート


                             独自ゲーム
   独自         独自                     GPU
                             エンジン
   ツール       コンバータ


ネイティブ        ネイティブ   ネイティブ   ネイティブ
       C++    C++     C++     C++


                              #greetech01
ヾ(*゚∀゚*)ノ♪
3か月前
72
/116




2007   2008   2009   2010   2011   2012    2013


                                          イマココ


       2012年 8月 15日
世界同時
74
/124    2012/8/15

  • Adobe Flash Player exits Android
    Google Play store
       • Android ブラウザのFlashプレイヤーの配布終了




http://www.bbc.co.uk/news/technology-19267140
                                                #greetech01
( ;゚Д ゚)
76     ブラウザ中心
/124
       クライアント関連技術の視点

  制作工程     制作物   ロジック        出力前処理      出力
             乗り換え必須
 2D静止画
マークアップ制作
            画像     サーバーサイド   サーバーサイド   ネットワーク

           テキスト
 FLASH制作            ブラウザ     ブラウザ
                                        CPU
           配置情報
                    ブラウザ      ブラウザ
2D動画制作
           2Dアニメ    プラグイン     プラグイン
            データ                         GPU
3D動画制作             ミドルウェア     ミドルウェア
            動画

3Dデータ制作    3Dデータ    ネイティブ     ネイティブ    サウンド



                                #greetech01
2か月半前
78
/116




2007   2008   2009   2010   2011   2012 2013


                                     イマココ


       2012年 8月 29日
東京 六本木
80       Flashテクノロジーの今後とあなたの人生との
/124
         かかわりについて
  • 第3回テックヒルズ
    「2012..Flashの終焉!? ~Flashの今後を見抜く~」実施レポート
  • 「Flashテクノロジーの今後とあなたの人生とのかかわりについて」




http://gihyo.jp/news/report/2012/09/0301
http://www.slideshare.net/otachan/flash-14113527   #greetech01
( ;゚Д ゚)
2か月前
83
/116




2007   2008   2009   2010   2011   2012 2013


                                     イマココ


       2012年9月12日
サンフランシスコ
85
/124




       #greetech01
( ;゚Д ゚)
87     ブラウザ中心
       クライアント関連技術の視点

                                       !
/124




  制作工程     制作物      ロジック     出力前処理      出力
 2D静止画
マークアップ制作
            画像     サーバーサイド   サーバーサイド   ネットワーク

           テキスト
 FLASH制作            ブラウザ     ブラウザ
                                        CPU
           配置情報
                    ブラウザ      ブラウザ
2D動画制作
           2Dアニメ    プラグイン     プラグイン
            データ                         GPU
3D動画制作             ミドルウェア     ミドルウェア
            動画

3Dデータ制作    3Dデータ    ネイティブ     ネイティブ    サウンド



                                #greetech01
(((( ;゚Д ゚)))
89
/116




2007   2008   2009   2010   2011   2012 2013


                                     イマココ


       先月までのまとめ
90
/124
       先月までのクライアント技術のまとめ

 • ブラウザ系クライアント技術の視点
       • GPUに対応したHTML5ブラウザを搭載した
         デバイスがどのくらいの速度で普及するか
         デバイス間の互換性はどのくらいか
 • 非ブラウザ系クライアント技術の視点
       • ミドルウェアを導入すべきなのかどうか
       • 参入してよい市場なのかどうか




                            #greetech01
91     (ゲームに関連する)
/124
       クライアント関連技術のまとめ

  制作工程     制作物      ロジック     出力前処理      出力
 2D静止画
マークアップ制作
            画像     サーバーサイド   サーバーサイド   ネットワーク

           テキスト
 FLASH制作            ブラウザ      ブラウザ
                                        CPU
           配置情報
                    ブラウザ     ブラウザ上の
2D動画制作
           2Dアニメ    プラグイン     プレイヤー
            データ                         GPU
3D動画制作             ミドルウェア    ミドルウェア
            動画

3Dデータ制作    3Dデータ    ネイティブ     ネイティブ    サウンド



                               #greetech01
1か月前
93
/116




2007   2008   2009   2010   2011   2012 2013


                                     イマココ


       2012年10月18日
東京
グリー坂本一樹
LWF公開
97     (ゲームに関連する)
/124
       クライアント関連技術のまとめ

  制作工程      制作物      ロジック        出力前処理    出力
                              1,HTML5は本当に
 2D静止画      2,HTML5に             大丈夫か?
             画像     サーバーサイド      サーバーサイド ネットワーク
マークアップ制作   どうやって出力
            するのか?
            テキスト
 FLASH制作             ブラウザ        ブラウザ
                                          CPU
           配置情報
                     ブラウザ       ブラウザ上の
2D動画制作
           2Dアニメ     プラグイン       プレイヤー
            データ                           GPU
3D動画制作               ミドルウェア     ミドルウェア
            動画

3Dデータ制作       3,ミドルウェア
           3Dデータ    ネイティブ        ネイティブ   サウンド
            に移行できるのか?


                                  #greetech01
98     (ゲームに関連する)
/124
       クライアント関連技術のまとめ
     LWFを利用するとFLASHコンテンツを
  制作工程    制作物    ロジック  出力前処理            出力
    ブラウザ/非ブラウザの両方に出力できる!
 2D静止画
マークアップ制作
            画像     サーバーサイド   サーバーサイド   ネットワーク

           テキスト
 FLASH制作            ブラウザ      ブラウザ
                                        CPU
           配置情報
                    ブラウザ     ブラウザ上の
2D動画制作
           2Dアニメ    プラグイン     プレイヤー
            データ                         GPU
3D動画制作             ミドルウェア    ミドルウェア
            動画

3Dデータ制作    3Dデータ    ネイティブ     ネイティブ    サウンド



                               #greetech01
99
/124
       クライアント技術要諦

 • 1つの分け方として
   「ブラウザを中核とするクライアント技術」と
   「ブラウザを中核としないクライアント技術」

 • ブラウザ中核技術の肝は「標準化」/
   非ブラウザ技術の肝は「差別化」

 • 「標準化」と「差別化」の両方を満たす
   「HTML5ブラウザ」は未だ安定していない技術


                    #greetech01
100
/124
       アジェンダ

 1.    今日までのクライアント技術のまとめ
 2.    グリーのクライアント技術戦略
 3.    クライアント技術におけるLWFの役割
 4.    グリーのオープンソース活動




                       #greetech01
②グリーのクライアント
   技術戦略
102
/124
       グリーのクライアント技術戦略

  制作工程     制作物      ロジック     出力前処理      出力
 2D静止画                                 ネットワーク
マークアップ制作
            画像     サーバーサイド   サーバーサイド
                                         n
           テキスト
 FLASH制作            ブラウザ      ブラウザ
                                        CPU
            どこの技術領域をやるの?
           配置情報
                  ブラウザ  ブラウザ上の
2D動画制作
           2Dアニメ プラグイン   プレイヤー
            データ                         GPU
3D動画制作           ミドルウェア ミドルウェア
            動画

3Dデータ制作    3Dデータ    ネイティブ     ネイティブ    サウンド



                               #greetech01
103    グリーのクライアント技術戦略=
/124
       フルラインナップ

  制作工程     制作物       ロジック     出力前処理      出力
 2D静止画                                  ネットワーク
マークアップ制作
            画像      サーバーサイド   サーバーサイド
                                          n


                  全部!
           テキスト
 FLASH制作            ブラウザ       ブラウザ
                                         CPU
           配置情報
                     ブラウザ     ブラウザ上の
2D動画制作
           2Dアニメ     プラグイン     プレイヤー
            データ                          GPU
3D動画制作               ミドルウェア   ミドルウェア
            動画

3Dデータ制作    3Dデータ     ネイティブ     ネイティブ    サウンド



                                #greetech01
104
/124
       アジェンダ

 1.    今日までのクライアント技術のまとめ
 2.    グリーのクライアント技術戦略
 3.    LWFを選ぶ理由
 4.    グリーのオープンソース活動




                      #greetech01
③LWFを選ぶ理由
106    (ゲームに関連する)
/124
       クライアント関連技術のまとめ
     LWFを利用するとFLASHコンテンツを
  制作工程    制作物    ロジック  出力前処理            出力
    ブラウザ/非ブラウザの両方に出力できる!
 2D静止画
マークアップ制作
            画像     サーバーサイド   サーバーサイド   ネットワーク

           テキスト
 FLASH制作            ブラウザ      ブラウザ
                                        CPU
           配置情報
                    ブラウザ     ブラウザ上の
2D動画制作
           2Dアニメ    プラグイン     プレイヤー
            データ                         GPU
3D動画制作             ミドルウェア    ミドルウェア
            動画

3Dデータ制作    3Dデータ    ネイティブ     ネイティブ    サウンド



                               #greetech01
107
/124
       地雷踏み済みです!

 • たくさん踏みましたw      ほんとたくさんw




                       #greetech01
108
/124
       失敗のサイクル

                 安定しない
                 技術基盤

  焦りながらの
                          予期しない
 実装、技術基盤へ
                          問題の発生
  の限定的な投資

                 スケジュール
                   の遅延


                          #greetech01
109
/124
       アジェンダ

 1.    今日までのクライアント技術のまとめ
 2.    グリーのクライアント技術戦略
 3.    LWFを選ぶ理由
 4.    グリーのオープンソース活動




                      #greetech01
④グリーのオープンソース活動
( ´_ゝ`)オープン?
112
/124
       グリーのオープンソースポリシー

 • グリーはグリーエンジニアの
   オープンソース活動を通じた
   コミュニティへの貢献を応援しています!




                     #greetech01
113    (ゲームに関連する)
/124
       クライアント関連技術のまとめ

  制作工程     制作物
             HTML5にロジック HTML5は本当に
                           出力前処理      出力
 2D静止画     どうやって出力        大丈夫か?
           画像     サーバーサイド  サーバーサイド   ネットワーク
マークアップ制作    するのか?
           テキスト
 FLASH制作            ブラウザ     ブラウザ
                                      CPU
           配置情報
                   ブラウザ     ブラウザ上の
2D動画制作
           2Dアニメ   プラグイン     プレイヤー
            データ                       GPU
3D動画制作             ミドルウェア   ミドルウェア
            動画

3Dデータ制作        ミドルウェア
           3Dデータ   ネイティブ    ネイティブ    サウンド
           に移行できるのか?


                              #greetech01
114    制作途中はFLASH制作/出力を
/124
       なんども繰り返す

  制作工程     制作物      ロジック     出力前処理      出力
 2D静止画
マークアップ制作
            画像     サーバーサイド   サーバーサイド   ネットワーク

           テキスト
 FLASH制作            ブラウザ      ブラウザ
                                        CPU
           配置情報
                    ブラウザ     ブラウザ上の
2D動画制作
           2Dアニメ    プラグイン     プレイヤー
            データ                         GPU
3D動画制作             ミドルウェア    ミドルウェア
            動画

3Dデータ制作    3Dデータ    ネイティブ     ネイティブ    サウンド



                               #greetech01
( ;゚Д ゚)メンドイ
116
/124   LWFS

 • グリー内製チームで利用している
   LWFプレビューシステム
 • エンジニアリングなしに、アーティストが
   LWFの調整を行える環境が整う




                  #greetech01
公開!
もちろん
オープンソース
120
/124
       自己紹介
 • 中丸 幸治
       • グリー株式会社 開発本部 インフラストラクチャ統括部
         アプリケーション基盤開発部 クライアント基盤チーム


 • 2012/7からグリー

 • 前職まではいろいろ
       • モバイル系3DエンジンとかUIとか立体視とか
       • 大昔、ファ○タジーゾー○(ファミコン版)のドット打ちして、
         コインの動きを6502で組みました
       • CGの研究とか

                            #greetech01
121
/124
        さらに拡充される LWFテクノロジー




       http://github.com/gree




                        #greetech01
122
/124
       グリーのオープンソースポリシー

 • グリーはグリーエンジニアの
   オープンソース活動を通じた
   コミュニティへの貢献を応援しています!




                     #greetech01
まとめ
124
/124
       本セッションでお伝えしたこと

 • 将来、手詰まりにならないために、
   幅広い範囲をカバーできる技術選択も1手!

 • LWFは幅広い技術範囲をカバーできます!

 • グリーはエンジニアの
   オープンソース貢献を応援しています!




                        #greetech01
一緒に働く仲間を募集しております!
 gree.co.jp/recruit

More Related Content

What's hot

GTMF2012 SpriteStudio と "Unity" と "CoronaSDK" と "ngCore" ! ~組み合わせて改善する 2D ワーク...
GTMF2012 SpriteStudio と "Unity" と "CoronaSDK" と "ngCore" ! ~組み合わせて改善する 2D ワーク...GTMF2012 SpriteStudio と "Unity" と "CoronaSDK" と "ngCore" ! ~組み合わせて改善する 2D ワーク...
GTMF2012 SpriteStudio と "Unity" と "CoronaSDK" と "ngCore" ! ~組み合わせて改善する 2D ワーク...
Web Technology Corp.
 
Unityネイティブプラグインマニアクス #denatechcon
Unityネイティブプラグインマニアクス #denatechconUnityネイティブプラグインマニアクス #denatechcon
Unityネイティブプラグインマニアクス #denatechcon
DeNA
 
FINAL FANTASY Record Keeperのマスターデータを支える技術
FINAL FANTASY Record Keeperのマスターデータを支える技術FINAL FANTASY Record Keeperのマスターデータを支える技術
FINAL FANTASY Record Keeperのマスターデータを支える技術
dena_study
 
DeNA TechCon2019 How to implement live streaming client using Unity
DeNA TechCon2019 How to implement live streaming client using UnityDeNA TechCon2019 How to implement live streaming client using Unity
DeNA TechCon2019 How to implement live streaming client using Unity
Takeyuki Ogura
 
DeNA流cocos2d xとの付き合い方
DeNA流cocos2d xとの付き合い方DeNA流cocos2d xとの付き合い方
DeNA流cocos2d xとの付き合い方
dena_study
 
Html5conference2012 yota hisamichi_世界に向けたスマートフォンゲームを支える、 greeのテクニカルアーティストについて。
Html5conference2012 yota hisamichi_世界に向けたスマートフォンゲームを支える、 greeのテクニカルアーティストについて。Html5conference2012 yota hisamichi_世界に向けたスマートフォンゲームを支える、 greeのテクニカルアーティストについて。
Html5conference2012 yota hisamichi_世界に向けたスマートフォンゲームを支える、 greeのテクニカルアーティストについて。
ひさし App
 
FINAL FANTASY
 Record Keeper アニメーション制作の濃ゆい話
FINAL FANTASY
 Record Keeper アニメーション制作の濃ゆい話FINAL FANTASY
 Record Keeper アニメーション制作の濃ゆい話
FINAL FANTASY
 Record Keeper アニメーション制作の濃ゆい話
Toshiharu Shirai
 
Android UIデザイン入門
Android UIデザイン入門Android UIデザイン入門
Android UIデザイン入門
OESF Education
 
FFRK cocos2d xレイヤーの最適化
FFRK cocos2d xレイヤーの最適化FFRK cocos2d xレイヤーの最適化
FFRK cocos2d xレイヤーの最適化
dena_study
 
その後のDeNAのネイティブアプリ開発 #denatechcon
その後のDeNAのネイティブアプリ開発 #denatechconその後のDeNAのネイティブアプリ開発 #denatechcon
その後のDeNAのネイティブアプリ開発 #denatechcon
DeNA
 
そう、UE4ならね。あなたのモバイルゲームをより快適にする沢山の冴えたやり方について Part 1 <Shader Compile, PSO Cache編>
  そう、UE4ならね。あなたのモバイルゲームをより快適にする沢山の冴えたやり方について Part 1 <Shader Compile, PSO Cache編>  そう、UE4ならね。あなたのモバイルゲームをより快適にする沢山の冴えたやり方について Part 1 <Shader Compile, PSO Cache編>
そう、UE4ならね。あなたのモバイルゲームをより快適にする沢山の冴えたやり方について Part 1 <Shader Compile, PSO Cache編>
エピック・ゲームズ・ジャパン Epic Games Japan
 
エフェクト、アニメーション、演出のデータ作るの大変じゃないですか? DeNAではこうしてます。
エフェクト、アニメーション、演出のデータ作るの大変じゃないですか? DeNAではこうしてます。エフェクト、アニメーション、演出のデータ作るの大変じゃないですか? DeNAではこうしてます。
エフェクト、アニメーション、演出のデータ作るの大変じゃないですか? DeNAではこうしてます。
DeNA_Creators
 
CEDEC2017 VR180 3D live streaming camera at "SHOWROOM" case
CEDEC2017 VR180 3D live streaming camera at "SHOWROOM" caseCEDEC2017 VR180 3D live streaming camera at "SHOWROOM" case
CEDEC2017 VR180 3D live streaming camera at "SHOWROOM" case
Takeyuki Ogura
 
Game Development and Automation @ Agile Sapporo 2018 #1
Game Development and Automation @ Agile Sapporo 2018 #1Game Development and Automation @ Agile Sapporo 2018 #1
Game Development and Automation @ Agile Sapporo 2018 #1
Michael Tedder
 
UE4モバイルブートキャンプ
UE4モバイルブートキャンプUE4モバイルブートキャンプ
CEDEC2019 大規模モバイルゲーム運用におけるマスタデータ管理事例
CEDEC2019 大規模モバイルゲーム運用におけるマスタデータ管理事例CEDEC2019 大規模モバイルゲーム運用におけるマスタデータ管理事例
CEDEC2019 大規模モバイルゲーム運用におけるマスタデータ管理事例
sairoutine
 
【Unite Tokyo 2018】バーチャルYouTuber電脳少女シロがご紹介する「2018年の注目アセット100連発」
【Unite Tokyo  2018】バーチャルYouTuber電脳少女シロがご紹介する「2018年の注目アセット100連発」【Unite Tokyo  2018】バーチャルYouTuber電脳少女シロがご紹介する「2018年の注目アセット100連発」
【Unite Tokyo 2018】バーチャルYouTuber電脳少女シロがご紹介する「2018年の注目アセット100連発」
Unity Technologies Japan K.K.
 
OpenNI 3Dセンサープログラミング
OpenNI 3DセンサープログラミングOpenNI 3Dセンサープログラミング
OpenNI 3Dセンサープログラミング
Kaoru NAKAMURA
 
先進的なルックデベロップメント
先進的なルックデベロップメント先進的なルックデベロップメント
先進的なルックデベロップメント
エピック・ゲームズ・ジャパン Epic Games Japan
 
ABC2012Spring 20120324
ABC2012Spring 20120324ABC2012Spring 20120324
ABC2012Spring 20120324
Tak Inamori
 

What's hot (20)

GTMF2012 SpriteStudio と "Unity" と "CoronaSDK" と "ngCore" ! ~組み合わせて改善する 2D ワーク...
GTMF2012 SpriteStudio と "Unity" と "CoronaSDK" と "ngCore" ! ~組み合わせて改善する 2D ワーク...GTMF2012 SpriteStudio と "Unity" と "CoronaSDK" と "ngCore" ! ~組み合わせて改善する 2D ワーク...
GTMF2012 SpriteStudio と "Unity" と "CoronaSDK" と "ngCore" ! ~組み合わせて改善する 2D ワーク...
 
Unityネイティブプラグインマニアクス #denatechcon
Unityネイティブプラグインマニアクス #denatechconUnityネイティブプラグインマニアクス #denatechcon
Unityネイティブプラグインマニアクス #denatechcon
 
FINAL FANTASY Record Keeperのマスターデータを支える技術
FINAL FANTASY Record Keeperのマスターデータを支える技術FINAL FANTASY Record Keeperのマスターデータを支える技術
FINAL FANTASY Record Keeperのマスターデータを支える技術
 
DeNA TechCon2019 How to implement live streaming client using Unity
DeNA TechCon2019 How to implement live streaming client using UnityDeNA TechCon2019 How to implement live streaming client using Unity
DeNA TechCon2019 How to implement live streaming client using Unity
 
DeNA流cocos2d xとの付き合い方
DeNA流cocos2d xとの付き合い方DeNA流cocos2d xとの付き合い方
DeNA流cocos2d xとの付き合い方
 
Html5conference2012 yota hisamichi_世界に向けたスマートフォンゲームを支える、 greeのテクニカルアーティストについて。
Html5conference2012 yota hisamichi_世界に向けたスマートフォンゲームを支える、 greeのテクニカルアーティストについて。Html5conference2012 yota hisamichi_世界に向けたスマートフォンゲームを支える、 greeのテクニカルアーティストについて。
Html5conference2012 yota hisamichi_世界に向けたスマートフォンゲームを支える、 greeのテクニカルアーティストについて。
 
FINAL FANTASY
 Record Keeper アニメーション制作の濃ゆい話
FINAL FANTASY
 Record Keeper アニメーション制作の濃ゆい話FINAL FANTASY
 Record Keeper アニメーション制作の濃ゆい話
FINAL FANTASY
 Record Keeper アニメーション制作の濃ゆい話
 
Android UIデザイン入門
Android UIデザイン入門Android UIデザイン入門
Android UIデザイン入門
 
FFRK cocos2d xレイヤーの最適化
FFRK cocos2d xレイヤーの最適化FFRK cocos2d xレイヤーの最適化
FFRK cocos2d xレイヤーの最適化
 
その後のDeNAのネイティブアプリ開発 #denatechcon
その後のDeNAのネイティブアプリ開発 #denatechconその後のDeNAのネイティブアプリ開発 #denatechcon
その後のDeNAのネイティブアプリ開発 #denatechcon
 
そう、UE4ならね。あなたのモバイルゲームをより快適にする沢山の冴えたやり方について Part 1 <Shader Compile, PSO Cache編>
  そう、UE4ならね。あなたのモバイルゲームをより快適にする沢山の冴えたやり方について Part 1 <Shader Compile, PSO Cache編>  そう、UE4ならね。あなたのモバイルゲームをより快適にする沢山の冴えたやり方について Part 1 <Shader Compile, PSO Cache編>
そう、UE4ならね。あなたのモバイルゲームをより快適にする沢山の冴えたやり方について Part 1 <Shader Compile, PSO Cache編>
 
エフェクト、アニメーション、演出のデータ作るの大変じゃないですか? DeNAではこうしてます。
エフェクト、アニメーション、演出のデータ作るの大変じゃないですか? DeNAではこうしてます。エフェクト、アニメーション、演出のデータ作るの大変じゃないですか? DeNAではこうしてます。
エフェクト、アニメーション、演出のデータ作るの大変じゃないですか? DeNAではこうしてます。
 
CEDEC2017 VR180 3D live streaming camera at "SHOWROOM" case
CEDEC2017 VR180 3D live streaming camera at "SHOWROOM" caseCEDEC2017 VR180 3D live streaming camera at "SHOWROOM" case
CEDEC2017 VR180 3D live streaming camera at "SHOWROOM" case
 
Game Development and Automation @ Agile Sapporo 2018 #1
Game Development and Automation @ Agile Sapporo 2018 #1Game Development and Automation @ Agile Sapporo 2018 #1
Game Development and Automation @ Agile Sapporo 2018 #1
 
UE4モバイルブートキャンプ
UE4モバイルブートキャンプUE4モバイルブートキャンプ
UE4モバイルブートキャンプ
 
CEDEC2019 大規模モバイルゲーム運用におけるマスタデータ管理事例
CEDEC2019 大規模モバイルゲーム運用におけるマスタデータ管理事例CEDEC2019 大規模モバイルゲーム運用におけるマスタデータ管理事例
CEDEC2019 大規模モバイルゲーム運用におけるマスタデータ管理事例
 
【Unite Tokyo 2018】バーチャルYouTuber電脳少女シロがご紹介する「2018年の注目アセット100連発」
【Unite Tokyo  2018】バーチャルYouTuber電脳少女シロがご紹介する「2018年の注目アセット100連発」【Unite Tokyo  2018】バーチャルYouTuber電脳少女シロがご紹介する「2018年の注目アセット100連発」
【Unite Tokyo 2018】バーチャルYouTuber電脳少女シロがご紹介する「2018年の注目アセット100連発」
 
OpenNI 3Dセンサープログラミング
OpenNI 3DセンサープログラミングOpenNI 3Dセンサープログラミング
OpenNI 3Dセンサープログラミング
 
先進的なルックデベロップメント
先進的なルックデベロップメント先進的なルックデベロップメント
先進的なルックデベロップメント
 
ABC2012Spring 20120324
ABC2012Spring 20120324ABC2012Spring 20120324
ABC2012Spring 20120324
 

Viewers also liked

Cakephp And Wordpress
Cakephp And WordpressCakephp And Wordpress
Cakephp And Wordpress
Kazuhiro Hara
 
Hacking Mac OSX Cocoa API from Perl
Hacking Mac OSX Cocoa API from PerlHacking Mac OSX Cocoa API from Perl
Hacking Mac OSX Cocoa API from Perl
typester
 
GREE流 新次元ゲーム開発
GREE流 新次元ゲーム開発GREE流 新次元ゲーム開発
GREE流 新次元ゲーム開発
Kazuki Sakamoto
 
エンジニアの為のWordPress入門 〜WordPressはWebAppプラットフォームです〜
エンジニアの為のWordPress入門 〜WordPressはWebAppプラットフォームです〜エンジニアの為のWordPress入門 〜WordPressはWebAppプラットフォームです〜
エンジニアの為のWordPress入門 〜WordPressはWebAppプラットフォームです〜
Yuji Nojima
 
はじめてのi osアプリデザイン
はじめてのi osアプリデザインはじめてのi osアプリデザイン
はじめてのi osアプリデザイン
schoowebcampus
 
GREE 流!AWS をお得に使う方法
GREE 流!AWS をお得に使う方法GREE 流!AWS をお得に使う方法
GREE 流!AWS をお得に使う方法
gree_tech
 

Viewers also liked (6)

Cakephp And Wordpress
Cakephp And WordpressCakephp And Wordpress
Cakephp And Wordpress
 
Hacking Mac OSX Cocoa API from Perl
Hacking Mac OSX Cocoa API from PerlHacking Mac OSX Cocoa API from Perl
Hacking Mac OSX Cocoa API from Perl
 
GREE流 新次元ゲーム開発
GREE流 新次元ゲーム開発GREE流 新次元ゲーム開発
GREE流 新次元ゲーム開発
 
エンジニアの為のWordPress入門 〜WordPressはWebAppプラットフォームです〜
エンジニアの為のWordPress入門 〜WordPressはWebAppプラットフォームです〜エンジニアの為のWordPress入門 〜WordPressはWebAppプラットフォームです〜
エンジニアの為のWordPress入門 〜WordPressはWebAppプラットフォームです〜
 
はじめてのi osアプリデザイン
はじめてのi osアプリデザインはじめてのi osアプリデザイン
はじめてのi osアプリデザイン
 
GREE 流!AWS をお得に使う方法
GREE 流!AWS をお得に使う方法GREE 流!AWS をお得に使う方法
GREE 流!AWS をお得に使う方法
 

Similar to GREE TechTalk グリーのクライアント技術戦略

【de:code 2020】 2020 年も最高のゲームをつくろう! Game Stack でゲーム開発をしよう! ~ LiveOps とデータ分析編 ~
【de:code 2020】 2020 年も最高のゲームをつくろう! Game Stack でゲーム開発をしよう! ~ LiveOps とデータ分析編 ~【de:code 2020】 2020 年も最高のゲームをつくろう! Game Stack でゲーム開発をしよう! ~ LiveOps とデータ分析編 ~
【de:code 2020】 2020 年も最高のゲームをつくろう! Game Stack でゲーム開発をしよう! ~ LiveOps とデータ分析編 ~
日本マイクロソフト株式会社
 
2020 年も最高のゲームをつくろう! Game Stack でゲーム開発をしよう! ~ LiveOps とデータ分析編 ~
2020 年も最高のゲームをつくろう! Game Stack でゲーム開発をしよう! ~ LiveOps とデータ分析編 ~2020 年も最高のゲームをつくろう! Game Stack でゲーム開発をしよう! ~ LiveOps とデータ分析編 ~
2020 年も最高のゲームをつくろう! Game Stack でゲーム開発をしよう! ~ LiveOps とデータ分析編 ~
Daisuke Masubuchi
 
Microsoft Intelligent Edge Technologies
Microsoft Intelligent Edge TechnologiesMicrosoft Intelligent Edge Technologies
Microsoft Intelligent Edge Technologies
Takeshi Fukuhara
 
【14-B-2】グリーを支えるデータ分析基盤の過去と現在(橋本泰一〔グリー〕)
【14-B-2】グリーを支えるデータ分析基盤の過去と現在(橋本泰一〔グリー〕)【14-B-2】グリーを支えるデータ分析基盤の過去と現在(橋本泰一〔グリー〕)
【14-B-2】グリーを支えるデータ分析基盤の過去と現在(橋本泰一〔グリー〕)
Developers Summit
 
剣と魔法のログレス いにしえの女神 〜スマホ時代の MMORPG を支える技術
剣と魔法のログレス いにしえの女神 〜スマホ時代の MMORPG を支える技術剣と魔法のログレス いにしえの女神 〜スマホ時代の MMORPG を支える技術
剣と魔法のログレス いにしえの女神 〜スマホ時代の MMORPG を支える技術
Satoshi Yamafuji
 
DeNAのゲーム開発を支える技術 (クライアントサイド編)
DeNAのゲーム開発を支える技術 (クライアントサイド編)DeNAのゲーム開発を支える技術 (クライアントサイド編)
DeNAのゲーム開発を支える技術 (クライアントサイド編)
denatech2016
 
LEGO MINDSTORMS EV3 API
LEGO MINDSTORMS EV3 APILEGO MINDSTORMS EV3 API
LEGO MINDSTORMS EV3 API
Akira Hatsune
 
Developr Camp 2012 Japan Fall Day2 Special Session - Visual Studio 2012 で始める ...
Developr Camp 2012 Japan Fall Day2 Special Session - Visual Studio 2012 で始める ...Developr Camp 2012 Japan Fall Day2 Special Session - Visual Studio 2012 で始める ...
Developr Camp 2012 Japan Fall Day2 Special Session - Visual Studio 2012 で始める ...
Developer Camp 2012 Japan Fall
 
Dev camp2012jpn day2special
Dev camp2012jpn day2specialDev camp2012jpn day2special
Dev camp2012jpn day2special
Katsuhito Katoh
 
使い倒そう Visual Studio Code!!! ~ここからはじめる基本のキ~
使い倒そうVisual Studio Code!!! ~ここからはじめる基本のキ~使い倒そうVisual Studio Code!!! ~ここからはじめる基本のキ~
使い倒そう Visual Studio Code!!! ~ここからはじめる基本のキ~
Saki Homma
 
革新的ブラウザゲームを支えるプラットフォーム技術
革新的ブラウザゲームを支えるプラットフォーム技術革新的ブラウザゲームを支えるプラットフォーム技術
革新的ブラウザゲームを支えるプラットフォーム技術
Toru Yamaguchi
 
シンラ・テクノロジー第2回クラウドゲーム開発者会議
シンラ・テクノロジー第2回クラウドゲーム開発者会議シンラ・テクノロジー第2回クラウドゲーム開発者会議
シンラ・テクノロジー第2回クラウドゲーム開発者会議
Shinra_Technologies
 
アプリエンジニアがサーバーサイドで最初に勉強するべきこと
アプリエンジニアがサーバーサイドで最初に勉強するべきことアプリエンジニアがサーバーサイドで最初に勉強するべきこと
アプリエンジニアがサーバーサイドで最初に勉強するべきこと
YutoNishine
 
Windows8のクライアントHyper-V入門(.NETラボ勉強会 2013/6/22 日本マイクロソフト)
Windows8のクライアントHyper-V入門(.NETラボ勉強会 2013/6/22 日本マイクロソフト)Windows8のクライアントHyper-V入門(.NETラボ勉強会 2013/6/22 日本マイクロソフト)
Windows8のクライアントHyper-V入門(.NETラボ勉強会 2013/6/22 日本マイクロソフト)
Tomokazu Kizawa
 
技術選択とアーキテクトの役割
技術選択とアーキテクトの役割技術選択とアーキテクトの役割
技術選択とアーキテクトの役割
Toru Yamaguchi
 
Azure Media Services 大全
Azure Media Services 大全Azure Media Services 大全
Azure Media Services 大全
Daiyu Hatakeyama
 
WeDX Flow Hands-on
WeDX Flow Hands-onWeDX Flow Hands-on
WeDX Flow Hands-on
Jingun Jung
 
3Dリッチコンテンツビジネス活用のご提案ver3.1
3Dリッチコンテンツビジネス活用のご提案ver3.13Dリッチコンテンツビジネス活用のご提案ver3.1
3Dリッチコンテンツビジネス活用のご提案ver3.1
CRI Japan, Inc.
 
3Dリッチコンテンツビジネス活用のご提案ver3.1
3Dリッチコンテンツビジネス活用のご提案ver3.13Dリッチコンテンツビジネス活用のご提案ver3.1
3Dリッチコンテンツビジネス活用のご提案ver3.1
ITDORAKU
 
DeNAのサーバー"コード"レスアーキテクチャ
DeNAのサーバー"コード"レスアーキテクチャDeNAのサーバー"コード"レスアーキテクチャ
DeNAのサーバー"コード"レスアーキテクチャ
Haruto Otake
 

Similar to GREE TechTalk グリーのクライアント技術戦略 (20)

【de:code 2020】 2020 年も最高のゲームをつくろう! Game Stack でゲーム開発をしよう! ~ LiveOps とデータ分析編 ~
【de:code 2020】 2020 年も最高のゲームをつくろう! Game Stack でゲーム開発をしよう! ~ LiveOps とデータ分析編 ~【de:code 2020】 2020 年も最高のゲームをつくろう! Game Stack でゲーム開発をしよう! ~ LiveOps とデータ分析編 ~
【de:code 2020】 2020 年も最高のゲームをつくろう! Game Stack でゲーム開発をしよう! ~ LiveOps とデータ分析編 ~
 
2020 年も最高のゲームをつくろう! Game Stack でゲーム開発をしよう! ~ LiveOps とデータ分析編 ~
2020 年も最高のゲームをつくろう! Game Stack でゲーム開発をしよう! ~ LiveOps とデータ分析編 ~2020 年も最高のゲームをつくろう! Game Stack でゲーム開発をしよう! ~ LiveOps とデータ分析編 ~
2020 年も最高のゲームをつくろう! Game Stack でゲーム開発をしよう! ~ LiveOps とデータ分析編 ~
 
Microsoft Intelligent Edge Technologies
Microsoft Intelligent Edge TechnologiesMicrosoft Intelligent Edge Technologies
Microsoft Intelligent Edge Technologies
 
【14-B-2】グリーを支えるデータ分析基盤の過去と現在(橋本泰一〔グリー〕)
【14-B-2】グリーを支えるデータ分析基盤の過去と現在(橋本泰一〔グリー〕)【14-B-2】グリーを支えるデータ分析基盤の過去と現在(橋本泰一〔グリー〕)
【14-B-2】グリーを支えるデータ分析基盤の過去と現在(橋本泰一〔グリー〕)
 
剣と魔法のログレス いにしえの女神 〜スマホ時代の MMORPG を支える技術
剣と魔法のログレス いにしえの女神 〜スマホ時代の MMORPG を支える技術剣と魔法のログレス いにしえの女神 〜スマホ時代の MMORPG を支える技術
剣と魔法のログレス いにしえの女神 〜スマホ時代の MMORPG を支える技術
 
DeNAのゲーム開発を支える技術 (クライアントサイド編)
DeNAのゲーム開発を支える技術 (クライアントサイド編)DeNAのゲーム開発を支える技術 (クライアントサイド編)
DeNAのゲーム開発を支える技術 (クライアントサイド編)
 
LEGO MINDSTORMS EV3 API
LEGO MINDSTORMS EV3 APILEGO MINDSTORMS EV3 API
LEGO MINDSTORMS EV3 API
 
Developr Camp 2012 Japan Fall Day2 Special Session - Visual Studio 2012 で始める ...
Developr Camp 2012 Japan Fall Day2 Special Session - Visual Studio 2012 で始める ...Developr Camp 2012 Japan Fall Day2 Special Session - Visual Studio 2012 で始める ...
Developr Camp 2012 Japan Fall Day2 Special Session - Visual Studio 2012 で始める ...
 
Dev camp2012jpn day2special
Dev camp2012jpn day2specialDev camp2012jpn day2special
Dev camp2012jpn day2special
 
使い倒そう Visual Studio Code!!! ~ここからはじめる基本のキ~
使い倒そうVisual Studio Code!!! ~ここからはじめる基本のキ~使い倒そうVisual Studio Code!!! ~ここからはじめる基本のキ~
使い倒そう Visual Studio Code!!! ~ここからはじめる基本のキ~
 
革新的ブラウザゲームを支えるプラットフォーム技術
革新的ブラウザゲームを支えるプラットフォーム技術革新的ブラウザゲームを支えるプラットフォーム技術
革新的ブラウザゲームを支えるプラットフォーム技術
 
シンラ・テクノロジー第2回クラウドゲーム開発者会議
シンラ・テクノロジー第2回クラウドゲーム開発者会議シンラ・テクノロジー第2回クラウドゲーム開発者会議
シンラ・テクノロジー第2回クラウドゲーム開発者会議
 
アプリエンジニアがサーバーサイドで最初に勉強するべきこと
アプリエンジニアがサーバーサイドで最初に勉強するべきことアプリエンジニアがサーバーサイドで最初に勉強するべきこと
アプリエンジニアがサーバーサイドで最初に勉強するべきこと
 
Windows8のクライアントHyper-V入門(.NETラボ勉強会 2013/6/22 日本マイクロソフト)
Windows8のクライアントHyper-V入門(.NETラボ勉強会 2013/6/22 日本マイクロソフト)Windows8のクライアントHyper-V入門(.NETラボ勉強会 2013/6/22 日本マイクロソフト)
Windows8のクライアントHyper-V入門(.NETラボ勉強会 2013/6/22 日本マイクロソフト)
 
技術選択とアーキテクトの役割
技術選択とアーキテクトの役割技術選択とアーキテクトの役割
技術選択とアーキテクトの役割
 
Azure Media Services 大全
Azure Media Services 大全Azure Media Services 大全
Azure Media Services 大全
 
WeDX Flow Hands-on
WeDX Flow Hands-onWeDX Flow Hands-on
WeDX Flow Hands-on
 
3Dリッチコンテンツビジネス活用のご提案ver3.1
3Dリッチコンテンツビジネス活用のご提案ver3.13Dリッチコンテンツビジネス活用のご提案ver3.1
3Dリッチコンテンツビジネス活用のご提案ver3.1
 
3Dリッチコンテンツビジネス活用のご提案ver3.1
3Dリッチコンテンツビジネス活用のご提案ver3.13Dリッチコンテンツビジネス活用のご提案ver3.1
3Dリッチコンテンツビジネス活用のご提案ver3.1
 
DeNAのサーバー"コード"レスアーキテクチャ
DeNAのサーバー"コード"レスアーキテクチャDeNAのサーバー"コード"レスアーキテクチャ
DeNAのサーバー"コード"レスアーキテクチャ
 

Recently uploaded

「スマートエスイー」におけるスマートシステム&サービスおよびDX推進人材の産学連携育成ならびに参照モデルに基づく育成プログラム分析
「スマートエスイー」におけるスマートシステム&サービスおよびDX推進人材の産学連携育成ならびに参照モデルに基づく育成プログラム分析「スマートエスイー」におけるスマートシステム&サービスおよびDX推進人材の産学連携育成ならびに参照モデルに基づく育成プログラム分析
「スマートエスイー」におけるスマートシステム&サービスおよびDX推進人材の産学連携育成ならびに参照モデルに基づく育成プログラム分析
Hironori Washizaki
 
第61回CV勉強会「CVPR2024読み会」(前編)発表資料:State Space Models for Event Cameras
第61回CV勉強会「CVPR2024読み会」(前編)発表資料:State Space Models for Event Cameras第61回CV勉強会「CVPR2024読み会」(前編)発表資料:State Space Models for Event Cameras
第61回CV勉強会「CVPR2024読み会」(前編)発表資料:State Space Models for Event Cameras
Takuya Minagawa
 
MySQLの文字コードと照合順序について 2024/07/05の勉強会で発表されたものです。
MySQLの文字コードと照合順序について 2024/07/05の勉強会で発表されたものです。MySQLの文字コードと照合順序について 2024/07/05の勉強会で発表されたものです。
MySQLの文字コードと照合順序について 2024/07/05の勉強会で発表されたものです。
iPride Co., Ltd.
 
【AI論文解説】LLMの事前学習をvisionに適用する手法Autoregressive Image Models
【AI論文解説】LLMの事前学習をvisionに適用する手法Autoregressive Image Models【AI論文解説】LLMの事前学習をvisionに適用する手法Autoregressive Image Models
【AI論文解説】LLMの事前学習をvisionに適用する手法Autoregressive Image Models
Sony - Neural Network Libraries
 
【GPT4-o越えのリアルタイム会話AI】kyutai labsのMoshiデモ動画を解説
【GPT4-o越えのリアルタイム会話AI】kyutai labsのMoshiデモ動画を解説【GPT4-o越えのリアルタイム会話AI】kyutai labsのMoshiデモ動画を解説
【GPT4-o越えのリアルタイム会話AI】kyutai labsのMoshiデモ動画を解説
TsuyoshiSaito7
 
Matsuo-Iwasawa Lab. Research unit Introduction
Matsuo-Iwasawa Lab. Research unit IntroductionMatsuo-Iwasawa Lab. Research unit Introduction
Matsuo-Iwasawa Lab. Research unit Introduction
Matsuo Lab
 
Kyndryl Developer Services のご紹介 2024年7月
Kyndryl Developer Services のご紹介  2024年7月Kyndryl Developer Services のご紹介  2024年7月
Kyndryl Developer Services のご紹介 2024年7月
Takayuki Nakayama
 
Matsuo-Iwasawa lab. Research Unit Introduction
Matsuo-Iwasawa lab. Research Unit IntroductionMatsuo-Iwasawa lab. Research Unit Introduction
Matsuo-Iwasawa lab. Research Unit Introduction
Matsuo Lab
 
MOSHI: 革新的な音声AI QAIが開発した次世代のコミュニケーションツール
MOSHI: 革新的な音声AI QAIが開発した次世代のコミュニケーションツールMOSHI: 革新的な音声AI QAIが開発した次世代のコミュニケーションツール
MOSHI: 革新的な音声AI QAIが開発した次世代のコミュニケーションツール
TsuyoshiSaito7
 
「福利厚生をコストから投資へ」AIで社員1人ひとりに最適な支援を届ける 全く新しいカフェテリアプラン
「福利厚生をコストから投資へ」AIで社員1人ひとりに最適な支援を届ける 全く新しいカフェテリアプラン「福利厚生をコストから投資へ」AIで社員1人ひとりに最適な支援を届ける 全く新しいカフェテリアプラン
「福利厚生をコストから投資へ」AIで社員1人ひとりに最適な支援を届ける 全く新しいカフェテリアプラン
shogotaguchi
 

Recently uploaded (10)

「スマートエスイー」におけるスマートシステム&サービスおよびDX推進人材の産学連携育成ならびに参照モデルに基づく育成プログラム分析
「スマートエスイー」におけるスマートシステム&サービスおよびDX推進人材の産学連携育成ならびに参照モデルに基づく育成プログラム分析「スマートエスイー」におけるスマートシステム&サービスおよびDX推進人材の産学連携育成ならびに参照モデルに基づく育成プログラム分析
「スマートエスイー」におけるスマートシステム&サービスおよびDX推進人材の産学連携育成ならびに参照モデルに基づく育成プログラム分析
 
第61回CV勉強会「CVPR2024読み会」(前編)発表資料:State Space Models for Event Cameras
第61回CV勉強会「CVPR2024読み会」(前編)発表資料:State Space Models for Event Cameras第61回CV勉強会「CVPR2024読み会」(前編)発表資料:State Space Models for Event Cameras
第61回CV勉強会「CVPR2024読み会」(前編)発表資料:State Space Models for Event Cameras
 
MySQLの文字コードと照合順序について 2024/07/05の勉強会で発表されたものです。
MySQLの文字コードと照合順序について 2024/07/05の勉強会で発表されたものです。MySQLの文字コードと照合順序について 2024/07/05の勉強会で発表されたものです。
MySQLの文字コードと照合順序について 2024/07/05の勉強会で発表されたものです。
 
【AI論文解説】LLMの事前学習をvisionに適用する手法Autoregressive Image Models
【AI論文解説】LLMの事前学習をvisionに適用する手法Autoregressive Image Models【AI論文解説】LLMの事前学習をvisionに適用する手法Autoregressive Image Models
【AI論文解説】LLMの事前学習をvisionに適用する手法Autoregressive Image Models
 
【GPT4-o越えのリアルタイム会話AI】kyutai labsのMoshiデモ動画を解説
【GPT4-o越えのリアルタイム会話AI】kyutai labsのMoshiデモ動画を解説【GPT4-o越えのリアルタイム会話AI】kyutai labsのMoshiデモ動画を解説
【GPT4-o越えのリアルタイム会話AI】kyutai labsのMoshiデモ動画を解説
 
Matsuo-Iwasawa Lab. Research unit Introduction
Matsuo-Iwasawa Lab. Research unit IntroductionMatsuo-Iwasawa Lab. Research unit Introduction
Matsuo-Iwasawa Lab. Research unit Introduction
 
Kyndryl Developer Services のご紹介 2024年7月
Kyndryl Developer Services のご紹介  2024年7月Kyndryl Developer Services のご紹介  2024年7月
Kyndryl Developer Services のご紹介 2024年7月
 
Matsuo-Iwasawa lab. Research Unit Introduction
Matsuo-Iwasawa lab. Research Unit IntroductionMatsuo-Iwasawa lab. Research Unit Introduction
Matsuo-Iwasawa lab. Research Unit Introduction
 
MOSHI: 革新的な音声AI QAIが開発した次世代のコミュニケーションツール
MOSHI: 革新的な音声AI QAIが開発した次世代のコミュニケーションツールMOSHI: 革新的な音声AI QAIが開発した次世代のコミュニケーションツール
MOSHI: 革新的な音声AI QAIが開発した次世代のコミュニケーションツール
 
「福利厚生をコストから投資へ」AIで社員1人ひとりに最適な支援を届ける 全く新しいカフェテリアプラン
「福利厚生をコストから投資へ」AIで社員1人ひとりに最適な支援を届ける 全く新しいカフェテリアプラン「福利厚生をコストから投資へ」AIで社員1人ひとりに最適な支援を届ける 全く新しいカフェテリアプラン
「福利厚生をコストから投資へ」AIで社員1人ひとりに最適な支援を届ける 全く新しいカフェテリアプラン
 

GREE TechTalk グリーのクライアント技術戦略

  • 1. グリーのクライアント技術戦略 グリー株式会社 開発本部 CTO室 芳賀 洋行
  • 2. 1 /124 自己紹介:芳賀洋行 どうぶつフレンズ CTO室 エンジニアリーダー 2012 イマ ココ どうぶつフレンズ プロダクトマネジャー 2012 グリー 2012 オートデスク 2011 ロンドンスタジオ エンジニアマネジャー 2006 2010 2003 エイリアス グロービス経営大学院 2003 会津大学コンピュータサイエンス #greetech01
  • 3. 2 /124 アジェンダ 1. 今日までのクライアント技術のまとめ 2. グリーのクライアント技術戦略 3. クライアント技術におけるLWFの役割 4. グリーのオープンソース活動 質問、コメントなどございましたら #greetech01までつぶやきお願いします #greetech01
  • 4. 3 /124 ゲームシステムにおける本日の話の位置づけ インターネット 計算 データ 分析 コード U コード E 企画 マーケット アプリ 画像 D プレース アプリ SWF A #greetech01
  • 5. 4 /124 本セッションでお伝えすること • 将来、手詰まりにならないために、 幅広い範囲をカバーできる技術選択も1手! • LWFは幅広い技術範囲をカバーできます! • グリーはエンジニアの オープンソース貢献を応援しています! #greetech01
  • 6. 5 /124 アジェンダ 1. 今日までのクライアント技術のまとめ 2. グリーのクライアント技術戦略 3. クライアント技術におけるLWFの役割 4. グリーのオープンソース活動 #greetech01
  • 8. 7 /124 ここまでクライアント技術要諦 • 1つの分け方として 「ブラウザを中核とするクライアント技術」と 「ブラウザを中核としないクライアント技術」 • ブラウザ中核技術の肝は「標準化」/ 非ブラウザ技術の肝は「差別化」 • 「標準化」と「差別化」の両方を満たす 「HTML5ブラウザ」は未だ安定していない技術 #greetech01
  • 9. 8 /124 本日の枠組み 制作工程 制作物 ロジック 出力前処理 出力 ゲーム 実行結果を 制作物を 制作物種類を ロジックを ハードウェア 出力する前の 作る 増やす/絞る 記述する で描画する 処理 場所と方法 #greetech01
  • 12. 2007 2008 2009 2010 2011 2012 2013 イマココ 2007年
  • 13. 12 /124 2007年釣りスタサービス開始! #greetech01
  • 14. 13 ブラウザ中心 /124 クライアント関連技術のまとめ 制作工程 制作物 ロジック 出力前処理 入出力 ブラウザ CPU FLASH アート Player サーバー PHP #greetech01
  • 15. 14 ブラウザ中心 /124 クライアント関連技術のまとめ 制作工程 制作物 ロジック 出力前処理 出力 2D静止画 マークアップ制作 画像 サーバーサイド サーバーサイド ネットワーク テキスト FLASH制作 ブラウザ ブラウザ CPU 配置情報 ブラウザ ブラウザ 2D動画制作 2Dアニメ プラグイン プラグイン データ GPU 3D動画制作 ミドルウェア ミドルウェア 動画 3Dデータ制作 3Dデータ ネイティブ ネイティブ サウンド #greetech01
  • 16. 15 ブラウザ中心クライアント技術のまとめ /124 標準化による短い開発期間の実現 制作工程 制作物 ロジック 出力前処理 出力 2D静止画 マークアップ制作 画像 サーバーサイド サーバーサイド ネットワーク テキスト FLASH制作 ブラウザ ブラウザ CPU 配置情報 ブラウザ ブラウザ 2D動画制作 2Dアニメ プラグイン プラグイン データ GPU 3D動画制作 ミドルウェア ミドルウェア 動画 クライアント側は サーバーサイドの 3Dデータ制作ロジック実装、 3Dデータ ネイティブ ブラウザ/Flash Playerに ネイティブ サウンド コンテンツ開発に全力を注ぐ! 任せる #greetech01
  • 18. 17 /116 2007 2008 2009 2010 2011 2012 2013 イマココ 2008年
  • 19. 18 /124 2008年 • はじめて国内のコンソールゲーム市場が 縮小に転じる 2008年国内ゲーム市場規模は約5826億1000万円(エンターブレイン調べ) #greetech01 http://www.famitsu.com/game/news/1221045_1124.html
  • 20. 19 非ブラウザネイティブのクライアント技術 /124 差別化(特殊化)による長い開発期間 制作工程 制作物 ロジック 出力前処理 入出力 独自 CPU 独自描画 データ エンジン アート 独自ゲーム 独自 独自 GPU エンジン ツール コンバータ ネイティブ ネイティブ ネイティブ ネイティブ C++ C++ C++ C++ #greetech01
  • 21. 20 非ブラウザコンソールの /124 クライアント関連技術のまとめ 制作工程 制作物 ロジック 出力前処理 出力 2D静止画 マークアップ制作 画像 サーバーサイド サーバーサイド ネットワーク テキスト FLASH制作 ブラウザ ブラウザ CPU 配置情報 ブラウザ ブラウザ 2D動画制作 2Dアニメ プラグイン プラグイン データ GPU 3D動画制作 ミドルウェア ミドルウェア 動画 3Dデータ制作 3Dデータ ネイティブ ネイティブ サウンド #greetech01
  • 22. 21 非ブラウザコンソールの /124 クライアント関連技術のまとめ 制作工程 制作物 ロジック 出力前処理 出力 2D静止画 ハードウェアの限界性能を引き出せるが マークアップ制作 画像 サーバーサイド サーバーサイド ネットワーク 広い技術領域、高い難易度、プラット テキスト フォームごとに異なるデバイス特性に ブラウザ FLASH制作 ブラウザ あわせたエンジニアリングが必要になる CPU 配置情報 ブラウザ ブラウザ 2D動画制作 2Dアニメ プラグイン プラグイン データ GPU 3D動画制作 ミドルウェア ミドルウェア 動画 3Dデータ制作 3Dデータ ネイティブ ネイティブ サウンド #greetech01
  • 23. 22 /116 2007 2008 2009 2010 2011 2012 2013 イマココ 2008年 7月 10日
  • 24. 23 /124 2008年7月10日 • App Store開始 http://en.wikipedia.org/wiki/App_Store_(iOS) #greetech01
  • 25. 24 ブラウザ中心 /124 クライアント関連技術からの視点 制作工程 制作物 ロジック 出力前処理 入出力 FLASH Playerの対応が 参入の時期の決定要因 ブラウザ CPU FLASH アート Player サーバー PHP #greetech01
  • 26. 25 非ブラウザコンソールの /124 クライアント関連技術の視点 制作工程 制作物 ロジック 出力前処理 入出力 巨大な開発コストを賄えるか どうかが参入の決定要因 独自 CPU 独自描画 データ エンジン アート 独自ゲーム 独自 独自 GPU エンジン ツール コンバータ ネイティブ ネイティブ ネイティブ ネイティブ C++ C++ C++ C++ #greetech01
  • 28. 27 /116 2007 2008 2009 2010 2011 2012 2013 イマココ 2010年 4月
  • 30. 29 /124 Apple FLASHプレイヤーに • Apple FLASHプレイヤーに対応しないことを正式 に表明 http://www.apple.com/hotnews/thoughts-on-flash #greetech01
  • 32. 31 ブラウザ中心 /124 クライアント関連技術からの視点 制作工程 制作物 ロジック 出力前処理 入出力 FLASH Playerの対応が 参入の時期の決定要因 ブラウザ CPU FLASH アート Player サーバー PHP #greetech01
  • 33. 32 (ゲームに関連する) /124 クライアント関連技術のまとめ 制作工程 制作物 ロジック 出力前処理 入出力 ブラウザ CPU FLASH アート Player サーバー PHP #greetech01
  • 34. 33 ブラウザ中心 /124 クライアント関連技術のまとめ 制作工程 制作物 ロジック 出力前処理 出力 2D静止画 マークアップ制作 画像 サーバーサイド サーバーサイド ネットワーク テキスト FLASH制作 ブラウザ ブラウザ CPU 配置情報 ブラウザ ブラウザ 2D動画制作 2Dアニメ プラグイン プラグイン データ GPU 3D動画制作 ミドルウェア ミドルウェア 動画 クライアント側は サーバーサイドの 3Dデータ制作ロジック実装、 3Dデータ ネイティブ ブラウザ/Flash Playerに ネイティブ サウンド コンテンツ開発に全力を注ぐ! 任せる #greetech01
  • 35. 34 ブラウザ中心 /124 クライアント関連技術の視点 制作工程 制作物 ロジック 出力前処理 出力 2D静止画 マークアップ制作 画像 サーバーサイド サーバーサイド ネットワーク テキスト FLASH制作 ブラウザ ブラウザ CPU 配置情報 ブラウザ ブラウザ 2D動画制作 2Dアニメ プラグイン プラグイン データ GPU 3D動画制作 ミドルウェア ミドルウェア Playerの FLASH 動画 2Dアニメーションデータ(swf) 代替となる高い をブラウザで表示するための変換 3Dデータ制作 3Dデータ ネイティブ パフォーマンスの ネイティブ サウンド 方法の模索 プレイヤーの模索 #greetech01
  • 37. 36 /116 2007 2008 2009 2010 2011 2012 2013 イマココ 2010年 6月 24日
  • 38. 37 /124 iPhone4 リリース #greetech01
  • 40. 39 /116 2007 2008 2009 2010 2011 2012 2013 イマココ 2010年 12月 9日
  • 41. 40 /124 2010年 12月 9日 • インフィニティブレードがリリースされる Infinity Blade © 2011-2012 Chair Entertainment Group, LLC http://en.wikipedia.org/wiki/Infinity_Blade #greetech01
  • 42. 41 非ブラウザ・ネイティブ系 /124 クライアント関連技術の視点 制作工程 制作物 ロジック 出力前処理 入出力 独自 CPU 独自描画 データ エンジン アート 独自ゲーム 独自 独自 GPU エンジン ツール コンバータ ネイティブ ネイティブ ネイティブ ネイティブ C++ C++ C++ C++ #greetech01
  • 43. 42 非ブラウザ・ミドルウェア /124 クライアント関連技術のまとめ 制作工程 制作物 ロジック 出力前処理 入出力 汎用 CPU 3D データ ミドルウェア アート スクリプト 言語 GPU #greetech01
  • 44. 43 非ブラウザ・ミドルウェア /124 クライアント関連技術のまとめ クライアント側の 制作工程 制作物 出力まわりの処理は ロジック 出力前処理 出力 ミドルウェアにまかせる 2D静止画 マークアップ制作 画像 サーバーサイド サーバーサイド ネットワーク テキスト クライアントサイドのブラウザ FLASH制作 ブラウザ ロジック実装、 CPU 配置情報 ブラウザ コンテンツ開発に全力を注ぐ! ブラウザ 2D動画制作 2Dアニメ プラグイン プラグイン データ GPU 3D動画制作 ミドルウェア ミドルウェア 動画 3Dデータ制作 3Dデータ ネイティブ ネイティブ サウンド #greetech01
  • 46. 45 /116 2007 2008 2009 2010 2011 2012 2013 イマココ 2011年 3月1日
  • 47. 46 /124 • グリー、マルチOS開発を支援する3Dゲーム開発 ツール「Unity」を提供するUnity Technologiesと技術提携 #greetech01
  • 48. 47 非ブラウザ・ミドルウェア /124 クライアント関連技術のまとめ 制作工程 制作物 クライアント側の ロジック 出力前処理 出力 出力まわりの処理は 2D静止画 画像 ミドルウェアにまかせる サーバーサイド サーバーサイド ネットワーク マークアップ制作 テキスト クライアントサイドのブラウザ FLASH制作 ブラウザ ロジック実装、 CPU 配置情報 ブラウザ コンテンツ開発に全力を注ぐ! ブラウザ 2D動画制作 2Dアニメ プラグイン プラグイン データ GPU 3D動画制作 ミドルウェア ミドルウェア 動画 3Dデータ制作 3Dデータ ネイティブ ネイティブ サウンド #greetech01
  • 49. 48 非ブラウザ・ミドルウェア /124 どうぶつフレンズまとめ 制作工程 制作物 ロジック 出力前処理 出力 2D静止画 マークアップ制作 画像 サーバーサイド サーバーサイド ネットワーク テキスト FLASH制作 ブラウザ ブラウザ CPU 配置情報 ブラウザ ブラウザ 2D動画制作 2Dアニメ プラグイン プラグイン データ GPU 3D動画制作 ミドルウェア ミドルウェア 動画 3Dデータ制作 3Dデータ ネイティブ ネイティブ サウンド #greetech01
  • 51. 50 /116 2007 2008 2009 2010 2011 2012 2013 イマココ 2011年10月12日
  • 53. 52 /124 iOS5.0配布開始 • Safari “Super fast HTML5 draw support.” http://en.wikipedia.org/wiki/IOS_version_history #greetech01
  • 56. 55 /116 2007 2008 2009 2010 2011 2012 2013 イマココ 2011年 12月16日
  • 57. 56 /124 Android 4.0 • CanvasのGPU対応がもりこまれる #greetech01
  • 59. 58 ブラウザ中心 /124 クライアント関連技術の視点 制作工程 制作物 ロジック 出力前処理 出力 2D静止画 マークアップ制作 画像 サーバーサイド サーバーサイド ネットワーク テキスト FLASH制作 ブラウザ ブラウザ CPU 配置情報 ブラウザ ブラウザ 2D動画制作 2Dアニメ プラグイン プラグイン データ GPU 3D動画制作 ミドルウェア ミドルウェア 動画 2Dアニメーションデータ(swf) HTML5で をブラウザで再生できる 高いパフォーマンス 3Dデータ制作 3Dデータ ネイティブ ネイティブ サウンド データへの変換方法の模索 が期待できる! #greetech01
  • 61. 60 /116 2007 2008 2009 2010 2011 2012 2013 イマココ 2011年のスマートフォン市場
  • 62. 61 /124 #greetech01
  • 63. 62 /124 日経BPコンサルティング • 2011年スマートフォンの国内普及率は9.5%、 20歳代が市場を牽引 http://consult.nikkeibp.co.jp/consult/news/2011/0801mobile/ #greetech01
  • 66. 65 /116 2007 2008 2009 2010 2011 2012 2013 イマココ 2012年 7月25日
  • 67. 66 /124 #greetech01
  • 68. 67 /124 日経BPコンサルティング • スマートフォンの国内普及率は18.0%、1年でほ ぼ倍増 http://consult.nikkeibp.co.jp/consult/news/2011/0801mobile/ #greetech01
  • 70. 69 非ブラウザコンソールの /124 クライアント関連技術の視点 制作工程 制作物 ロジック 出力前処理 入出力 巨大な開発コストを賄えるか どうかが参入の決定要因 独自 CPU 独自描画 データ エンジン アート 独自ゲーム 独自 独自 GPU エンジン ツール コンバータ ネイティブ ネイティブ ネイティブ ネイティブ C++ C++ C++ C++ #greetech01
  • 73. 72 /116 2007 2008 2009 2010 2011 2012 2013 イマココ 2012年 8月 15日
  • 75. 74 /124 2012/8/15 • Adobe Flash Player exits Android Google Play store • Android ブラウザのFlashプレイヤーの配布終了 http://www.bbc.co.uk/news/technology-19267140 #greetech01
  • 77. 76 ブラウザ中心 /124 クライアント関連技術の視点 制作工程 制作物 ロジック 出力前処理 出力 乗り換え必須 2D静止画 マークアップ制作 画像 サーバーサイド サーバーサイド ネットワーク テキスト FLASH制作 ブラウザ ブラウザ CPU 配置情報 ブラウザ ブラウザ 2D動画制作 2Dアニメ プラグイン プラグイン データ GPU 3D動画制作 ミドルウェア ミドルウェア 動画 3Dデータ制作 3Dデータ ネイティブ ネイティブ サウンド #greetech01
  • 79. 78 /116 2007 2008 2009 2010 2011 2012 2013 イマココ 2012年 8月 29日
  • 81. 80 Flashテクノロジーの今後とあなたの人生との /124 かかわりについて • 第3回テックヒルズ 「2012..Flashの終焉!? ~Flashの今後を見抜く~」実施レポート • 「Flashテクノロジーの今後とあなたの人生とのかかわりについて」 http://gihyo.jp/news/report/2012/09/0301 http://www.slideshare.net/otachan/flash-14113527 #greetech01
  • 84. 83 /116 2007 2008 2009 2010 2011 2012 2013 イマココ 2012年9月12日
  • 86. 85 /124 #greetech01
  • 88. 87 ブラウザ中心 クライアント関連技術の視点 ! /124 制作工程 制作物 ロジック 出力前処理 出力 2D静止画 マークアップ制作 画像 サーバーサイド サーバーサイド ネットワーク テキスト FLASH制作 ブラウザ ブラウザ CPU 配置情報 ブラウザ ブラウザ 2D動画制作 2Dアニメ プラグイン プラグイン データ GPU 3D動画制作 ミドルウェア ミドルウェア 動画 3Dデータ制作 3Dデータ ネイティブ ネイティブ サウンド #greetech01
  • 90. 89 /116 2007 2008 2009 2010 2011 2012 2013 イマココ 先月までのまとめ
  • 91. 90 /124 先月までのクライアント技術のまとめ • ブラウザ系クライアント技術の視点 • GPUに対応したHTML5ブラウザを搭載した デバイスがどのくらいの速度で普及するか デバイス間の互換性はどのくらいか • 非ブラウザ系クライアント技術の視点 • ミドルウェアを導入すべきなのかどうか • 参入してよい市場なのかどうか #greetech01
  • 92. 91 (ゲームに関連する) /124 クライアント関連技術のまとめ 制作工程 制作物 ロジック 出力前処理 出力 2D静止画 マークアップ制作 画像 サーバーサイド サーバーサイド ネットワーク テキスト FLASH制作 ブラウザ ブラウザ CPU 配置情報 ブラウザ ブラウザ上の 2D動画制作 2Dアニメ プラグイン プレイヤー データ GPU 3D動画制作 ミドルウェア ミドルウェア 動画 3Dデータ制作 3Dデータ ネイティブ ネイティブ サウンド #greetech01
  • 94. 93 /116 2007 2008 2009 2010 2011 2012 2013 イマココ 2012年10月18日
  • 98. 97 (ゲームに関連する) /124 クライアント関連技術のまとめ 制作工程 制作物 ロジック 出力前処理 出力 1,HTML5は本当に 2D静止画 2,HTML5に 大丈夫か? 画像 サーバーサイド サーバーサイド ネットワーク マークアップ制作 どうやって出力 するのか? テキスト FLASH制作 ブラウザ ブラウザ CPU 配置情報 ブラウザ ブラウザ上の 2D動画制作 2Dアニメ プラグイン プレイヤー データ GPU 3D動画制作 ミドルウェア ミドルウェア 動画 3Dデータ制作 3,ミドルウェア 3Dデータ ネイティブ ネイティブ サウンド に移行できるのか? #greetech01
  • 99. 98 (ゲームに関連する) /124 クライアント関連技術のまとめ LWFを利用するとFLASHコンテンツを 制作工程 制作物 ロジック 出力前処理 出力 ブラウザ/非ブラウザの両方に出力できる! 2D静止画 マークアップ制作 画像 サーバーサイド サーバーサイド ネットワーク テキスト FLASH制作 ブラウザ ブラウザ CPU 配置情報 ブラウザ ブラウザ上の 2D動画制作 2Dアニメ プラグイン プレイヤー データ GPU 3D動画制作 ミドルウェア ミドルウェア 動画 3Dデータ制作 3Dデータ ネイティブ ネイティブ サウンド #greetech01
  • 100. 99 /124 クライアント技術要諦 • 1つの分け方として 「ブラウザを中核とするクライアント技術」と 「ブラウザを中核としないクライアント技術」 • ブラウザ中核技術の肝は「標準化」/ 非ブラウザ技術の肝は「差別化」 • 「標準化」と「差別化」の両方を満たす 「HTML5ブラウザ」は未だ安定していない技術 #greetech01
  • 101. 100 /124 アジェンダ 1. 今日までのクライアント技術のまとめ 2. グリーのクライアント技術戦略 3. クライアント技術におけるLWFの役割 4. グリーのオープンソース活動 #greetech01
  • 103. 102 /124 グリーのクライアント技術戦略 制作工程 制作物 ロジック 出力前処理 出力 2D静止画 ネットワーク マークアップ制作 画像 サーバーサイド サーバーサイド n テキスト FLASH制作 ブラウザ ブラウザ CPU どこの技術領域をやるの? 配置情報 ブラウザ ブラウザ上の 2D動画制作 2Dアニメ プラグイン プレイヤー データ GPU 3D動画制作 ミドルウェア ミドルウェア 動画 3Dデータ制作 3Dデータ ネイティブ ネイティブ サウンド #greetech01
  • 104. 103 グリーのクライアント技術戦略= /124 フルラインナップ 制作工程 制作物 ロジック 出力前処理 出力 2D静止画 ネットワーク マークアップ制作 画像 サーバーサイド サーバーサイド n 全部! テキスト FLASH制作 ブラウザ ブラウザ CPU 配置情報 ブラウザ ブラウザ上の 2D動画制作 2Dアニメ プラグイン プレイヤー データ GPU 3D動画制作 ミドルウェア ミドルウェア 動画 3Dデータ制作 3Dデータ ネイティブ ネイティブ サウンド #greetech01
  • 105. 104 /124 アジェンダ 1. 今日までのクライアント技術のまとめ 2. グリーのクライアント技術戦略 3. LWFを選ぶ理由 4. グリーのオープンソース活動 #greetech01
  • 107. 106 (ゲームに関連する) /124 クライアント関連技術のまとめ LWFを利用するとFLASHコンテンツを 制作工程 制作物 ロジック 出力前処理 出力 ブラウザ/非ブラウザの両方に出力できる! 2D静止画 マークアップ制作 画像 サーバーサイド サーバーサイド ネットワーク テキスト FLASH制作 ブラウザ ブラウザ CPU 配置情報 ブラウザ ブラウザ上の 2D動画制作 2Dアニメ プラグイン プレイヤー データ GPU 3D動画制作 ミドルウェア ミドルウェア 動画 3Dデータ制作 3Dデータ ネイティブ ネイティブ サウンド #greetech01
  • 108. 107 /124 地雷踏み済みです! • たくさん踏みましたw ほんとたくさんw #greetech01
  • 109. 108 /124 失敗のサイクル 安定しない 技術基盤 焦りながらの 予期しない 実装、技術基盤へ 問題の発生 の限定的な投資 スケジュール の遅延 #greetech01
  • 110. 109 /124 アジェンダ 1. 今日までのクライアント技術のまとめ 2. グリーのクライアント技術戦略 3. LWFを選ぶ理由 4. グリーのオープンソース活動 #greetech01
  • 113. 112 /124 グリーのオープンソースポリシー • グリーはグリーエンジニアの オープンソース活動を通じた コミュニティへの貢献を応援しています! #greetech01
  • 114. 113 (ゲームに関連する) /124 クライアント関連技術のまとめ 制作工程 制作物 HTML5にロジック HTML5は本当に 出力前処理 出力 2D静止画 どうやって出力 大丈夫か? 画像 サーバーサイド サーバーサイド ネットワーク マークアップ制作 するのか? テキスト FLASH制作 ブラウザ ブラウザ CPU 配置情報 ブラウザ ブラウザ上の 2D動画制作 2Dアニメ プラグイン プレイヤー データ GPU 3D動画制作 ミドルウェア ミドルウェア 動画 3Dデータ制作 ミドルウェア 3Dデータ ネイティブ ネイティブ サウンド に移行できるのか? #greetech01
  • 115. 114 制作途中はFLASH制作/出力を /124 なんども繰り返す 制作工程 制作物 ロジック 出力前処理 出力 2D静止画 マークアップ制作 画像 サーバーサイド サーバーサイド ネットワーク テキスト FLASH制作 ブラウザ ブラウザ CPU 配置情報 ブラウザ ブラウザ上の 2D動画制作 2Dアニメ プラグイン プレイヤー データ GPU 3D動画制作 ミドルウェア ミドルウェア 動画 3Dデータ制作 3Dデータ ネイティブ ネイティブ サウンド #greetech01
  • 117. 116 /124 LWFS • グリー内製チームで利用している LWFプレビューシステム • エンジニアリングなしに、アーティストが LWFの調整を行える環境が整う #greetech01
  • 121. 120 /124 自己紹介 • 中丸 幸治 • グリー株式会社 開発本部 インフラストラクチャ統括部 アプリケーション基盤開発部 クライアント基盤チーム • 2012/7からグリー • 前職まではいろいろ • モバイル系3DエンジンとかUIとか立体視とか • 大昔、ファ○タジーゾー○(ファミコン版)のドット打ちして、 コインの動きを6502で組みました • CGの研究とか #greetech01
  • 122. 121 /124 さらに拡充される LWFテクノロジー http://github.com/gree #greetech01
  • 123. 122 /124 グリーのオープンソースポリシー • グリーはグリーエンジニアの オープンソース活動を通じた コミュニティへの貢献を応援しています! #greetech01
  • 125. 124 /124 本セッションでお伝えしたこと • 将来、手詰まりにならないために、 幅広い範囲をカバーできる技術選択も1手! • LWFは幅広い技術範囲をカバーできます! • グリーはエンジニアの オープンソース貢献を応援しています! #greetech01