Rock N Dirt Yard Case Study

Project Brief
Type — Individual
Duration — 2 Weeks
Goal — Redesign E-Commerce experience
Project Focus — Information Architecture & Design process
Software Utilized — Axure
Client
Rock N Dirt Yard is a local Austin,TX based landscaping supply company, created and operated by original owners Roy Amonette and Marc Vogelman since 2009. Despite limited advertisement, they developed a presence through word of mouth from a few initial customers, and just recently launched a website.
As most of the business and customer engagement occurs in person and over phone/email, the website is rendered somewhat useless other than to browse products and pricing. The issue is quickly revealed upon entering the site as the home page and overall navigation is extremely unorganized and confusing.
Our project brief tasked us with redesigning the website, focusing on creating an e-commerce experience for customers as well as streamlining the product checkout process.
Research
Personas
Since this was a short project and our instructors wanted to create a constant within everyone’s projects, we were given two personas to base our research and final design on. I chose the following to focus on:

The key points I honed in on were needing knowledge/authority on inventory, memory of past purchases, pain points of difficult navigation and indistinct product categories, and providing an efficient checkout process.
Interviews
Choosing to target the contractor persona led my initial research toward searching for competing landscaping companies and suppliers. After looking at a few websites, I came upon one that had a preferred vendor page. I decided to contact those landscaping companies, which ultimately ended up comprising a majority of the research I used for my redesign.
Questions
How much experience do you have in the landscaping industry?
How do you order your supplies/materials?
What makes you decide on a certain supplier?
Would you entertain buying materials on a website?
What is the primary need you would require if having to order through a website?
Condensing the answers from these questions, there was one common answer that was stressed in response to what one aspect would drive them to use a website. They all emphasized needing a system that was compatible with the “bids” they use as proposals and invoices to account for supplies, materials, labor, etc. This common factor and apparent importance to both contractors and suppliers was just the information I needed to determine I wanted to incorporate bids as the MVP of my project.
Competitive Analysis
My analysis of Rock N Dirt competitors started in the interview process, and continued after to determine how other sites organized their navigation. Mainly using google maps to locate and read reviews, I settled on looking further into:
-Whittlesey Landscaping
-ASAP Stone & Landscape
-Austin Landscape Supplies
-SiteOne Landscape Supply
I targeted the navigation of these sites to get an idea of how others in the industry organized the information architecture since the Rock N Dirt site was clearly flawed and a bad example. Briefly exploring these sites I sketched some user flows for browsing products and also noticed not a single one had any sort of e-commerce feature to purchase products. Adding this element to the new site would surely separate Rock N Dirt from its fellow landscape suppliers.
My research and interviews gave me a clear picture of problems the current site deals with, and what viable solutions could solve those issues. I developed statements to keep consistency and help hone in and focus on particular elements.
Problem Statement
Rock N Dirt offers a website that is useless for contractors and so unorganized for homeowners there is virtually no usage for the website other than to confusingly browse products and prices.
Solution Statement
Design a consistently functional and organized website that can be used effectively by all customers. They need to be able to search, browse, and order landscaping products/materials in an informed and minimally time consuming way.
Going back to the persona, some major pain points were indistinct product categories and inconsistent navigation. I aimed to directly solve such pain points right off the bat, represented by very distinct categories in the sitemap and simple, explicit user flows.
Sitemap

User Flows

Sketching & Wireframes
Inspiration & Sketches
I like to get inspiration from external sources, then use my creativity to iterate and make a design my own. For this project, the ecommerce aspect was the highlighted aspect of the project. Due to a project from a previous class in which I improved an ecommerce experience for a bike shop, I had an idea of a website that I would like to get inspiration from in regards to the information architecture, navigation, and checkout. So I started with a basic version of that website design for my initial sketches which included a dropdown nav bar, main slideshow with other featured content in boxes below the fold.

