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 and we'll give you feedback! 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