VPS DESIGN SYSTEM

Project Overview

THE TASK

Over the years, many of VPS’s products were built on the Bootstrap framework, customized repeatedly to match evolving UI needs. However, Bootstrap’s bloat and limitations led me to propose a bold shift: replace Bootstrap entirely with a lightweight, custom CSS framework tailored specifically to our design language and development workflow.

MY RESPONSIBILITIES

• Refresh and unify the visual style of all UI components for both internal tools and client-facing products.
• Eliminate excess server requests by trimming unused Bootstrap code, speeding up performance.
• Create a single, accessible framework site where developers could instantly copy/paste ready-to-use components.

TOOLS & TECHNOLOGIES

• UI Design: Adobe Illustrator CC
• Framework Reference: Materialize.css (as a base for some components)

KEY CHALLENGES

• As a non-revenue-generating initiative, I worked on this project in between priority tasks.
• Building and testing a fully functional, cross-browser compatible framework required meticulous attention to detail.
• Every component had to meet our exact use cases without sacrificing simplicity or accessibility.

SOLUTION

I began by defining a visual style that leaned into material design principles—using icons inside form fields, subtle micro-interactions, and a clean aesthetic. Where useful, I adapted components from Materialize.css, customizing them to better suit our brand and technical needs.

A key feature of the framework is a collapsible side navigation that allows team members to copy component code to their clipboard with a single click. This drastically reduces the time needed to build mockups or full pages, making the system intuitive and efficient for developers of all levels.

RESULTS

The new design system has begun rolling out across upcoming VPS projects. Thanks to the copy-and-paste feature and component reusability, developers can now prototype and implement interfaces without needing custom front-end work for every screen—freeing up time across both front-end and back-end teams. The system has become a foundation for consistent, scalable, and high-performing UI development at VPS.