Digital Boomerang Singapore 

During one of the AJAX seminars we attended at Open Publish, Sydney, Tim Lucas spoke about Yahoo! and how Yahoo! shares its design philosophy with the world at the Yahoo! UI Library. If you haven’t had the chance to visit the site, do so! It’s really worth the while.

We thought it was a good idea and decided to share some of our design philosophies as well. This post will focus on the homepage design of EnterpriseOne located at http://www.business.gov.sg.

Getting down to the design

One of the mistakes many people make when doing a website revamp, is to start with the design. Thank goodness we had a great client, and we were able to do the necessary planning, thinking, and testing before having to produce this design. Here’s how the process went:

• Develop Content Strategy
• Profile Users (businesses in Singapore)
• Develop content for 3 sections
• Populate content into content management system
• Apply mock design (done by another vendor)
• Conduct usability test with mock content
• Conduct survey with target users
• Analyse usability findings and survey results
• Design the homepage

For the actual usability tests, we engaged MicroUsability. The usability tests helped us identify many navigation and design issues. It helped us conceptualise a wireframe for the homepage. However, we were still far from getting an actual design. Something with lovely colours and imagery that would appeal to our audience.

Balancing Usability with Design

No matter how much usability has become a science, design will always remain an art. The challenge is finding a happy harmony between the two.

The usability results told us:

• how content could be organised
• how navigation could be organised
• how elements could be laid out
• where users expected things to be
• what users thought of the section labels

However, usability results couldn’t tell us how to design the site:

• what colours to use
• how the site should make the user “feel”
• what graphics/pictures to use
• what our design concept should be

Usability is more about functionality. Design leans towards the aesthetics. We’d like to think usability appeals to the user’s left brain, while design appeals to their right brain. Usability doesn’t have much love for graphics.

Jakob Nielsen, a prominent thought-leader on usability, has reiterated time and again that users don’t look at graphics. And he lives by his mantra. Just take a look at his website http://www.useit.com/.

However, it seemed our users cared a lot about the design. During the usability tests, users couldn’t help but criticise the rather basic and functional design. They wanted something that looked better. In fact, many of them seemed distracted by the poor artwork. (It’s the “Blink” effect which Malcolm Gladwell wrote about).

The design challenge

How on earth were we going to make a government website look appealing? How do we know what colours to use? What imagery to go with?

Those were questions for creative directors and designers. We engaged the help of Pat Chan and Shafudin Jaya. Between them is 50 years worth of design experience. The usual creative process was gruelling. As a team we:

• studied the usability test results
• analysed the survey results
• discussed and argued a lot
• amended each other’s work

The design concept

In the end we settled on one design concept. The homepage would be welcoming. A friendly face, a face of someone who actually worked for the Singapore Government. Someone who actually interacts with the target audience (local businesses). Someone real.

The lovely lady in the photo is Yansiang. She is positioned above “drawers” of content resources, almost like a friendly librarian with all the information local businesses need at her fingertips.

To the right of her, we placed a short paragraph to tell users what the site was all about. We expected many new users to the site, so it was important they knew upfront what the site could provide.

Colours and design touches

Shafudin did a wonderful job of using the client’s corporate colours. He added nice design touches like drop shadows, curves and gradients. The hues combined with the solid blues and design touches, made the site bright, optimistic yet business-like.

Tweaking a million times

Unfortunately, our job was still not done. We had to tweak the design a million times (exaggeration…but it sure felt like it!). The original design had more graphical elements and we chopped that and placed more content instead.

The best part of the entire thing? We tortured ourselves willingly. The client didn’t need to do many critiques as we were so busy doing it ourselves!

Is this the best thing in the world?

Never. That’s the thing about the web. We can think of a gazillion improvements we can make. But it was the best thing we could have done, given the time and resources.

Share This