GE Interface Redesign

This newly-released internal content management tool excelled in functionality but could handle improvements in its usability. Through research, implementation, and ideation, an enhanced user interface made the tool visually simple and more user-friendly.

Year

2019

Organization

General Electric

Project Type

UI Design / UX Design / UX Research

Role

Digital Technology Designer

A mockup of the new GE application design on two Mac computers

Project Overview

Redesigning a complex, content-heavy interface

Over the summer of 2019, I worked on a Digital Technologies team at General Electric Research. The team consisted of in-house employees, an offshore development team, two other interns, and a few contractors. While I had been initially tasked with designing onboarding material for a newly-released internal management tool, I ended up shifting my focus for the rest of my internship towards the interface redesign. This was done through multiple iterations following feedback from various stakeholders and employees within the company.

Note: Some text and visual elements (icons, input field information, etc.) have been changed due to copyright and privacy protection.

Challenge

Design a new interface promoting enhanced usability while maintaining the functionality of the platform.

My Role/Responsibilities

UI Designer
UX Designer
Usability Testing

Research & Planning

Onboarding and user testing

Since the tool had been developed and soft-released before I was brought on to the team, I spent my first week learning how to use the platform along with other employees in the company. I quickly began to notice opportunities for creating an easier user experience during my onboarding process. These elements served as jumping off points for my proposal of an interface redesign.

User Testing

The first step I took was to create a list of pain points I experienced while moving through the tool. I asked my coworkers, who were also learning the tool for the first time, to do the same. We compared this list to the concerns other GE employees mentioned in meetings.

Screen mockups of the old GE interface design
Competitive Analysis

I noticed that the function of certain elements in the existing design weren't easily understood by users. After researching the competition, I was able to identify industry standards and trends that are widely recognized. These standards make the onboarding experience quicker and less stressful.

Screen mockup of the old GE interface design

Design

Establishing a fresh look using an existing grid system

Since the platform had already been soft-launched, making changes to the existing grid system would have created major setbacks for the release timeline. I worked alongside the UX developer to create a design system that utilized the existing grid dimensions.

Design System Ethos

01

Purposeful use of color with softer hues & adhering to industry standards

02

Contrast in typeface weight and size create a hierarchy to single out important information

03

Similar component layouts that remain consistent throughout all pages

Color Palette

The project manager asked to maintain the existing purple color somehow. Building off of the purple, I expanded the color palette to suit the needs of the tool's complex information management system, as well as working to adhere to industry standards. After receiving advice from a colorblind employee, I made iterations to the palette by only using hues and contrast ratios that passed colorblindness tests.

Key Considerations
  • Tints of the primary colors facilitate visual hierarchy
  • To ensure visual accessibility, all color combinations were run through colorblindness tests
  • Vibrant tertiary tones stand out and conform to industry standards
Screen mockup of the new GE interface gridding system and style
Style Guide

I created a style guide throughout the redesign process consisting of every visual element and its respective dimensions. The guide was referenced by the designers and development team to eliminate confusion and ensure visual consistency across every page.

Style guide for the new GE interface design

Final Interface Design

Designing for efficiency and easy collaboration

After multiple iterations, I arrived at this final design. My main goal was to reduce the friction that was experienced when users onboarded the complex platform. By organizing content into relevant categories and consolidating information through various design tactics, the new design was visually simpler and intuitive.

New Content Page

Input form to add new content to the database. The form content has been reorganized and ordered based on function and importance. All optional fields are hidden under pop ups and drop downs to prevent visual overload.

Screen mockups of the new GE interface design
Event Calendar Page

Displays events in multiple view layouts to accommodate users preferences. A new filtering system allows for narrowing down visual load.

Screen mockup of the new GE interface design calendar page
Content Management Page

Displays materials uploaded to the database with the option to view or share them within the platform. Users can filter their search results for more accuracy.

Screen mockup of the new GE interface design content management page

Final Thoughts

Amazing first professional experience

This was my first experience working on a large team. I attended and conducted multiple in-house meetings within my team, as well as with other teams throughout General Electric. In doing so, I learned various public speaking techniques and improved my confidence. I also communicated virtually, with developers and stakeholders across different time zones. I was able to practice selecting the most appropriate terminology to explain my work based off my audience. I was also able to further my experience designing under company constraints and guidelines.

More Projects