Art Friend
Art friend, a beloved local art store, has been a go-to destination for artists and art enthusiasts for decades. However, the store's online presence has not kept up with the times. With an outdated website that appears to be neglected and unhelpful, Art friend misses out on a significant opportunity to connect with customers and expand its reach beyond its physical location.
An enhanced e-commerce website to upgrade the Art Friend digital presence and successfully widen it’s customer base
Research Methods
01
User Interviews
02
Competitors Analysis and Benchmarking
03
User Personas
Heuristic Evaluation
Card Sorting
Tree Testing
Usability Testing
07
04
05
06
Key Insights
Although artists and customers had varied motivations to shop for art supplies, there were a number of common patterns across purchasing behaviour.
Tactile Buying
Most users use tactile response and sight in their product selection and therefore prefer going into store.
Sentimentality
Many users have a sentimental connection to Art Friend. They enjoy speaking to the store keepers, asking for their advice and recommendation.
Research + Reviews
As art products can be expensive users prefer to do thorough research before buying a product; online, asking peers, teachers or shop keepers.
Convenience
Users who value convenience have purchased online previously, but are often disappointed with the product quality.
Usability
We carried out a combination of Heuristic evaluation and Usability testing to study real user interactions with the current website. This was fruitful is quickly uncovering roadblocks and imminent issues.
Participants
5
Error Free Rate
40%
Task Completion Rate
63%
Average Time for Shopping Task
4.20 minutes
“Navigation can ONLY be understood by pro artists or people who have pre existing product knowledge.”
The way information was organised on the website was a consistent problem among everyone we tested with.
Solution Mapping
"How might we create an inclusive, user-friendly online shopping experience that effortlessly integrates expert advice?
How might we ensure swift, intuitive navigation and encourage widespread use?"
Redesign
Information Architecture
To improve the IA , I ran an Open Card Sorting activity with 30+ participants. I used Dendrograms and a Similarity Matrix to understand that all participants chose to sort by Product Type. Conducting a Tree Testing activity to check if this redesign was successful produced a 14% indirect failure in one category and a 100% success in all other categories.
Old Navigation
New Navigation
What has improved?
To reduce visual load and clutter, I reduced the number of tabs was reduced from11 to 8.
Sorting by General Product Type names as opposed to Specialist names, customers of all knowledge levels could have a similar shopping experience that was easy.
Average time for the same shopping task dropped to 2.3 minutes from 4.2 minutes
Discovery
The revamped Home Page aimed to immediate capture attention while simplifying navigation, setting customers off on their product exploration and purchasing journeys quickly. The original page suffered from clutter and outdated content, severely hindering product discovery and limiting customer expansion. The new design focused on a reorganized layout & simplified content, aimed at increasing click-through rates for existing users while widening ArtFriends addressable customer base
Before
After
What has improved?
Reduced banner size and style. Less text on the banner and more vivid images to capture attention
I added more negative space, bringing more attention to important icons, nav bar, search bar as well product images
I provided multiple ways of discovering a product:
Through brand name for customers who are more brand conscious/ aware
Through ‘art friend recommends’ for those who need guidance and advice
Through product category for those looking to browse or are uncertain of what they want
Product Information
The product pages on the previous website included a great deal of technical jargon that made it hard for a amateur artist to navigate. Product descriptions were severely lacking. Additionally, the lack of appropriate images meant that customers looking to trial a brush or use a tactile feel to help them shop were left having to always visit the physical store. The revamp layout + content simplifies the information available and provides helpful imagery about a products real-world use, encouraging users to make a buying decision within the page itself
Before
After
What has improved?
I reduced the need for scrolling - the most important information is now available on the top part of the screen.
Product pages are more beginner friendly
Product descriptions are far more detailed. I’ve used a friendly, educational tone for product details to be less intimidating
I’ve included recommendations for how products can be used
I’ve added space for product reviews to aid both beginners and experts with their buying decisions
The improvements on this page significantly contributed to a reduction in total shopping time to 2.3 minutes, from 4.2 minutes previously
Community
Both amateurs and pro artists commented on the positives of the community aspect of shopping in-store. They enjoyed being able to ask for recommendations from shopkeepers as well as other customers. To encourage customers to shop online it was critical that this “essence of community” was also captured online.
Before
After
What has improved?
I created a subsection of the website that completely focused on the community. This included:
Space for featured artists
Product recommendations from artists
Product tips and tricks
Inspiration and creative ideas to help kickstart creativity
Upcoming events in the art space
I ensured that the community pages were featured heavily on the homepage, right under the featured products. Additionally the “Explore the Art Friend Community” call- to-action button appears on the top of every page to ensure that it remains top-of-mind