My perspective

For just over 5 years, I worked part time as an Aquatic’s swimming instructor and Lifeguard in the City of Markham. Many of my co-workers and me on a daily basis, get many questions regarding registering for swimming programs or swimming levels. We usually try to direct them to also use the Econnect website to answer these questions but many users end up relying on us to help them with their program registration. Although we are trained to deal with these issues, our primary task, as an Aquatics employee is to deal with the issues residing in the physical swimming environment. This makes me wonder, if many customers are relying on use with their registration needs, then something needs to be done with the website that should answer most of these questions.

Primary Research: User survey

Although I have my own views and insights regarding the website, I wanted to ensure that they were not fully biased to what I think are the user’s pain points. One of the key take ways that I noticed from many of the customers was that registering for certain programs are becoming a lot more competitive in terms of availability. As a result, finding the right program with the desired timeslot should be a much faster process.

User persona

I wanted to get a general idea of the type of customers that have used the Econnect website register for a program/ course. Much of the issues revolving around the registration process came from older adults that are trying to register a program for their kids or seniors that want to participate in aquatic drop-in programs.

Heuristic evaluation

I did a thorough evaluation of the Econnect registration website and considered the different visual and user flow elements that require attention or a re-design. Throughout my evaluation, I made sure that I was still considering the insights that I got from my feedback survey.

Mapping the journey

The Heuristic evaluation allowed me to critique elements of the website that were and were not working. With this re-design, I wanted to make sure that I was not taking out visual or interactive elements that were already working for the website. With a user journey map, I pinned out the process of registering for a course on Econnect/ EZ registration that showed larger and lower levels of frustration.

Wireframing

Taking what I learned from my research and critique of the website, I created some wireframe ideations of different page layouts. This was a good opportunity for me to see what truly needs to be changed and what is already working.

Low-fidelity

City of Markham branding

The City of Markham has 2 websites; the Econnect program registration website and their main community website. They have a general brand and colour guideline for their company, so I wanted to try to follow those guidelines as best as I can with this re-design. I extracted some of the colour hues that I found on the sport, recreation, and fitness section of their main website.

Homepage: Pre-login

The homepage of a website leaves a very big first impression on many of its viewers. In the current platform, the first page that the user in presented is a homepage with a vast amount of text that lacked Information hierarchy and most users would probably not bother reading it. My approach:

• Showcase updates regarding program and city events that is easily digestible to the user
• Quicker access to finding the programs that users want more information for registration

Quick searches

• Reducing the time of searching and filtering by having the option to select categories on the homepage
• A clear page navigation on the left side of the page
• A feature on the homepage that showcases program courses with limited availability and this would be displayed based on the the program categories that the user commonly registers

Login to register

Users can browse without logging in but if they decide to register, they will need to login into their account.

Initial login pop-up

• More in-depth updates and news catered to the users search history and preferences
• For new users, there is a dedicated modal to access any tutorials or help require within the portal (ex. How to register for a program, Refund policy)

Adding a program

• Cleaning up the UI of how the programs are being displayed
• The implementation of a cart is to allow users to quickly add a program to register and continue browsing

Checking out

• Reducing the number of pages that the user goes through to finalize their registration
• Instead of a modal, the checkout uses a full page to give the UI navigated by the user more breathing room

Single user account

During the sign up process of Econnect, users have an option to create an account that is for themselves or carries multiples participants. An account with multiple participants are typically for guardians/ parents register for kids 12 and under. The key difference in the single user account versus a family account is that a single user does not have a section to "add participant."