Hi OSM developers!<div><br></div><div>I want to make the OSM rails site better. I've already started submitting a few small pull requests (thanks Tom for the merges!), but I thought I'd lay out my plans and solicit suggestions from those of you who are more familiar with things than myself. </div>
<div><br></div><div>I plan to approach the project by first making incremental, obvious improvements, resisting the urge to design from the ground up. I want to hold onto the brand identity, the paired-down aesthetic, and the information architecture. Based on the solid foundation that is already in place, I want to start shaping it into a more friendly, modern, professional website. Here is our hit list of adjustments:</div>
<div><br></div><div><ul><li>Remove table-based layout elements where they're inappropriate. Tables are hard to style, and often don't align cleanly with other elements on a page. (partially done in site-cleanup)</li>
<li>Start to establish a horizontal grid in the content area for better organization (partially done in site-cleanup)</li><li>Clean up typography, with stronger rhythm, more breathing room, consistent behavior  (done in site-cleanup)</li>
<li>Break up #content section of the site into two sections: .header and .body. This adds some much needed hierarchy to pages, and establishes a predictable pattern to help new users find their way around and interact with the site (partially done in site-cleanup)</li>
<li>Consistent and more prominent button styles</li><li>Consistent margins. I am using a 20px base for margins across the site right now (partially done in site-cleanup)</li><li>Better looking map markers and map popups</li>
<li>Improved 404 page</li><li>Perform a copy review and clarify UI text (IE, friends -> contacts) (partially done in site-cleanup)</li><li>Simplify the 'examples' below the search box.</li><li>Rethink the "where am I?" and "home" buttons from the home page, turn them into a single button that does something more useful</li>
<li>Better, more consistent icons. (partially done in site-cleanup)</li><li>Consolidate all the graphics into sprites</li><li>Find a better home for the 'map key' link</li><li>Find a better home for the 'GPS traces' link</li>
<li>Restyle forms</li><li>Friendlier login / new account pages. These pages should include a concise statement + graphic encouraging users to join </li></ul></div><div>If there are more no-brainer fixes to hit, I'd love to hear them and add them to to this list.</div>
<div><br></div><div><div>Right now, I am close to having<a href="https://github.com/openstreetmap/openstreetmap-website/pull/150"> the site-cleanup branch ready for merge</a>. There is one blocker though. I would like to build in a separation between the header and content of the body of pages into the site logic. I taked to Pavel about helping with implementation, so hopefully that can happen soon. <a href="https://github.com/openstreetmap/openstreetmap-website/pull/150#issuecomment-9923530">Here are some details on what exactly needs to happen</a>. I am going to cut off new additions to this branch and make sure everything here works. I will try to keep pull requests more contained in the future. This one started with a typography overhaul, but a lot of the 'typography' problems were interrelated with other issues. Next up, I want to rework the map markers and popups.</div>
</div><div><br></div><div><div>At the same time that I am making these small improvements, I will be thinking about how to push the OSM site forward in more ambitious ways: more inviting UI, new functionality, better tools, stronger visual identity. How do we make this site a place both for map consumers to find their way around, and the home for a more active, more connected mapping community? How do we make the site dramatically more inviting to new users? For now, I want to take care of the easy problems.</div>
</div><div><br></div><div>Lastly, here's a little bit of background about why I'm doing this and who I am:</div><div><br></div><div><div>I'm <a href="http://mapbox.com/about/team/#saman-bemel-benrud">a designer at MapBox</a>. As you all probably know, we recently received a big grant from the Knight Foundation to help OSM. Part of that money is going to fund improving the website, mostly implemented by me. Yep. I work for the man. <a href="http://mapbox.com/about/team/#eric-gundersen">This man specifically</a>. I also think OSM is an amazing project and I want to do everything I can to make productive contributions to it. My background is solidly in visual/UI design (I can also write html/css & very bad javascript), and while I've worked a little with CMS's, I am not much of a developer and don't have any familiarity with Ruby on Rails. I hope to get more capable over the next few weeks, but for now I'll probably be making mistakes and asking for help from those of you who know their way around the Ruby side of things.</div>
</div><div><br></div><div>Looking forward to working more with all of you. Now would be a great time to provide feedback on the list I have so far and also send advice my way on how to best approach things.</div>