As the Creative Director at Bucky, I designed a custom website with a simplified content management system. Each main category page features a lifestyle photo with select products. Below this, all of the items in the category are accessible. The goal of the design was to keep it as simple and elegant as possible and to convey a relaxed and calming user experience reflective of the product goals.
When tasked with redesigning our eCommerce site I collected feedback from customers and the Bucky team and identified the following problems:
Initially I wanted to do both the development and design of our eCommerce redesign. I took two classes online through Lynda.com; an eCommerce development course, and a course that explained SEO (search engine optimization).
I learned a lot about databases and the structure of eCommerce sites, but when it came down to the payment processing and some of the more advanced features, it became evident that we should hire a developer.
I took on the UX/UI designer role and worked directly with the developer. I completed a benchmark study and competitive analysis of other websites, and took detailed notes on effective user interfaces.
Working with the developer, I created a site map and identified the structure and how the new content management system would work. This new structure was flexible and scalable and addressed all of the pain points of our previous design. The areas in gray were flexible pages that could be updated with an open source HTML editor. The new information architecture also provided exclusive information for wholesale customers.
Next, I created several mood boards and visual design options for the new site. The new website should reflect the products with a relaxing and comfortable user experience. It should be easy to find products, with clear and concise navigation, showcasing quality products, with a trustworthy and easy checkout.
Once the mood and site map were established, I then created high fidelity wireframes in Photoshop. From there the developer worked from the wireframes, previous website, and site map and created a test site.
I did extensive testing in different browsers and operating systems and made sure there were no issues. We kept a excel document to identify a punch list of features and issues that needed to be fixed.
For my portfolio purposes, I created an interactive prototype using Adobe XD. It works fine in Safari but I have noticed that it doesn't work in all versions of Chrome. This is an Adobe thing, and not something I can fix (aside from recreating it in another program). My apologies if you see this error message: There was a problem displaying this prototype. Please try these troubleshooting steps.
The new user interface was visually appealing, easy to use, and felt trustworthy. The customer service number rarely received calls, customers were able to find items, and check out with ease. The backend CMS made it easy to update items. We created a way to hide out of stock items rather than sending an unfriendly out of stock error message. A separate wholesale portal was created and wholesale accounts could now order online.
Our Alexa rank went from 2,000,000 up to 350,000, increasing our traffic by 471% and eliminating our need for Google Ad Words.
Our online sales went from less than 3% to over 15% of our yearly revenue.
Showing an increase of 400% in one year.
This website functioned well from 2009 to 2013. It was designed before smart phones were widely in use and was not responsive or adaptive. If I were to redesign it today, I would take that into consideration. I would also make the design more flat, expand out the tabs and make all of the products shown below instead of items only in their individual categories.