Cocos2d Mac Game Hello World Cocos Creator Tutorial

Cocos2d Mac Game Hello World Cocos Creator Tutorial

Cocos2d Mac Game Hello World Cocos Creator Tutorial

We are revisiting a “Games Development” topic today, but games involving the possibility for “heavy” graphical usage, by channelling the first Hello World chapter of a book we really like called Cocos2D Game Development Essentials by Ben Trengrove (ISBN: 978-1-78439-032-7). You may recall a previous Cocos2D Hello World scenario we presented earlier with Cocos2d Mac Xcode Game Development Primer Tutorial featuring MacBook Pro (Mac OS X) Xcode IDE work involving a GitHub project found on the “net”. Today, we’re signing up with the excellent Cocos2d-x portal … thanks … after having installed the wonderful Cocos Creator game development software where we create a Hello World style mishmash of a few GUI components and …

  • public web server link to the game … after having proved it could exist (ie. ‘published’) as a …
  • MAMP (Apache/PHP/MySql) local web server version at, what was for us, on our MacBook Pro represented by URL HTTP://localhost:8888/Cocos2DHelloWorld/build/web-mobile/ … via some (Mac OS X) Finder application copying of files after the development, via Cocos Creator IDE, from its …
  • Cocos Creator local web server HTTP://localhost:7456/ Hello World “game”

The start of our Cocos2D Cocos Creator Hello World “journey” (you can get a feel for with today’s PDF slideshow presentation) today was with this …

  1. great and useful webpage (thanks) … leading us through …
  2. installs (via web browser downloads) made up of two parts, that being the install of Xcode Cocos2D templates via a downloaded setup.py (that needs more work) and the install (via a Disk Image File (yay!!!) *.dmg on Mac) for the Cocos Creator IDE (involving joining up with the Cocos2d-x portal) and (Mac OS X) Finder copies and (Mac OS X) Terminal …

    sudo mkdir /Library/Cocos2D

    … as, for us, the place to copy Cocos Creator (IDE) application to … and then the slideshow goes on to show …
  3. Cocos Creator IDE functionality for Inserting GUI Components (including a webview and sprite), Creating a Scene and (slideshow doesn’t show, but there is Saving a Scene also) and Project -> Play on Device (which, for now, is this MacBook Pro … but stay tuned for later blog postings here) to HTTP://localhost:7456/ … and implied …
  4. (Mac OS X) Finder copies in order to be able to access in a web browser via MAMP local web server HTTP://localhost:8888/Cocos2DHelloWorld/build/web-mobile/ … and implied …
  5. FileZilla (sftp) copying of relevant MAMP local web server files over to the public web server link to the game

We hope the PDF slideshow presentation is of some benefit to you, thinking about getting into Cocos2D Game Development.


Previous relevant Cocos2d Mac Xcode Game Development Primer Tutorial is shown below.

Cocos2d Mac Xcode Game Development Primer Tutorial

Cocos2d Mac Xcode Game Development Primer Tutorial

Games development involving “heavy” graphical usage usually requires more than you can do very professionally with Javascript client code in a web application that we did, last, for Star Proteins versus Superbugs Game CSS Tutorial, and if you read that tutorial we did say …

The “shoot ‘em up” aspects are, as you’d expect from a properly spent youth not playing Space Invaders, lame … oh so lame … just an HTML hr (horizontal rule) element so far. It’s early days. Though wouldn’t count on too much here, and it is better to get the atmospherics by devoting your time to a gaming platform like Cocos here.

… and point you towards the Cocos games development framework, as an initial idea as to how to become more serious. We discovered Cocos for the first time in a Windows 10 environment with Visual Studio 2015 Express IDE usage that we talked about, below, with Cocos Open-Source Game Development Primer Tutorial.

Today, we do some rudimentary Cocos2d games development framework work, but this time the environment is Mac OS X Yosemite (Version 10.10.3 (14D136)) on a MacBook Pro laptop under the auspices of the Xcode IDE (Version 6.4 (6E35b)).

Initial research and development on this topic on the net led us to this GitHub cocos2d-objc repository … thanks … used to interface to Xcode and Objective-C coding on a Mac OS X environment, though other iOS type platforms work with this repository as well.

The major installation steps involved …

  1. Terminal application “cd” to place of interest to place an Xcode cocos2d project, then type, as per the advice at the bottom of that previous link’s webpage …

    $ git clone --recursive https://github.com/cocos2d/cocos2d-objc.git
    $ cd cocos2d-objc

    … (or clicking “Clone or download” button on that previous GitHub link, could be another option that is like the first command above)
  2. Open Xcode
  3. File -> Open (we made a copy of) cocos2d.xcodeproj
  4. Select “cocos2d-tests-mac” from the Schema selection list … again as advised near the bottom of the webpage of that previous link
  5. Product -> Run … compiles and builds, hopefully successfully, then executes various testing scenarios useful to spark your imagination about where to go next …

… and as far as “where to go next”, especially if you are new to this, you may need any/all of …

  • seek out Open-Source free cocos2d Xcode Objective-C source code
  • sign up for a cocos2d Games Development course
  • get yourself a good reference book, and we ended up buying “Learn cocos2d Game Development with iOS 5″ by Steffen Itterheim and Andreas LΓΆw (ISBN: 978-1-4302-3813-3)
  • seek out the expertise of Game Developers out there, especially those with Mobile App development experience

So, as you can see, we hope, this is a big topic, with large amounts of expertise required, so we wish you luck on your endeavours, learners and experts!

We’ll leave you with a “stream of consciousness” view of our early days Cocos2d endeavours on Mac OS X and Xcode with this PDF slideshow.


Previous relevant Cocos Open-Source Game Development Primer Tutorial is shown below.

Cocos Open-Source Game Development Primer Tutorial

Cocos Open-Source Game Development Primer Tutorial

Games development is huge on the net, and so there are good reasons to get into “Open-Source” for collaborative purposes and to pick the brains of experts in forums and blogs and chatrooms about what is good and what is a waste of time.

In our recent foray back into the Visual Studio world, we shaped to try out what was on offer with Visual Studio Express 2015 on Windows 10 related to a Games project, and stumbled on the “Cocos Open-Source Development System” based on the “Cocos2d Framework” information from Wikipedia (thanks) …

Cocos2d is an open source software framework. It can be used to build games, apps and other cross platform GUI based interactive programs. Cocos2d contains many branches with the best known being Cocos2d-objc, Cocos2d-x, Cocos2d-html5 and Cocos2d-XNA. There are some independent editors in the cocos2d community, such as those contributing in the areas of SpriteSheet editing, particle editing, font editing and Tilemap editing as well as world editors including SpriteBuilder and CocoStudio.

We’ve got together a “Hello World” feeling of “stumbling along” getting a sample project to run an animation to dip our toes into the deep deep oceans of knowledge swirling around this topic … ie. we want you to know you can do it … and we don’t work for Nike?!

If clicking today’s tutorial picture is not your style, below, we’ve broken it into that approach’s two components …

  1. Preparatory installs and project creation and configurations … and …
  2. Running project’s animation in situ (recorded off a Windows laptop via an Android Phone Camera app’s Video option and emailed on and downloaded to MacBook Pro and uploaded to the website … so there, ngaaaaa! … sorry if you can’t play .mp4)

If this was interesting you may be interested in this too.


If this was interesting you may be interested in this too.


If this was interesting you may be interested in this too.

This entry was posted in eLearning, Games, GUI, Not Categorised, Operating System, Tutorials and tagged , , , , , , , , , , , , , , , , , . Bookmark the permalink.

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>