Their member subscription service allows its users to access fitness workout videos, recipes, and results guaranteed workout and nutritional programmes. All of this can be accessed from the comfort of their home on their mobile, tablet or desktop devices.
Challenge & Objectives
Having worked together with RwL since their launch in 2013, we had made various modifications to their website along the way. Listening to user feedback, feature requests and implementing new changes to constantly improve the website’s user experience and simplify usability.
In 2014 we discussed giving the website a complete overhaul, implementing a multitude of new and highly anticipated features, which users would come to depend on for their day-to-day fitness regime.
Solution
Mapping out the entire user journey
After collaborating with RwL from their launch, we all had ideas on ways we could improve the user experience of their site, and build upon its functionality. The entire user journey was prototyped to enable the RwL team to walk through every user scenario for each of the existing features, whilst also accommodating any new journeys a user would undertake.
Previously RwL offered nutrition and workouts separately, but on the new website they wanted to integrate the two together.
We implemented a multi-tier tabbed accordion which allowed the user to also use this as a progress bar, to see how far through their plan they are, without having to load page after page. This could now all be done via the new improved dashboard. On mobile the website also included a tap/swipe accordion, allowing the user to mimic the desktop experience on their mobile, whilst utilising familiar mobile gestures.
Conversion Focused Homepage
The homepage of the website was geared towards data collection and signups. Although the homepage provided testimonials, write ups and lists benefits; we wanted joining for free to provide a true experience of what users could expect if they moved to a paid plan.
The navigation provided anchor points to areas lower down the page. The only onward journey from the page was to begin the sign up process.
Social Integrated Sign Up
With so many RwL followers connecting socially, users were now able to register or link their existing account with their Facebook or Twitter accounts for easier sign in.
Modals were used to capture email registrations before progressing to the pricing page.
Creating an Expandable Plans/Pricing Page
The RwL plans page was actually quite a challenge, trying to ensure it was expandable for when new plans were introduced. The typical comparison vertical columns wouldn’t display all the content clearly, so placing in a horizontal accordion allowed us to showcase the core components of the plans whilst open, and comparing prices when closed.
Using an expandable accordion approach for the plans page allowed us to easily introduce new plans without compromising the design.
Anticipating Questions & Delivering Answers
With users not knowing which plan may be right for them, RwL created a fitness quiz, which posed another challenge for us on how we would deliver it.
After some planning and interaction discussions, for both desktop and mobile we developed a visual solution with subtle images with the core questions, before providing results based on chosen answers.
The quiz allows users to identify a plan best suited to their lifestyle in a few short visual questions.
Providing Guidance If Required
With thousands of users already using the site, making any change to a user’s usual routine can cause upset. So prior to the launch, walk through guides and visuals of the new site were sent to existing users preparing them for the upgrade.
We also provided a walk through that appeared for all new and existing users on first login, with a new dedicated help section should they have any further questions or seek support.
We anticipated the migration from the old website to new would take some getting used to, so in creating a tour we allowed existing members to quickly learn how to access their old features whilst also discovering what was new.
Redefining the User Dashboard
Achieving a balance between form and function was our goal here. With so much content to include, our focus was on usability.
The new dashboard gave the user an overview of their daily workouts and recipes, and access their plans, and any of their personal settings all from one central place.
Implementing Progressive Delivery
Although users can freely watch videos and look at recipes, some plans are structured. The RwL team wanted these plans to only display certain content at milestones in the programmes.
With the inclusion of the tabbed accordion, we could showcase introduction videos, shopping lists and all other information in a single place. Each day a new workout playlist and a new meal plan is delivered, all tailored to the user’s progress.
At the end of the programme the goal tab is shown and the user can select the next plan for them, whether that’s to go it alone, or to take the next fitness challenge.
The newly structured programmes allow users to easily follow their programme in a chronological order.
Drip Fed Notifications
RwL are constantly adding new features, pushing offers and sending motivation emails to their users. We implemented a new notification system, so they could schedule countless motivational or inspiration messages and offers, all targeted to the individual user based on their progress.
If there was any planned maintenance or new features being added the RwL team could simply notify each user simultaneously.
Time To Workout
From the original website the main focus is providing access to a variety of workout videos. With the upgrade came greater filter options based on length of workout, intensity, target body zone, user rating, or equipment required.
Dynamic search was also implemented to allow users to quickly find workouts. We also implemented load on scroll, reducing page loading times.
Favourite, Star Ratings & Iconography
To heighten functionality we allowed users to rate each workout and recipe, to better help others. We also enabled users to favourite workouts and recipes, storing their own catalogue of favourites in their dashboard for later.
New icons and tooltips were also introduced to improve user experience, clearly displaying key stats of each of the videos.
Create Your Own Playlists
A big feature request was for users to have the ability to create their own playlists from the workout videos. The upgrade allowed users to not only create and use their own playlists, but to also socially share and have a dedicated area for user generated playlists for others to use.
Members could easily create, edit and update their custom playlists and even have the ability to sort their workouts to an order tailored to them.
Let’s Eat
Utilising the same layout as the workouts the recipe section was given its own set of filters and food related icons.
Members were provided with the ability to filter their recipes, including dietary specifics such as Gluten Free and Vegetarian only meals.
Real Results & User Timelines
The success of RwL is based on real women achieving real results, and their success inspiring others. Whilst building the new website we wanted to create a sustainable solution that automated the Real Results pages for the team, saving them countless updates.
The RwL timeline was introduced. Using prompts via the notification system, we were able to encourage users to photograph their fitness journey. From uploading a photo of their current progress, and with regular further prompts, users could now submit diary entries and updated photos to their own timeline.
Although completely private, along with all of their photos, we gave users the option to share either an each individual update or their entire timeline, if they chose to.
At the end of their programme the user would be prompted via autoresponders and notifications, to upload their latest photo and submit their RealResults.
The timeline helps members track their progress over time during their RwL experience.
Social Sharing
Within every area of the website we included a social sharing capability. When users are happy with a service they sing about socially, and with RwL their users can’t wait to tell their friends & followers.
Whether via the timeline, RealResults, user playlist, or their favourite workout/recipe; users can share updates on their chosen social network.
By default, timeline “events” would be set to private. But most members who find themselves happy with their progress could share their progress by making their event public.
Results
The website rebuild greatly improved the user experience for members, across devices.
The website proved so successful, that in 2016, the RwL were able to hire a full in-house web and marketing team.
