IPTS - Design System Case Study - Scaling Design Systems Course
Introduction
The Scaling Design Systems course provided by Dribbble lead to this final project prompt. Your leadership has decided to launch with 3 unique offerings:
ipts.org, an informational website where you can find the latest news and happenings with the IPTS
IPTS Travel, a website where you can browse and book travel to and from multiple destinations within our galaxy. Like Expedia for space.
IPTS Rail, a real-time updated web app where you can view lines, routes, and times for all the different commuter lines. Think NYC subway or the London Underground, but for interplanetary travel.
The only course provided asset during this phase was the IPTS logo in black or white.
Plot Twist (materials from Dribbble)
Your leadership at the IPTS—the Interplanetary Travel Syndicate—just hired the prestigious branding firm MegaBrand to do a rebrand of the entire organization, and there are a few things that’ll affect the three products you’ve been working on.
MegaBrand discovered through focus groups that the IPTS name and logo felt very ominous, like it was cold, faceless corporation that was always watching. (“The eyeball-shaped logo doesn’t help,” said one candid participant.) In addition, the IPTS wants to appeal to a younger demographic.
After weeks of research and exploration, they’ve settled on the new name “Shuddle,” which feels more like a cool, new startup.
I did not create these assets directly below. They were provided by the course materials to give direction on the rebrand phase.
Rebrand Design System
I lucked out having nearly the same base color as the new design direction and made typography adjustments. My custom header no longer made sense for the new logo direction which resulted in a rebuild of that entirely.
This project was created using a custom design system built with Figma components
The following screens show a before and after of the rebrand phase. Modifying components at the master level to cascade changes into multiple products, reduces margin of error and increases turnaround time.
Photographic stock images were pulled from open source materials. Planet images were modified AI assets.