Eurostar Redesign

Nine months in the making, this is the upcoming redesign and re-platforming of the high-speed international rail service, Eurostar. It is available in three languages – English, French and Dutch. The project involved a new responsive look and feel, ‘future vision’ native apps for phones and the Apple Watch, a digital pattern library and a wholesale re-platforming with new editing tools for the content team. My role was design lead on the booking path team, which also included establishing a shared vocabulary across the product teams with the creation of a pattern library.

Prototyping interactions (early designs)
Using Flinto, I prototyped potential micro-interactions, primarily as a presentation tool for developers and a visual cue in discussions with stakeholders.
Prototyping the booking funnel
As well as a presentation tool, I prototyped regularly as a means of iterating between concepts and gathering feedback relatively quickly through guerrilla testing around other parts of the business. Starting with Sketch/Flinto, I gradually ended up working concurrently with the front and back-end developers to iterate within the browser.
Future app vision
This was an impromptu one-week project that sought to encourage shareholders to acknowledge the value of an app strategy that didn’t simply replicate the responsive website. It aspired to create a tailored experience for Business Premier iOS and Android mobile users while reaching larger audiences with limited device development.
Process
Flat designs tend to over-promise and are good for conversations but they rarely reveal the full story. With so much meta-data at our disposal, visual nuances had to be experienced over time. The primary challenges were maintaining rigour and managing the design/UX debt in a two-week sprint process.
User testing
We undertook extensive quantitative and qualitative testing throughout the project. The UX team held panel studies in dedicated labs, while we conducted intercept surveys by interviewing Eurostar customers inside London St. Pancras International Station. New features were A/B tested (sometimes A/B/C/D!) and there was an analytics team disentangling data and informing the decisions of our modular design process.
UX & container framework spec sketches
The holistic framework for content: a flexible and coherent system that empowered editors to provide the best content experience.
The scope creep problem
As new REF data and content lists were being defined and pages being developed, there was worry of an ever-growing and unmanageable array of bespoke layout patterns. Over two days, I mapped out a system of patterns designed to meet content needs as a user experience, so we could manage the scope of build and choreograph pages effectively.
The new e
The age-old brushed metallic Eurostar e logo was unfit for purpose and not strong enough to be seen at any size other than on the train at close up. To rebrand across the entire business (including trains, signage, tickets and other printed collateral) was deemed a too-expensive exercise. By simplifying the brand mark to a flattened shape, we could save money by reducing the number of colours required for some printing, reduce digital load time and increase SEO optimisation whilst improving the visual impact as it relates to digital platforms and accessibility.
Pattern library workshop
A collaborative workshop was arranged across the entire product and content teams to make clear the role of the pattern library. It was a hands-on process that had the aim of encouraging everyone to see first-hand the benefits of ensuring consistency across UI elements and reducing code and visual redundancy to a minimum.