Wardour: responsive website

While the main duration of this project from the information architect to a finished project was completed within 2 months, the branding was being revamped by several internal teams.

My main role of this project was to take the existing proposed new Wardour brand and to turn it into a more professional, modern and responsive website that reflects the company's new branding.

I worked with the marketing team, content creators, other designers, video/animation editors and the developers team to bring this to life within 2 months.

Video demonstration of the revamped website across different screen sizes

User goal

To design and propose UX-led and SEO-led pages using the existing new brand and to ensure the website is modern with responsiveness implemented.

Research & Ideation

This was a face-paced huge project and was collaborated with plenty of team members within the company. The ones responsible had help formed the information architect of this website (with some of my suggestions of possible pain points added on)

From there I started to do quickly do lo-fi components and prototype to gain user feedback on not only usability studies but also on the client's intention of what they wish to showcase to the public.

Along the way, I had to answer queries and also source information to content creators and other designers on what formats we'll need to be able to decide on what layouts or components were needed.

I also had to ensure the team that decided on the new branding to revisit the colours and fonts so that they pass web accessibility standards.

Problem solving on the UX wireframing

The initial lo-fi prototype was based from the previous pages that the non-ux design team had made, I had added more ux elements to the wireframes and from there I awaited feedback internally before amends were needed.

At the same time, our art director were in charge of the hi-fi visuals; they did not get implemented until the UX wireframing was approved. 

Lo-fi wireframes with ideated layouts for each page

V1 visual designs by the art director, but user experience-based layouts were designed by me 

Designs

As the UX layout had gained approval, the client was still very unsure with the visual designs of the website.

The branding was meant to represent the company being fearless, creative, fun and professional at the same time. The previous designs had screamed creative and fun; but to the client, fearless seems to be amiss.

In the end, I did test versions with another designer (since both creative and art directors were on holiday during the making of this project) and remembering from past expriences, I went for a more 'less loud' but 'more professional' direction.

V2 wireframes where the colours were toned down and some ux component designs were also updated

V3 wireframes where the colours were decided by myself and another colleague

My suggestions had been approved. The red colour, though meant to be the new brand colour, was actually too loud, it screams huge attention seeker rather than to prove we are not only fearless but also professional at the same time. 

My V3 designs gained approval, is now live at current year of 2023-2024 (until next revamp)

Reflections

There were many challenges when redesigning the website with a new brand in mind.

There were plenty of feedback and problem solving involved and to ensuring the UI lives up to its standard in terms of both responsiveness and also to web accessibility standards.

The current live site will still be updating itself frequently, new pages has been added since the case study of this project. Feel free to contact me if you wish to know more about this project.

See another project…

Personal project: review submission flow

A self-learning project created as part of the Google UX design course, Simply Bento focuses on the user journey of a submission form.