Network Perception

UX Research & UX Design

The Client:

NP-Live is a Network Security and Compliance Software for Electrical Utility Companies. It manages IT infrastructure, made by the company Network Perception.

My work for Network Perception has been in three main phases. This is the first Phase.​

The Task:

 

Conduct a Heuristic Evaluation of the NP-Live software.

Deliverable:

A spreadsheet identifying all usability issues. Ranked by severity, with accompanying screenshots, and proposed solutions.

Process

 

  1. Define Heuristic Criteria

  2. Evaluate through Use Cases

  3. Identify Issues

  4. Propose Solutions

  5. Developer Handoff

Defining Evaluation Criteria

Evaluating a platform heuristically is to evaluate the ways in which the software or app allows users to problem solve.​ It is a powerful tool for determining UX needs.

Method of Evaluation

Heuristic Criteria was based on Jakob Nielsen's 10 General Principles for Interaction Design, with some modifications to answer specific challenges in Network Perception's NP-Live software.​

Prioritizing Changes

It was important to triage, or rank, the needed improvements in a way that would allow developers to prioritize UX/UI updates to NP-Live. The simple ranking system was:

0 = Cosmetic ​

1 = Low

2 = Medium

3 = High

4 = Urgent

Heuristic Categories

Visibility of system status​

Can users understand what the app is doing?

Conventions

Is the app functioning in the way that user expects?

​User control

Do users understand how to manipulate the app?

​Consistency

Are interactions consistent across the app?

​Error

Is this interaction creating an error?

​Recognition

Can users recognize needed tools easily?

​Flexibility

Can users move freely?

​Minimalism

Are there extraneous interactions?

Recovery

Can users recover from errors?

​Help and documentation

Is guidance readily available?

 

UI

Is this a cosmetic issue?

 

Now that Criteria have been defined, the process of working through the app using the criteria will be discussed.

 

User & Use Case Based Evaluation

User Personas and Journeys

Network Perception produced an extensive document with user personas and detailed step by step use cases. ​

To evaluate NP-Live I went through the entire sitemap for each user and use-case to look for violations of the Heuristic Criteria defined above.

Let's walk through an Example:

Rome is a Compliance Analyst.

Rome uses NP-Live to make sure that network connections are up to speed with compliance standards set by the NERC.

Evaluate NP-Live from Rome's perspective.

While going through Rome's use case an issue was found.

The issues were labeled in a spreadsheet.

Example:

Issue #33

Heuristic Violation:

Consistency

Severity:

3

Issue Details:

Two buttons that perform similar functions do not look the same, creating confusion.

Solution:

Define a single button type for this action and apply everywhere this interaction takes place.​

*Screenshots like this were paired with every single issue.

After each use case was evaluated The Development Team received a comprehensive, actionable spreadsheet

 

In all, the Evaluation found 200+ instances in which UX improvements were needed.

Developer Handoff

Spreadsheet

The final product of the Heuristic Evaluation was this Research spreadsheet.

 

It included every issue, its location, its severity, its description, a solution, and a screenshot.

Heuristic

Severity

Screenshot

Graphic representations of the issues found were provided to give an at-a-glance look at areas for improvement

Conclusion

Analysis of the research by myself and The Development Team led us to the decision that a Design System needed to be created to bring consistency to the platform.

This consistency would provide the framework to fix a majority of the interaction issues.

That work is covered in the next project.

Network Perception

Phase 1 - UX Research & Heuristic Evaluation

The first phase was to complete a thorough ​Heuristic Evaluation of the entire NP-Live Application.

Phase 2 - Design System & UX Overhaul

The second phase was to build a Style Guide, Design System, and overhaul the UX site-wide.

Phase 3 - Design System Application & Dashboard Design

The third phase was to develop a backend Dashboard for a different set of users.

© 2023 by David Thrift