Product Design | 2015

Managing Infrastructure Issues in Guatemala

How can we bridge communications between civilians and municipalities to address water infrastructure issues?

Client

Champion Software, a Guatemala based software company

The Challenge

Pasalo (“Pass It On”) is Champion Software's cross-platform issue management software used by various organizations to coordinate, delegate, and resolve community-reported infrastructural issues. It is currently used by Empagua, the Guatemalan municipality’s water service, to resolve civilian-reported water leaks, maintenance requests, drainage issues, and more. With multiple types of users (civilians, infrastructure repair agents, administrators, QA, etc), the existing desktop web app needed to be redesigned to clarify permissions and functionality for each type of user, improve the clarity of the user flow, and create a consistent visual pattern that was easy to use.

Involvement

I worked with a product manager at Applico, the platform business consultancy I worked at, to define how our client's app could facilitate two-party transactions and design the wireframes for what that app would look like.

The Outcome

After extensive reviews with the client, I reorganized the task flows for various user groups and interaction maps into a clear work flow breakdown. This helped identify one repeatable design pattern that could be extended based on complexity of the task. I created lo-fi wireframes with Balsamiq and followed with hi-fi wireframes in Sketch for the mobile and desktop breakpoints of the web app. These wireframes were handed over to an internal front-end development team to implement.

How can Guatemala bridge the gap between civilians and municipalities to flag and address infrastructural issues in need of maintenance and attention?

Though there was a beta in production, the redundant color schemes and mixed functionality made the process of reporting and responding cumbersome. The lack of differentiation and specialization across the desktop, tablet, and mobile products for all types of users in the system (resolvers, QC, delegators, administrators, etc.) creates visual clutter and work- flow confusion. Event statuses, app flows and functionality, color coding, and iconography all lacks one global standard within the application, and is instead separate (and sometime conflicting) between user types. Simpilfying the organization and clarifying the consistency of the desktop application design can streamline the work-flow for the most feature-intensive uses of Pasalo.

The current state of the system

The existing Pasalo application before we started working on it was a mix of non-native patterns and redundant colors. Without a global standard, the system created work ow confusion among the many different types of users.

Persona workshops

We held a workshop with the client to create 4 target personas who would use Pasalo. While the application was first used by Guatemala’s water infrastructure company, Champion Software hopes to white-label Pasalo for other event-based issue tracking software. The personas helped keep the diversity of future potential users in mind.

Defining required features by user group and device

Given the complexity of the system, I interviewed the Pasalo users to split the features of the enterprise application across three device mediums, each focused on the actions central to that user role.

Core Workflow

I worked with the Product Manager to white-board the core workflow.

Understanding the information hierarchy of the Pasalo system

Through multiple meetings with the team and their users, we began to clarify the task management and resolution process to reduce redundant work and find the simplest possible flow between user types. We also created one, global color scheme that would be consistent regardless of user type.

Wireframe of the Delegator's admin panel, which assigns tasks to be fixed within certain areas

Wireframes and prototype

After extensive reviews, I created mid-fidelity mocks in Sketch and prototyped in Invision to demonstrate functionality and connections between the screens. Simplifying the organization and clarifying the consistency of the desktop application design helped streamline the workflow for the most feature-intensive uses of Pasalo. Ultimately, the final product of this engagement was the fully interactive Invision prototype, which was passed to the client's development team to implement.