Design System
You work at an agency that was hired by a recipes company (competitors are Allrecipes and Yummly) to redesign their website.
One of the main tasks is to build out a new design system and you've been put in charge of starting that process.
Design specific elements (below) of a style guide for this fictional recipes website using your favorite design tool (using your tool's design system features) or HTML/CSS. Make sure all elements are responsive. Document and organize the design system and include a summary at the beginning with the overall goals.
Elements:
Extra Credit: Design more elements for the style guide, or add variants of the elements you've already created. Make a few mockups using the design system in practice to show how it all works together.
If you need help with this challenge, check out our hand-picked tutorial recommendations.
Not sure which tools to use? Try one of these.
When you finish the challenge, post your work on Twitter! Be sure to use the hashtag #uxtoolschallenges and tag our account @uxtoolsco. We'll keep an eye out and repost good examples on a regular basis.
We're also building a new paid community for designers where you'll be able to get even more feedback. See more details.
All Challenges