I researched and designed an improved e-commerce website for Chameleon Video Supply, overhauling their online shop to boost sales and broaden their reach to other creatives within the video/film community.
Giovanni or "Gio," as the locals call him, is the heart and soul of Chameleon Video. He worked in the film industry for over 35 years and understood the power of the story. Chameleon's primary goal has been to empower creators with the right equipment to tell their stories. Chameleon Video Supply does this by partnering with their customer to learn about their needs to give them the best service possible.
"Gio" and the Chameleon family have helped underrepresented groups in the film and video community. Based in Atlanta, GA, they've been especially embraced by the Hip Hop community providing equipment guidance on music videos and short films.
To date, 95% of all sales are made through patronage at the store's physical location. They can only help creators locally because their current website was not a focus in the business. Gio is willing to overhaul their current digital solution to favor something more effective at increasing online sales. After an initial intake interview with Gio and his staff, they revealed some initial must-haves:
The project's result is an excellent first step in setting up the foundation for an e-commerce website that would successfully achieve Gio's goal of updating the business model to be less dependent on local sales. The website would prove to be a valuable asset to the business. It would help further Chameleon Video Supply's goal of providing excellent customer service and providing the right tools for creators to tell their story, inside and outside of Atlanta.
During the discovery phase, I gathered a wide variety of video-related products to get an idea of the type of equipment Chameleon Video would carry. The purpose of this exercise was to familiarize myself with the store's items and, in turn, would be used in the beginning stages of my research.
I then had an open card sort with the different types of items that Chameleon Video would sell to help with the overall Information Architecture. I recruited 10 participants who had varying knowledge of video equipment to sort the things in groups that felt made the most sense.
During these sessions, I took advantage and gathered user interviews, asking them various questions that revolved around their overall e-commerce shopping experience and any pain points they had with finding and purchasing video equipment in the past.
The type of customer that would patronize Gio's store had at least a medium level of video knowledge. I had an assumption that his customer base would have no understanding of video, and the site would need to cater to that audience. The research proved me wrong in that assumption. Even though an occasional novice could go to their store, most customers had some experience creating videos. This moment helped take me to develop two distinct User Personas. (Click images to enlarge)
With the research organized and the two Personas solidified, I felt comfortable in finalizing a Problem and Solution Statement for the project.
Chameleon Video Supply needs a more robust and efficient e-commerce website because they want to grow sales for the business and continue to support more creators in telling their stories.
By redesigning Chameleon Video Supply's Website to have simple, intuitive navigation, a focused inventory display, and a simple checkout system, we will make purchasing video tools online a pleasant experience.
With the information I gathered during the Open Card Sort, I settled on the navigational scheme that would make the most sense for Chameleon Video's typical user. Next, I worked on the happy path for the User Flow.
I began the sketching process choosing specific pages to draw out in order to work out some initial layout options for main content. The role of creating sketches is especially important for three main reasons: to organize my thoughts on paper, to quickly try different layouts and to have a baseline to work from when building low fidelity wireframes easier in the software later.
Grayscale wireframes were then developed with a focus on the user flow to start fleshing how the site would layout content. I made sure to further develop the appropriate number of screens needed to achieve the one task of buying a specific item from the site. This low fidelity prototype would be used for the first round of usability testing with a focus on making sure the user could complete the task.
A couple of things that came up during first round of testing was that users were struggling a bit in the checkout process. They wanted to know what stage they were at. I felt that the checkout process would be clearer once I added some breadcrumbs for the user. I would make sure to include that in the next version of the prototype.
In the next version of the prototype I went with a much higher fidelity. I fleshed out more screens to give the user three different ways to accomplish their task of adding and buying the Sony FX9 camera.
After the second round of testing, a few more challenges came up for the user. One of them being that you couldn’t add an item to their cart without going to the specific Product's page first. The other challenge is that the user wanted some kind of visual cue that the item was in their cart. I added an add to cart option in the thumbnail image as well as added an "in cart" visual cue.
In the final round of edits, I added the ability to add reviews in the product detail page, addressing a need from The Prosumer persona. The breadcrumb trail in checkout was made a bit larger and to let the user know where they were in the process and adding a contact page.
The website overhaul is still a work in progress, but I'm happy with the state it’s in so far. Here are some next steps to continue building and improving Chameleon Video Supply’s e-commerce experience.
In building out an e-commerce experience such as the one for Chameleon Video, designing multiple ways to easily add items to cart is important for the overall shopping experience.
It may be obvious, but the checkout experience was the most challenging aspect of the project. Any minor changes or missteps in gathering their shipping and payment information could result in abandoned shopping carts. The flow of that experience took me a while to get and it still needs some work to make it just right.
Check out the prototype in its current state
