Implementing the first pieces of a redesigned site
At State of the Map US, Saman Bemel Benrud presented a vision for a ground-up redesign of the OpenStreetMap website. His proposal introduced concepts for strengthening community aspects of the site, improved the on-boarding experience for new users, and defined a more logical information architecture, making the relationship between the community, data, and map layers of the site clearer.
At the sprint days following the conference, OSM contributors began to work on parts of this vision. A desire to strengthen the collaborative features of the site had emerged as a theme of the conference, and several contributors began to implement features to allow communities to form around specific regions, features, or interests. Meanwhile, Tom, Saman, and I began to work on reworking the existing map UI on OpenStreetMap.org’s main page, with an eye toward paving the way for bigger changes.
Mockup of Saman’s design presentation, recently deployed map UI
Having heads down
Our focus right now is on incremental, clearly actionable improvements. Our goals are to improve the overall impression of the website and project for people arriving on OpenStreetMap.org for the first time, make it easier for new users to sign up, and provide better guidance for beginning contributors:
Clean up forms
A new map UI
Improve sign up experience
A cleaner organization of the front page
Update attribution page
In the last couple of weeks, working with other contributors and the maintainer of OpenStreetMap.org, Tom Hughes, we have made great progress.
First, we helped do a ground up clean up of all form elements on OpenStreetMap.org, creating a sensible styling for all form elements, revisiting button positioning across the board resulting in a much cleaner look and feel. These improvements are now deployed to OpenStreetMap.org.
Second, we refactored and consolidated the map user interface. This pull request, was deployed just last Friday, and discussion is underway on followup changes. These changes consolidate interaction with the map into a tool box on the right hand side. Where before the map key, map navigation UI elements, layer switcher and sharing controls were spread out in all four corners of the map, they are now consolidated in the top right. This change results in a cleaner look and feel and frees up space for other uses.
The new map UI toolbar unites map navigation, map sharing, map key, creating notes and layer switching.
The layer selector of the new map UI.
Right now work are going on a welcome landing page for new users. This is part of improving the sign up experience on OpenStreetMap, designed to help anyone get started mapping. It’s not intended as a comprehensive guide, but more like the page you’d want to send someone to before they crack open an editor.
The proposed welcome page to help newcomers start mapping.
Further priorities include:
- A cleaner organization of the front page
- A better jumping off point for help