Weather app

This next one I wanted to model on an analogue clock model. Our interface has many similarities to a weather app. In respect the quantity of data, how it is structures and related and in the manner a person used the interface. Like a weather app the user knows what they are looking for when they open the app, slowly interpret more and more data and make their own evaluation further actions based on the data. I had made this weather app mockup, that uses a rotating handle to manipulate the time and the data represented in the middle(dividedinto 2 panes(swipe)).

Screenshot of weather app • David Valente

I mapped this same construct with tidal data in the mockup beneath. In this I have continued with the blue tide height visual in the background. The clock at the top show the current time at the top in large when the interface is opened, when the user changes to the to see predictive data for the future, this shrinks and rises with the selected time larger in black. This is a WIP for visualising a contrast between now and selected time and a reset button.

Analogue interface mockup • David Valente

Rather than making points for high and low tide, I have used green and red to represent the periods of time when the water is flowing in and out respectively. Thus, just by moving the dial handle, and glancing at the colour on the circle the user can see there’s about 2 more hours of the tide flowing out, with this, they can then seek more detailed tide data.

As this only shows 12 hours, the next 12 are shown inside with a thinner stroke. Tis same thinner stroke data is tied to the thinner weight fonts in the green and red arrows of the same colours inside the dial.

Next post ›

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s