SSCS User Interface Design

I help streamline the user journey for SSCS software and web applications by applying modular design principles that create a simple and accessible workflow.

Objective

The interface needs to be familiar to veteran users who are accustomed to our previous product versions.

The interface must be equally intuitive and appealing to new users.

The designs must be on-brand and well-aligned with current trends.

Research

Research about user pain points and workflow needs are gathered via multiple internal channels:

Customer Support teams gather insights from calls
Sales team members gather feedback via relationship management

Context

SSCS creates back-office software and applications for gas stations, convenience stores, and petroleum retailers. Founded in 1981 with over 15,000 sites nationwide, customers value the product for its ability to increase profits through automation, monitoring, and standardization of crucial data.

Sample Pain Points:

Users with high-volume data have difficulty viewing the fuel dashboard on mobile devices.
Users need a way to leave notes for employees in subsequent shifts to communicate about expected deliveries, vendor issues, etc.
Alerts meant for overall staff knowledge can be dismissed by individual users, leaving subsequent users uninformed.
Users find it easy to confuse “cancel” and “delete” functions in the context of inline editing modules.

Figma Prototyping

I create mock-ups in Figma using a shared library of assets and iterate on these designs with the product owner and developers. This is a collaborative and evolving file that helps me communicate designs effectively and ensure designs are applied accurately by developers.

This Figma file is for prototyping modules in the Computerized Daily Book. We use the same setup in Figma for designing prototypes for our other products as well.

I created this shared library assets in tandem with our Content Delivery Network to streamline our prototyping, iteration, and application process.

Iconography

To assist users with module recognition and understanding, I design icons and glyphs that communicate function and purpose.

Data Visualization

Our dashboards display fuel and merchandise data in a digestible manner that visibly exposes points of interest and outliers.

Key user needs for the dashboards are that the designs need to be responsive and appealing for small and large ranges of data as well as accessible in terms of color, text sizing, etc.