Making a mobile app? This is how to make sure it works well.

Posted on Oct 4, 2012 - 9:00 AM PST

This guide is based on Mixergy’s course with Jen Gordon.

Jen Gordon knew creating mobile apps was a complicated process, so she made it simple to make killer apps that sell. It was all done using her mobile app design system, so we invited her to teach you how to do it.

Jen is the founder of Design Boost, which trains web designers, app developers, and entrepreneurs who want to create beautiful and usable mobile apps.

Here are the actionable highlights from the course.

1. Identify your target users to come up with an intuitive and useful app

Jen says Coffee Spot, an app that helps people find the closest coffee shop, targets users who are driving to work, are on a coffee break, or are buying coffee for co-workers.

Take Action:
Determine what your app does and who it’s for, and create scenarios for how it be used by considering your target users’ probable personalities, jobs, and lifestyles in detail.


2. Lay out your app’s screens to decide what features to add

Jen laid out the Coffee Spot screens associated with each of the three types of users, went over the features, then checked her budget and decided that the WiFi option could wait.

Take Action:
Create layouts that show the content and order of your app’s screens, and prioritize features that your intended users will find most useful.


3. Make a paper prototype to figure out what’s missing in your app

Jen asked friends to look at her paper screens for Coffee Spot and “use” it as they would use the actual app to see which features were missing or if any screens were out of order.

Take Action:
Create sketches of your app’s screens, ask people who don’t know a lot about the project to “use” it, and get their feedback to find out if anything’s missing or ordered wrongly.


4. Create an app mock-up to get feedback from collaborators

Jen used iPlotz to make Coffee Spot’s wireframe and get feedback about the layout and screens from collaborators.

Take Action:
Sign up for an iPlotz account, create a new iPhone or iPad project, make the full wireframe for your app’s screens, and use iPlotz’s collaboration feature to invite others to comment.


5. Render your app screens digitally to test proportions and tweak colors

Jen showed her designer the iPlotz wireframe and asked him to create app screens that she could load on her iPhone so she could see if the color and proportions were rendered right.

Take Action:
To find a designer, go to Dribbble.com, type “iPhone” in the search bar, contact designers who are suitable for your app, and then have the designer create screens for your app’s intended platform.


6. Communicate with developers to get the product you want

For an app that loads long lists of data, Jen told developers to add a progress wheel and to add the option to let users load data manually or automatically.

Take Action:
Consult with developers early in the design process, explain what problems your app should solve, and tell them what features you want.


7. Plan how you’ll generate revenue so you can build your app accordingly

Jen plans to make money from Coffee Spot by selling a pro version and by releasing a free ad-supported version.

Take Action:
Decide if you’ll make money from straight-pay downloads, advertising, or in-app purchases, and work with your developer to integrate this strategy into your app.


Want to make sure you get results?

Written by Hazel Chua, based on production notes by Jeremy Weisz

  • http://www.mobileapptycoon.com/ Thomas @ Mobile App Tycoon

    Interesting tip about using iPlotz. Never heard of that before but I’m definitely going to check it out. Up until now I’ve just used Pages for Mac to make some mockups for developers.

    Thomas

New Here? Start With These