The Problem
Need to move fast
My client had an enterprise app that converts a set of photos into a 3D Model designed and built by an outside consulting agency. Before releasing the Beta, the product owner came to me to see if I could redesign the app from the ground up inside of 3 weeks.
Initially I was told that the business owner that they were "fine with the look and feel" of the current app and just wanted to address a couple of key areas of concern.
Here was the first area of concern ↓
I was asked to clean up the side panel above and add some additional information. This is what I came up with ↓.
OK. This is starting to look a bit better. My guess is that you already notice a whole lot of other areas of concern both from a UX and UI perspective.
- First off, it's ugly
- The grid is not aligned properly and the gutters are far too wide
- The primary color does not pass color contrast tests
This app is in serious need of design love.
The Solution
Show them something pretty
Sometimes serendipity is needed. Once my initial mocks starting circulating around the Product team, a prominent member of the Product team mentioned that the initial designs I had produced were "lacking". That person went on to say that this was a high profile project, that it should look "awesome" and should be dark theme.
I want to take a moment to explain my approach in situations like this. I have learned that pretty wins. Showing them something pretty creates a sense of aspiration. Developers want to code a good looking design, Product wants to your pretty images to bolster their case for more resources and impress their bosses. The question is not whether pretty images work, it's when to produce them.
In this case, I could tell right away that the product was in desperate need of a redesign but I did not at that time know what kind of schedule the business required. I had just joined the project and had built a positive relationship with the Product owners on previous projects. In this case, I gave them what they wanted (mild edits to the existing product) to show that I am team player. Once word came back that the designs I was producing were "lacking", I knew that was my opportunity to start showing them something that creates excitement and it worked.
As soon as Product got their hands on a series of my pretty images, they went viral throughout the Product, Business and Development teams. They quickly gave the approval to revamp the Beta release schedule to include a complete redesign, but it had to be in 3 weeks!
Enter The Design System
This is when Design Systems really show their value
It just so happens that I had also spearheaded the design of the design system. Fortunately, we also had a full-time engineer on this effort so we had both a designed and coded design system ready to roll at the onset of the project. Having the design system up and running made it possible to hit the 3-week deadline. I could design quickly and hand off designs that used almost all standard components from the library which sped up development. It also helps to have good relationships with engineering.
I began an almost daily cadence of producing new mockups for each page of the app with Product and the Front End Engineer on the project. They would make comments and I would adjust my designs. I would also participate in weekly calls with the Business Owner to validate certain assumptions.
Fully Responsive
you have to sell this concept
Having designed mostly enterprise apps over the past 3 years, it is important to me to push for fully responsive web applications whenever I can. Desktop only apps are relics of the past. Users should be able to login into their favorite work apps on any device they choose (perhaps with limited functionality on smaller devices). To me, it is a misnomer that enterprise apps cannot be as beautiful and responsive as their B2C counterparts.
Here was a perfect moment - a full scale redesign. Show them something pretty worked. Why not use that same strategy here as well. In this case, show them how even something the grittier areas of the app, like editing, can be easily accomplished on mobile devices. So that is what I did. I created several examples of how this seemingly "complex" app could indeed be managed and used on smartphones and tablets alike.
The Switch To Light Theme
Another Example Why Design Systems Matter
Ever had a client change their mind? No. Never?
Of course, that happens all of the time. The Business Owner had a last moment change of heart and requested that the app be switched to a light theme. This is another great example of how a well-designed design system can easily allow a designer and engineering team to quickly shift gears.
The Results
Hit the Deadline
The product has been successfully redesigned, coded and released for Beta testing with a target group of beta users. This project was exhilarating, challenging and ultimately successful! I can't wait to see what I can do for your next project.
