[Osmf-talk] design

Richard Fairhurst richard at systemeD.net
Sat Dec 17 00:14:17 UTC 2011

Hi all,

Heh, so I should probably explain what a few of us have been working on.

At the London Hack Weekend we started work on a prototype for the 'short 
cycle' site redesign. You can see a running version at 
http://redesign.apis.dev.openstreetmap.org/ and get the code from my 
github (https://github.com/systemed/openstreetmap-website/tree/redesign).

The overall aim is to make the site more approachable for new users via 
a simpler, more contemporary look. It's a work-in-progress: some stuff 
is experimental and may not stay (not sure yet about the tint bar at the 
bottom... but you have to try these things!), but you get the general 
idea. A few points to highlight:

*Simpler and more direct*

The editable nature of OSM is in prime position with just three large 
tabs. Lesser used functionality has been moved into a "Tools" menu and a 
"Community" disclosure list.

*Content-rich RH column*

Emphasises two points:
- Applications of OSM data (the "OpenStreetMap Inside" concept from the F2F)
- Mapping projects (to reinforce the message "we want /you/ to contribute)

This follows current design practice that in the absence of hierarchical 
nav, main content is left-aligned, supplementary content right-aligned.

*Search box in standard location *(top right)

This is designed to expand (via a link) into
/    From: [_______]   To: [_______]   By: [ car|foot|bike ]
when the routing backend is ready.

*Consistent design language*

Developing the 'OpenStreetMap as a brand' concept we're starting to 
discuss in CWG. The colours are keyed around the green of the OSM logo, 
which with the dark red and yellow equates to OSM's 
"trunk/primary/secondary" cartography. The logo and typography is 
consistent with that on help.osm.org and trac.osm.org (and can be rolled 
out further). We anticipate reskinning Potlatch 2 to match the design 


*The design is strongly influenced by that of openstreetmap.ru. Features 
used by more experienced mappers have been retained, but moved out of 
the way of newcomers.

Despite the extra content, we have managed to retain the map at 90% of 
its current size (thanks to the full-bleed design), and the area 
available in edit mode is actually greater.

*Wording and layout changes

*"History" (sounds passive) has become "Activity" (emphasises the active 
nature of the data - i.e. find out what other mappers are doing right 
now). On the login screen, "sign up" has been moved above "log in" to 
maximise signups from new users, and the buttons moved to the LH margin 
to make them more obvious. The copyright link is in the standard place 
on the bottom RH of the map. And so on.

Code so far is by Tom, Matt and me. We're excited about it and hope 
you'll like it.


More information about the osmf-talk mailing list