Normal Portal
Overview
Normal Framework is an open, scalable automation platform for real estate portfolios that provides customers with smarter ways to connect to smart buildings. The early-stage startup had already created the foundational Framework product with an agency before I joined.
The Problem
As the product and customer-base grew, a need for a management tool emerged. Users needed a way to manage existing software licenses, purchase new licenses, and deploy and manage sites across their real estate portfolio.
Internally, a design system was also needed for more streamlined design and development.
The Goal
This project had two main goals:
1. Design and develop Normal Portal to help users manage licenses and sites.
2. Create a design system that folded in the existing Framework components, but also improve upon it and add dark mode.
Team
Lead Developer, Front end developer, Product Manager
My role: Product designer
Research and Insights
In previous projects, we created user persona’s. These two, Michael & Sofia, were important for the Portal project. Here are their personas:
And here are their anticipated interactions with the Portal:
These personas, along with detailed specs from the PM, helped to smoothly drive the design process.
Design Process
I began the design process on the visual design side to solve for the new dark mode theme. Here are some examples of the layouts presented in the first round:
After we landed on a color scheme, I started folding those styles into the existing design system. This and impeccable specs from the PM helped me rapidly design the portal screens.
Final Designs
Outcomes & Reflections
From concept to go-live, this project went extremely fast. I love working with small early-stage startups where we can be nimble and fly. Having a strong, componentized design system helps speed the process, so there are no speed bumps along the way design-wise. After the Portal was up and running, the team marketed it heavily and was able to use it for sales and GTM efforts.
