unityを使用したスマートフォン開発事例...

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ

Ｕｎｉｔｙを使用した スマートフォンゲーム開発事例

ギルティドラゴンのアートワーク

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ

株式会社サイバーコネクトツー

アーティスト 杉上 哲也

テクニカルアーティスト 松尾 隆志

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ

株式会社サイバーコネクトツー

福岡県福岡市博多区博多駅前1丁目

東京都品川区大井1丁目

平成８年２月１６日

１７３名

４０,０００,０００円

家庭用ゲームソフト企画・開発

商号

本社

東京スタジオ

設立日

従業員数

資本金

事業内容

❖ 会社概要

page.3

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ

❖ アジェンダ

page.4

14:40 ▼

14:45 はじめに (5分)

14:45 ▼

14:50 ギルティドラゴンの開発概要 (5分)

14:50 ▼

15:25 ギルティドラゴンのアートワーク (35分)

15:35 ▼

15:40 おわりに (5分)

15:25 ▼

15:35 開発上の問題点と解決方法 (10分)

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ

ギルティドラゴンの 開発概要

page.5

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ page.6

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ

❖ ギルティドラゴンで目指したこと

page.7

1 スマートフォンの常識を超える 圧倒的なビジュアル

2 ｉＰｈｏｎｅ４レベルの スペックで快適に動く軽さ

3 手軽で病みつきになるゲーム性

4 ＭＭＯライクな キャラクタカスタマイズ

5 ｉＯＳ/Ａｎｄｒｏｉｄ同時リリース

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ

❖ 初期の企画

当初はインフィニティブレード系のハイエンドを想定

ヘビーユーザー向けになりすぎてしまう

page.8

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ

❖ 最終的な企画

ストレスの溜まらないゲームとして調整

page.9

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ

❖ 最終的な企画

page.10

ＭＭＯライクなキャラクタカスタマイズ

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ

❖ Ｕｎｉｔｙを選んだ理由

page.11

1 短期開発でクオリティも出したい

2 絵を出すまでが簡単

3 モバイルへの対応

自分たちの持ち味（ＣＣ２らしさ）を Ｕｎｉｔｙでどうやって活かすか

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ

❖ 開発の流れ

page.12

２０１１年 １１月

２０１２年 ２月 １０月

運営 開発 検証

３ヶ月

１０月 ９日 ： Ｖｅｒ１.０.０ 配信開始

１０月２２日 ： ｉＯＳ Ｖｅｒ１.０.１ 配信開始 Ａｎｄｒｏｉｄ Ｖｅｒ１.０.２ 配信開始

・・・

７月

３ヶ月

調整期間

５ヶ月

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ

❖ 開発環境

開発機材

プログラマはＭａｃベースで開発

アーティストはＷｉｎｄｏｗｓベースで開発

Ｕｎｉｔｙ ３.５.６

常に最新のバージョンにて開発

３ｄｓＭａｘ ２０１１

キャラクタ、背景、ＵＩ、アニメーション作成 など

ＳｍａｒｔＳＶＮ

コード、リソースはＳｕｂｖｅｒｓｉｏｎで管理

page.13

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ

❖ プロジェクト構成

プロデューサー/ディレクター ： １名

アートディレクター ： １名

ゲームデザイナー ： １名

アーティスト ： ３～６名 （時期により変動） 管理の１名が固定、残りの人数は変動

モデル/デザインの多くは外部会社様に委託

クライアントプログラム ： ２～４名 （時期により変動）

サーバープログラム ： ２～３名 （時期により変動）

テクニカルアーティスト ： １名

サウンド ： １名

page.14

計１２～１８名

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ

ギルティドラゴンの アートワーク

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ

ｙ Ｕｎｉｔ

背景モデル

キャラモデル

モーション

カメラ

エフェクト

シェーダー

組み上げ

❖ アートワーク概要

page.16

３ｄｓＭａｘ

キャラモデル

