Successfully reported this slideshow.

Cocos2d-x公開講座 in 鹿児島

9

Share

1 of 43
1 of 43

More Related Content

More from Tomoaki Shimizu

Related Books

Free with a 14 day trial from Scribd

See all

Cocos2d-x公開講座 in 鹿児島

  1. 1. in 鹿児島 Cocos2d-x公開講座 ~基本講義&お試しハンズオン~ 株式会社TKS2 清水友晶
  2. 2. 清水 友晶 • 株式会社TKS2 スマートフォンアプリ開発 (iOS, Android, Windows Phone 8)  Webコンテンツ開発 • Cocos2d-xへの開発参加 Cocos2d-xを利用したアプリ開発 講演活動 執筆活動 • Twitter: tks2shimizu • Blog: http://tks2.net/memo • SlideShare: http://www.slideshare.net/doraemonsss • Facebook: http://www.facebook.com/doraemonsss
  3. 3. 販売台数比較 http://www.businessinsider.com/future-of-digital-slides-2012-11?op=1
  4. 4. プラットフォームのシェア http://www.businessinsider.com/future-of-digital-slides-2012-11?op=1
  5. 5. 時間別トラフィック http://www.businessinsider.com/future-of-digital-slides-2012-11?op=1
  6. 6. Angry Birds vs Nintendo DS http://www.businessinsider.com/future-of-digital-slides-2012-11?op=1
  7. 7. フリーミアムモデル http://www.businessinsider.com/future-of-digital-slides-2012-11?op=1
  8. 8. 収益Top200アプリ中ゲームが70% http://www.businessinsider.com/future-of-digital-slides-2012-11?op=1
  9. 9. これらから判ること • スマートフォン・タブレットは今後もしばらくは伸 び続ける • PCは仕事で利用、一般的にはスマートフォン・タ ブレットが利用される • 無料アプリでアプリ内課金を行うフリーミアムモデ ルが主流 • ゲームアプリの課金率が高い
  10. 10. と言うことは・・・ • まだしばらくは、スマートフォン・タブレット向け ゲームで稼ぐことができる
  11. 11. もう少し詳細に • スマートフォン・タブレット向けOSに対して、日 本ではAndroid, iOSが主流 • できれば両OSに対応したゲームアプリを開発でき ることが望ましい • AndroidとiOSのアプリをそれぞれ開発するには、 実装に2倍の工数が掛かってしまう・・・ • 1ソースでAndroidとiOSの開発ができれば効率が良 い • クロスプラットフォーム開発が可能なゲームプラッ トフォームがあれば良いけど、そんなのあるの?
  12. 12. クロスプラットフォーム開発可能な ツール・フレームワーク • Cocos2d-x Cocos2d-x • Unity •2Dゲームフレームワーク • Corona SDK •オープンソース(MIT) • Moai •高速処理 • Gilderos •メモリ周りの処理は不要 • Game Salad •ゲームエンジンを修正可能 •入門者から熟練者まで • JS / HTML5 framework • Titanium Mobile • Phone Gap
  13. 13. Cocos2d-xでどんなアプリが作れるの? • Cocos2d-xに使用例が紹介されている http://www.cocos2d-x.org/projects/cocos2d-x/apps
  14. 14. Cocos2d-xでどんなアプリが作れるの? • スマートエデュケーション おやこでスマほん(Android, iOS) AWS「スタートアップチャレンジ」優勝 IVS 2012 Fall Kyoto 「Launch Pad」優勝
  15. 15. Cocos2d • オープンソース • MITライセンス • 2Dゲームフレームワーク • Python • Windows, Mac, Linux http://en.wikipedia.org/wiki/Cocos2d
  16. 16. Cocos2d for iPhone • オープンソース • MITライセンス • 2Dゲームフレームワーク • Objective-C • iOS, Mac OS X http://en.wikipedia.org/wiki/Cocos2d
  17. 17. Cocos2d-x • オープンソース • MITライセンス • 2Dゲームフレームワーク • C++, Lua, Javascript • マルチプラットフォーム http://en.wikipedia.org/wiki/Cocos2d
  18. 18. Cocos2d-x対応プラットフォーム http://www.cocos2d-x.org/projects/cocos2d-x/wiki
  19. 19. 開発環境 • Android, iOS対応のアプリを開発する際の開発環境例 • Mac OS X  • Xcode (iOS向けアプリ開発) • Eclipse (Android向けアプリ開発)
  20. 20. Cocos2d-xをさわってみよう
  21. 21. Xcodeのインストール • Mac App StoreからXcodeをダウンロード&インスト ール
  22. 22. Cocos2d-xのダウンロード • Cocos2d-xの最新バージョンをダウンロード (ハンズオンは基本的に最新バージョンを用いて行います) http://www.cocos2d-x.org/projects/cocos2d-x/wiki/Download
  23. 23. Cocos2d-xを解凍する • ダウンロードしたzipファイルを任意のディレクト リに解凍します • ハンズオンではユーザのホームディレクトリへの解 凍をオススメします(解凍した場所を忘れなければどこでもいいんです) • ユーザ名がsumomoの場合、  /Users/sumomo へ解凍し  /Users/sumomo/cocos2d-2.1beta3-x-2.1.0 となります
  24. 24. テンプレートのインストール • ターミナル.app起動 アプリケーション > ユーティリティ > ターミナル • cocos2d-2.1beta3-x-2.1.0のディレクトリへ移動 cd cocos2d-2.1beta3-x-2.1.0 • install-templates-xcode.shの実行   ./install-templates-xcode.sh -u     強制インストールの場合 ./install-templates-xcode.sh -u -f
  25. 25. テンプレートのインストールに成功! • テンプレートのインストールに成功した場合は、次 のようなログが見られます
  26. 26. テンプレートのインストールに失敗する... • テンプレートのインストールに失敗する場合は、テン プレートの権限をチェックしてみましょう cd /Users/tomoaki/Library/Developer/Xcode/Templates ls -al • 所有者が別の人になっている場合は、所有者を変更し ましょう(変更しても問題ないか管理者に確認して下さい) chown -R tomoaki cocos2d-x
  27. 27. 新規プロジェクトの作成 • Xcode起動 • 新規プロジェクトの作成 cocos2dxを選択 • Product Name:HelloWorld  • 保存先: ホームディレクトリ(/Users/Sumomo)
  28. 28. Hello World • 作成されたプロジェクトをRun
  29. 29. ソースをいじってみよう
  30. 30. 表示する文字を変更する • HelloWorldScene.cppを選択 • 54行目の”Hello World”を好きな文字に変更しよう
  31. 31. 背景を動かしてみよう • 背景は66行目のpSpriteにて表示している • pSpriteに対して命令することで背景を動かすことが できる
  32. 32. 背景を動かしてみよう • 位置変更 pSprite->setPosition( ccp(0, 0) ); • 拡大・縮小 pSprite->setScale(2.0f); • 回転 pSprite->setRotation(90.0f); • アンカーポイント pSprite->setAnchorPoint( ccp(0, 0) ); • 透過 pSprite->setOpacity(127);
  33. 33. 別の画像に変更してみよう http://tks2.net/cat.png • Resourcesディレクトリに画像を配置する HelloWorld/Resources/cat.png • Xcode上に読み込む • ソースの修正 CCSprite* pSprite = CCSprite::create("cat.png");
  34. 34. Cocos2d-xの仕組み • 基本的なクラス • CCDirector ... アプリの中心 • CCScene ... シーン(画面) • CCLayer ... シーン中のレイヤー • CCSprite ... シーン中の画像など
  35. 35. Cocos2d-xの仕組み • プロジェクトには次のディレクトリがある • Classes • Resources • 最初に用意されているクラスは次の2つ • AppDelegate • HelloWorldScene
  36. 36. Cocos2d-xの仕組み • AppDelegateには次の関数がある • applicationDidFinishLaunching() • アプリ起動時に処理され、 アプリのセッティングを行う • 最初のシーンを呼び出す • applicationDidEnterBackground() • アプリがスリープする時に処理され、 アプリの停止を行う • applicationWillEnterForeground() • アプリ復帰時に処理され、 アプリの再開を行う
  37. 37. CCActionを使ってみよう! • オブジェクトを移動させてみる 2秒で画面右端へ移動する CCMoveTo* move = CCMoveTo::create(2.0f, ccp(size.width, size.height/2)); pSprite->runAction(move);
  38. 38. CCActionを使ってみよう! • CCAction • 移動 CCMoveTo, CCMoveBy • 回転 CCRotateTo, CCRotateBy • フェードイン・フェードアウト CCFadeIn, CCFadeOut http://www.cocos2d-x.org/reference/native-cpp/d7/d12/ classcocos2d_1_1_c_c_action.html
  39. 39. CCActionを使ってみよう! • 連続アクションを実行(同じアクション) CCRepeat, CCRepeatForever • 連続アクションを実行(異なるアクション) CCSequence • アクションを同時に実行 CCSpawn
  40. 40. CCActionを使ってみよう! • 指定時間待つ CCDelayTime • メソッドを呼ぶ CCCallFunc, CCCallFuncN, CCCallFuncND, CCCallFuncO • イージングを利用する CCEase~
  41. 41. 新しいシーンを表示しよう! • シーンの表示は、CCDirectorクラスが担当する • replaceSceneメソッド • pushSceneメソッド • popSceneメソッド • 画面遷移してみよう! CCScene* pScene = HelloWorld::scene(); CCDirector::sharedDirector()->replaceScene(pScene);
  42. 42. 格好いい画面遷移を! • CCTransitionScene • クロスフェード CCTransitionCrossFade • フリップ CCTransitionFlipX, CCTransitionFlipY • ページめくり CCTransitionPageTurn http://www.cocos2d-x.org/reference/native-cpp/d1/dc8/ classcocos2d_1_1_c_c_transition_scene.html
  43. 43. Cocos2d-xについてもっと知りたい! • Cocos2d-x実践講座 in 鹿児島 ∼少人数で実際にアプリ作りを体験してみよう!∼ • 1/19(土) 13:00~17:00 • http://atnd.org/events/35243

×