OSKRHQ Design System
A largely subjective but feasible method for creating adaptive digital interfaces with a shared anatomy.
Visit Website Figma File
Suggest Product
Suggest Product
A largely subjective but feasible method for creating adaptive digital interfaces with a shared anatomy.
Visit Website Figma FileA largely subjective but feasible method for creating adaptive digital interfaces with a shared anatomy.
For responsive web interfaces, OSKRHQ.DS is a themeable Style Guide and Component Library written in React. Although I designed the system for my own personal brand, anyone can customize it and use it for themselves. My experiences creating and running big business multi-platform Design Systems served as inspiration for its architecture.
The nine identical building blocks of the UI elements you see here were assembled using semantic Design Tokens. Color, Typography, Space, Motion, Depth, Iconography, Borders, Layout, and Shape are what I like to refer to as The Anatomy of UI. The System includes useful engineering tools for creating unique pieces that are all based on the same basic anatomy.
Every interface you use was at some point created. And smaller design teams within larger design teams are likely to have created those interfaces. When considering the Customer Experience (CX) as a whole, these silos generate fragmented experiences.
A Design System, from the standpoint of a designer, enables you to concentrate more on resolving issues for users and less on resolving minor design issues already covered by the Design System.
From the standpoint of an engineer, a Design System enables you to develop interfaces without absolute values and with reusable parts of code. Those are probably the unintended consequences of a particular design choice made to address an already resolved design issue. You should generally steer clear of this.
The Pluralsight Design System strives toward a cohesive design language for Pluralsight’s products, a shared vocabulary for their teams, and basic building blocks to accelerate development.
Get in-depth information and UI resources for designing great apps that integrate seamlessly with Apple platforms.
The SEEK styleguide's purpose is to enable the creation of content that will assist our users to complete tasks easily and hopefully enjoy the experience.
The ServiceNow Design System is a living system that empowers us to design and achieve a consistent, efficient, and high quality visual language that brings cohesion and familiarity to the user experience across the platform.
Nachos is Trello's design system. This comprehensive guide and resource library contains everything you’ll need to design with us, including our core principles, visual design and interface components.
Photon is the Firefox design language to build modern, intuitive, delightful experiences, for products across all platforms – from mobile to desktop, from TV to the next big thing.
Our user interface components enable you to quickly and easily create Industrial Internet web applications that run on dedicated Predix services and data.
This library showcases the building blocks that make up Hubspot's design system, from colors and typography to React-based components and data visualization tools.
GEL is the BBC's shared design framework which enables us to create consistent and delightful user experiences across all of our Digital Services.
The styleguide is a resource that provides a common language around Yelp’s UI patterns. We use it to maintain modular front-end code and visual consistency across the web app.