<p>Design + Sketch App &mdash; Medium | Christopher Deane An ongoing series where we build a design system in Sketch called Dezin. An hour of updating shared styles, creating a couple of icon symbols and making a common set of form field components. View the tutorial https://medium.com/media/7850f829f35efacaabe31dd2292a2f44/href Download the Sketch file If you visit the YouTube page for [&hellip;]</p>

Breakdown

Design + Sketch App — Medium | Christopher Deane

An ongoing series where we build a design system in Sketch called Dezin.

An hour of updating shared styles, creating a couple of icon symbols and making a common set of form field components.

View the tutorial

Download the Sketch file

If you visit the YouTube page for the above tutorial, you can download the Sketch file from a link in the description.

What’s covered in part 7

  1. 0:21 Introduction, create a new branch in Abstract
  2. 1:19 Update button art-board, create a rectangle for out first button then create new shared styles to be used in our form fields
  3. 10:50 Input text field, more shared text styles, resizing settings then demo it’s nested symbol
  4. 21:44 Text area field then demo
  5. 23:45 Select field, arrow symbols, shared style updates then demo
  6. 40:18 Radio buttons and check-boxes
  7. 53:26 Create a sign up form to demo the form components
  8. 56:53 Outro, commit and merge branch into master in Abstract

Watch the series

Here’s the rest of the series where I’ll be adding new parts every 1–2 weeks:

For updates:

Follow me here at Medium, Twitter and YouTube.

stat?event=post.clientViewed&referrerSou


Design Systems, part 7: Forms was originally published in Design + Sketch on Medium, where people are continuing the conversation by highlighting and responding to this story.

Curated

Mar 18, 5:44 PM

Source

Tags

Tomorrow's news, today

AI-driven updates, curated by humans and hand-edited for the Prototypr community