Dr Ralf Speth, the former CEO of Jaguar Land Rover famously said, ‘If you think good design is expensive, you should look at the cost of bad design.’
Whether you are looking to take your ideas out of your own head and commit them to paper, or create some beta designs in order to start looking for investment. UI, UX and wireframing (for the sake of this article, let’s call this design) is one of the most crucial stages in the app development process.
Design is where you see your ideas come to life, where you can theoretically test the validity of your idea and start mapping out the flow of your product before you actually start development. This part of the process is extremely important and the first step in creating a successful app. As development can be expensive and time consuming, you want to make sure that you are happy with your UI before you take the leap into the beautiful world of the app store.
Good design means there is clear communication and understanding between the end user and the app. If you are experiencing a good app, it just feels easy. You know where everything leads, the product feels intuitive and you as the end user is not frustrated with the product
Where do I start with app design?
This question takes me back to a time when I first started my career, 7 years ago. I am on the first day of my new Marketing Assistant job, sitting in front of a blank Photoshop file on my new 27 inch PC. I’m trying to grasp what my Marketing Manager had just briefed me about. I had no idea where to start. None.
Before landing the job I was a student, graduating with a Bachelor of Business, majoring in Marketing. So what did I know about design? Most university courses only teach theory. They teach you to hire a graphic designer and launch your million dollar idea into the sky, but not how to use design tools or even what makes a successful design. I remember I did some work in Microsoft Excel with Statistics but not Adobe Suite, not even close.
Fast forward 7 years and I can say now that design is a learned experience. Design is about solving problems.
And you too can create solutions to the problems you face by following this simple process that I adhere to when designing anything. Of course I will be applying this framework to app design specifically.
It can be easy to just jump straight into the pretty stuff. But, try not to get distracted by the pot of gold at the end of the rainbow, instead focus on the journey you need to take in order to get there.
Flow can be as simple as a hand drawing in a notebook. Think about the screens on the app and the purpose of each individual screen. Sign in, sign up, initial welcome, home page, news feed, my account? And then how does a user navigate to these pages? Through the menu bar? From another page? How do they navigate away? If there is a trick to it then the UI and design process is ultimately broken.
Mapping out your flow is essential and does not need too much thought. But once you are happy with a flow you can begin to apply your design. Be purposeful in your flow. It is always best to keep it as simple as you can instead of trying to overcomplicate.
Remember that every design begins with an even better story. Creating a great user experience is all about telling that story and bringing things to life.
Wireframes are definitely one of my favourite parts of the process. I use Adobe XD to design all applications as the system is intuitive. But, if you are just starting out and looking for a way to get the ball rolling, Canva is a fantastic free tool.
When wireframing it is important to keep the styling consistent and use common elements. Create patterns throughout the design. This is crucial as once a user learns how to do something, they will be able to apply this throughout other areas of the app.
Testing an app design
Remember, most business models come from self interest rather than user experience. A design is not done until it has been tested.
Once your User Interface and designs are complete, you need to start showing this off to others. Don’t be afraid of feedback. Feedback now is cheaper than feedback later. Focus particularly on how all the elements together influence the flow and experience of the app.
Of course we are not going to go too deep into development here. But the final stage in testing your flow, wireframes and subsequent UI is to develop your app and put it to the real test. Let that theoretical baby bird spread its wings and find its own way in the world.
You can mother your app as much as you want, but without development and a beta app, you can not gauge the real success of your product.
Design in the app space is admittedly hard, it takes years of experience working with a range of industries and in depth knowledge of mobile app development. But do not let this deter you from starting to map out the flow and design for yourself. Start thinking about how you want your users to experience your app and start asking yourself the hard questions.