SoCal 511 IVR Dashboard Redesign
Goal
Redesign the dashboard to make it very clear and easier for the users to find and run reports and manage floodgate schedules by enhancing the overall look and feel.
Client
Metro LA Safe & IBI
Role
Lead Product Designer
Team Members
Christopher Arendt (Senior Developer)
Nikita (Project Manager)
Duration
April 21, 2022, to Nov 20, 2022
Tools
Whimsical Figma Google Doc Slack Jira
Specialities
User Interviews Site Map Wireframes Design System Prototypes Dev Handoff
The Client:
The SoCal 511 IVR system supports a free service allowing travelers in Southern California to dial 511 and receive traffic, transit, and other related traveler information.
Design Process:
- Design Audit of the current dashboard
- Create a design doc
- Approvals on initial concepts
- Wireframes
- Prototypes
- Design System
- Dev Handoff
What I did:
The first step of the process was to conduct a design audit on the current dashboard to understand previous design efforts, identify areas for improvement, and prioritize usability efforts. I quickly learned that the current dashboard was designed by a developer without any inputs from design, so overall there was a lot of scope for improving the overall usability and look and feel of the dashboard.
I also got an opportunity to walk through the product with potential stakeholders and ask specific questions about the context of use, target users and implementation constraints. The next step for me was to create a design doc that was shared with the client for validation in terms of the goals, objectives, users and Use cases.
Key Insights summarized
Based on users, I fleshed out potential concepts for the Home Page and Reports that were shared with the client, so I know what design direction to go ahead in. On approval of the initial rough ideas, I went ahead to polish the screens to create high fidelity wireframes.
Once I had my components figured out, I started to flesh out a design system to maintain visual consistency across the designs. I started defining the typography, colors and styles, custom icons and components.
To help the client, users and developer understand the functioning of the product, I created an interactive prototype. It's a good practice to follow, to get early feedback, save time and cost and get an early validation before development.
To make developers life easier, in the handoff I provided different responsive views, how the designs would behave on compact and wide displays. After the dev implementation, I also made sure to have an ongoing bug bash and design audits before the launch of the product.
What challenges I faced:
The current system is one of the oldest and to redesign without changing any functionality was a challenge as you are very restricted. Collaboration with Christopher, Sr. Developer was very helpful and his involvement in the early stages helped me understand design flexibility in terms of functionality.
What have I learned:
Communicating with developers in early stages of designs proved very beneficial, especially because developers have different backgrounds, different skill sets, and interests - so they think about the same challenges very differently.
What have I achieved:
The users are now able to generate, save, share and print multiple reports with ease and the operators have a more accessible way to create and manage floodgates.