Yelp | CookbookDS
HACKATHON PROJECT
🌝️ Light Mode
🌚️ Dark Mode
This project was inspired by the article posted by Marco Paglia called “Uber Design Platform“. Check the full article by clicking the button below.
*Image credit by Uber.
Background
Components, design systems, and tools are valuable only as long as people are familiar with them.
– Uber Design Platform by Marco Paglia
Sometimes there is lag in getting to know what is available, updated, new or even deprecated on the design side, hence the possibility to have discontinued UX in production. This holds true for designers, but for engineers as well.
CookbookDS consist of a Mac OS menu bar extension that gives designers and engineers quick access to our tools & resources.
Opportunity
Spread and create a community that helps the Design System to be recognized and valuable to the whole team.
– Uber Design Platform by Marco Paglia
The idea behind CookbookDS is to create a tool that enables designers & developers to always be updated with the latest changes and/or additions to the design system.
This can be connected with a couple important element inside the our design team, which are “Community” and “Developer & Designer Experience”.
Such a tool can make more people familiar with the work and the status of the Design System, and also have more people involved into the contribution process, making the growth of the design system more of a collective and open process.
We could potentially send native push notifications to make people aware of changes and /or updates. Email updates and newsletters don’t really serve the need to communicate brief, simple updates to a design system, and the number of emails can be overwhelming.
Benefits
One key element to creating and keeping momentum is the community that grows around the design system. Make every designer a little better at thinking of everything in terms of systems, allow everyone to design together, to learn from a common source, and to have a shared understanding of product quality across the company.
– Uber Design Platform by Marco Paglia
Create a sense of community around the DS, where everyone can contribute and make it better.
Send quick updates without overloading designers and engineers with extraneous communication.
On the fly content update CookBookDS so that it can always surface what’s new and relevant.
The Tool
Start screen
At the opening it will have a Latest Updates section right on top to surface the latest changes on the DS.
Below we can include a section of all Core Recipes available.
The search bar allows you to quickly search for components, or updates that you’re looking for.
Scroll & Hover
Scrollable content will be provided and hovering an item will provide a direct link to the Figma file or the latest source code available.
This allows you to check either the latest designs, or the latest code available and serves well both designers and developers.
Search
Typing will surface the most relevant content available divided by category, and the hover state will behave in the same way by providing a direct link to the Figma file or the latest code available for implementation.
Details
The detail page contains all the variants of the searched components with the ability to go directly to the internal documentation divided by platform, and be able to visually see every variations and directly jump to the Figma design.
Updates
As soon as updates will available, a banner will be displayed allowing designers and developers to be in the loop of the current state of the design system and all updates related to patterns and components.