Slab Fabricator
A website for ordering kitchen countertops online, on both web and mobile platforms. The early-stage process of the Order Process feature.
OVERVIEW
Cecaco is a slab-fabrication company that sells countertops online. It has three types of users: designers, consumers, and fabricators. Even though my team worked on all parts of the product, in my portfolio I'll present the Order Process feature in detail.
PROBLEM
My design partner and I were added to this project after the majority of research, information architecture, and branding had been collected by our UX design colleague. However, the main question was still unanswered: what was the most comfortable way for users to select countertops online?
GOAL
To create a simple, friendly, and interactive countertop order process that would make a user feel happy and satisfied before they check out.
SOLUTION
To design a countertop order process we had to do some extra research, interviews, and user testing. Our final solution suggests that a user would have to go through five simple steps only to select the features they want: 1. Color; 2. Finish and Thickness; 3. Kitchen Shape; 4. Slab edge; 5. Interactive Square Footage calculation.
ROLE
I was part of a team of two designers working hand in hand with the development team. I was an assistant to the main designer and was mostly responsible for the mobile platform. However, I significantly contributed to the web platform as well.
TOOLS
Figma
RESEARCH
INSPIRATION
For any project I work on, I start with inspiration. This is the fastest way to dive into the industry the project belongs to, so I dedicate time to this important part of the process. My research let me explore the variety of slab-fabrication companies and their products to find the best way for our project to proceed. I found out that the majority of slab fabricator companies have a variety of products, but I couldn't find the one that let me cut the exact amount of slab for my kitchen size. Therefore, our product's main value proposition would be a custom square footage calculation of the surface.
Greatlakesgm.com, has a wonderful visualization tool! A user can actually preview any material on the surface. Both the web and mobile platforms worked well. The weakness here is that they only offer a single kitchen floor plan as a template.
Stonetrash.com offered custom stone planes by pieces. A user can order pieces by custom size and add as many pieces as they want. The weakness, however, is its bad responsiveness of the mobile platform. Overall, the idea of custom measurement is great!
The main problem for the majority of them is that the mobile solutions look messy.
Greatlakesgm.com
Stonetrash.com
Cabinets.com Homedepot.com
INTERVIEWS
Even though I didn't start this project from the beginning, I never missed a chance to do user interviews. What looks good to me may not look good for a potential user, so I always try to get a second opinion. For the Order Process feature, I talked to three friends of mine who have their own houses. One of them remodeled their kitchen, another one replaced the countertop. They shared with me their painful and joyful moments. This is what I found out:
Home Depot is the best company in terms of quality and service. But none of my friends used Home Depot's website to make orders. They made phone calls or they talked to assistants in a store. In response to the question "why not?" they said, "The website is too complicated."
A friend who only replaced the countertops liked an idea of a digital product that specializes primarily in countertops.
An overabundance of information is exhausting! Simpler is better, but that's not well understood in the industry. The company wants to offer more, but in practice, they only confuse consumers.
Changing your kitchen is painful, especially if you're trying to save money. The fact that you get a huge unexpected total cost is devastating. By the end, you just give up and become ready to pay more money for the experience to be over.
There was too much communication involved. Two of my friends aren't native speakers, so it wasn't comfortable for them to be constantly on the phone discussing their kitchens.
OUTCOMES:
The main goal for our product is to eliminate the number of steps a user takes when ordering the product, decrease the level of confusion, and minimize communication. In other words, we set out to make the process less stressful by providing a clear and distinct design.
ORDER PROCESS: FIVE STEPS
Step 1. The user can select the Color of the countertop. The search can be filtered by distributors, color family, thickness, finish type, and price. The user can also see the details of the product by hovering over it.
Step 1 mobile solution. The main goal was to make it clean and comfortable.
Step 2. The user can select Finish and Thickness.
Step 3. The user can select a kitchen shape. They can see their progress at the top of the screen in web, and by clicking on the bar menu in mobile.
Step 3 mobile solution. Round 2
Step 3 mobile solution. Round 3
Step 4. At this step, our first solution was to present a schematic representation of the slab edge (Option A) for consistency. But after deeper research, our team transitioned to Option B with photos in the background. A rapid user test proved that this was a better solution.
Step 5. The user can drag the circles on the scheme to change the size of the kitchen. They can also enter the measurements on the left side of the screen. The user can also indicate what side of the kitchen is located next to the wall and whether backsplash tile is needed for it. In addition, the user can select the number of sinks and other cutouts.
Step 5 mobile solutions.
RESULTS
After designing the five step order process, I contacted my friends for user testing. Since I was primarily responsible for the mobile design, I was especially interested in their opinion on that. Our solutions were positively received. The test subjects especially acknowledged the simplicity of the design and how "easy it feels to use." They liked that the navigation bar showed them their progress through five easy steps. And they found that even if you don't need to order a countertop it is interesting to play around with the product.
The negative comments raised the inability to see how the total cost changes when options are changed. They were also concerned about paying upfront before being able to talk to a representative. All these concerns were discussed the client and the team of engineers, and further work was done to improve the product.
P.S. OUR OTHER DELIVERABLES
Onboarding
Checkout
User Profiles (3 types)
