Summary
I redesigned a company website by collaborating with a cross-functional Agile team to ensure my designs align user needs with business goals.
Transforming Gignite’s Online Presence
Product Type:
Company Website
The original landing page prioritized a platform for early access and joining the waitlist before the launch of Gignite AI.
After release, the business positioning has changed and no longer provided relevant information. Therefore, evolving the needs and purpose of the landing page.
The Goal:
Redesign the website to clearly state Gignite’s purpose to provide users clarity on its purpose and selling point.
UX Designer
Overview
Responsibilities:
Wireframing
UI Design
Visual Design
Content Planning
Role:
How I approached the project
Design Process
1. Understanding the problem
To understand the problem, I gathered requirements with stakeholders and uncovered pain points.
2. Building context through user research
I explored competitor products, mapped out heuristics and generated ideas for the revamped website
3. Designing the solution
I contributed to the wireframes, stakeholder reviews, iterated mockups and handed over to the developers
4. Tracking Impact
I monitored outcomes via metrics and learned from the journey
1. Understanding the Problem
Gathering Requirements from Stakeholders
The business department was the main stakeholder in this scenario as they were the ones who had regular contact with business partners and clients. They were able to collate concerns and feedback regarding the website and pass it on to us.
Additionally as the company grew, the business positioning evolved over time.
Uncovering pain points
Through website metrics and feedback from business partners, I uncovered two main pain points:
Users were unsure and confused on the purpose of the website
Website was outdated did not show relevant information
2. Building context through user research
Reviewing Competitors
I wanted to understand the flow of information and business positioning of other AI companies. By gathering insights on these topics, I managed to identify common design patterns, usability, gather inspiration and understood their market positioning.
Mapping Heuristics
Prioritized Heuristic
With the competitor landscape in mind, I determined the following three heuristics to be most crucial for my website redesign
Consistency & Standards
By maintaining a consistent layout, navigation, and visual elements, we reinforce our brand identity and help users navigate our website confidently, guiding them towards discovering our offerings.
Aesthetic & Minimalist Design
This heuristic was one of the main priorities because we wanted to simplify design elements and focus on essential information. This approach directs users towards learning about our products and services effortlessly.
Match between system & real life
By using common terms and avoiding technical jargons, we want to make the website understandable to users with no coding experience.
Running heuristics between competitors & our Gignite company website
3. Designing the solution
Generating Ideas for the website revamp
Through inspiration and insights from analyzing competitors, I was able to come up with options for revamping the website. I made new sections and reorganized and swapped sections as and where needed. I prioritized the flow of information to prevent user confusion and allow easy understanding. Overall, I wanted to experiment with the company tone and message.
Creating Wireframes
User feedbacks and pain points were heavily considered during this process. Therefore, changing the narrative and reorganizing the website was a priority to give users clarity and understanding. Other sections not shown here are FAQ, pricing plan, contact us and testimonials.
Hero
This structure was chosen as it is similar to other AI products, and therefore would give frequent AI users the first impression that we are also an AI product.
Additionally, this structure was chosen as it is easy for developers to implement.
Introduction
As an introduction to the product and company, the section has a list so users can quickly skim through.
Content
Afterwards, we listed out the steps of the creative process for simpler and clearer understanding.
Iterating Mockups
Iterations were made after thorough reviews and re-examining our timeline. Some sections were re-arranged as I realized I was following other website flows a little too much. I had to step back and re-evaluate our main user needs and how should I display our information such that we can communicate our product without being excessive. Additionally, some sections were removed as they were not a priority for the near future.
Sample images
I wanted to use sample images throughout the website so users can have a visual reference of the app and its outputs, helping them quickly understand the app's capabilities and potential benefits.
Partners
Originally planned to be with testimonials, it was relocated to the hero to provide more credibility, increasing user trust and confidence in the product.
Introduction
I found out that a short description is a better way to onboard audiences than a list as it would serve as a good start for a smoother flow of information, engaging users and setting them up for a clear understanding of the product.
Process
I broke the process into steps to better convey the creative process to users and used icons to visually guide them through each stage, enhancing their understanding and streamlining their workflow.
Benefits
Originally placed below the hero, I moved it to the end to finish the introduction and to give a final prompt to sign up. I realized that this section does not give sufficient details to be an introduction. Therefore, I redesigned it to provide clear and concise benefits that address user needs and motivate them to sign up.
4. Tracking Impact
Monitoring outcomes via metrics
The new website was launched on October 7 2023, seeing a significant increase on high weekly visitors.
We received successful uses of the website during meetings with potential business partners. They were able to easily and quickly understand the company’s mission and purpose with a quick skim of the website.
Looking back, the website design was rather bland and did not show much personality. There are many websites that are able to be captivating and have personality while maintaining a professional front. I think there are many opportunities here to improve the UI so it can better convey the company’s presence and mission.
Lastly, If we had more time I would like to carry out user interviews to find out more about user needs regarding the company website. Additionally, i think we would have been able to create better outputs.