Accessibility & System Meta
Accessibility is everyone’s responsibility, and it benefits everyone, not just people with disabilities. The Bristlecone Design System is crafted with inclusion and accessibility at mind and heart; the packages that make up this system are meant to be tools and patterns to help you create more accessible-friendly products by default.
For more info on accessibility (A11Y), visit the A11Y Project.
Pro tip: Semantic markup is A11Y's sibling that shouldn't be forgotten as you build your web sites and apps.
Homage and Overview
Bristlecone is attributed to the Bristlecone Pines of the Great Basin. I assembled
Bristlecone to assist me in developing quality user interfaces and experiences for my various personal and professional projects. I continuously add to the design system as new use cases and needs arise, and as tech and human-centric patterns, in general, inevitably evolve.
Tech Stack, Dependencies and Services
- Bristlecone is assembled using a combination of React (JS), CSS, and composable patterns
- The components library leverages a CSS-in-JS approach in parallel with styled-components to properly scope and scale CSS class selectors
Pro tip: You can write custom CSS in any
cssprop, or you can define your style rules in separate SASS/CSS files all-together, or a combination of both.
- Styled-System is utilized at the core of all components to easily and reliably map to default theme values, which take into account media queries for pre-defined breakpoints (or you can define your own!)
- Markdown/MDX for all-things-content for the docs site
- NextJS is used for this creating this site
- ZEIT Now is the platform for hosting this site in the cloud
- Packages are hosted on npm
- Base icon set is from GitHub's Octicons
- The entire Bristlecone Design System is a monorepo, properly split up into various packages; Lerna makes accomplishing this easier than before!
Individals and resources that have been an inspiration to me while assembling and fine-tuning Bristlecone, and really, throughout my career since the young padawan years, are listed below (in no particular order); check them out, I don't doubt you'll be inspired by these individuals, and their respective work and insights.
- The Primer Design System and the incredible teammembers behind the Primer project were a big source of inspiration to me on Bristlecone's architecture and current tech stack ☝🏽- big props to them ✨
Development of Bristlecone will be an on-going effort; the hope is that Bristlecone can offer you a good starting point to hit the ground running in creating excellent, extensible and user-friendly digital experiences for all of your users. At the very least, perhaps it'll serve as a source of some useful ideas to build upon.