First 'Internal Friday'
100 Days in a Row
Third Lunation
Second Successful Lunation
First Successful Lunation
Made the journal public
📐

Design System Starter Kit

Build a library of flexible and un-styled components to start or supplement design system projects. Anyone can jump in the file below
229 entries
Started Apr 30, 2020
norton

On no!

I worked on the project yesterday, but forgot to post.
Styles and components for articles, etc.
Basically cover everything in the Markdown spec

Tangentially related scripts

Glued together the "Batch Create/Update Local Styles" script and the "Color Stepper" script.

Batch Delete (Local) Color Styles

let node = figma.currentPage.selection[0]
let nodes = figma.currentPage.selection

nodes.forEach (node => {

  let localPaints = figma.getLocalPaintStyles()

  localPaints.forEach (localPaint => {
    if(localPaint.name === node.name){
      localPaint.remove()
    }
  })

})

Out of scope?

A test corpus thingy for articles/markdown.

- Headings
- Paragraphs
- Lists
-Dates and bylines
- Pull quotes
- Images & captions

And so on…

Keep writing the description

A Figma-first component library to kickstart or supplement design system projects.

The starter kit should be

- Minimal
- Flexible
- Systematic

Concrete goals

- Compact layer lists and layer names
- Don’t use the layer list to change state
- Build for instance swapping
- Use pages and frames to create related instances
- Use the tool—not shared context—to enforce convention
- Auto Layout, guides, text cse
- Create a library, not a framework. More context

Write the description

DSSK is a Figma-first component library to start or supplement

Concrete goals

- Compact layer lists and layer names
- Build for instance swapping
- Use the tool—not shared context—to enforce convention
- Create a library, not a framework. More context

00:00
norton
norton Design System Starter Kit