At the V&A shop I came across the The Oarsman’s and Angler’s Map of the River Thames. On this straight ribbon is projected the river Thames preserving the meanders wile compressing its longitudinal distance to something more usable on a rectangular scrolling interface.
If we decide to not abstract points on the river down to a series of radio buttons, we can use this map to show he river in detail at large scale on screen.
Following a mockup and style guide, we put together the beginnings of the final interface. Anything that is actionable is highlighted in a consistent pink accent. The semi-circle button shape is an abstraction of a boat hull. The river is abstracted to a series of buttons representative of an abstracted transport map. On desktop clocking on any of the date and time options then allows the user to change the option with arrow keys.
The two dials on the right indicate the next high and low tides. Unfinished as of current, the one that is next is larger in size. I have brought back the buoy model. It sways over to one side to indicate a strong current, however, as you can see it’s not too obvious thus the supporting text.
At this stage we wanted a more usable time and date selections.
This idea above works by the user selecting a month button that then expands horizontally to display the next few months.
The next change was moving the next high and low tides to a panel on the left. This is joined by an indicator for the current sunrise and sunset times. The reason being this makes for a more saleable system. This panel can then support an ever increasing number of widgets in accordance to the user’s preference.
Much like the tube map the, selection of the location can grow to support more linear locations up and downstream in addition to tributaries on other rivers. We removed the ear buttons either side of the location in favour of just a radio button model, for fewer interactions for the same data and a more readable interface.
