Weekly email of our best stuff
Hello and welcome to contact us page at eProfits
How can we help you today?
Wireframing is the initial usability mockup for your application. It should be straightforward, intuitive, and exha...
Wireframing is the initial usability mockup for your application. It should be straightforward, intuitive, and exhaustively detailed. Though you’ll need to perform multiple wireframes for your application as you move further into development, each time you undergo the process should be quick and easy.
In under 20 minutes you can determine everything that your application needs to optimally function.
You can’t go into designing a mobile app halfcocked. You need to do a little research ahead of time. Take a look at either Apple’s or Android’s design guidelines for some ideas on how your app should look and flow.
Next you’ll need the proper tool for wireframing. Balsamiq, Proto, and Mockingbird are all fast and easy tools that can help you on your way, use these programs or others like them to get your wireframing done in a hurry.
Initially though, you’ll be sketching your ideas out on paper, so don’t worry about learning a new program just yet.
You have two options.
1. Epicenter design - in which you build the core function/content of a page first and then build navigation and branding around it.
2. Linear design - where you begin at the home screen and move through the application’s user flow.
The latter is more prevalent, and it is what we will be focusing on in this article.
Begin by drawing your home screen on a sheet of paper:
Determine where your logo, navigation controls/buttons, and the core functionality will be placed.
Lay them out.
You need two sets of navigation controls, one to your application features and the other to the user’s personalized settings.
Repeat these steps for each additional screen in your user flow, according to your application’s functional complexity.
Estimated time: 10:00
Now you’ll take your ideas and translate them into digital reality using one of the previously-listed tools. Each program has its own interface, but all are simple, easy, and swift to apply.
Use this time to revise any issues with buttons or flow that may not translate as cleanly as you’d imagined. Once you’re done, you’ll have the scaffolding for a fully functional mobile app!
Estimated time: 9:59
Total estimated time: 19:59
Share your favourite wireframing tools and techniques in the comment section.