Game Development with QML The slide deck from my talk at Nokia Developers Workshop (28029 Feb 2012) in Islamabad-PK. You are free to download and modify this presentation howerver, if you are going to use this PowerPoint presentation, kindly mention me as the original author of the presentation.

1. Game Development with
QML for Nokia Devices
By Faisal Iqbal – Mobile Specialist

2. About Me
 Faisal Iqbal a.k.a. chall3ng3r
 Adobe Flash, MS .Net, Nokia Qt
 10+ Years Professional Experience
 6+ Years with Mobile Technologies
 Nokia Developer Champion for 5 Years
 Won Local and International Mobile Dev.
Contests

3. Highway Racer on Nokia Store

4. Some Achievements
 Highway Racer
 Developed in 1 Month - Graphics + Game Engine
 Aug 2011 – Released on Nokia Store (previously
Ovi)
 September 2011
Won Nokia & P@SHA MakeMyApp Challenge
2011
 Feb 2011 – Over 280,000 Downloads!!!

5. Agenda
Workshop  Introduction to QML
Day 1
 Games Development with QML
 -- Lunch Break
 QML Plugins for Game
Development
 -- Tea Break
 Lets Make a Ping Pong Game

6. Introduction to QML
- Qt and Qt Quick Platform Overview
- Future of Qt Quick

7. Qt and Qt Quick Platform
Overview
 Qt - Released publicly in 1995 by Trolltech
 Popular on Embedded platforms & Linux (KDE)
 2010 - Nokia Qt SDK v1.0 was released (Qt
4.6)
 Qt Quick runs QML, introduced with Qt 4.7 -
2011
 QML = Qt Meta Language / Qt Modeling

8. Qt Quick - QML
 JavaScript
import QtQuick 1.0
 CSS
Rectangle {
 GUI Layer for Qt Apps id: canvas
width: 200
 Animations and Transitions height: 200
color: "blue"
 Fluid UI Performance Image {
(60FPS) id: logo
source: "pics/logo.png“
 Media APIs anchors.centerIn: parent
x: canvas.height / 5
 Qt Mobility APIs }
}
 Qt C++ Plugins

9. Future of Qt Quick
 More Platforms like QNX, Android, iOS and maybe WP ;)
 Qt5 (summer 2012)
 Powerful and high-performing C++ API
 QML as the best way to create rich interfaces
 Qt Quick 2 in Qt5
 QML is our bet in "the next step in GUI programming"
 Should apply for most use-cases
 Qt Quick 2 uses the Google V8 Javascript Engine
 Superfast JS support
 Architectures: x86, x86-64, ARM

10. Future of Qt Quick – Continued…
 Qt Quick 3D
 QML bindings for Qt3D
 Access to OpenGL and 3D graphics hardware
 QML Item3D elements live in 3D space
 OpenGL, 3D hardware, and C++ convert this to 2D on screen
 Desktop support will continue to exist
 Qt Quick components for Desktop are ready
 Qt Webkit in Qt5
 Webkit 2 architecture

11. Game Development with QML
- QML User Interface Elements
- Graphics Performance
- Transitions & States

12. QML User Interface Elements
 Basic UI Elements
 Containers or
Layout Managers
 Views or Pages
 Lets see in
action…

13. QML User Interface Elements –
Cont.
 Qt Quick
Components
 More Components
 Streamline
Presentation on
Meego and
Symbian
 Lets see in

14. Graphics Performance
 Smooth & Fluid
 vs J2ME
 vs Flash Lite
 vs HTML5 Apps
 Lets see in
action…

15. Transitions and States
 Built-in
 Easy
 Customizable
 Lets make some…

16. QML Plugins for Game Development
- Box2D QML Plugin - Basics
- Sound Engine

17. Box2D QML Plugin - Basics
 What is Box2D  Why Use Box2D
 Basic Concepts  Examples
 World  Angry Birds
 Bodies  Moto Trial Racer
 Joints  Flying Bus – (No
 Lets play… Box2D)

18. Sound Engine
 Qt Game Enabler
 Lets play…

19. Lets Make a Ping Pong Game!
- Sketching Storyboard
- Defining and Locking Features

20. Features & Sketching Storyboard
 Pencil and Paper  Splash Screen
 Write Everything  Main Menu
 Lets Draw…  Level 1
 Pause Menu
 Level End

21. Lets Talk – Q&A
Contact Me:
 Web: chall3ng3r.com
 Email: ifaisal@orison.biz
 Twitter/FB/Skype: chall3ng3r

22. Go home, but remember to come back tomorrow!

23. Agenda
Workshop  Coding Ping Pong Game
Day 2  Adding Finishing Touches
 -- Lunch Break
 Preparing for Publishing
 -- Tea Break
 Advance QML Tips & Tricks
 Closing Notes by P@SHA and Telenor

24. Coding Ping Pong Game
- Setting Up Qt Creator Project
- Box2D World and Bodies
- Game Logic

25. Setting Up The Environment
 New Qt Creator Project
 Box2D Libraries and Plugin
 Game GUI
 Game Logic

26. Adding Finishing Touches
- Sound Effects and Music

27. Sound Effects and Music
 Qt GameEnabler
 Online Sound Libraries
 http://www.freesound.org/

28. Preparing for Publishing
- Developer Signing and On-Device Testing
- Icons and Packaging

29. Developer Signing
 Visit: http://publish.nokia.com/
 Request UIDs from Nokia Publisher Team
 Install CODA and PerfMon on Device
 Sign and Test On Device

30. Icons and Packaging
 PNG and SVG-Tiny
 SIS for Symbian OS
 DEB for Meego OS

31. Advance QML Tips & Tricks
- Content Protection
- OpenGL GPU Acceleration
- Nokia Remote Device Access

32. Tips & Tricks
 Content Protection
 Decompress SIS
 Embed Code
 OpenGL Acceleration
 Nokia Remote Device Access

33. We Made It – Thank You
Contact Me:
 Web: chall3ng3r.com
 Email: ifaisal@orison.biz
 Twitter/FB/Skype: chall3ng3r