Travel Bytes

Service automation for travel companies

Travel Bytes screenshot

Client

Travel Bytes

Project

Responsive Website

Year

2019

The challenge

Travel Bytes are a digital product agency that works closely with their clients in the travel industry to reduce their cost of ownership compared to building an in-house product.

They approached me to redesign their website to bring it up to the level of their software solutions.

My role

As the UX team of one, I was involved throughout the whole project, from planning, estimating, UX research & design, UI design and front-end development.

Discovery

We held a discovery session to understand Travel Byte’s business, its goals, strategy, customers and so on. We gathered key project information to gain a high-level understanding of the project.

The key goals were to:

  • Modernise to the look and feel
  • Re-package their offerings
  • Improve the messaging
Old Travel Bytes website
Old Travel Bytes website

Market research

We identified four key competitors to Travel Bytes, and carried out a review of their websites and messaging.

This process helped Travel Bytes clarify exactly how they should convey their offering and benefits. They settled on the following:

  • Automation Planning
  • Self-service Components
  • Travel Communication
  • Marketing Engine
  • API Access
  • Flight Alerts

User demographics

As a B2B offering, Travel Bytes' customers are large travel companies that need custom software solutions. From years of working with these companies, the team at Travel Bytes understood what questions potential customers of theirs would want answered before making contact with them.

Customers are interested in learning about how Travel Bytes can help their company, but also how their own customers benefit as the end result.

Content creation

We used a shared Google doc to prepare the content. I worked with them to write their content. I recommended an XY positioning statement as it succinctly describes who you help and what you help them with.

We tried several positioning statements, and they tested them internally to see which felt right. We landed on "We improve your travel company’s bottom line with service automation". This was combined with the key benefit as a sub-title, "Reduce your cost of ownership with our specialised travel software".

We worked through benefits, features, testimonials, imagery, contact details and other key content until we had all content written.

Mood board

I designed components and UI elements to maintain a unified design voice. I made the components easily accessible so that Travel Bytes can reuse the components after this redesign.

Travel Bytes mood board
The Travel Bytes mood board was created as an intermediate step to discuss design elements prior to them being placed in a layout.

Design

A brand new look that's bright, clean and focuses on the key messaging for Travel Bytes' customers.

Travel Bytes screenshot
The hero design for the home page features their tagline, a call to action and the illustration I created. The illustration conveys the features of their software, with end-customers and a chart to represent the B2B's need for data-analysis.
Travel Bytes screenshot
The benefits section with custom icons.
Travel Bytes screenshot
Cards I designed for when they choose to include case studies on their site.
Travel Bytes screenshot
A feature section for the business, and their customers (travellers).
Travel Bytes screenshot
Social proof with a testimonial.
Travel Bytes screenshot
Image gallery.
Travel Bytes screenshot
About page with team shot, content and team members.
Travel Bytes screenshot
Contact page.
Travel Bytes screenshot
Home page on mobile.

Final deliverables

  • Figma mood board and interface designs
  • Responsive HTML templates
  • SCSS for stylesheets
  • Vanilla Javascript for interactive elements
  • Parcel JS as the build tool

Takeaways

For small websites such as this, the largest investment of time should be spent creating content getting the messaging right. I try to emphasise that a great website is only as good as it's weakest aspect. Everything must be performaing well for the project to be a success.