Case study - David Lloyd Leisure

Technical analysis, strategy and planning for the website redevelopment

Overview

Alongside Precedent, I worked with David Lloyd Leisure to plan the re-design and development of their responsive website, back-end member systems, and two apps.

Responsive views of the homepage of the David Lloyd Leisure Ireland site

Precedent, a full-service agency, were providing UX, design, consultancy, planning, front-end, and back-end build. I worked alongside them as a Technical Analyst and Consultant, performing initial research, architecting solutions, documenting information, and overseeing build.

Involvement

My work involved the following:

  • Working with the David Lloyd Leisure in-house IT team to balance user needs, business frustrations, and IT realities.
  • Investigation and analysis of numerous fragmented systems including two timetabling and booking platforms, a content management system, a video delivery system, a CRM, user rights management, assorted web services, and multiple apps.
  • Planning of the CMS (Sitecore) implementation, including data models, architecture and hosting.
  • Technical architecture of a consolidated system, including unified timetabling and booking, and a strategy for the later integration of online user registration.
  • Front-end recommendations and prototyping, including a concept making use of geolocation, and detail around making complex booking elements work with responsive design.
  • Testing new web services created for the project; ensuring all information and documentation was in place for developers prior to build.
  • Formal documentation of all work in wiki format, using Atlassian Confluence.
  • Participation in full-team user story sizing, sprint planning, show and tells.

New homepage of the David Lloyd Leisure Ireland site

Above: screenshot of the re-launched David Lloyd Leisure Ireland site. Thanks to ami.responsivedesign.is for the top one.

The project

The website redesign was to be rolled out across territories in phases, starting with the launch of the Ireland site, and a subset of all eventual features and functionality. Not only had considerable back-end system changes been undertaken as part of this redevelopment, but the clubs themselves had to update their processes, so a large amount of training and monitoring was in place internally.

The site features included individual club pages (separately managed), a guest pass reward scheme redemption (switching from a print-out-based process to purely digital), timetables, class and court booking, an API to serve a mobile app, a single sign on between the website/two booking systems/social logins, the ability to update account details, email marketing integration, emergency messages, member referral awards, tag management (using TagMan), and videos (transitioning from an internal platform to using Vimeo). All of the above were within my remit to investigate, scope alongside UX consultants, document, and architect a solution for.

I’m particularly proud of the work I did with planning the new implementation of the timetable system. Timetables for different sports came from two different systems – one via a webservice, and one via a CSV drop. It was not possible to consolidate these processes, and each had a totally different set of data.

I had to create a method of gathering data from each, including reconciling both data sets and common elements, identifying what we could display, and working with the UXers/designers in order to translate this through into page layout and functionality. Presenting timetables in a responsive manner was particularly challenging, and whilst the project launched with a simplified view, there is a more enhanced version to come.

Scrappy technical planning notes

Data set reconciliation

Timetable planning

Other very enjoyable elements involved me getting my hands dirty, and putting together a little proof of concept to check our idea around certain geolocation information was sound. It involved using the HTML5 Geolocation API, reverse geocoding using the Google Maps API, outputting the most relevant address data, and sorting results.

“I brought in Sally to fill a much needed role as technical lead to scope technical requirements, discovery of client landscape and solution architecture across a number of our biggest projects.

She faced all our challenges of new processes, untried new systems, and very murky beginnings to complex projects with utter initiative, tenacity and purpose, leading the way without needing major guidance. I could trust implicitly her knowledge, sense of direction and attention to detail whether defining new documentation standards when specifying integration points, writing up analysis of content management systems or holding stakeholder interviews. This versatility was essential for such a broad and high priority brief and I am pleased to say she delivered with integrity to the end and cared about the completeness and quality of her work. Her ability to jump in and work well with colleagues as part of a multi-disciplinary team was also critical to its success and established robust relationships that still endure.”

Marc Goblot, Executive Tech Director at Precedent

Software and processes

The team held daily stand-up meetings/calls, which the client team was often part of. David Lloyd Leisure staff frequently worked from the Precedent offices, and attended show and tells every two weeks, as well as myself and Precedent often visiting the DLL head office at Hatfield.

Documentation was done through Atlassian’s Confluence, and was thorough due to needing approval from David Lloyd Leisure’s stakeholders. All documentation was linked to user stories held in Jira (using the Greenhopper interface), and vice versa. Gliffy was used to create the many diagrams needed, which allowed us to edit them directly within the wiki pages, rather than re-importing new images each time.

The Precedent team were able to take over the boardroom, creating a dedicated project space to cover in visuals, post-its, and sketches, and in the room was a mix of UX, design, strategy, front-end, back-end, and QA resource.

The room

The CMS involved was Sitecore, with TeamCity used for CI, Mustache/Handlebars for tempting, and Axure for wireframing. Extensive sketching was done, and despite the heavy documentation the different discipline team members worked closely, either directly in code, or by collaborating on sketches.

Sketching

Contact me

If you'd like any more information about what I did on this project, or would like to talk to me about doing something similar in the future, please get in touch.