‍

01 Introduction

Context

RCD's staff spent a lot of time processing applications

RCD offers a range of services and programs to their community, one them being processing accessibility parking permit applications, renewals and replacements.

Before this project, in order to get a new permit, community members needed to collect forms in person, fill them out and submit them manually to RCD.  

Problem

Permit applications were processed manually, which took a lot of time.

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.

Big Takeaways

• Co-designing with RCD's team
• Intelligible form design
• Usability testing

‍

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.

Iterations on form design

Nearly 50% of the user base described themselves hlbing low familiarity with technolol, I prioritized making the experience easy to use and as familiar as possible. Early in the form design, I considered these 3 alternatives;

1. Full form page

2. Paginated sections + progress bar

3. Accordion sections

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

There was a lot to learn in the process for me, these were some particular lessons I'm taking from this project into my future designs;

• People find it easier to digest smaller groups of information at a time. Creating the initial wireframes, I found it helpful to think from "how do I make it easy for people to identity what to do next"
• For responsive experiences, start with mobile design first. It's easier to adapt from smaller to larger screens. Some layouts and components that appear functional on desktop don't necessarily translate.
• Test early and often. This applies with respect to any type of design/product process. It matters most when you're creating a service that's new to the people who would use it.