Carbon: July recap + August preview
If you haven’t heard of the Carbon Design System before, check us out! We’re a design system built by IBM, shipping open-source styles and components in Vanilla, React, Angular, and Vue for anyone building on the web.
June is already over? Julyin! Our small team (mainly) in Texas worked on some hot stuff for you this month. It’s the kind of stuff that rivals these Texas summers. Hot, hot stuff.
Released in 10.4
Sketch Kit
We fixed quite a few bugs, including some symbol changes for icon button, dropdown, checkbox, data table, and more. We also added several new color tokens, along with a few other component enhancements. But the biggest new thing with our kit is our UI shell templates and rail component! 🔥
Icons
We added 41 new icons! 🙌 Plus, a new entry point in@carbon/icons-react means no longer having to specify the path for an icon. This, along with several bug fixes for over 10 different icons, means a better experience for you.
Theming
Our #theminggoals are on their way to realization. We delivered several bug fixes and notable new features, and our vanilla development environment now supports color theming. 🎨 Simply select a different theme from the dropdown, and voila, you can view our components in different colors. We’ve also updated our theming sandbox to Carbon’s latest components and themes.
UI Shell
With more documentation and functionality, our UI shell is getting better and better each release. This month, we added in responsive behavior for header navigation links, a new rails variation (still a work in progress), and more guidance for navigation patterns.
Support
You may as well call us exterminators because we squashed a lot of bugs this month, including many a11y fixes! 🐛 ☠️ Some components with notable a11y violation fixes include: overflow menu, tooltip, ListBox, modal, toggle, and slider. Other non-a11y bug fixes include adding a light variant to our Search component, adding sticky header styles for data table, fixing the data table clear input functionality, and many more.
TL;DR
- Sketch kit updates include bug fixes and new UI Shell templates
- We added 41 new icons and fixed bugs in 10+ existing icons
- Our theming sandbox has been updated to our v10 components and color themes
- UI shell has more responsive behavior, new rails variation and more documentation
- We fixed several bugs and notable a11y violations in our components
- See our changelog for more details
Coming in August
We’ve got several important projects on our to-do list for Carbon’s next release, some of which are a continuation from July’s work. You may notice some of our projects are less about design and development and more about community, processes, and architecture. We hope that by focusing on some of these things over the next few weeks, we will be able to propel the system to offer an entirely better experience for our community.
Support
Support is one of our ongoing projects. Like in July, we intend to fix things that are broken, triage bugs, and document our support process. One important thing to note is that this project will not prioritize feature requests or expand functionality.
Icons & elements
We’re working to make sure the IBM Design Sketch Library better reflects the current assets in our repos by developing our pipeline tools.
Soon the IBM Design Sketch Library will actually be automatically derived from the Carbon Elements repos themselves, meaning that the kit’s assets will be much, much closer to the actual contents of that package. We’re also building a new icon library experience for our website to make it easier to find icons (and to find them in the Sketch Library too). 🔍
Patterns curriculum
As the design system for IBM products, we’ve been actively working with the new Design Education Program, “Patterns”, to educate new IBMers on Carbon. Our goal for this project is to create an interactive curriculum for both designers and developers going through Patterns. We’ll touch on things like the IBM Design Language, our design system, open source, getting started, and more.
This work helps us improve the system through things like better docs and tutorials.
Carbon website content audit
The system is always growing and expanding, but interest in contributing has skyrocketed and we’re starting to feel the growing pains. Users come to our site for a lot of different reasons, and we want to meet you where you work.
We’re auditing every piece of guidance and documentation we offer and we’re exploring new ways to bring it to you.
Contribution and community model
How do I contribute a component? What is an add-on?Who maintains contributed assets?
Being an open source project, we get questions like these often, and we hear ya! Our team is working on drafting a community and contribution model to clarify our process and expectations for this.
IBM Design Language site
Not to brag (ok, a little bragging): We have a pretty dope site for Carbon documentation. For the last several weeks, we’ve been working hard on creating a Gatsby Carbon Theme which will allow other sites to easily implement the Carbon look and feel. This project consists of updating the IBM Design Language site to use the Gatsby theme!
Component specification
With so many components, contributors and framework variations, it can be challenging to make sure all our code assets align with our designs. Through this project, we hope to make this easier. We’re creating written documents that formalize the specification for each component, alongside rules that verify (test) that specification.
We want (need) your feedback
Big isn’t easy. We know that, you know that. That’s why we’re building a system to make big projects feel a little more…little.
If you run into any issues, or have feedback for us, please reach or make an issue on GitHub and we’ll get back to you as soon as possible.
Check out our projects on GitHub! We’re always looking for contributors. If you have any questions or comments about the Carbon Design System, please reach out at carbon@us.ibm.com.
