BetterAppBuilder CMS Design
UI/UX
2019
Sr. UX Designer, with a team of 2 designers reporting to me
Project info
Challenge
Alteris Group had a product idea of a CMS that would make it easier for small businesses to create and manage their own app. The project began with over 100 Balsamiq, low-fidelity wireframes created by the product owner with no defined branding or visual system and a strict 7-month deadline to deliver a live product to showcase at an expo.
Solution
I led the end-to-end design effort, translating the lo-fi wireframes into high-fidelity branded designs in Sketch, adding both a light and dark mode, and updating the designs for ease of use. Working closely with product, engineering, and leading a team of two junior UI designers, we were able to complete the design 2 weeks ahead of schedule. The finished product was a huge success at the expo.
Platform
Desktop
Timeframe
7 Months
My Tasks
Information Architecture
Visual Design
Q&A
The project when I started
Results
Design Deliverables included:
A Design System
Font Styles
Logos
Primary Colors
Color Themes
Components - Light and Dark
Information Architecture
Journey Maps
CMS High Fidelity Wireframes for the following processes:
Login
Dashboard
App Creation
Media Library
Image Details & Editing
Analytics
Page Edit Design
Admin Settings
Admin App Directory
The project when completed
The impact of my work
Scaled Design Execution through Leadership
Trained a print designer and developer on how to design in Sketch. After training, the two were able to assist me with design and take feedback for updates. They assisted the company with future simple UI projects, scaling the company's design capacity.
By effectively collaborating with my design team and stakeholders for feedback, we were able to complete the designs early. This unlocked more time for development and Q&A on the final product, which ensured success at the expo.
My Process
Research
After researching the project goals, limitations, and thought process of the development team and project manager. I also researched light and dark themes, as that was of interest to the project manager running the project.
Synthesis
From the onboarding interviews with the development team, I learned they wanted limited deviations as the back-end was already built. The project manager wanted it to be visually appealing enough to show at trade events and loved the idea of a light and dark theme. From there, I started creating light and dark theme components and text styles with appropriate contrast.
Research Outcomes
Once I landed created WCAG-compliant dark and light theme components and font styles to ensure design accessibility. I presented them to the team. The project managers and Development team were thrilled with the visual direction, so with that approval, I began the visual design of the application's pages.
Design Process
Every week, I visually designed several new sections for review. Once approved, I designed the opposite theme. If I noticed an issue in the design, I created the exact design requested and a potential solution design to discuss with the team. Once the design system for the product was approved, I brought on my team of designers to assist.
Delegating and Reviewing Designs
I would delegate a section to each designer and then organize adequate design and review time before I presented the designs to development with my own updates. I managed development and product owner feedback at our meetings. Initial design questions came in Abstract. Jira was utilized for component and page flow questions that required visual guides. Microsoft Teams was also always open for general questions between all teammates.
The CMS Now
With the CMS being a success at the Expo, the company gained several product buyers at the Expo, which became future revenue and future custom design projects. The product is one of Alteris Group's lead products to this day.
“The team did a good job of thinking though how to make the system simple but effective, We’ve already got a number of great clients on the platform with several more clients launching apps soon,”
