TruView

Project Overview

Background:

TruView aims to take the pain out of painting. By utilizing AR technology, the company hopes to create an app that allows renters and homeowners better envision their DIY paint projects. This will take the guesswork out of painting and prevent costly mistakes. As a start up, TruView is looking to develop an MVP that makes it easier for users to turn their house into a home.

Challenge:

As a new startup, TruView needs to rapidly create an MVP for proof of concept. Within a tight timeline, research would be limited to competitive review and industry expert guidance. A review of AR technologies would also have to be conducted for feasibility.

Role:

UI/UX Designer

Project Goals:

Understand how homeowners and renters progress through a DIY paint project
Conduct a study on the coverings industry to assess the strengths of our competitors' paint app offerings
Synthesize research into a design for a mobile application that helps users make their space their home

Deliverables:

Summary of expert interview and competitive research
User flow & wireframes
Mid-fidelity mobile app prototype
Results of 1st round user testing

Process:

Competitive research to establish industry standards and opportunities
Interview industry consultant to identify possible pain points
Generate proto-personas to establish baseline understanding of what we currently know and understand about our users

Create user personas to synthesize research
Establish project goals, generate feature road map, identify key features for MVP
Build out the sitemap and task/user flow

Generate concepts for features in the road map and sketch low-fidelity wireframes for further iteration
Refine concepts to a singular approach. Create digital wireframes and apply established brand and UI standards to design
Iterate designs and finalize key wireframes for user flow

Establish criteria for user testing
Build mid-fidelity prototype based on user flow/testing requirements
Organize and conduct user testing
Compile findings and iterate on user flow/wireframes

1. Research

In order to meet these challenges, competitor research and an expert interview was conducted. The goal of which was to answer the following:

Expert Interview: Conduct 1:1 interview with an industry expert to identify common user motivations, behaviors and pain points. Additionally, gain understanding of market trends and how new technology is influencing the industry.
Competitor Research: Assess the strength of compeditor’s applications. Identify if there are any service gaps or means of employing AR technology in a way that would provide TruView with a unique path to the market.

Most applications on the market attempt to make picking the right color an easier task. The common approaches utilize either AR technologies or photo editing software. While they provide a general idea, they can not ensure a high degree of accuracy. This is because most do not account for lighting or have other service gaps. Companies then tend to fill these apps with additional features like the inclusion of social media, virtual rooms, and curated collections. There is also little support for users to contend with the costs and effort associated with their project.

Research Takeaways

Painting is one of the first and most impactful choices when moving into a new space. However, the option to paint often comes with several obstacles that raise the bar for entry and a satisfying result. The chief concerns are high costs, uncertainty of results, and substantial effort involved. Solutions are abound, yet even the best in the industry have substal usability issues and fail to fully rectify the problem. If a platform would focus on usability, color accuracy, and additional supporting tools, Truview could find a path forward on the market.

Any aspiring DIY-er will come across some, if not all of these concerns. The severity of each varies by person and circumstance. While most of these projects end successfully, it is rarely without complications that leave a lasting negative association. According to our industry insights, the issues to address are as follows:

High Costs—
The average cost to paint one small room ranges between $150-$300. The cost of home renovation can easily create stress for people when compiled with the next issue.

Uncertain Results—
Final results can be difficult to predict simply by going off of a swatch or paint sample. This can result in costly changes that can quickly skyrocket the cost of even the smallest of projects.
Substantial Effort—
Painting requires a great deal of both mental and physical effort. A person could spend $150-$300 and 8-12 hours on a project that they might not be confident about, leaving little wonder why it is done so infrequently.

2. Define

During the consultation, it seemed clear to me that DIY paint projects are not undertaken lightly. There has to be sufficient motivation to justify the costs and effort needed to complete a project. The application that Truview develops will have to save users both time and money, while also providing confidence that the result will turn out the way they want.

Project Goals:

Understand how homeowners and renters progress through a DIY paint project.
Conduct a study on the coverings industry to assess the strengths of our competitors' paint app offerings.
Synthesize research into a design for a mobile application that helps users make their space their home.

Feature Roadmap:

An extensive list of features was generated from an overview of industry standards and user-identified needs. This list was then refined to key priorities for this iteration.

Key Features:

AR Color Visualizer— Utilize smartphone camera to preview selected paint colors on user’s walls. Include adjustments for different lighting situations and allow users to spec colors on individual walls.
Project Estimator— Utilize data from AR Visualizer to estimate the amount of paint needed to complete the project. Options to specify the number of coats needed and determine if primer is necessary. Link information to project materials list.
Applicator/Supply List— Utilize data from AR Visualizer and user input to recommend needed supplies and add them to current project list.
Room x Room Listing— Allow users to create rooms within a project and spec colors needed individually. Adjust material list as needed.

