Artayo E-Commerce Site
Helping Artayo to showcase its range of products while maintaining local brand image.
Duration: 2-Week individual project
My Role: UX Research, UX Design, Information Architecture, UI Design, Visual Design
Tools: Sketch, InVision, Adobe Photoshop, Guerilla Interviews, Card Sorting, Keynote
This was a speculative project for a concept brand Artayo. The company business model was based on customer service, reasonable pricing, and keeping it local. The highest priority will always be given to the face-to-face contact with their customers, but they see opportunities to support the local community by allowing people order some products online, and either have them shipped to their home or work, or picked up at the store. Artayo source from a variety of suppliers and are able to offer customers the best range of products at the most competitive prices.
The brief asked to design an e-commerce website for the East-London based art supplier Artayo to showcase its range of quality products, while maintaining local brand image. The main challenge was to maintain Artayo’s ‘small shop’ appeal and great customer service. Unlike e-commerce retailers such as Amazon, they offer a highly-curated inventory, focusing on hand-picked quality over quantity, so it was important to reflect that brand image within their new website.
To learn more about the customers’ needs and pain points, I conducted a contextual inquiry on two sites in the East-London area as part of the research team. Through observation and conducting guerrilla interviews, I collected some key findings, which then helped me to design the product that will meet the right needs of the users. Based on all the research findings I created a user persona to help guide decisions about product features, navigation, interactions, and visual design. My persona was Jennifer, a city worker with a creative flair, who lives a busy life in London.
To understand how clients would categorise products available on-site, I conducted three open card-sorting tests each with a different user. This helped me to understand and build categories that make finding the product easy and intuitive for the majority of site users. When proceeding onto defining the site map for the website, the challenge was to use as least number of categories as possible to avoid long, never-ending lists of products, which were very common for other art supply competitors and use filtering to allow search and choice of the final product. I then translated the site map into a navigation system, which guides the user through the site. I imagined how my persona Jennifer would navigate through the site to complete the task to fulfil her needs and created a user flow having my persona in mind.
Prototyping and Testing
All the research findings and user flows led my ideation process and resulted in creating first ideas for the actual product screen flow. I conducted a series of tests with the seventeen different users in three key stages; starting with low-fidelity paper prototype, low to mid-fidelity clickable prototype, and mid-fidelity Sketch prototype. Some of the key iterations were regarding positioning of the filters feature, adding “sorting” button to allow an option to further sort the filtering results, and adding an option to proceed with the purchase as a guest. Also, implementing a returning customer reward, redesigning the shopping cart and delivery pages.
The next step in the further development will be to add a feature that will allow users to compare few images of the product by choosing and aligning them next to each other on the page. As it was important to the users to be able to compare few similar products in more detail, which enabled them to choose the right product for their needs. Also, exploring and adding wish list page and functionality.
The final deliverable is a 'click-through' prototype for the e-commerce site, using a desktop first approach. The solution is an experience of shopping online, designed to meet the goals of users as represented by the provided persona, and the business goals of the company. The users have a clear ways of locating specific items and an efficient way of purchasing multiple products. They can also browse products related to their current selection, read and write reviews, be rewarded for their loyalty and contact the business through the chat feature.