A One Man Ux Team and a Desktop Application
Story Context
  • I currently work at Jonas as a Ux designer
  • Jonas Fitness makes software for Gyms / Clubs
  • This software runs the entire club facility, from Check-In's to Contract Sales
1. The Problem
Compete Desktop

Let me take you on a journey that spans across a year and two months. It all began with a desktop application and an audience that was craving to get out from behind a desk.

In fact... The very audience itself was against everything that sitting behind a desk stood for. That's right, these were type A, get up and at em' fitness club and gym owners.

So, how do you take an extremely task based desktop application and translate it to the web and to be responsive to boot? Complicating this was the fact that it was waterfall with a very tight deadline, which made user testing difficult.

2. The Research
Balsamiq Mock up

The beauty of Bootstrap... The powers that be did not want to write custom iOS/Android/Windows apps for this project. The expense was deemed to great. I had to figure out a design and system that allowed us to accomplish this all in a web browser. As a web designer, I was well acquainted with the Twitter Bootstrap framework and although I knew there would be some challenges making a task heavy web site using the framework, I devised some prototypes to see how it would work.

But before I get ahead of myself... I also did some leg work in research. I looked at several competitors offerings but there was not much there as no one had a system as complex as ours translated to the web. I researched some other task based Bootstrap sites and templates to get an idea of the best layout for the project. Instead of doing a lot of up front user research and testing, we decided to base the designs on the desktop application as our customers were already very familiar with it. We would then go back after launch and iterate.

Sprinkle in some Balsamiq... I began mocking up designs in Balsamiq and holding design meetings with Subject Matter Experts. These SME's were trainers who knew the system better than anyone else in the company. We picked the most logical modules (the compete system is laid out in modules i.e. Check In, POS, etc) that would make sense to a club owner running the software in a gym. I began doing mock up designs using our framework and branding.

3. The Design
Compete Browser Based

So it begins... I am a one man Ux team at my current job, which means I also have to build the sites. And let me add that when I say build, I mean build the entire site out in HTML/CSS and hand the completed code off to developers who then code the back-end (over 105 HTML pages). To help save time I invested in a Flat UI framework from Designmodo which helped by providing many of the basic components needed for a form heavy site.

Code, code, code... In the course of 1 year, I have built out an extensive portion of the site, which module by module was handed off to developers for coding. The product is being launched officially in March 2015.

4. Iteration
Front Desk Persona
Post it notes. User Testing Focus questions

Personas', User Stories, Flow Charts, Ohh My... I am already making a significant effort to pivot company goals so that we can begin iteration testing the modules that are about to be released. I have proactively set up team design meetings to begin to focus on user test questions. The first module to be tested will be POS since it is very task heavy and has the biggest margin for error in usability. I have already done some contextual user research to create personas' of the users of our system and I am in the process of creating user flow charts of every module.

Let the user testing begin... I will be conducting contextual inquiries on the POS system using some of our beta clubs in the next few weeks. I will be posting videos of those interviews when they are complete

5. Lessons Learned

User test first... I believe user testing should have been done first, despite the fact that it would have threatened the deliverable date. I am happy we are going back now to user test, but the system was based on a desktop application that never itself was user tested. This along with some variables that any web based system can have, as opposed to a desktop app, creates some unknowns for the project that need to be fleshed out. I don't like unknowns.

Design decisions... There are also some design decisions that I made that were based on my assumptions of what the user wants. As I look at them now, I know that there will be changes coming after user testing. But I am happy about that.

Cast aside bias... I started out as a designer back in 2000 and I think all designers have a bias towards the products they produce. It can be very hard to let go and accept that something you have done is not user friendly. I have learned that I need to let it go, no matter how much I like something I have created. Because if users don't get it.. I need to be prepared to change it until they do.

Value Add... The Compete web based app has been a success for our sales department which touts its responsive design at every opportunity to perspective clients. In fact, we have landed several large clients because of the COG design and concept.