ELI LIM
OPen
Client:
Heem
Branding
Concept
UX/UI Design

AR Commerce iOS for Furniture Shopping

Client

Heem

Year

2018

Involvement

UX/UI Designer | Branding

Location

NYC

Heem is an interior design company with partnerships with more than 10 major furniture brands. Heem is aiming to enhance the furniture shopping experience by developing a new app featuring augmented reality technology. I was tasked with designing an iOS app for the MVP, where users can browse products and visualize how their selected furniture would look in their homes using augmented reality. This project is the first initiative in a broader program, and we were hoping to establish a direction for future development of AR features.

Secondary Research

As someone initially unfamiliar with the AR/VR industry, my first priority was to deepen my understanding of the subject matter. Through extensive secondary research and competitive analysis, I discovered that AR technology has been increasingly adopted by major technology companies and direct furniture brands to enhance shopping experiences. However, AR is still relatively new to most people, and the technology's proficiency has not yet been perfected. Next, it's crucial to engage directly with potential users by exploring how they currently shop for furniture and gathering their thoughts on AR. This hands-on research could be pivotal in gaining a real understanding and personal connection with the users. Feel free to review the full competitive analysis for more detailed insights. View Research

In-Person Research

Thanks to interviews with six participants and the easy accessibility of major furniture stores, I was able to identify that customers need both in-store and online experiences to purchase furniture. To deepen my empathy, I spent time observing how people interacted with furniture, their families/friends, and the customer service teams at Williams Sonoma, West Elm, Rafael Interiors, Homenature, and Crate & Barrel. I also noted the categorization, product information, selection, and successful in-store design patterns. This observation allowed me to deeply understand customers’ behaviors in-store, including furniture arrangement, categorization, inspiration, and how in-store shopping influences the rest of their shopping journey.

Empathy Map

After synthesizing the data into insights about user needs, I understood that people genuinely enjoy browsing in stores. However, I also identified several barriers that prevent people from purchasing products more frequently. The findings from the empathy map clearly indicate the challenges they face, which translate into the user needs of Heem’s target audiences.

Define Persona

To represent the data from the empathy map, I created the persona "Pam." By giving context and personality to the research data, we can better empathize with the target users throughout the design process.

Thinking about a Total Experience: Designing the Complete Shopping Experience.

From the brief, the client requested the creation of AR features for a new app. To develop the right AR feature for both the client and the user, I first needed to fully understand the complete experience of how Pam would conduct her furniture shopping. I drafted a comprehensive shopping journey, covering both in-store and online experiences—from browsing online, navigating in-store with a map, viewing potential furniture placements in her space using AR, sharing AR photos with her friends and family, to making the final purchase on her iPhone. This phase is crucial to fully empathize with Pam’s insights and behaviors in order to provide the right solution.

Thinking about a Total Experience: Designing the Complete Shopping Experience.

From the brief, the client requested the creation of AR features for a new app. To develop the right AR feature for both the client and the user, I first needed to fully understand the complete experience of how Pam would conduct her furniture shopping. I drafted a comprehensive shopping journey, covering both in-store and online experiences—from browsing online, navigating in-store with a map, viewing potential furniture placements in her space using AR, sharing AR photos with her friends and family, to making the final purchase on her iPhone. This phase is crucial to fully empathize with Pam’s insights and behaviors in order to provide the right solution.

Sitemap Visualization

I then created a sitemap to visualize the information architecture of the app. A challenge I faced was integrating AR features with a comprehensive online shopping service, guided by the iOS Material Design guidelines. To address this, I analyzed patterns in existing furniture apps and empathized with my persona, Pam, to identify the most intuitive app structure. Subsequently, I employed card sorting to refine and validate the information architecture and navigation of the app.

Mapping User Flows

To analyze the flow throughout the app, I mapped out user flows and task flows based on a comprehensive storyboard. By examining the sequence of user actions for each scenario, I identified the relationships between screens. This process enhanced my understanding of how to craft intuitive experiences through the UI.

Sketching Out

I began designing the UI for the new features by sketching out initial ideas inspired by design pattern research. Following this, I refined the sketches, ensuring they adhered to iOS material guidelines. This sketching process facilitates early sharing of ideas with peers and mentors, enabling me to receive constructive feedback at an early stage of the design.

Logo Development

Before creating high-fidelity wireframes, I defined Heem’s branding attributes: versatility, expansiveness, large-scale vision, forward-thinking, inclusiveness, multi-functionality, and visionary outlook. I then began exploring various logo concepts for Heem. My approach involved combining natural and raw textures with the sharpness of refined industrial elements, creating a dynamic and juxtaposing design.

Branding

Next, I created a moodboard with references from iOS Material Design. To emphasize Heem’s goal of offering a broad range of products through major partnerships, I rooted the concept in the idea of a tree, symbolizing large-scale operations and versatility. Please feel free to view the styleboard.

Content Strategy Through User Feedback

It’s time to think about content strategy. To create engaging and highly retainable content, it’s crucial to understand what people are truly thinking and how they interact with the subject matter. During the empathize and ideate phases, I gathered insights by observing and interviewing people about their furniture shopping experiences. After synthesizing the data, I gained a deep understanding of the patterns and insights. Additionally, I studied competitors to identify common trends. New arrivals, decoration inspirations, the latest sales, direct access to each category, and content from each store are valuable elements that should prominently feature on the home screen.

High-Fidelity Prototype

I created high-fidelity prototypes, incorporating the branding and initial design sketches of the main AR features and product pages for usability testing. Feel free to interact with the prototype using the button below.

Affinity Map

After gathering sufficient usability findings, I created an affinity map to synthesize the data and identify recurring behaviors and feedback. This process helped me better understand the usability of the current design. I then derived insights from the synthesized information, which informed my recommendations for the next iteration by prioritizing key options.

Key for a Total Furniture Shopping Experience

By deeply understanding how furniture shopping should be and users' expectations for a comprehensive shopping experience, both digital and in-store, I recognized the importance of developing app features to bridge these two worlds. With key features, users can seamlessly browse all their previously saved products during in-store visits, enhancing their furniture shopping experience. Major features should include a key code for access, AR map product navigation, visual/barcode searching, and an AR feature that allows users to use saved room measurements to view products in their space without being physically present.

Use this form to describe your project
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.