Visitor registration app

GymSales are a provider of lead and member management software for gyms and fitness centres. They wanted to extend their product set to include an iPad application for management of visitor registrations.

The challenge

Gym receptions are busy places. Multiple instructors are meeting their students, loud music is playing, phones are ringing.

GymSales wanted to provide gym visitors with a quick and painless way to register as visitors, while meeting gyms’ data and legal requirements. Therein lied the biggest challenge for the project: how to collect all the data required, while keeping the process of registering quick and simple?

Research

I hit the streets and walked to three different gyms where I signed up as a visitor in order to experience the registration process. The main learnings were:

Simplify from the start

Before starting to design, I talked to the client about minimising the amount of inofmation we collect.

The principle we ended up agreeing on is that if the information was not required during the 'visitor' period, we did not need to collect it with this app. Any information that was required for full members would be collected once (if) they signed up as full members.

Animation and the perception of effortlessness

I was keen for the process of registering to feel as effortless as possible. Once the amount of information was minimised, I turned to animation design, using Principle, in order to come up with screen transitions which gave the impression of speed, smooth movement and progress.

Elements logically morph into each other

Where it makes sense, elements morph into each other. This is preferred to elements dissapearing and new ones appearing as it enhances the feeling of continuity.

Object origin

Objects don’t just appear on the screen. They have a point of origin, and a destination. This allows them to enter and leave the screen in an orchestrated manner.

Animation continuity

Movement of individual elements overlaps by a 0.2s, in order to create a sense of smooth continuity.

Breaking animation consistency for emphasis

All animations use an ease-in/ease-out curve with the exception of error messages. Error messages spring onto the screen in order to create emphasis.

Oversized input controls

From my research, I knew that the existing forms were physically cramped and difficult to fill out – I didn't want this application to feel like a form, hence I opted to use large, oversized elements, such as the input fields, action buttons and links.

Usability testing

I improvised in order to recruit subjects for my usability testing – I reached out to friends and acquaintances who joined a gym within the last year. I managed to find three people very quickly and tested the app prototype.

Usability testing with a friend

The key change made after the usability testing was to provide explanation as to why the phone number was needed – some people were uncomfortable with providing this information.

Branding customisation

Finally, I had to make sure that the visual design can accomodate different branding, as this app was to be used by different gyms.

I created a set of guidelines to make sure that different colour schemes could be applied to the app, while keeping text accessible and maintaining the app‘s visual identity.

The outcome

The app was finished in May 2016 and has been rolled out to over a thousand gyms around the USA, Canada and the UK.

A further sign of success was that the major client, Snap Fitness, requested for the app to be extended to cover their entire member signup process.