背景モデル

デモ

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ

❖ キャラクタモデル：概要

キャラメイクを行うため分割で作成

顔、髪、上半身、下半身、追加パーツ

page.17

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ page.18

髪パーツ

５００～２０００ ポリゴン

上半身パーツ

１５００～２０００ ポリゴン

顔パーツ

５００～１０００ ポリゴン

下半身パーツ

１５００～２０００ ポリゴン

モデル全体で ３５００～７０００ ポリゴン

各パーツごとに ２５６ ｐｘ×２５６ ｐｘ

のテクスチャ １枚

パーツ概要

＋武器パーツ

１０００ ポリゴン以内

＋追加パーツ

５００～２０００ ポリゴン

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ page.19

髪パーツ ： 約７０個

髪色違いを含む

顔パーツ ： 約７０個

眼の色違いを含む

上半身パーツ ： 約２０個

男女合計

下半身パーツ ： 約２０個

男女合計

武器パーツ ： 約６０個

男女兼用

追加パーツ ： 約１０個

男女兼用

※ 個数はローンチ時のものです

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ

❖ キャラクタモデル：揺れもの

揺れもの

Ｕｎｉｔｙで設定

ＣｈａｒａｃｔｅｒＪｏｉｎｔ

ボックス型のコライダ

カプセル型のコライダ

モデルのボーンに設定

設定

シンプルな構造

破綻しないように

page.20

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ

❖ キャラクタシェーダー：概要

ランプシェードとリムライトの組み合わせ

４パターン作成

page.21

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ

❖ キャラクタシェーダー：作成フロー

アーティスト側で大まかに作ったものを最適化

１つのシェーダーをＵｎｉｔｙのインスペクタ上で調整

プログラム側でシチュエーションに合わせて適用

page.22

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ

❖ エフェクト：エフェクト概要

Ｓｈｕｒｉｋｅｎ

Ｕｎｉｔｙのパーティクル システム

アニメーション

３ｄｓＭａｘから モーションデータを出力

スクリプトでの拡張

メッシュの３軸スケール

メッシュのビルボード対応

page.23

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ page.24

エフェクト例

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ page.25

エフェクト例

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ page.26

エフェクト例

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ page.27

エフェクト例

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ

❖ 背景：バトル用背景概要

バトル用の背景

１種類×４パターン

闘技場

昼、夕、夜、雷雲

page.28

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ page.29

約 ７５００ ポリゴン

テクスチャ ４枚

ライトマップ １枚

（５１２ ｐｘ×５１２ ｐｘ）

バトル用背景

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ page.30

バトル用背景

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ

❖ 背景：冒険用背景概要

冒険用の背景

４種類×３パターン

街、草原、森林、荒野

昼、夕、夜

page.31

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ page.32

約 １５００ ポリゴン

テクスチャ １枚

（２０４８ ｐｘ×１０２４ ｐｘ）

冒険用背景

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ page.33

冒険用背景

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ

❖ キャラクタアニメーション：概要

まずは３ｄｓＭａｘ上でのアニマティクス

目指すべきクオリティラインの設定を行う

ほとんどの動きを決定する

３ｄｓＭａｘ上で作成したアニメーションをＵｎｉｔｙへ

アニメーションをカットごとに出力

ボーンのみのデータ

page.34

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ page.35

３ｄｓＭａｘ アニマティクス例

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ page.36

３ｄｓＭａｘ アニマティクス例

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ

❖ カメラアニメーション：概要

カメラアニメーションをＦＢＸで出力

通常ＦＢＸではカメラアニメーションは出力できない

ボックスにアニメーションを移して出力

社内で専用のスクリプトを作成

ボタンひとつでカメラアニメーションを出力できる

３ｄｓＭａｘ（出力用）、Ｕｎｉｔｙ（入力用）の２種類

page.37

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ

❖ Ｕｎｉｔｙ上での組み立て

インスペクタ上で組み立て

