✨Final Result✨
Increased the goal
conversion rate (+169%), the avg. page views per visit(+28%), the avg. time
on page (+57%), the every session duration (+33%), reduced the bounce
rate (-22.2%) and the exit rate (-23.7%).
Kick-Off
After talking with CEO and interviewing 3 brides, I listed conditions that need to be considered:
Define Problems 🔍
With goals and constraints in mind, I defined problems of the original website by analyzing data and interviewing target users.
The gap between conceptual models
In traditional US weddings, couples find vendors by themselves. So when they land on LadyMarry's website, they expect to see a search engine or ads listing platform with plenty beautiful pictures.
However, LadyMarry is more like a middleman, who will finally become a virtual middleman using AI technology. The gap between the conceptual models and lack of effective explanation make users confused.
Low desirability, less trustworthy
The heat map is one evidence that the website has a low desirability from users' eyes. For content, the website didn't echo with ads and user's expectations very well. Visually, the grey illustration, uneven layout can not make the website good-looking and trustworthy.
LadyMarry currently has 4 digital platforms: 1 website, 1 web-based application, 1 mobile application and 1 blog. However, they are visually less connected and lack of a consistency in content, which will cause confusion and weaken the power of brand.
Brainstorm & Sketch
I brainstormed solutions to the issues of Understanding, Trust & Getting Engaged and move forward with some promising ideas.
Rich Information
New Information Architecure
Users want to everything as they see "one-stop", they expect to find everything on this website. So I create a list of services and refined the site map to make it more logical and dynamic. There is a comparison of old site map and new site map.
New workflow & Layout patterns
For services like florist, cake, photographer, I categorized them into several groups and different layout for them, for example:Florist, cake, hair and makeup - they have a lot of pictures, they can be filtered by product types; for DJ/MC, Musician, Photographer, Videographer, I highlight their work samples and styles, rather than people; for photo booth and venue, highlight styles.
Illustration & Co-Creation
One challenge was there were not much good-quality photos left for the website. That was to say, I could not adopt the strategy that to convince users by showing lots of past works of LadyMarry like other competitors did. But I found another way to build trust--Illustration.
Facilitate understanding: how LadyMarry works?
Imagining when new couples log in a vendor website, they actually know nothing about wedding planning — totally a mess. Traditional service vendors show them a lot of good pictures, the amazing results,and tell them "Just leave this to me!". But miscommunication happened a lot, which makes couples lost confidence for vendors. For LadyMarry, I want to highlight we close the loop with "3C", coordinate till the big day.
Build trust: how a certain service works?
Transparent communication brings trust. Here, I try to explain "How It Works" to couples, to tell them how we customize services for them, the dimensions we need to considerate.
I tried diagrams, icons, but finally chose illustrations as the educational method--on one hand, it's easy to read and quickly understand, on the other hand, the elegant hand-drawing style shows LadyMarry's taste and sincerity, moreover, for users didn't see works that satisfy their needs can also clearly express their visions to LadyMarry using the picture. Here is an example of flowers in a wedding.
Elicit emotions: wedding planning is enjoyable
Finally, our couples and vendors all like these illustrations very much, they even print it out when having meetings to facilitate the conversation. For couples, they always feel overwhelmed and tired during the wedding planning, but pretty pictures and effective communication can release their burden a lot.
Other Details
Wording
For example, I changed "contact us" into "free consultation" since our target users are sensitive to price, which I learned from sales reps.
CTA buttons & New icon set
In the original version, all CTA button are khaki, which looks too pale and vague, can not attract users attention, let alone increase the CTR. I changed the color into LadyMarry pink, as well as put more CTA buttons in prominent positions.
Implementation
I took 4 weeks designing and 1 week implementing, here are some "OLD vs NEW":
Validating and Iteration
Then I tested with users. Incoming brides showed their appreciation and get attracted by the website, especially the illustrations-- "Beautiful and professional!"
I keep iterating the details on website (sometimes do AB testing) and check the data from Google Analytics and Hot Jar.
Takeways
Startup mentality, MVP & Progressive iteration
A startup has very limited resources and managers have to make a balance among all the departments and services. For a new service or function, we have to have something first, test the MVP then iterate. It's OK the first version is not perfect, we can polish the website/product later with feedback from our users.
Designer's value in a business group
Designers are problem solvers. In a business group, I was supposed not only to advocate for users but also to solve business problems. Sometimes I have to compromise due to business goals and constraints, but it's more important to communicate, understand and collaborate.