A new year and a new look for Martial Arts on Rails

Since launching in 2016, one of our major selling points has been the ease-of-use and simplicity of our user interface. User feedback has always been very positive in that regard and we’re looking to build and improve and on that.

In the four years since we originally designed the look and feel of our software. Many new features and whole sections of the software have been added, adding additional complexity and pushing the limits of what our original user interface was designed for.

User interface design trends and user expectations have also continued to evolve. To keep our software ahead of the curve and to address user feedback we’ve been collecting, we have been working on a refreshed look for our UI, which also includes some changes to core features.

Continue reading below to see what has changed and how to try out the new look.

Mobile first design

We’ve always made sure all of our features worked just as well on mobile devices as they do on desktop machines. However, the desktop layout was distinctly different to the mobile layout, which led to different user flows on each device on occasion.

One example is the main navigation menu – on desktop the main menu items would show sub-menus when you move your mouse cursor over it, yet that is not possible on mobile devices as there is no mouse cursor. To accommodate that, most sections of the software had secondary navigation bars that had the same links as the main menu’s dropdown feature, leading to redundancy.

The new design, featured below, places the main menu on the left, an instead of a dropdown menu, each section now has a dedicated sub-menu that is shown the same way on both the desktop and mobile versions.

The navigation menu for our member management section
Mobile version of the same menu

Other examples include consistent treatment of data tables and filters for lists of members, member check-ins, payments and so forth. Handling data tables on different screen sizes is always tricky, but we’re happy with the solution we settle on. As for the list filters, we’ve added many over time based on user feedback, and it became somewhat unwieldy to use. We will have a more consistent experience across devices going forward that will organize those interface elements better.

Example of the list interface on mobile

Revamped Attendance Tracking

One of the key elements we wanted to address was our member check-in flow. Based on user feedback we have been receiving and considering common questions we get on how to handle different scenarios, we restructured the way members check-in into training sessions to reduce friction and potential issues.

There are different factors that determine if a member can check-in to a session –

  • Do they have a membership? (if the membership requirement is turned on)
  • Does that membership provide access to the program / session they want to check-in to?
  • Do they have remaining sessions to use? (in case the membership limits the amount of sessions available per day / week / purchase)
  • Are they overdue on their membership payment?

Apart from having an overdue payment, most of the check-in failure scenarios would previously show the dreaded “No active membership” error message.

Failed check-in attempt – Previous UI

The problem with this message is that it wasn’t clear why there is no active membership for the selected session. Sometimes the member would have an active membership, but ran out of sessions, their membership expired or it does not provide access to that specific session, among other reasons.

In the redesign, we’ve reversed the order of operations for checking-in – instead of the member first picking the session they want to check-in to and then entering their check-in code, they will now enter their check-in code first and then see their active memberships, remaining acccess and what sessions they can check-in to.

Member information shown during check-in

After entering their code, members see their active memberships and remaining sessions, and are able to pick only sessions that they have access to. Sessions that they cannot check-in to are disabled and cannot be selected, and sessions that have already been checked in to are indicated as such and disabled as well, to prevent double check-in to the same session.

This change in the check-in flow should also reduce mistakes where members forget to select their session, and they end up checking-in to the session selected by a previous member. We’ve also improved the failed check-in notifications to provide more detail on the reason a member was not able to check-in to a session.

Redesigned Dashboards

All of the main sections of the dashboard have a new dashboard design, with additional options for displaying data. We’ve added additional graphs and statistics, while retiring older ones that weren’t very useful.

The new marketing dashboard

The redesigned dashboards include:

  • The main dashboard, with a set of new notifications and the option to quickly view who has checked-in to sessions.
  • The billing dashboard, which has additional controls for the revenue graph and our new graph design.
  • The marketing dashboard, which now allows to track leads generated over time.

Improved Family Account Flows

We identified a couple of friction points with family accounts that we wanted to address with this update.

Since we use Email addresses as the username for our member portals, members cannot have the same Email address as other members, even if they are in the same family account.

In practice, it is not necessary for all family members to have Email addresses or the same address multiple times, since the primary family member will receive all Email communications on behalf of the family account members, if they don’t have a separate Email address.

This is a common point of confusion, as it’s not obvious that it would happen, and often managers and members try to add their Email address again for family members only to fail doing so.

To address this, and to streamline the process of creating a family account, we’ve added a few improvements to the process.

Adding family members from the post signup screen

Post sign-up options

We’ve added the option to add a family member directly from the post signup screen, seen above. This will create the family account and add the 2nd family member to it directly, while previously you will have needed to do those actions separately. This action is also available post sign-up in the front desk mode.

You can now also sign-up a family member and add them directly to a family account in one step from the family management screen.

The family management screen now has a “Register family member” button

Those new options for adding members to a family account should streamline the process of setting up a family account. When setting up a family member using those two options, the sign-up form will default to using the primary family member’s Email address, with an option to add a separate Email address if needed –

The sign-up form for a family member uses the family account Email address by default

We Look Forward To Your Feedback

There are countless other improvements we made – The redesign gave us the opportunity to thoroughly go over every aspect of the system and improve consistency.

We did our best to make sure everything works perfectly, however it is the nature of software that with such a big changes there could be some hiccups here and there. For that reason, you will be able to keep using the old design until all the issues have been ironed out and we addressed any feedback you may have.

Please let us know if you encounter any issues or have comments and ideas for improvement. Positive feedback is also welcome 🙂

How to switch to the new design

You can switch to the new design and back to the old design at any time from your account settings. Go to your account settings from the account menu in top-right corner, pick the “New and improved” option in the “UI Version” section, and save your settings.

To go back to the original design, go to your account settings, and this time pick “Original” under the UI version option.

What about the gym website and member portal?

Designing a new, modern template for the gym website is also on our priority list. As part of the UI redesign, we updated the style of the sign-up form in the manager account to match the rest of the aesthetics. For now, your website sign-up form will keep the original design until everyone migrates to the new design, and we address any issues that might arise.

Similarly, the member portal will continue showing the original design until we do the final switch for everyone to the new design. Since most members use it exclusively on mobile devices, we’re certain they’d appreciate the new layout.

Coming up next

We have many new improvements lined up for you in 2020. Here are a few things that we intend to release in the coming months –

  • Improved lead management flows, with categorization, automatic Email campaigns and Email templates, better notifications and alerts and visualization of the lead conversion funnel.
  • Event management for seminars, gatherings and similar events at the gym
  • Multiple instructors per training session
  • A new gym website template, and a pricing page for the gym website
  • Private class scheduling (with an option to schedule directly from the gym website)
  • A front desk user that goes directly into front-desk mode when used to log-in (and cannot exit that mode)
  • And much more!

Please send us any feedback you have on the new design! We appreciate your continued support, and look forward to continue improving our product for your needs in 2020 and beyond.

Published by Eran Galperin

Eran has been developing software for over 15 years, and is a black belt in Brazilian Jiu-Jitsu. In 2016 he founded Martial Arts on Rails, online software for managing gyms and martial arts schools.

×

Get Our Best Content In Your Inbox

Insights on how to build and grow your gym

Subscribe Now
×

Subscribe

Get our latest articles on the business of managing gyms and martial arts schools.

* Unsubscribe at any time