In my previous posting, I gave a brief overview of the discovery phase of the Joomla.org redesign project. In March 2008, we launched into the design phase by setting up a few requirements of our design strategy:

  1. Simple, simple, simple. This was a priority. Keeping in mind that anything that's too simple runs the risk of being called "plain" or "dry," a obvious goal was to make it look good but simplify everything and eliminate clutter to appeal to the lowest common denominator of user personas.
  2. Bring deeper level content up to the top: There's a ton of activity on a site that serves over a million visitors a week, but none of it was visible when coming to Joomla.org. Promoting content would help reflect how active and vibrant the Joomla community really is.
  3. Universal navigation: Integrating all the sites into a single system may seem like an obvious point, but it didn't always happen in practice. If we were going to break a Web convention, there had to be a very good reason why and we had to be consistent about user flow.
  4. Universal search: Searching the whole family of Joomla Web sites was previously not possible and this is an important factor in content integration and access.
  5. Funneling: Provide top level "funnels" to get our user personas to relevant areas quickly.

These are just a few highlights of the overall design strategy. Naturally, part of the goal was to take the next step in Joomla's look and feel, determining what design choices were wiser than others, and what could be seen as a logical extension to the existing brand.

Now we come to the point of design inspiration. As the Designer/Art Director, I compiled scores of ideas ranging from the Joomla color palette and mark, to magazine clippings and stock photos, which I felt had an inkling of what Joomla was about. Believe it or not, nothing in that compilation of ideas had anything to do with Obama or his Web site. In fact, I'd never even seen his Web site until we were into several rounds of design and someone on the Core Team said it reminded them a little of Obama's site. We discussed changing it because we didn't want people to think we were subliminally suggesting they vote for Obama (at least for the U.S. users), but everyone agreed that it wasn't an issue and we were far enough down the path not to change it. Comparing the backgrounds, it's obvious the only similarity is that they're both bluish in color. But design can be subjective for many people who don't fully understand it, so it could be the best design in the world but someone would always come along and say they don't like it. That being said, part of the Joomla community consists of professional designers, so it's a bit like doing magic tricks for a room full of magicians—it's a hard audience to please.

I started with the "page" approach, which is a fixed-size presenation of the material in a portal-like format. The page seems to "float" above the background, giving it more depth and visual interest. For first-time users, there's an overwhelming impression of a project that's organized and strong. Bringing more content to the surface creates a "virtual smorgasbord" of information and resources for users to pick and choose. The icons and descriptions in the "feature area" across the top give users (especially first-timers) the fastest route to finding out what they need to evaluate Joomla. In our research, we determined that 92% of first time visitors had no idea what a CMS was, what it stood for, what it did, or how it could work for their needs. A simple statement, no matter how well crafted, just wasn't enough to explain to those users what Joomla was really about and how it could help them—and this statement was for those users—so it was removed in lieu of a newbie-friendly About Joomla section.

There were a multitude of other technical details in the mix. The days of 800x600 sites have passed and even large corporate clients of mine have long since moved on to 1024x768 (with an average active area of 980x580) so that's what we went with. The target OS/browsers were Win/IE6, Win/IE7, Win/FF2, Win/FF3, Mac/Safari, Mac/FF2, and Mac/FF3 since those are the Lion's Share of site visitors.

Personally, I like Flash and the potential it has for the future once some of its issues are resolved (Is CS4 the answer to my prayers? We'll see...). But there was a clear consensus against using it in any way. I thought it might have worked out well for the cross-promotional headers/teasers on secondary level pages, but that idea was nixed.

After multiple rounds of design and plenty of back-and-forth with all the internal stakeholders, we finally had a version we were ready to move forward with. But we knew every aspect of this version wasn't written in stone and we would be "massaging" it in small ways along the way. 

One of those ways is the search function. "Where is the search?" you ask. It's coming, but not before we complete the rollout of the other sites. As previously mentioned, a goal was to integrate family-wide search. The old search is still on each of the other areas of the site (except the "main" site). The only searchable content there are news items and the About Joomla section—both of which are nicely organized areas. Anyone clicking on those sections should be able to very quickly locate information within those areas far easier than with a search box and fishing through results. That being said, a search box is forthcoming for the main site once the other sites are complete.

My next post will give an overview of the implementation phase, usability testing with a task analysis protocol, and family rollout plans.