LUCID
Web Homepage Redesign UX Case Study
UX Design/Research, Visual Design, Mapping, Wireframing, Prototyping & Testing
MY ROLE
DURATION
October - December 2021
TEAM
Manahari
OVERVIEW
Preface
Lucid is a visual collaboration tool used by millions of users around the world. I came across Lucid Software at my school's career fair of Fall 2020. I got an opportunity to talk with the recruiter about the company and the products they offer. As a Computer Science major, I have used one of their products, Lucidchart, countless times.
A few weeks ago, I was browsing the website, and the homepage, especially the navigation looked out of place, especially the fonts, two navigation bars, lack of colors in some places, and overuse of the same colors in other areas.
Hence, I decided to redesign Lucid Software's homepage and the product's navigation bar.
Task
Conduct user research with people who are already familiar with the product
Make sure the redesign fits the company's branding policy.
Problem
I am conducting user research on students who are only familiar with the product. Conducting user research for enterprises is out of my time and budget. However, it will give me ample data and feedback.
Goal
This study was to redesign the homepage and navigation panel such that it incorporates rebranding to enhance the user design and the overall user experience.
Tools
Adobe XD, Lucidchart, InVision, Google Forms, Adobe Illustrator
NOTE: I am not affiliated with Lucid Software. I created this case study as my curiosity project.
RESEARCH
DEFINE THE USER
Hypothesis
People who are familiar with online visual collaboration tools would tell you they make their ideas flow fluently into diagrams. However, the product should convince you as to why they are better than other competitors. To achieve that, a good website with a good User Interface and User Experience should exist.
"I want to use a product, but I would want to know how their website looks like because the first thing people notice, is their website."
Understanding the target audience
I wanted to create a case study about Lucid Software's audience. Since 2010, Lucid has been on a mission to empower teams and companies of any size, in any location to see where they are today and where they need to go next, in order to build a better future for us all.
Since Lucidchart is Lucid's most popular product, I identified the company's closest competitors and performed a competitive analysis in a feature comparison matrix.
Secondary Research
After creating and analyzing Lucid's competitors, I conducted research to gain a better understanding of how the user feels about Lucidchart.
I gained the following insights for the homepage and the products' homepage:
Two navigation headers — The two navigation headers on the products' homepage are not visually appealing
Lack of dividers — the homepage lacks any sort of division between the section and looks clustered
Overuse of the color black
The footer is too big
I conducted user interviews to test and prove my hypothesis and gain more useful insights. To reach a fairly larger audience, I came up with a few questions survey and posted it on social media that matched the target user audiences. I received 15 responses.
Here are some of the results:
74% of the participants knew about Lucid software (all of them used Lucidchart)
100% of people who hadn't heard about Lucid's software were not thoroughly impressed with the homepage.
60% wanted a more robust website UI/UX experience
68% would prefer the redesign of Lucid's homepage
80% didn't like the two headers when browsing through their products
Primary Research
I further conducted 5 in-person user tests. The survey also asked whether they liked the current design of the website. The responses I got revealed a normal user prefers good design.
1
The website should look modern and user-friendly
2
Two headers are not preferrable
3
A good modern website will help persuade consumers to buy your product
IDEATION
Empathy mapping
After the research, I designed an empathy map. It aided me in being in the shoes of a user and helped me gain insight into a user's behavior and feelings.
Persona
Based on the interviews and tests, I set up a persona. I referred to them throughout the entire product development process.
How Might We (HMW)
To explore further, I created a few How Might We (HMW ) questions:
How might we...
use radiant colors to make the homepage look prettyHow might we...
solve the situation of making two navigation into oneHow might we...
make use of dividers and present more with fewer words
DESIGN
Findings:
Users preferred only one navigation
Lack of color demotivates to navigate the website
Design solutions:
The navigation bar would be redesigned to only one
Standard vector graphics would be used
Initial Design
Low fidelity wireframe
Keeping personas, user flow, empathy mapping, and HMW questions, I sketched low-fi wireframes using InVision.
High fidelity wireframe
To make the web app more visually appealing I used bright colors.
Usability Testing
In order to satisfy my hypothesis and solutions, I asked the users the following questions:
Do you have an idea of what the company is about from this homepage?
Are you satisfied with the information given?
PROTOTYPE
After planning out everything from the research, ideation, design, and user testing I developed the working prototype of the web app.
Additionally, you can find the prototype here as well for a better user experience.
Desktop users: Hover your mouse over the prototype to interact with it
PROJECT LEARNINGS
What did I learn from this project?
I am happy with the research, wireframe, and prototype of my UX case study. This isn't an elaborate or extensive project because I wanted to use my knowledge and challenge myself into designing a webpage. Overall, I am satisfied with the progress I made with this project.
It is important to refer back to the user and research throughout the process. I had the opportunity to learn about users' needs and demands. I would have liked to conduct more usability tests to outline additional improvements. However, conducting user research for a big company is out of my time and budget.
Overall, I am really pleased with the project.