Heem

Technological development of virtual and augmented reality are no longer far-fetch ideas. These technologies are quickly becoming mainstream. Many furniture sellers such as IKEA and Wayfair are racing to perfect their AR features to enhance and provide a frictionless purchasing process for their customers. This project aims to explore the UX design of AR on a mobile environment for a fictional furniture distributor, Heem.

The higher-level objective of this case study is to design an end-to-end mobile application for buyers to browse the furniture catalog and explore different furniture arrangement options through AR.
Role
UX/UI Design
Brand Identity
Design Tools
Adobe XD
Illustrator
Duration
2019
Client
Heem
Business goal
---
Problem
--
Discovery & Research
  • We started the project by conducting a series of research to help us frame UX challenges and solutions.
  • 1. Secondary Research
    Research into furniture industry trends.
  • 2. Competitive Analysis
    Assessing other furniture purchasing applications available on the market at the moment; specifically those with AR features implemented. Test out the apps understand key functions available at the moment and areas for improvement.
  • 3. User Interviews
    Conduct 1:1 user interviews with 7 participants. This process helped pin down key pain points and needs our target market wants from an application like Heem. It also adds another layer to the UX challenges and how I should frame the solution moving forward.

    Read the Interview Findings
UX Challenges
  • Based on the research conducted the project are tackling the following issues:
  • 1. Customers have difficulty visualising the products
    in their homes while shopping online. The finishes and (estimated) dimensions online don’t alway match the offline product.
  • 2. Customers find it difficult to navigate through the massive online catalog.
    With so many options and products available, it’s overwhelming to look at if the information isn’t well organised.
  • 3. Customers want the flexibility to test out different options before committing to a big purchase.
    Furniture shopping is a big commitment compared to shopping for smaller items and they take up space!
UX Solutions
  • 1. Design a mobile app fulfilling their creative needs.
    The application should incorporate features to help consumers assess if the item(s) meets their interior design goals.
  • 2. Enhance the overall customer experience.
    A overall frictionless browsing and purchasing experience while exploring Heem’s expansive catalog.
  • 3. Develop a minimalistic brand identity and design.
    With all this stuff going on, Heem should keep its aesthetics clean and coherent. A consistent design can visually declutter the mass amounts of information presented and make the content more digestible for the consumers.
Ideation
  • The ideation phase started with a study of the user flow, this will help us determine the necessary features for the app client to complete their actions. Afterwards, these flows are translated into lo-fi wireframes to quickly design and test different design options.
LO FI WIREFRAME
  • I sketched out a few key frames to quickly test design options. The challenge I faced when designing the AR screen was the mass amounts of features that needs to be included. As the consumers mentioned in their interview, the most frustrating part was the lack of accurate information when deciding on a furniture item.

    It is necessary to include helpful tools such as measure and easy navigation to the catalog to help them assess different furniture options in their homes. The solution is to compartmentalise these features into drawers consumer can tap and expand for different needs. This allows the screen space to be maximised for viewing, without loosing all the functionalities and flexibilities the consumers want during their creative process.

    Additionally, certain features such as rotating and moving the pieces around can be done through gestures instead of buttons. Which gives the consumers more control over the adjustment without additional buttons and tapping.
Mid-fi wireframes
  • Following up the initial sketches were wireframes. With consistency being key, the design was kept clean by following a the defined layout grid. As the consumer navigates through each of the pages, the UI language is carried over creating a smooth flow between each frame. The organisation and repeated elements creates a cohesive design where the consumers understands the functions of each element. Thus avoiding confusion and friction when browsing.
BRANDING
  • With branding development of Heem I wanted to communicate its identity of being a furniture purchasing platform and hint at its AR technology. After a few quick sketches and exploration into a logo which has more dimensions. I landed on a simple design which mimics two chairs and contains the first and last letter of Heem. Thus keeping with the clean brand aesthetic and opting out of over complicating the logo. This idea was carried over when developing a neutral palette and font choice.
USABILITY TEST
  • The first round of usability testing was conducted though Adobe XD with a focus on 3 tasks:
    1. Start a new home project, experiment with the placement of a sofa in the AR view and save the item for later.
    2. Pair the saved sofa item with a coffee table
    3. proceed to complete purchasing the sofa item. The findings of the usability test is cataloged with an affinity map:
Takeaways
  • This project was completed as a personal exploration into user experience design for furniture e-commerce with the integration of AR technology. It was completed over a 2 week period. The next step to this project is to go through another set of design iteration based on the affinity map.

    There are additional features I would like to test and incorporate into the screen space. Such as tap the item to reveal product details in the AR screen, either presenting them as a card on the screen or point to the object with a leader and comment.

    Additionally, a larger user group for the next round of testing will be beneficial for a wide range of feedback. the effects of other AR accessories and the impact it may have on the furniture shopping experience. For example the development of ARKit and how a multi-user AR shopping experience will be like and can be design. Overall, the project sets a good foundation, but needs a few more iteration to polish the product.