Website Redesign: 2359 Media

iMac-mock-up-diferents-views

Sometime last year, I helped redesign the website of 2359 Media (a digital consultancy firm in Singapore) while I was interning there. Throughout a period of 2-3 weeks, I was in charge of the UX design, web graphic design and copywriting of our website. The redesign, however, was restricted by our decision to use the same WordPress theme in order to save time.

Nevertheless, I tried as much as possible to improve the visual and structural design of the web pages. In the end, it turned out to be a pretty extensive project, with substantial changes made to many parts of the website. Here are the main parts of the website that were redesigned.

Home Page
Problems

old home page3

The main and most obvious flaw of our home page was a jarring lack of any value proposition; the main image slider simply showed a carousel of case studies. This is quite a serious shortfall, since multiple researches have shown that users form impressions of websites quickly (in as little as 50ms), and that value propositions make or break user visit retention.

There was also no clear, relevant call to action to direct the user to their next logical step – the Services page, to check out how 2359 Media can help them.

Problematic case study image slide

Problematic case study image slide

The image slider was problematic as well. The slides, rather than focusing on the services provided by 2359 Media, sounded like promotional material for the apps themselves. In other words, the case study sliders failed to point out exactly what we did to help our clients. Furthermore, the App Store and Google Play buttons are distracting, since they aren’t clickable (and if they were, they’d be directing traffic away from the website). And while not totally essential in this context, the case study slides also lack calls to action.

Solution
The first step was therefore to first create a unique value proposition – and make it visible to users upon entering the home page.

new home page

In the redesigned home page, the image slider would first show our value proposition – with a distinct call to action that leads the user to our Services page – before looping to other case study slides.

New case study image slide

The case study slides are also completely redesigned. A one-liner headline now shows what the company has done for the client (in this case, changing the way people read the news), while a simple and clear call to action prompts viewers to read the case study in more detail. The images used are also more dynamic to make the slides more aesthetically attractive.

Services Page
Problems

old services

The old Services page was pretty messy, with services grouped into “Significant Value”, “Creativity” and “Successful Execution” – not exactly intuitive groupings of services. Curiously, the UX Workshop service was placed at the bottom of the page, separate from the other services and written in much more detail.

Crucially, calls to action are absent, therefore disrupting and prematurely ending the user experience for potential clients.

Services old

Old Services Page design

Solution

new services

In the redesigned Services page, the various services are presented in a clean grid, with a succinct description for each type of service. A contact widget is also added below the services grid, so users can easily get to the next (and hopefully final) step of their user experience in the website: contacting us to find out more.

Services new

Redesigned Services Page

Case Studies
Problems 

old case study

Case studies form an essential part of a website, especially for digital consultancies like 2359 Media. They showcase what we can do, and provide a solid testimonial – but only if done right.

The old case studies, however, are badly designed, with poor layouts that lack clarity and purpose. Above the fold, for instance, the case study simply doesn’t provide readers an idea of what the article is about. And no one is going to read an article if they don’t know what they are getting themselves into.

Moreover, positioning the app screen slider so high in the case study, and without any preamble introducing what the project is about, serves little purpose.

app buttons

Below the fold: distracting App Store and Google Play buttons

The App Store and Google Play buttons directly below the fold distract the user and drives traffic away from the site. Besides, the case study should be focused on showing what 2359 Media has done, not providing publicity for the app.

The copy is also thoughtlessly arranged into “Value”, “Creativity” and “Execution”. This does not help readers understand the case study, and what 2359 Media has done, any better.

Old case study page for "NewsLoop" project

Old case study page for “NewsLoop” project

Solution

new case study

The new case studies were designed with a clear purpose: to demonstrate what we can do, and eventually convert users into clients.

Above the fold, a bold headline describing the project is what users see immediately. A short excerpt, with the client’s logo (especially effective for boasting about our client base) highlights the main issues faced by the client and our awesome solution to the problem.

Newsloop new

Redesigned case study page for “NewsLoop” project

Just below the fold, a series of figures (readership, number of publishers, etc) validates the success of our solution, and a slider of app screens showcase our product.

The main copy is broken down into meaningful segments, starting with a “Project Outline”, followed by a section on “Re-thinking the News Reader App for the Region”, which showcases the bulk of our services and capabilities.

newsloop last

Wrapping up: bringing the focus into the future

Wrapping up the case study is a section that brings the article to a broader perspective. By looking ahead and talking about conceptual trends like user-centric design, the section provides impetus and relevance to 2359 Media’s services.

Besides the case study for the “NewsLoop” project, I have also redesign and written the copy for 4 other case studies.

––

Redesigning 2359 Media’s website had been one of the more fulfilling experiences in my internship with the company, and I really enjoyed the level of autonomy I had while leading the project.

You can view the 2359 Media company website here: www.2359media.com

P.S.: I do UI, UX and web graphic design; if you are interested, you can contact me at clone.yusiang@gmail.com.

Advertisements

I wanna hear your comments!

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s