Logo

Helped IT teams to better optimize performance for their business applications

Exinda provides innovative tools for high-performance network orchestration and WAN optimization. Its solutions make business applications perform better for over 4000 organizations worldwide.

When we first met Exinda, they were seeking a fresh, new user interface for their suite of network analytics applications. What made this project unique was that the application features were already complete, but the visual design needed an overhaul from top to bottom. Their goal was to make it more consistent across applications, and to make it easier for IT teams to understand how users, traffic, devices, and applications were behaving across networks.

Creating a fresh, new visual design

Styleguide

We created a series of templates to establish a visual style guide that the Exinda development team could apply to the current product, and also extend in the future.

When designing for the display of information, a typeface is one of the most critical elements of the overall design — especially for numeric data. We chose Oxygen Light, a free Google web font, because it’s clear and legible, it’s well kerned, and it works well at all sizes. The numerals especially lend themselves well to this type of application.

Visually communicating and summarizing information

A data analytics application revolves around one thing: graphs. We designed new graphing templates that applied Exinda’s new colour palette.

  • Data flag

    Data Flags

    Time series graphs are used extensively in this application, so we designed a quick way to observe activity at high granularity. Hovering inside the graph reveals a flag showing data value and time.

  • Stackedgraph

    Stacked Graphs

    This application called for many instances of layered graphs. We designed a method for displaying layers using 10 new colors for the stroke, as well as a 15% opacity version for the fill to limit visual weight.

  • Progressbar

    Progress Bars

    Progress bar-style graphs can be rather hard to read when done improperly. We designed new progress bars using high-contrast colored fills inside a light gray background, and located label text on top of the bar.

  • Datadonut

    Data Donuts

    Who doesn't like donuts? Yes, they are the same semantically as a pie chart. But by hollowing out the center of each circle, we reduced visual weight and made these popular charts better match the rest of the application's user interface.

Screenshots
View all case studiesNext case study >