Opensource Design Workflow

Testing ways to bridge the devide between designers and developers in Open Source projects.

1. Atomic Design
2. Figma
3. Design System Explorders 3a. Storybook (Javascript) 3b. QML Explorer?

Atomic Design - Ref

Framework for breaking down applications into smaller, composable components that is grouped by their level of complexity.

1. Theme
2. Grid
3. Atoms
4. Molecules
5. Organisms
6. Templates
7. Pages

Design System Explorers

Javascript

• I recommend javascript projects look into Storybook.js for showing their components. There is support for React.js, React-Native, Vue.js and

Dart / Flutter

• ...

Implementations

Vue.js

• https://dev.to/miladalizadeh/vue-cli-30-plugin-for-creating-apps-using-atomic-design--storybook-42dk