Modernizing the aesthetic and unifying the user experience of a flagship structural engineering software

Before

After

Brief

The company’s flagship product, RISA-3D is a desktop software that was old, large, and complicated. They wanted to modernize the aesthetic and improve the user experience of this product. This work would then be a base to unify the look and feel of the rest of its product ecosystem.

Client

RISA delivers a suite of integrated software design solutions and technical support services that allow structural engineers to innovate with confidence, secure in the safety and efficiency of their designs.

Audience

Structural engineers or engineer managers who have been loyal customers for decades and may have limited technological fluency

Timeframe

4 months

Role

1 of 2 UX Designers on team of 5

Skills

  • User Research

  • User Interface Design

  • User Experience Design

  • Presentation Creation & Execution

  • Client Management

Deliverables

Design System

  • Picking a typeface to modernize and unify aesthetic

  • Recoloring icons to lessen cognitive load

  • Setting a grid to align each screen

Hi-fidelity Screens

  • Implementing hierarchy for buttons

  • Showing information only when relevant or requested

  • Ensuring consistency in component use

“[They] took the time to learn the software choices before implementing anything, and that’s what made their quality so ideal. They learned how and why we made choices and how they could implement different things.”

Chief Product Officer of RISA Tech

Process

UX Audit

We received detailed walk throughs of the client’s core products – RISA 3D, RISA Floor, and RISA Foundation. Through that, we conducted UX audits of each program, taking detailed notes on what was working and what wasn’t.

Brand Identity Workshop

We conducted a workshop to better understand the client’s existing brand identity and explore what defines its visual style. We achieved alignment on the problem statement, desired outcome, and a visual direction to take the user interface in.

Personas

Through subject matter experts and technical support staff, we pulled together personas representing the majority of RISA’s customer base. We kept their goals, questions, and pain points in mind as we constructed the design system.

Workflow Plan

Once we had a lay of the land, we mapped out how we would build a design system. We decided to take an outside-in approach, beginning with the elements on the outer parts of the product screen and working our way inwards to the dialogs.

Design System

We started by expanding the brand guidelines to include not only color and logos, but also spacing, grids, iconography, and typography. We also tested colors to ensure they followed WCAG standards. Next, we built components based on what currently existed in the program.

Hi-Fidelity Designs

With the components and guidelines, we built patterns for the various sections of the product, such as ribbon toolbar, icon toolbar, properties panel, etc. We wrote up documentation to ensure the design system and screen designs could be used by the client after we handed the deliverables off.

Outcomes

The design system was implemented and is currently live in the software. The client invited us to roll out this design system onto their other products.

Reflections

Building a design system from scratch is not a small undertaking, especially with scant brand guidelines. We spent a lot of time upfront getting guidelines and components as close to complete as possible before we starting on patterns, but ended up tweaking many components to better suit their implemented context. If I were to redo this project, I would add components to the design system incrementally, based on redesigns of key patterns of the software.

Client-vendor trust was crucial to this project’s success. Establishing trust is not a one-time event but a consistent effort throughout. Showing work-in-progress with appropriate cadence, explaining the rationale behind design decisions, and involving them in key decision making processes all work together to build strong client relationships.

With more time, I would have standardized RISA-3D’s workflows through user research, subject matter expertise, and analyzing RISA’s other products.