Hey All,

Some of you may remember that I posted some ideas for UI improvements to 
Launchpad to the list a while back. These were relatively minor improvements to 
the existing UI. I've recently been spending sometime working on some more 
dramatic changes. I've been focusing on 3 things:

1. Removing unnecessary clutter - removing things that are better suited on 
other pages, and re-arranging items to make a cleaner look
2. Expanding links - for some items that were previously linked to, I've pulled 
the content onto the main page
3. Improving terminology - Some of the terminology in Launchpad can be quite 
confusing

Before I go into detail discussing the mockups I just want to talk about the 
main aims of this post. I'm wanting to know if this is something that you would 
like me to continue on. I've only mocked up 3 pages, but hopefully they will 
give you an idea of the scope of the changes. If you are looking for changes as 
large as these to the UI then I am happy to work on mocking up the rest of the 
UI and working with others to help design and implement it. I strongly believe 
that Launchpad is the most powerful site out there for open source projects, 
and with a fresh take on the UI to make it more approachable I believe it can 
be the most popular.


1. Homepage - http://dropbox.mcubedsw.com/skitchpics/launchpadhome.png

The current home page doesn't really sell Launchpad. It assumes people know 
what launchpad is and why they should use it. The only real advertising is a 
tour link that is very easy to miss.

In this redesign made it try to sell Launchpad to potential users much more. 
The 3 key items are finding existing projects, getting the user started (more 
on this later) and the current featured project. Below this we have the 
secondary items, explaining what launchpad is and who uses it, and providing 
the latest posts from the launchpad blog.

And finally I have pulled the tour out of the link and put it at the bottom of 
the page. I'm only showing two items in this mockup, but imagine the whole tour 
being placed there. It shows what Launchpad does and explains why you should 
use it and it is right on the home page, where people will see it, not hidden 
away in a link (which I only found myself when I took a good look at the home 
page).

Now to come back with getting the user started. I was talking to someone 
earlier and they mentioned that one of the most common complaints they heard 
about Launchpad versus over services like Github, is that it takes too long to 
get source up there. The whole sign up process needs to be streamlined so that 
the user can go from clicking the get started button to having their code 
online in under 5 minutes. This is something I'd look into in future mockups, 
but for now it is probably the most important thing that needs to change that 
isn't on this page.



2. Teams - http://dropbox.mcubedsw.com/skitchpics/launchpadteam.png

Like a lot of Launchpad, the current teams page is a little bland and not 
highly structured. The biggest change in this mockup is the members section. 
Rather than just list the latest and pending members, I have move the member 
photos section onto the team page. The most important thing about any team is 
the actual team, so it makes sense to put give them a large amount of screen 
space. The team 'bio' is placed at the top of the page.

Down the left are all the relevant details. The team details are placed in a 
compact list. The mailing list emphasises the address as the main piece of 
information and the extra options are displayed as subordinates. And finally 
the member map has been given a place that looks like it belongs on the page, 
rather than being tacked on.

This page shows one of the main changes, which is the elimination of the 
actions in the sidebar. In my last series of mockups I moved the actions away 
from being inline, but on reflection and discussion with some people, it does 
make more sense for them to be inline. This is why the "join the team" and 
"subscribe" actions are both at the top of the respective sections.



3. Projects - http://dropbox.mcubedsw.com/skitchpics/launchpadproject.png

And finally we have the project overview page. I have removed a lot of stuff 
which is unnecessary and stripped the page to its most important elements. The 
series & milestones and the development focus aren't relevant unless you want 
to see the code. The latest questions and the FAQs aren't relevant unless you 
need support. And the latest bugs aren't relevant unless you're looking at bugs.

I've moved the summary field up below the project title as it seems a much 
better fit, and give a better sense of the difference between the summary and 
the description. As with the team bio, the project description is placed front 
and centre. Below this I have again taken a minor player and made it very 
important in the news and announcements. If you're coming to the project 
overview page you are wanting to do one of two things: find out about the 
project or download the binary or source. The news and announcements are 
important to both these needs.

All the relevant info is placed to the left of this. The basic details of the 
project are in a list like with teams. The downloads are listed like everything 
else, and use the description rather than the download name (oddly enough, 
descriptions are more descriptive ;) ). A new element is the Get Source 
section, which simply says what you need to type into your command line to 
download the source. And below this are the top contributors, because it is 
important to give recognition to those who put the most work in on the front 
page.




You can still see the old launchpad in the designs, and that is part of the 
idea. There are some really good bits of UI in launchpad, but they are often 
drowned out by not so good bits. A little spring cleaning of the layout and a 
little bit of colour and you have a much more appealing site for users.

I look forward to your feedback, thanks for putting up with my ramblings :)

---------------------------------
Martin Pilkington
Writer of Weird Symbols
[email protected]


_______________________________________________
Mailing list: https://launchpad.net/~launchpad-dev
Post to     : [email protected]
Unsubscribe : https://launchpad.net/~launchpad-dev
More help   : https://help.launchpad.net/ListHelp

Reply via email to