Passport’s Portal UI Redesign
Redesigning Passport’s Client Portal, the back-office parking management tool used by 800+ municipalities, to be more user friendly, educational, and easier to navigate..
My Role
Lead product designer
Challenge
Establish a new UI visual language and form pattern that made the app easier to navigate for new users.
The Process
Establish redesign goals
Passport Client Portal users are often older, tenured, and are offered training on the software when they are onboarded. However, as the tenured workforce churns and newer users enter the municipal workforce, the complex interfaces their predecessors operated were going to prove challenging to onboard new users to.
Be more user friendly
Introduce multi-page (wizard) experiences instead of complex, single page settings
Introduce onboarding with app education
Simplify color usage so Statuses would stand out best
Before
Tall pages, no visuals, and flat info hierarchy.
After
2. Get inspired and explore design possibilities
First experiments were with navigation layouts. Client Portal had a mature site architecture so any redesign was primarily structural eg. should feature settings be centralized or located within the feature?
Experimentation then expanded to table design and further sub-navigation display.
Here we focused on onboarding. We set a clear pattern for setup across the app, so creating a policy, profile, or setting happens step by step with a few questions at a time.
We first tried larger, more visual radios and checkboxes. That test confirmed a core goal of the redesign: be truly user friendly.
3. Extend and test the redesign with specific features
Balancing onboarding and setup needs, we designed the wizard to handle complex flows like Create a Policy, with a map UI and step‑by‑step setting screens.
We continued to extended the visual onboarding approach to boost adoption, using visuals to highlight and guide users to new settings.
4. Tackle complex data display scenarios
With the navigation and setting management UI feeling established, we graduated ourselves to dashboard and data display. Dashboard design included filter management and card design, as well as more status display.
A key opportunity the original design missed was complex table cell layouts. Basically, we wanted to condense the number of columns our tables had (many often had horizontal scroll) so leveraging a multi line display of data in a cell was a game changer.
Results
While I left Passport before this could be implemented, the project certainly inspired our dashboard designs as we tackled the complex world of Curb Management. During the design phase, we proved to ourselves and our peers that complex forms can be simplified, that navigation bloat can be tackled, and that onboarding was a crucial element to keeping our customers happy.