Halfway through the initial sketches I took another look at the ASAP Stone & Supply site and really liked the way they designed the home page above the fold. It had many of the elements I was already sketching but in a more condensed and structured fashion, so I incorporated those aspects for a slight change that significantly changed the overall view from a vertical orientation to more horizontal.
Wireframes
This project gave me an introduction to Axure for the first time. Having only previously used Sketch, I quickly realized Axure had significantly more functionality. Clearly made specifically for basic wireframes and prototyping, I really enjoyed the variety of shape/icon options available in the library as well as the Masters feature was incredibly useful right off the bat in making the navigation bar and applying it to all screens.


Needing a minimum of 20 screens for this project, I referred to my mapped out flows and screens on paper and just went to work creating outlines in Axure. I particularly enjoy this part of the process because it’s the initial formulation of all the research and pre-design planning brought together.
Prototyping/Usability Tests
Once completed with the frames I moved into prototyping, which I didn’t have much experience doing at all. This is where video tutorials are so useful especially in how to start the process and gaining an understanding of what the program is capable of doing.
I ran into my first challenge in figuring out how to create a dropdown menu from the nav bar. After some toying around in the interactions toolkit and referring back to the tutorial, I quickly began to understand the concept of adding cases while needing to hide certain objects until those cases had been activated.

Through just a few hours of learning just a few of the abilities of Axure I felt comfortable enough to help some classmates that were tying to complete similar actions, showing and describing to them everything I had just learned myself. This is where the design process is so fascinating to me in that one piece of information can be the only thing one needs to spark the development of an idea, concept, or creation.
Prototype LINK — http://zzudp1.axshare.com
Usability Tests
Upon completion of adding interaction to the wireframes, I started writing a script for usability flows I wanted people to attempt. I chose to script the user flows shown earlier, demonstrating the focus on solving the pain points and needs of the persona.
-Today we will start the test on the Home page. From there we will ask you to perform certain actions, navigate through the site, and complete specific tasks.
-First, we would like you to take a look at the home page for 1 minute before navigating with the mouse. We want to hear your thoughts about the layout, aesthetics, and overall design.
-Next, begin navigating and find how much it will cost to deliver a shipment to a specific zip code.
-Now, imagine you are completing an actual landscaping project at home and are curious about a past purchase you made to match the exact kind of product you used before. From the zip code page, find this past purchase, labeled Purchase 2 and click. Once completed, you will be given an additional navigation task by the system.
-From the current screen, you want to find a way to email the company about further information regarding that previous purchase. Find the page where you can send an email.
-Once there, imagine they send a response saying that the product you were looking for is Bermuda Tifway 419 Grass. You now want to navigate to this product, add it to your order, view the whole order, and complete the checkout process. Confirm the order.
Results
Conducting these tests were very helpful and encouraging for my first go around in Axure. Users completed all my tasks with great ease and even exceeding my expectations on some pages where I thought they might struggle. Navigation clarity was praised as a highlight, as well as interactive elements like the zipcode map.
As for my design/content, there was a universal sentiment that my home page was too busy and contained too much information. At first hesitant to make a change based on this feedback, I realized it was necessary to scale back and make the Create Bids section a main part of the home page. Although a very small change, I do feel it makes a big difference in achieving the primary goal and not overloading users with content right as they enter the site. Other critiques included using actual landscaping wording in the cart dropdown and bids pages instead of letters/numbers as placeholders which made the content confusing.
Overall everyone was impressed with the design, layout, attention to detail in the interactions, and always keeping the personas needs in mind. As this was the ultimate goal from the start, I believe this project was a definite success in my progression as a designer. Given nothing but a persona and an objective, I was able to research, design, and iterate an entire new experience (e-commerce) for a user (landscapers) that could redefine how they conduct their businesses.
Going forward I aim to take a look at my journey through this project, iterating and refining the research process, while continuing to develop my natural interest and skill for creating interfaces people can use with minimal effort and maximum enjoyment.
