top of page

Case Study: Weather App Re-Design

Winter Quarter 2020 - Interface Design Class

Topics explored: User Flows, Wire-framing, Visual Design, Mobile App Prototyping, Micro-Interactions

Duration: 5 weeks 

Tools: Adobe XD

weatherappMockup_edited.png
Redesign the user interface and visual design of a chosen weather app. This should also include two or more micro-interactions that provide pleasure and improved functionality.

User Flows

Assess a user's path through the app as it is.

Primary User Goal 1

Be able to know the weather later in the day.

Screen Shot 2020-03-12 at 10.57.02 PM.pn

Primary User Goal 2

Be able to know the weather at a different location.

Screen Shot 2020-03-12 at 10.57.24 PM.pn

Wire-Framing

Create wire-frames that propose the re-designed concept.

IMG_9260_edited.jpg
Screen Shot 2020-01-12 at 11.24.52 PM.pn
Screen Shot 2020-01-12 at 11.01.00 PM.pn

Visual Design

Refine both the flow of the UI and the visual execution.

Screen Shot 2020-01-22 at 2.10.38 PM.png

Final Prototype!

Create a high-fidelity prototype with working micro-interactions.

Screen Shot 2020-01-22 at 2.10.46 PM.png
Screen Shot 2020-01-22 at 2.11.02 PM.png
bottom of page