‍

01 Introduction

Context

RCD's staff processed applications by hand

Processing accessibility parking permits was one of RCD's most frequently used services. However, this service was stuck in a legacy system because 100's of applications were filled, organized and processed by hand.

With their hands full with other initiatives, RCD had little opportunity over the years to change how they processed these applications.

Problem

Managing physical applications was a costly process for RCD and its community members

Administrative staff were spending large portions of their weeks sorting through physical files. And for community members, getting a new permit involved collecting forms in person, filling them out and submitting them manually to RCD.

The pandemic worsened the inefficiencies in this process; community members could not visit the centre in-person, creating a backlog in physical applications once lockdown restrictions were removed.

‍

02 Research

Early on, I had weekly sessions with the administrative staff to learn about their infrastructure and current procedures for permit applications, renewals and replacements.

In the first month, my team and I focused on key user statistics to guide our initial brainstorms. We gathered that over 70% of community members had low literacy of how to use a desktop computer. And of those users, 30% did not speak English as a 1st language. Additionally, 80% were above the age of 60.

‍

My team created a web-based application management portal, made of two parts:

#1: An external portal where community members can:

• Apply for, renew or replace a permit online from home
• Receive updates on the processing

#2: An internal management system where RCD's administration can:

• Validate and review permit applications
• Track and search community members’ profiles and applications

As 1 of 3 designers, I worked on the part of the application portal used by RCD's community members to apply for, renew and replace their parking permits.

‍

02 Design Process

Co-designing with RCD's team

From meetings with their internal team we mapped the experience registering new users, issuing parking permits and managing their renewals.

We started the design process with a strong understanding of their current process, and tested our prototypes against their current user flows.

WIREFRAMES

Form layout iterations

After surveying a sample of RCD's community members, I observed over 50% of respondents described themselves as having low-to-moderate familiarity with using technology.

I prioritized simplicity and ease of use early in the process, focusing on large, distinct call to action and layouts that mapped the logical flow of information as in the paper forms.

‍

‍

‍

‍

04 Usability Testing

To make better choices on the form design options, I ran usability tests, asking users to vocalize their train of thought, decision making, and frustrations as they attempted to navigate the permit renewal process.

From the tests, I observed more users consistently navigated through the accordion form with accuracy to the given task. The page-by-page granted better focus for users to centre their attention on 1 form group at a time.

I refined this design into higher detail, using components from our design system, Chakra UI, and creating custom ones where needed.

👏🏾 IN CONCLUSION
The final (and current) version uses a stepper component in place of the dropdown bar. It gives the user a clear view of their progress in the form and the flexibility to edit at any point

05 Learnings & Insights

People find it easier to digest smaller groups of information at a time.

When making choices on the flow of actions from one page to the next, I found it helpful to break the experience into mental puzzle pieces forming a larger process. How do I make it easy for people to anticipate what will happen next was a guiding framework in my process.

Scale up from mobile design first.

In particular when it comes to designing for users less familiar with technology. It's easier to adapt from smaller to larger screens. Some layouts and components that appear functional on desktop don't necessarily translate.