👋🏽 Hope this article finds you with a cup of your favorite drink to sip on. Welcome one and all to the Ripple Blog!
This blog will explore practices and latest trends, share our experiences, and highlight the lessons we've learned from creating the Ripple Design System for the Watermark Education Impact Suite (EIS). Communication and collaboration are the cornerstones of the Design System team, and this blog is a new channel to share our stories and insights with our users, stakeholders, and beyond.
From Components to System
The Ripple Design System started as a modest collection of screenshots and blurbs on a wiki in the days of the Taskstream-Tk20 merger with Google’s Material Design design system as a foundation. We’ve evolved alongside Watermark itself and continued to grow both the product and its audience with each addition to the EIS. Today the Ripple Design System and its team of five serves nine product designers, ~13 product owners, tons and tons of developers across ~14 scrum teams to varying degrees with seven comprehensive guidelines and patterns and 23 accessible web components…that’s a big deal people!! Can I get an applause or amen up in here?!
Improving our Debt-to-System Ratio
The diversity of technologies, resources, patterns and interactions, resulting from Watermark's history as seven distinct companies, represent a particular challenge for our company. Design systems are a fantastic tool to address these kinds of disparities, but not all design systems have to contend with such great divergences. The EIS was forged from the unification of over seven products, each bringing its unique history, culture, technologies, and branding. None of these companies had established a design system to support their products. Some products came in hot 🔥 with well-structured processes, common components and a style guide, while others were less organized and came in a little more like a hot mess express 🚂 - no offense intended! This situation is actually quite typical for early-mid stage companies. And I totally get why!
Only when a company reaches a certain maturity does the creation and maintenance of a source of truth for a product’s patterns, behaviors, components, styles and accessibility become a priority. That’s our directive though. The Ripple Design System unifies products under Watermark. I’m really proud of the team that’s built it from the ground up, and we're ready to share so much more about how we do it!
Not just Extracurricular Consistency
So why now you ask?! Back in 2019, after a few months in his role as a front-end developer in the newly-created Design System team, Martin realized that most of the problems he was working on didn't yield many solutions online. Little was written on these specific issues at the junction between design systems, web components and accessibility. Knowledge sharing is essential to the work of developers and designers, and it seemed natural to share the solutions the team was coming up with. This became the kernel of an idea for a blog, with content oriented to Watermarkers as well as to other developers working on design systems and component libraries outside of Watermark. With some nurturing, this idea blossomed, and after allowing the Ripple website to mature a bit, we are excited to unveil our blog.
Design Systems are mysterious things. As Ripple matured, our understanding shifted from product to process, expanding our focus from the deliverables themselves (designs, components, guidelines) to an increased attention towards communication, transparency and collaboration. We’ve grown to participate during PI Planning and present our most up to date roadmap at every meeting possible. We’ve published our processes online, and the positive results are confirming the benefits of more connection and collaboration with our users. My hope is that our users and collaborators will see themselves in the work we share. Everyone who uses the design system contributes to it in a meaningful way, and this blog will be used to bring your voices and experiences to the spotlight as well with case studies and requested content. Through this blog, we hope to inspire and empower others, increase collaboration and knowledge sharing within Watermark, and make work easier for our users.
We’re launching with a couple of articles, including our innovative algorithm for Watermark charts and their grid intervals. There’s quite a bit to nerd out about in this article, so feel free to skip those sections if you haven’t had your morning coffee. We’ll also share news about how the Product Design organization is evolving its toolset to improve efficiency that will enable them to do their best work without costly interruptions they’ve been experiencing with the current (Sketch + Abstract) stack. For those that have been frustrated with Abstract’s limited zoom capabilities or finding a collection from an archived branch (good luck), you’re welcome!! 😛 Stay tuned as we dive deeper into the intricacies of the Ripple Design System, providing you with in-depth articles, tutorials, and case studies. We will also shed light on the Watermark Impact Suite, showcasing how our design system supports educational institutions in making a positive impact.
Showers of Gratitude
I want to extend my gratitude and appreciation for your support in reading about this launch! We’re so excited we get to engage with Watermarkers in a new and fun way. Please let us know how you like the content, and what content you’d love to see for Ripple. The blog is open to contributing editors here and there, so if you’ve been waiting to start your second career as a writer, now is the time! Of course, feel free to request an article if you would like a particular subject to be covered. Make sure to check out the #designsystem channel in Slack for new content alongside our releases. We hope you enjoy riding Ripple’s new waves with us. Until next time! ✌️
