How do you design a User Interface for an exercise app? Today I will walk through the process of designing a custom concept for an iOS running app. Learning UI Design can be hard when you are a beginner, but it doesn't have to be so complicated. In this design tutorial, I will take you step by step through the concept, creation, iteration and completion of a simple UI, using The popular design software Sketch for mac.

////////// Want the starter file? Sign up and become a member for access to this file and other just like it as well as monthly live streams, behind the scenes footage, and more
https://designchamps.io/hip

Remember to Subscribe https://goo.gl/6vCw64 🤘

Through the design tutorial, I am going to be thinking on my feet and making design decisions as I go. Pay attention to the preparation of the project and how I have already made some of the important decisions before I ever manipulate a pixel. Color pallet, typography choice, the layout of the screen, and needs to satisfy the project and client. The more decisions that you can make before starting the smoother the process will be.

The finished product is far from perfect but the major pieces of the design are all there. The design is fresh and light, it matches the colors of energy and trust with the firm ridged structure of the typography. Also pay attention to the conscious focus on User Experience throughout the design tutorial. I make decisions based on the fact that the user will be running, bumping around, sweaty, focused less on the interface and more on their exercise. Therefore the design needs to be simple, CTA's need to pop, and icon weight and size needs to be sturdy.

I hope this tutorial was a help. Please download the project file and rework the project in a new and fresh way. Change the color pallet, change the fonts used, solve the problem in a completely different way and then post a link to your work in the comments. I am really excited to see what you come with and how it differs from mine.


////////// Try Out Sketch
https://www.sketchapp.com/

------------------------------------------------------------------------------------

////////// Want to support my content and get extra goodies? Become a member and get perks like member-only content, behind the scenes, design files, and more...
https://designchamps.io/hip

////////// Connect with me here
Instagram: https://www.instagram.com/imjesseshow
Twitter: http://twitter.com/imjesseshow
Anchor: https://anchor.fm/imjesseshow
Medium: https://medium.com/@imjesseshow

////////// Sign up for my Monthly Newsletter
http://jesseshowalter.com/newsletter

////////// Music is from Musicbed click below for a free trial
http://share.mscbd.fm/imjesseshow

////////// Equipment
https://www.amazon.com/shop/jesseshowaltertv