Les Mills On Demand - Web Experience Design
I was contracted as a UX/UI Designer to join the Les Mills On Demand (LMOD) product team and my main responsibilities were in designing the LMOD web experience. The LMOD mobile app had recently been released, but the current website was still based on a legacy design and built using old technology. So my main focus was in designing the new web experience, including desktop, tablet and mobile. The design was to reflect what was happening within the new app and then be expanded on, with features and content that the web experience required.
Health & Beauty
UI Design, User Flows, User Testing
Les Mills International
Research, Journey Mapping and User Flows
The initial process involved meeting with all the stakeholders, understanding UX requirements and expectations. I then went about setting timeframes, analysing previous user research data and existing user personas. I also got familiar with the LMOD app, it’s content, features and functionality. From here I started creating sitemaps, customer journey maps and user flows and rough wireframe of possible screen architecture.
Low-Fi Wireframes and Low-Fi Prototypes
Based on the research I had done and the rough wireframes I had designed, I started building low-fi wireframes (mobile first) of all the screens required for the website. During this process, I presented progress to stakeholders, workshopped findings and iterated designs as required. Once designs were finalised, I then uploaded these into Invision and created a workable prototype. This was analysed and tested in-house, iterated on until it was ready for user testing.
I then prepared to undertake user interviews. This consisted of contacting participants who had agreed to participate in the testing via a survey sent out the Facebook LMOD community. We would agree on a time and date, mindful of time zones, as these were international users. Along with the email they were sent a link from the Lookback software to download and open on their mobile to conduct the interview. At the time of the interview I would ask them some initial questions and discuss specific scenarios, then get them to interact with the mobile prototype. While doing this they could give me feedback on their journey. Once finished I asked some final questions regarding their experience. The session would be recorded and then analysed for findings later. These were disseminated and written up on Miro boards as post-it note clusters for presentation to stakeholders.
UI Design and Hi-Fi Sketch designs
Once user testing findings were analysed and findings complete, the low-fi prototype was iterated on and then finalised. The next step involved creating hi-fi designs in Sketch, based on the low-fi screens from the prototype, these included desktop, tablet and mobile versions. I used established components and design patterns from the existing Les Mills design library. If new components or patterns were designed, these would then be signed off on and saved into the LM master component library. Once screens were finalised, the Sketch files would then be uploaded into Zeplin.