This prototype was created for the UX Techdegree program at Treehouse.
In this project, I was tasked with creating a user interface for a weather application. My role was to create a prototype that included:
After reading positive and negative reviews for the top 3 weather applications in the Google Play Store, I made a list of the most common design-related complaints:
Keeping these common criticisms in mind, I sketched a preliminary app layout in Procreate and began fleshing out ideas for the layout, icons, and text.
Since many of the complaints from other weather applications mentioned a cluttered and confusing interface, I chose to keep the iconography and text simple with symbols users could easily recognize.
The location pin and settings slider are common app design patterns that users have seen multiple times in other applications, and facilitate the user journey through this weather application's contents.
The use of simple line icons and numbers allow this interface to display helpful information without becoming cluttered, and the content boxes for each day assist with clearly distinguishing daily information visually.
Displaying images from the user's location with colors that reflect the current conditions help to reinforce a sense of information accuracy.
With these considerations and design choices in mind, I created a prototype in Adobe XD.
I learned about the importance of starting with a strong understanding of user needs and expectations and translating those requirements into a clear design before getting started with code. This project taught me how much I enjoy making prototypes in Adobe XD based on user feedback.
During this project, I was taken by surprise by how quickly a user's trust can be broken by trying to present too much information, not giving them clear options, and not providing a sense of forecast accuracy.
There are many free and low-cost weather applications available on a variety of platforms, and users won't spend much time trying to figure out an interface they perceive as cluttered or confusing before uninstalling the application and trying another.
The final grade I received on this project was exceeds expectations. To obtain the "above and beyond" grade, I:
Here are some comments from my project reviewer on my work:
"Great work on your prototype! You created two mockups and connected them with interactivity to make a more realistic version of the design for the client to view. At this stage, you would most likely be making decisions on functionality over layout and design."
"I absolutely love the design of this app! The orange is so calming and beautiful, and it really does reflect the weather shown. I also like the inclusion of the picture in the background, I think that really makes the design complete."
"Fantastic work! I look forward to seeing more from you."