Ｕｎｉｔｙのインスペクタ上で設定

モーション、モデル、エフェクト、 トレイルなどを登録

アニメーション時に呼び出す

確認用シーンで再生、確認

page.38

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ page.39

バトル例

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ

開発上の 問題点と解決方法

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ

❖ 開発における問題点

page.41

1 カメラアニメーションのインポート

2 外部データ（ＡｓｓｅｔＢｕｎｄｌｅ）の作成方法

3 描画負荷

4 解像度

5 ｉＯＳ/Ａｎｄｒｏｉｄ固有の問題

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ

❖ カメラアニメーションのインポート

２種類のツールを作成

３ｄｓＭａｘでワンボタンで出力するツール

Ｕｎｉｔｙでのインポート時に設定するツール

ダミーのボックスを利用

キーフレームアニメーション、パース、クリッピング情報を ダミーに格納しておく

page.42

カメラアニメーションを簡単にＦＢＸとして 出力してＵｎｉｔｙに読み込みたい！ PROBLEM

問題

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ

❖ 外部データの作成方法

ツールを作成

シンプルなエクスポーター

選択したフォルダ内や ファイルをエクスポートする

カードやモデルの 外部データ化に利用

page.43

Ｕｎｉｔｙ上で外部データ（ＡｓｓｅｔＢｕｎｄｌｅ）を 簡単にエクスポートできない！ PROBLEM

問題

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ

❖ 描画負荷

こまめなリダクション作業

各端末で繰り返しチェック

モバイルシェーダーの利用

シェーダーの軽量化

モデルやテクスチャの軽量化

コリジョンの設定を変える

page.44

ハイクオリティな表現は描画負荷が大きい！ PROBLEM

問題

端末 チェック

リダクション

ビルド

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ

❖ 解像度

ｉＰｈｏｎｅ４基準で 色と解像度を決定

９６０ｐｘ×６４０ｐｘ を基準に

拡縮処理と黒ベタでの 塗りつぶしで対応

page.45

ｉＯＳとＡｎｄｒｏｉｄは解像度が違う！ PROBLEM

問題

９６０×６４０ ８００×４８０

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ

❖ ｉＯＳ/Ａｎｄｒｏｉｄ固有の問題

端末ごとのチェックが必要

ｉＯＳ/Ａｎｄｒｏｉｄ端末ごとの個別のチェック

ＧＰＵごとのチェックが必要

表示が崩れる、クラッシュする など

こまめな端末チェックが重要！

page.46

ｉＯＳとＡｎｄｒｏｉｄ同時リリース！？ PROBLEM

問題

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ

おわりに

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ

❖ まとめ

初めてのスマートフォン開発でも 自分たちの持ち味を活かすことに成功！

３ｄｓＭａｘを利用したワークフローをスマートフォンへ

反省点

Ａｎｄｒｏｉｄへの対応

早い段階からのチェックや検証

内部データ（アプリ内）と外部データ（ＡｓｓｅｔＢｕｎｄｌｅ）

外部データの読み込みに時間がかかる

内部データと外部データのバランス

page.48

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ

❖ 感謝

Ｕｎｉｔｙ様には色々とご相談に乗っていただき、 ギルティドラゴンの助けとなりました

Ｆａｃｅｂｏｏｋのグループ 「Ｕｎｉｔｙユーザー助け合い所」はとても参考に なりました http://www.facebook.com/groups/unityuserj/

この場を借りてお礼申し上げます

page.49

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ

質問等ありましたら…

t_sugikami@cc2.co.jp

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ

なお、本講演の内容に関する記事が

月刊 ＣＧＷＯＲＬＤ １２月号 （２０１２年１１月９日 発売）

に掲載されております！

(Ｃ) .ｈａｃｋ Ｃｏｎｇｌｏｍｅｒａｔｅ (Ｃ) 2012 ＮＢＧＩ

ご清聴ありがとうございました