Tools I use in my development practice
2024-09-26
One of the rites of passage in the web community is contributing open source tools and code for others to learn from, use, and build off of. I created my first gist today—a color palette generator mix-in for Sass.
A long term personal-professional-fun-goal of mine is to create some sort of small tool that would help make web development a little easier. The gist is a good start, but I have a long way to go before I am able to create or fund some of these tools.
In University, I redesigned and redeveloped my website each year; a learning by doing ritual while recording professional progress. A few years after graduation, that routine was lost. This year, I think I’ve made up for it a bit, in a third or fourth iteration this year alone.
I’ve sought and found some tools I, now, routinely come back to as my go-to resource when developing my website. I plan for this to live on some type of /resources page—similar to how I listed books that have shaped my practice.
This is specifically for devtools, ordered by use.
Tools
Contrast Grid by Eight Shapes, Nathan Curtis and Dan Brown
Utopia by James Gilyead and Trys Mudford
Modular Scale by Scott Kellum and Tim Brown
Design System Checklist by my Booking.com colleagues Arda Karacizmeli, Dmitry Belyaev, and Steven Baguley.
Frequent references
Stacks, StackOverflow’s open sourced design system
Pajamas, Gitlab’s open-sourced design system
Primer, Github’s open-sourced design system
Cedar, REI’s open-sourced design system
Carbon, IBM’s product and marketing open-sourced design system
IBM’s Design Language, an open-sourced identity system for all of IBM
USWDS, the United States’ federal government’s open-sourced design system
Seeds, Sprout Social’s open sourced design system
Protocol, Mozilla’s open-sourced design system for all Mozilla and Firefox websites
Design System, the United Kingdom’s government services open-sourced design system
Don't miss what's next. Subscribe to Craft & Practice:
