Workstation UI & UX Redesign

What is Workstation?

The premier record management system for government county offices. Installed in over 25 counties. Workstation is an intuitive software that automates document recording, document indexing, document searching, and fee recording.

My Role

During this project I worked closely with the development team to collaborate on successfully implementing the new interface and developed a design system for the product that improved its user interface and the user experience. As the lead designer I was responsible for providing creative direction and insight on UI and UX design practice and principles. I was also responsible for thoroughly identifying design issues and solutions during our initial product reviews, evaluating the usability of the product with each update throughout the process, and creating style guides for each segment and iteration of the project to guide the development team.

Year Started

2017

Design Process

Based on our evaluations, usability testing, and user feedback.

Issues

  • The interface was bare and rudimentary
    • It felt somewhat outdated and needed an eye-catching aesthetic
  • The interface lacked adherence to company branding
    • We wanted to make this software feel more like a company product
  • We needed to improve the user-friendliness of the interface
    • Navigation throughout the interface was unintuitive
      • It could be confusing to locate important features, pages, or information
      • There wasn’t enough distinction or hierarchy between the different types of text, text fields, buttons, links, and navigational components
    • This is a very feature heavy product and it could be difficult to locate or select the correct action within its features
      • Buttons and icons weren’t clearly indicated enough
    • We wanted to make it simpler to navigate to the software’s primary features
    • The user interface did not feel as inviting or interesting to the users because it lacked graphics, icons, or a consistent and effective color-scheme

Solutions

  • Created aesthetic cohesion by implementing an attractive and distinguishable company-oriented graphic style and color palette
    • Created a cohesive library of buttons, icons, and graphical elements
  • Added hierarchy to the interface by:
    • Improving the font usage
      • Improved the font selection
      • Established a clear font size, weight, and color hierarchy
    • Improved the alignment and white space between elements to separate or establish relation
    • Improved the usage of color by placing it strategically to establish order and separate elements
    • Created a large library of categories for the buttons and icons through a standardized variety of sizes and styling to distinguish their meaning, importance, or relation
  • Added four large “Getting Started” buttons to the homepage to provide quick access to its primary features
  • Added helpful features such as tooltips to links and buttons
  • Restructured some of the elements within the interface to modernize and improve their styling

Old Screenshots

A few examples of the product before the installation of the new user interface.