Following their 2013 takeover by Hilco, Code Computerlove were appointed to work with HMV to replace their temporary holding website (that had been in place since they went into administration) with a content focused entertainment hub that connected customers to their local HMV store and the film, music & games they love, whilst also re-establishing HMV’s reputation as entertainment experts.
My Role: Lead UX Architect @ Code Computerlove
What we did
In order to gain a deep understanding of customer needs, behaviour and motivations I worked closely with our strategy team to conduct user research.
We spoke to customers and staff in-store about their current perceptions and experience of HMV.
We posted an incentivised survey on social channels to gather quantitative data from both new and existing customers.
Based on our research findings we created user personas to represented the different customer types.
To kick off the solution design phase I facilitated an internal ideation workshop involving developers, creatives, strategists and user experience specialists. The session was designed to generate initial creative ideas that solved a number of the key project challenges whilst working together as a mixed discipline team. This collaborative approach enabled us to come up with well-rounded and achievable solutions.
A key challenge we faced was connecting HMV’s various other platforms with hmv.com. To ensure that users had a smooth transition between their browsing experience on the hmv.com platform and purchasing on HMV’s separate digital download and physical product platforms, I mapped out user flows. This helped me to identify opportunities to simplify journeys and improve consistency between platforms.
Due to the short initial deadline we worked in fast paced design sprints towards a minimum viable product for launch. I worked closely with designers and developers to sketch low fidelity wireframes in order to quickly develop and validate potential solutions. We worked on a component basis and approached sketching mobile first to allow for progressive enhancement. During sketching sessions I considered appropriate psychology techniques to apply in order to meet journey objectives.
In order to further explore and validate our interface design I created interactive prototypes using Axure. This allowed us to bring the sketches to life and better understand how interactions and transitions would work across various screen sizes.
I conducted guerilla usability testing in local HMV stores to evaluate how intuitive the user interface was to use, and whether it supported the needs of actual customers. This allowed me to get input from a large number of actual HMV customers in a short space of time and ensured a customer centred approach. We tested a mix of interactive prototypes and flat designs and evolved the interface based on user feedback and insights.
Since the site launched we have continued to work with HMV to optimise the site. I’ve analysed heat map, scroll map and Google Analytics data to understand what people are doing on key pages of the site; where people are clicking, and where people are scrolling to. This data has enabled me to identify key opportunities for improvements and areas to base further qualitative research to dig deeper into why people are behaving in certain ways. This approach has informed the continual improvement and evolution of hmv.com.
Crafted to look and function beautifully no matter what screen size you're viewing it on.
Users can preview tracks wherever they are using the mobile friendly music player.
Showcasing staff knowledge & expertise to help customers discover new products.
International Roll Out
The site has been rolled out to Canada & Ireland, each carrying its own locally generated content.