Responsive website

The aim was to take the static website and redesign it to lift the design and incorporate a major component – the booking engine. This would match the iOS app and open the door to new users who use multiple and different devices.

The new design directed users to the main booking funnel through trainer profiles and drove registrations at key touch points.

Research, sketches, concepts

With new functionality being introduced I mapped the key journeys we wanted users to experience and researched best practices from other services.

Responsive grid

In collaboration with the technical team in Moscow, we defined a responsive grid system to ensure a seamless experience across all devices. Once concepts were approved, we decided to use a 12-column grid with fixed gutter widths and flexible columns, with 5 breakpoints.

Final designs

The look and feel was kept consistent with the iOS app, to deliver a site that was clean, transparent and promoted TruBe’s main product – trainers. Primary colours were used more prominently to help give a strong brand presence. Designs were executed across desktop and mobile (and tablet if needed).

Design documentation

To ensure interactions and styles were explained and built correctly, I created various guides for the technical team.