The site map was constructed around the three main functions of the application, the AR Visualizer, Project Management, and Color Catalog. The structure of the functions had to be distinct to maintain clarity, while also flexible enough to allow users to switch back and forth as necessary.

The user flow represents the complete flow from exploring colors, to previewing how they would look, creating an estimate, and finally reviewing a project list. While this flow is linear in nature, it should be noted that at all stages, a user can move freely through the application, to alter and adjust as desired.

3. Design & Ideate

The aesthetic of TruView is representative of its purpose. TruView aims to be the blank canvas on whitch people play and experiment with color. Its palette is a half finished painting, in a sense: a lot of white, some linework, and splashes of color.

This is carried over to the logo as well. The concept of fully defined yet not fully finished. It is meant to be emblematic of its promise to users. “You draw the line, we’ll help you fill in the details.”

While Truview is designed to highlight the colors that the user picks, blues are interspersed throughout the design. This is to develop the trust of users, so that they can feel confident that they can rely on the application's accuracy.

TruView uses the Rubik font because they share similar values, playful yet structured, bold yet approachable. Rubik’s readability against color backgrounds is particularly valuable. Truview’s type standard had to be flexible to retain legibility across the color spectrum.

The aesthetic goal of the UI was to not distract from the AR viewer or the colors that a user picks. However, system colors are used throughout to support the hierarchical structure to aid in user navigation. The navigation bar option adjusts based on the context of the function in use. The structure of the app is based around the AR visualizer and the project panel. The paint palette and color library serve as supporting features.

The color library and paint palette is where most users will start to use the app. Here users will be able to explore their options and narrow down their selections. It was important that users would be able to sort, filter, and compare their options. From here users would then be able to construct their own palette for specific projects. These palettes would then be utilized in the AR visualizer.

The purpose of the AR Visualiser is to provide an accurate representation of how a color will look on a given wall, under given lighting. Furthermore, it provides estimations of coverage needed via accelerometer readings. These results can then be compiled and saved as a complete project. The outcome for the user is a preview of final results and a searchable shopping list. This would provide a user greater confidence in their choices and help avoid costly mistakes.

The project panel serves as an organizer and shopping list. It is the end result of the AR estimator feature, which generates a detailed list of the materials needed for a project. Here users can organize lists for projects of any size. The lists display paint and tools needed, while providing an estimated breakdown of costs.

4. Test

Overview:

Three people tested the TruView color visualizer app. 2 women and 1 man were given the task of planning a DIY paint project. At various stages, testers were given situational prompts to break down their task. In a one-on-one setting, each participant went through the prototype on a mobile device. I was in the room taking notes. At the end of the test, follow-up questions were asked based on user responses during the test.

Observations:

All users were able to navigate to the visualizer tool and begin painting with ease.
There was some confusion as to how to begin. 2 users went to the swatch tool while the third went straight to the visualizer.
Palette adjustment options were requested by two users.
Users had questions about how the estimator calculates its measurements. They expressed uncertainty with the results. Details about how the materials list was generated was also requested.
All users asked for the option to order samples or place their whole order from the app.

Improvements:

New user onboarding needs to be provided. Tool tips for the AR visualizer, how to access the color menu, and how to generate palettes are the most needed.
The color catalog needs to be made accessible from the AR visualizer. There may also be a need to allow for fine adjustment of color across all brand lines.
Materials should be moved to a separate category and no longer be mixed in with individual rooms. For consumable items a note should be included with a room by room breakdown.
Placing orders from the app was the most requested additional function.

5. Takeaways

Designing an MVP to test the viability of a concept presents its own set of challenges. In this case, the first challenge was to assess if there was a genuine need for the concept. Once the research proved there was, the next challenge became designing a product from scratch to address that need. In my research, I discovered a wide variety of obstacles that make painting a laborious and expensive task. This would then lead to the final challenge of utilizing new technology to address these obstacles and deliver cohesive products.

The takeaway here is to look at the root of the problem to find the solution. Uncertainty caused most of the obstacles users experienced. Actions taken on uncertain information often resulted in wasting time, effort, and money. It was this uncertainty that could be addressed by providing more accurate information to users. From there, we could utilize new technologies like AR to convey that information to users.

The design of TruView is solely based around the AR visualizer. As an MVP that’s acceptable, While testing the product however, I found that users kept asking for more features that were well outside the scope of the project. These features were not on the radar at all, yet could lead to more cohesive solutions to problems they were facing. The next few steps for TruView would be to explore the possibilities of adding features like the online ordering system that was often suggested.