Weather Channel App Redesign
For my User Interface Design class (CS 3750), we were instructed to find a problematic user interface and create redesigns to address those user interface problems. I chose the Weather Channel app, because it presented some problems with discoverability, signifiers, and information overload. Below are my redesigns, mocked up using the iOS app Inspr.
Improved first launch experience. The dots represent a feedback animation feature, letting the user know that the app is loading. The previous design did not provide any feedback for the user while launching.
Improved signifiers. The user clearly knows which forecasting section they are currently in, indicated at the top by "Hourly" or at the bottom of the menu, where the selecte
Home Page - Current Weather
Quick navigation. There is now a menu at the bottom of the screen with different forecasting options; the previous design did not show allow the user to quickly navigate to any of the other options.
Improved signifiers. The left and right arrows at the top module suggest that the forecasts are displayed in a carousel module, affording horizontal scrolling clearly marked by the arrows. The user can also see more information about two daily forecasts in the lower module, beginning with the selected day (marked by an opaque-white highlight in the top module).
Quick navigation. The user can quickly navigate between their saved cities, or add a new one by clicking the search icon. They can also see the current temperature in each of their saved cities without clicking on them.
Improved navigation. The hamburger icon lets the user know that there are more features and settings in the app. This secondary menu shows various features separated by relevance.