UX - Dealer360 — 7wordsmax

Overview

Purpose

Dealer360 was a collection of individual web applications built by various teams across different companies that served a specific OEM. Because these apps were built as “one-off” applications to serve a specific need of a stakeholder, all the apps had their own unique styles and UX patterns.

Later this product evolved into our CoEFFICIENT platform.

Objective

Unify the collection of apps so they felt like a single product built by a single company that it could be packaged and resold to other OEMs.

Approach

Thoroughly document each application, identify common UX patterns and functionality and incorporate a design system that could be shared across applications.

01_Documentation

Before I could begin to unify the various applications, I needed to understand exactly what each application did for our users.

I also wanted to clearly document the work flow and user tasks of each application so that I could later identify common pattens.

Screen Shot 2021-07-20 at 10.43.24 AM.png

Screen Shot 2021-07-20 at 10.43.36 AM.png

Screen Shot 2021-07-20 at 10.43.13 AM.png

Screen Shot 2021-07-20 at 10.43.45 AM.png

Screen Shot 2021-07-20 at 10.46.27 AM.png

Screen Shot 2021-07-20 at 10.46.37 AM.png

Screen Shot 2021-07-20 at 10.46.48 AM.png

Screen Shot 2021-07-20 at 10.47.04 AM.png

Screen Shot 2021-07-20 at 10.48.39 AM.png

02_Develop a Plan

After I had a clear understanding of what each application did, I partnered with Product Managers to learn more about the future strategy of each app.

I wanted to make sure I was planning for the future.

Countless wireframes were created for each apps in Dealer 360 to illustration functionality, possible new features, and how the various applications might work together instead of so separately (ie, share a metric from a Dashboard into a different application)

Screen Shot 2021-07-20 at 11.56.27 AM.png

Screen Shot 2021-07-20 at 11.55.46 AM.png

Screen Shot 2021-07-20 at 11.56.15 AM.png

Screen Shot 2021-07-20 at 11.56.59 AM.png

Screen Shot 2021-07-20 at 11.57.39 AM.png

Screen Shot 2021-07-20 at 11.57.48 AM.png

Screen Shot 2021-07-20 at 11.57.56 AM.png

Screen Shot 2021-07-20 at 11.58.26 AM.png

Screen Shot 2021-07-20 at 11.58.47 AM.png

Screen Shot 2021-07-20 at 11.58.57 AM.png

Screen Shot 2021-07-20 at 12.01.35 PM.png

Screen Shot 2021-07-20 at 12.02.31 PM.png

03_Styles

Still being a very small team and resource constrained, we didn’t want to start from pure scratch. It was way more efficient to buy a template that gave the basic fundamentals of the design system that could be modified to our liking.

Later we’d build a more robust living style guide (based off of Bootstrap) that we could continually iterate and build on as our needs fit.

Screen Shot 2021-07-20 at 11.13.37 AM.png

Screen Shot 2021-07-20 at 11.13.53 AM.png