The current structure of having four separate B2B websites for our chemical company client creates inefficiencies and inconveniences, particularly for their sales teams, who struggle to introduce products across different brands.
Consolidate four separate websites into a single platform to deliver a cohesive brand impression. The design also focused on enhancing user experience, improving brand visibility, and reducing maintenance costs while embracing the latest industry trends
This project showcased my expertise in B2B website design, UX optimisation, and strategic leadership. By driving the successful pitch and spearheading UX aspects, I demonstrated my ability to address business challenges, deliver client value, and enhance my professional competitiveness in UX Design / Strategy.
I started by conducting B2B trend research to help understand how the website can adapt to market dynamics and stay current in the evolving B2B landscape. This research identified three key trends:
1. Moving Towards B2C Shopping Behaviours: B2B companies are increasingly adopting strategies from B2C e-commerce, focusing on creating more personalised and customer-centric experiences.
2. Omni-Channel Sales: Customers are increasingly interacting with brands through multiple channels, such as online, in-store, and mobile. To meet their expectations, companies are finding that a seamless, integrated approach across all these channels is becoming essential for success.
3. Customer Needs Help: Customer often require assistance during their purchase journey to make informed decisions, especially in the B2B buying journey.
Based on these findings, I defined our strategic direction to focus on a Customer-Centric Design. Customers expect relevance and an intuitive, user-friendly navigation experience.
Me and project manager conducted extensive stakeholder interviews to ensure all perspectives are considered.
• 10 stakeholder interviews (involves 22 stakeholders) from various departments including LEAD, ESG, PR, Foundation, Finance, Legal, and HR.
• Interviews focused on user experience, corporate branding, content communication, technical maintenance, and desired features.
1. Confusing User Experience: The current design lacks a user-friendly structure, with unclear information architecture leading to navigation difficulties.
2. Weak Corporate Image Presentation: The website fails to clearly communicate the company’s values and sustainability efforts, leading to a disconnect between the brand and its audience.
3. Inconsistent Content Communication: News, product details, and ESG initiatives are not clearly conveyed, leading to potential misunderstandings.
4. Disorganised Information Processes: Information gathered through the backend is scattered, resulting in inefficient workflows and a need for a unified data collection system.
5. Missing Key Features: The lack of product comparison tools, unified contact forms, and streamlined navigation creates a poor user experience, potentially driving customers to competitors.
1. Prioritise User Experience: Ensure a user-friendly design with intuitive navigation to address issues caused by unclear information architecture.
2. Emphasise Corporate Image: Highlight the company’s values, sustainability efforts, and professional image.
3. Ensure Clear Content: Communicate news, product details, and ESG initiatives effectively.
4. Streamline Processes: Unify information collection to address disorganised data currently gathered through the backend.
5. Incorporate Key Features: Add product comparison tools, unified contact forms, and streamlined navigation.
To develop the mainpage design strategy, I implemented the following approaches:
1. Current Analysis and Categorisation: Analysed the mainpage layout logic of 15 chemical company websites according to their scalibilty and brand reputation and then categorised them into 3 types:
A. Customer Acquisition-Oriented: Attract new customers and introduce them to the company.
Key Features: Engaging visuals, prominent CTAs, recent company updates, and comprehensive information layout to provide a complete understanding of the company.
B. Functionality-Oriented:Enhance usability and provide efficient access to information.
Key Features: Primary placement of the search function, detailed product and service sections, and streamlined layout to improve user experience.
C. Hybrid-Oriented: Balance engagement and functionality.
Key Features: Balanced page length, combination of engaging content and functional elements, recent updates, and detailed sections to cater to diverse user needs.
2. build up positioning matrix: Using matrix visually represented the anticipated strategic direction, helping us understand where to position the design in terms of in formation density and design focus.
My design decisions for three types of homepages: For each type, I created wireframe to discuss with the client.
I also referenced GA data, which revealed that many website visitors are interested in ESG content, so I adjusted the section layout accordingly.
Feature is to improve the user experience by providing a tool that facilitates efficient and informed decision-making.
Key Development Process:
1. Competitive Analysis: Conducted an analysis of similar features on competitor websites
2. Requirement Gathering: Identified key comparison criteria through stakeholder interviews and meeting with client.
3. Wireframing and Prototyping
In the original design, each product page had its own 'Contact Us' section. However, this approach led to several issues such as misrouted Inquiries and increased workload.
Analysed the websites of 15 chemical companies for reference.
Conducted 10 stakeholder interviews (involves 22 stakeholders)
featuring 13 different templates across a total of over 50 pages.
The redesign of the chemical company’s website not only achieved a more cohesive and brand-aligned platform but also significantly enhanced the user experience through strategic feature implementations. By focusing on user-friendly navigation, detailed product comparisons, and a clear presentation of the company’s values, the new website positions the company as a leader in the chemical industry, prepared to meet the evolving needs of its customers and stakeholders.
1. Development of Communication Skills: This project has trained me in communicating effectively with clients and across departments. Understanding how to drive design through effective communication is crucial.
2. Enhanced Design Consideration: It's essential to consider component reusability when designing CMS pages, which enhance my design ability after this project.
3. Cultivation of Design Strategy: I have accumulated the ability to conceptualise website strategies through competitive analysis and stakeholder interviews.