Kayco Furniture inspires customers with curated styles from all over the world. I built the brand’s identity, proposition and shaped its user experience.

My Role

Project Type

Market Research, Competitive Analysis
Brand Proposition, Brand Identity
User Research, Information Architecture
Minimising Cognitive Load
Cross-platform Design
Design System, Art Direction
Prototyping
Copywriting

E-commerce Website
E-commerce App
for a speculative business

Results

Increased Conversion Rate progressively by 30%, 10% and 3.3% through three iterations in two weeks

Kayco selects furniture from all over the world and curates them into city-themed collections

  • High end, city-inspired furnitures.

  • Customisable items

  • Free return

  • 10-year warranty

  • Customer Help Centre

Kayco's Unique Selling Points

Concept Validation

In order to validate the concept, I conducted Market Research, Consumer Research to identify the market and the target audience for the product .

Market Research

The online furniture market is worth $200 billion in 2019 where city-based aesthetics is amongst the most searched keywords.

The results confirm a considerable need for a more tailored, unique furniture shopping experience. The target audience is devised based on age, gender, income as follows: Female, 30-55 years old, Medium-to-High income, Cultured, Well-travelled.

User Research

From the Consumer Research, I created the persona, ran Competitive Analysis to discover potential pain-points, challenges and opportunities for Kayco.com

Challenges & Opportunities

The common challenges that Katherine might face on furniture e-commerce platforms. This also presents an opportunity for Kayco.

Common Challenges of Furniture E-commerce Platforms

1.

Unfamiliar, Complicated Navigation

2.

3.

4.

Overwhelming, Unnecessary Product Information,

Lengthy, Convoluted Check-out Process with Little Room for Errors

Customer Retention aka How to Keep Them Coming Back

My goal for the project is to ensure that Katherine is able to find what she likes and checkout as easily as possible by minimising cognitive load.

This would be achievable by highlighting Kayco's city-themed collections, ensuring easy navigation, comprehensive product listing and simple check-out.

Design

Highlighting top offerings to help form an idea

Putting Kayco's city-based collections into:

  • Hero section's carousels to immediately attract attention and create first impression.

  • A supplementary section to expand on the collections' items to reinforce this impression.

Aiding users to form an idea of what they want helps reduce cognitive load.

Supplementary Section

Making Navigation Easy with Mental Models, Pertinent Filters and Text-based Dynamic Search

Finding product categories easily using Mental Model

Product categories are card-sorted into ‘by-the-room’ mental model according to users’ homes — in which room they would expect to find the items.

For Katherine, style and comfort often come to mind before the price. The filter reflects these criteria:

  1. Product Type
  2. Style
  3. Colour
  4. Materials
  5. Price
  6. Kid-friendly

Pertinent Filters help narrow down the search

A sticky Side Navigation bar offers:

  • Help navigate through the site quickly and reduce scrolling fatigue.

  • Shortcuts to the top of the page

  • Shortcuts to different product categories.

The search function suggests matching results as the user types, reducing the time needed to complete the search and the number of mistakes (typos).

Predicting User's needs with Text-based Dynamic Search

Chunking and Simplifying Product Information to help make decision easier

As Katherine is concerned about style, price but also how the item would fit in her home, including only Product dimensions and Colour variations ensure a high Signal-to-Noise ratio.

Essential but meaningful information organised into product chunk helps the decision making process.

Scan-able Product Page to identify important details before Check-out

Essential information is displayed above the fold to offer a comprehensive view of the product.

Additional elements to support decision making include:

  • High quality photos (360-view included)

  • User Reviews

  • Relevant Suggestions

The sticky ‘Add-to-basket’ modal helps retain information as we scroll.

For the app, product details and extra information are displayed as a seperate card, accessible through a simple swipe. This helps declutter the product page.

Simplifying the Checkout Process with Bundled Steps

Bundling the three steps into one removes the frictions as it:

  • Provides an overview with separated steps, allowing users to switch between steps without the fear of losing data.

  • Fosters a sense of freedom, letting users know that they can always go back and change details. (User Control & Freedom Heuristic)

  • Allows estimation, which gives the impression of less process and faster to complete than with the succession of pages. (Spark Effect)

For the app, the checkout process has a tab based breadcrumb navigation that allows navigation through the steps easily.

Keeping the customers coming back with a personalised experience

The search page is populated with FAQs based on common topics

Personalised Welcome, Thank-you & Help Centre Pages

On the next visit, personalised messages greet and inform users of the latest updates.

The Help Centre page is personalised to provide a human touch especially when assistance is needed.

Online shopping is an incredibly complex yet intuitive process. Apart from the merchandise, the look and feel of the platform is imperative in the User Experience.

A subtle and elegant UI and Interactions are absolutely important to showcase the products, the personalities of the brand, but also to delight the users.

Design System

  • Convey a sense of friendliness but premium as that would determine the impression of ease (Aesthetic-Usability Effect).
  • Give a foundation for the products to speak for themselves but also,
  • Be engaging to entice the users to explore more.

Restrained yet refined

My aim is to create a modern yet classy, chic yet down-to-earth colour palette

Blue suggests maturity, trust, calm, classiness, hence is used to facilitate information.

Pink provokes dynamism, friendliness, modernity, used to prompt action.

Grey to provide additional information
Colour Palette
Playfair Display for its premium, bespoke, gender neutral with a soft, feminine touch.

Avenir: modern, user-friendly, scannable.
Witty, friendly contents with a hint of personal touch to keep the users engaged and feeling appreciated.

Clear, concise texts to provide relevant information and to prompt the user to the actions.
Ample negative space to allow the content to breath.

Curved-corners to soften the look

Premium photography
Copywriting
Art Direction
Typography

Colour Palette

Witty, friendly contents with a hint of personal touch to keep the users engaged and feeling appreciated.

Clear, concise texts to provide relevant information and prompt the user to the actions.

Two complimenting fonts that appeals to the eyes but also clearly conveying information

Playfair Display for its premium, bespoke, gender neutral with a soft, feminine touch.

Avenir: modern, user-friendly, scannable.

Ample negative space to allow the content to breath.

Curved-corners to soften the look

Premium photography

Typography

Art Direction

Copywriting

Blue suggests maturity, trust, calm, classiness, used to facilitate information.

Pink provokes dynamism, friendliness, modernity, to prompt action.

Grey to provide additional information

Interactions

Transition between pages: fluid and seamless to connote continuation, enticing the users to move forward.

Confirmation interactions: snappy, prompt, solid to build confidence and reassure the users.

Expanding / Switching: a 0.2s delay is added to inform the users the action was deliberate (Steering Law and Movements in a GUI Tunnel)

Takeaways


Tested with 10 women, 30-55 years old, living in Paris, London, Saigon, Melbourne

Increased Conversion Rate progressively by 30%, 10% and 3.3% through three iterations in two weeks

Learning #1: Let the carousel auto-play. I’m not joking!

E-commerce best practices recommend letting the users click through the carousel to:

  • Give a sense of control, hence minimise the impression that the content is ad-like.
  • Allow the users to explore the content after the first slide decreasing missing out rate.

Despite this, 4/5 users during Testing prefer to have the carousel on auto-play to have the information fed automatically (Audible is an example).

Learning #2: Provide only relevant information

Shopping is a high-energy consumption process. Conversion rate heavily depends on the mental load of the users. The less energy required to shop, the more we are likely to do it.

As designers, we need to organise and prioritise information that would help people get what they want easily.

Have a good read!

Halfway there!

Thanks for reading!