This class was excellent! I'm currently working as a UI/UX designer and want to improve the creativity in the products I work on. For the class project, I decided to use my favorite workout app - Fitbod - as inspiration. My main goal was to explore new, visually creative ways to develop on boarding screens, so I did not focus on user testing.
Step one: Answer this question "what are the main benefits users are getting?"
Before sketching out my on boarding screens, I answered Victoria's question and identified the following benefits of Fitbod:
-Users can choose their fitness style (body building, olympic lifting, crossfit, etc)
-Users receive unique, customized workouts built by the Fitbod algorithms
-Users are able to see their achievements over time
-Users gain the ability to live forever (this is my addition & personal goal).
To generate this content, I pulled from the Fitbod website and my personal experience using the app. The last benefit – "achieve immortality" – is a benefit that I added, and a personal goal.
Step two: Choose a color palette
-I browsed coolors.co until I found a color palette that jumped out at me. I wanted something with a dark base and a pop of a brighter color.
Step three: Find/create illustrations for the on boarding screens
Probably the most time consuming aspect of the project. I browsed the resources Victoria mentioned in the class videos but ultimately found what I was looking for on other sites. However, I'm absolutely keeping unDraw in my back pocket.
- I found this set of Exercising Silhouettes on Vecteezy and recolored them in Illustrator using my chosen color palette.
- I also used this geometric pattern from Vecteezy because I love finding ways to add texture to my designs.
Step four: Arranging screen elements and app flow
This was the most fun for me – because of my background in graphic design, this part of the project let me play around with the visual design of the on boarding flow.
When I finished version 1, I wasn't completely in love. I felt like the illustrations were too flat, too similar and ultimately didn't fill the space in a balanced way. Back to scouring the internet for illustrations...
Step three (repeated): Find/create illustrations for the on boarding screens
For version 2, I switched up my app elements with,
-This set of People at the Gym from freepik; again I recolored them in Illustrator using my chosen color palette.
-This abstract pattern from Vecteezy
-and blobmaker to generate some fun background shapes
Step four (repeated): Arranging screen elements and app flow
I'm much happier with the visual complexity of version 2, especially in the variety of workout styles shown because I think they better reflects Fitbod. Plus, I'm really digging the background pattern.
Thanks for the class, Victoria! I'd love any and all feedback.