iPad Educational App Tutorial: PrequelPosted: June 2, 2012
How To Create Your Own iPad Learning App
With this post I am going to begin a 9 part tutorial on creating a simple iPad learning app.
I created my first iPad app to help me learn Chinese characters (Hanzi). As a student of the language, I find it helpful to go after this ambitious learning project from many directions. Language study involves speaking, listening, reading and writing, and each can be daunting — even without the challenge of learning a language that is tonal (if yours is not) or uses a completely different writing system. As an advanced beginner, I have some basic vocabulary, and having studied reading and writing, I have a basic knowledge of strokes and characters, but this (along with pronunciation) is my weakest area. Hence this App.
My App will be a relatively simple one, something that uses a “game board” with “word tiles” and “picture tiles”. As flash-card type prompt will require selection of a corresponding word or image, and there should be “hints” to help reinforce the learning. In fact this topic (learning characters is somewhat daunting, so I have also written a companion book for study.)
While the App is relatively simple, it is not a “Hello World” app or something a first time programmer or even a novice on this Platform will want to use to learn Xcode, to understand what UI Kit is, and to learn how to build and deploy an app to the store. For these basics, I highly recommend a good beginning book such as “iPad Apps for Dummies” and the like. Here is a link to a page that lists the basic books I used to get started — where the books walk you through step by step how to use Xcode, how to become an Apple Developer if you want to sell your Apps, and how to create, compile, debug and test a basic App on both your device and in the simulator. This tutorial is not intended to replace or compete with these materials. Finding a good, working example complete with source code and an explanation, as several others have done (see the links on this blog), is far and away the most useful sort of training I have found once I got past the basics.
Back to the basic choice of how to create and App for iPad — what sort of ‘instructional designs’ should we consider? If you’ve spent any time at all looking at the zillions of apps out there, it is clear there are many choices and approaches to learning software and games. For learning to recognize Hanzi, I developed a learning design that was a hybrid of “flash cards” and the familiar “memory” game. I also wanted a design that lent itself to pairs of users that were helping each other — so that a Chinese speaker could practice English, and an English speaker could practice recognizing Chinese. I was also deliberately laying the groundwork for apps for learning words in other languages and for speakers of other languages. More about my specific instructional design is here.
As this App was my first commercial iPad product, I think it is suitable for other newbies learning the Xcode, IOS, ObjectiveC platform. And for this reason the basic application design pattern selected was a) a “View” app, or one with a single playing surface (and pop-over windows for things like help, instructions, some settings, etc.) and b) based on “UIKit” or simple user interaction controls. Programming using UIKit and Apple’s built-in User Interface Controls is the most basic way to interact with IOS users; other approaches include “2D graphics” — like pinball / arcade style games and “jumper” games where a game figure is moved through “levels” and around the screen (in 2D or 3D). I have an arcade-style game in process that uses the CoCos2D graphics package libraries, as well as the Box2D physics package (so that game elements can interact with each other the way physical objects do, without each developer having to invent the code for gravit, for bouncing off surfaces, for collision detection, and whatnot). There are some good tutorials for these sorts of games out there — see the “blog roll” and sites I link to from this blog for good examples. Such games are a good bit more complex, so doing a simple UI Kit based app is most often where new developers start.
The app I will cover in this tutorial is already in the store — you can find it as “Chinese Words 4 Beginners” at this LINK. I will also make arrangements to have the source code available for interested learners. The plan for the tutorial is something like this:
- Structure of a UI Kit-based View app
- Laying out the game board
- Creating and using Data
- Creating and using images
- Controlling Game play
- Adding scoring and top scorers.
- Adding help and demo video
- Gestures, animation, application settings
If you have any questions or specific suggestions before I start, feel free to send me a note. A link to info about this app specifically is located here. [You will also find a low-res PDF file of the companion book for learning Chinese characters at this page.] A link to the web site for this entire family of Apps — word recognition and learning for Japanese, Korean and Chinese for English, French, Spanish, Italian, and German speakers, and in fact every combination of any two of these languages, is located here.