We have developed a template app that we can use for a whole series of apps to be published in the iTunes app store. The app series is will be word search apps and there will be several apps in the series, for example:
LDS Church word search
Valentines word search
Christmas word search
BYU sports word search
Tech World word search
American History word search
And more...
Most of the graphic design should be generic to the series rather than specific to the particular app we are building. We really want to be able to reuse most of the art and only change a few components that give the app its theme. Each app will also have a different icon. We would like you to design for the LDS app, while keeping in mind that we want a broad style. The icon for the LDS version is already created, and I've included it for reference, and can provide the graphics for design assistance if required.
I've included a couple mockups for explanation purposes only. I've also included some images to depict the overall feel we'd like to go for. This is a game. Word searches aren't exactly the most exciting apps out there, we'd like the design feel to give them as much excitement as possible.
The basic navigation of the app should match closely to our mockups, unless you feel confident that you have a better idea. Within an iOS app all buttons, logos, backgrounds, etc., can be swapped out easily, and all graphics support full-alpha transparent PNG files. Which should make it easier to stylize some elements (that could easily be changed to create a different theme.
We would prefer illustrator files (I like that Vector scales). Each image should be provided at double resolution, for a 640x980 screen.
The app will come with a few "packs" of word search puzzles. Each pack contains 5 puzzles (ranked in difficulty). The app will have a store where the user can buy more packs of 5 to play.
Imagine each pack as a world, or group of levels. Similar to the worlds in angry birds or the boxes in cut the rope. Angry birds and Cut the Rope have 16-25 levels in a pack/world. Our app will only have 5.
Your main job is to decide on a paradigm for how to display these packs. They should be enticing to the user, and should be designed in a way that makes them want to buy more.
You could imagine little magazines, or newspapers, 3D boxes of words, or any other level pack icon you could imagine. They could even be attractive roundrect squares like in Angry Birds, just so long as they are enticing.
In its simplest form, your decision on the app packs will give you direction on everything else:
- If you decided on newspapers or magazines, you could show a coffee table for the selection screen, and a news rack for the in app purchase screen.
- If you decided on a word search book for the whole app, the icons for the packs could be displayed in a table of contents page of the book.
- If you decided on books, you could display a wooden desk for the main screen, wooden home bookshelf with empty shelves (begging to be filled) for the selection screen, and a bookstore for the in app purchase screen.
- You could have roundrect square icons that are stylized for the theme. They could be war battered metal for American History, or shiny ornaments for Christmas.
- It doesn't have to be skuemorphic, you could just use leather, wood and paper textures. Or even go with no textures with a MetroUI look.
One of the most important things is that your design should be flexible enough for us to quickly and easily modify for the other themes we have created.
The app has a few functions that should guide the navigation and layout of the app (some of them already discussed): In-App Purchases, Game Center Scoring, Newsletter signup, and advertisements. These functions are on top of basic game level selection, and play.
You should be able to accommodate these functions in 4-5 basic screens.
- A screen for navigation
- A screen for selecting games already purchased, or buying new game packs. (could be one screen or two screens)
- A game play screen
- An info screen
1. App Home Screen
The opening navigation screen would contain:
- 'Play Now' button
- 'Get more Puzzles' (screen or button to point to in app purchases)
- 'GameCenter and Friends' button
- 'Info' button
2. Level Selection Screen
The Puzzle Selection Screen(s) would be similar to a level selection screens in other apps, including a distinction for completed word searches.
The layout of the screen would depend on the icons you imagined for the level packs. A couple ideas could include pages of a word search book, or shelves of word search packets or even floating icons/boxes like angry birds or cut the rope. In this sense, you could add the main navigation of the app if it fit well. But I don't want the UI cluttered.
Main information that needs to be displayed on this screen:
- 'Name' of puzzle pack
- Area for a 'Preview' of the word selection or puzzles in the pack
- 'Completion' of Puzzle pack (fully or partially)
- Option to 'Reset' a level pack (it will recreate a new and reorganized word search.
- 'Available for purchase'
- 'Score' or star rating.
So, to be clear, this screen should have three distinct looks for different word search 'levels'. 1) Completed 2) Not Completed 3) Available for Purchase.
As such, it could be a couple screens, one to display in-app purchases and another to display packs they have on the device similar to library/store in iBooks.
For example, you could have a physical desktop that had purchased packs on top of it for the user to select on one screen (nicknacks on the desk to show the style: holiday, sport team, etc.) and then a bookshelf that displayed packets available for purchase on a different screen.
3. Info Screen
This would basically be our catch-all screen for newsletter, settings, and to promote our other apps. Feel free to use pop-overs.
Main elements of screen:
- 'Newsletter Signup'
- 'Share of Facebook/Twitter'
- 'App Settings'
- 'You May Enjoy Our Other Apps'
4. Gameplay Screen
Obviously the most important is the Word Search screen. In your design, please include how a 'found' or 'highlighted' word would appear.
This screen should display the nature of the app theme (holiday, sports team, technology, etc.) but should still be very simple. It could be guided heavily by the icon you chose for the pack - similar to how cut the rope uses the boxes to determine the background of the game play view. If you chose newspapers or magazines, the view could have the texture of a newspaper page.
We would like to be able to easily show a unique background to distinguish each puzzle pack within the app, or even appstyle-to-appstyle, we look forward to seeing your creativity with this screen.
Main elements of screen:
- Area for 'Name' of puzzle
- Large puzzle area
- 50pt empty space along the bottom for advertisements
We are very excited to see your LDS designs. These apps have been sitting on our computers waiting for submission to the app store for a long time, we just couldn't figure the design out.
I've included a number of iconic LDS images for you to use as you prepare your design work. Remember, these can be knickknacks or just inspiration. Churches don't have crosses, books are a big deal. The look of this app could just be classic, doesn't have to distinct. Something small to distinguish it from the other themes.
Good design might include:
- dark oak wood background
- deep colors
- church or temple graphics
- spotlight, or lamp lighting
- sunbursts
- a book of mormon, or triple combination
- magnifying glasses
- a pen, or red colored pencil
- suit and tie
- Missionary name tag
Major church icons (not necessarily used):
- Square wood ended church pews
- Silver sacrament trays
- Red brick church and white pillars
- single tall steeple
- Wooden pulpit
- Large pipe Organ (behind the choir and pulpit)
Images included:
- picture of inside of an LDS church for reference
- picture of outside an LDS church for reference
- Angry Birds world selection screen (example of selection screen)
- Books and wood icon (possible color scheme - not required)
- Missionary Tags
- Angrybirds start screen
- cut the rope game screen. (even though the level is simple, the graphics in the background make it look more fun.
- Fruit ninja level complete screen.
- LDS app background - (example texture and color)
- another Angry birds selection screen example
- Word search example - (not a very good one, cheesy and boring)
- Fruit ninja game screen. (an example of lots of fun because of the graphic background.
- Cut the rope selection screen.
- LDS Library example
- Cut the rope start screen
- Book of mormon (old version)
- Cut the rope levels within selection screen (we will have 5 levels in each pack.)
- Book of mormon
- Cut the rope completion screen. Love the simplicity and design.
- Cut the rope start screen. Very well designed, and has the same elements we'd like in ours. You don't need to have big buttons like Cut the rope, or small ones like Angry birds but these are successful examples.
- Fruit ninja start screen. Another completely unique start sreen. Similar required buttons.
I've included the ideas I've had and some images for reference. You don't need to add all, or any of these things into the design, I'm just giving you a reference to things that our LDS users would see, and recognize immediately. I have in my mind that these icons will be helpful to you in your design, but don't feel limited by them.