Build It Better, Stupid: Using Design Systems for Scalability
Atomic design and design systems are all the rage in our industry right now—but how can these principles be applied within Drupal? In this talk, we will show you how these principles influence our implementation process to increase consistency and flexibility for designers, developers, and clients alike.
First, we will walk through what a design system is, and how it shapes our design team's approach to wireframes. We will then show how our designers and developers leverage a shared language to document a site's component structure, using tools like Sketch and InVision's Design System Manager. Wrapping up, we will demonstrate how Drupal modules, such as Paragraphs or Layout Builder, can be used to translate the design system into an extendable and easy-to-use component library.
Learning Objectives
At the end of this session, designers and developers will be able to:
Apply design system principles to maintain consistency throughout a project
Document the architecture of a build for a smooth handoff from design to dev
Successfully structure a theme in preparation for component-based design
Improve a content admin's editing experience as it relates to atomic design
Target Audience
This session is best suited for:
Design and development leads who collaborate on projects and make high-level architecture decisions
Anyone who is interested in implementing design systems (components) into their workflows
Anyone who is looking to brush up on best practices
Prerequisites
A general understanding of component-based design
A general understanding of Drupal theming
Speakers
Jessica Ito
UX / Digital Designer @ Elevated Third
After four years in the Marine Corps as a communication specialist, Jessica found herself wanting to go down a more creative path in life. She studied design at the Art Institute of Colorado and has spent the last three years designing in Denver.
Jessica strives to find creative solutions that are authentic, lasting, and impactful. Design systems are her jam, and she is also a little bit of a spreadsheet geek – hooray organization! In her ongoing quest to improve experiences for clients and users alike, her husband and young son are her biggest supporters - always pushing her to be her best self.
Eric Schmidt
Drupal Developer @ Elevated Third
https://www.midcamp.org/2020/topic-proposal/build-it-better-stupid-using-design-systems-scalability
First, we will walk through what a design system is, and how it shapes our design team's approach to wireframes. We will then show how our designers and developers leverage a shared language to document a site's component structure, using tools like Sketch and InVision's Design System Manager. Wrapping up, we will demonstrate how Drupal modules, such as Paragraphs or Layout Builder, can be used to translate the design system into an extendable and easy-to-use component library.
Learning Objectives
At the end of this session, designers and developers will be able to:
Apply design system principles to maintain consistency throughout a project
Document the architecture of a build for a smooth handoff from design to dev
Successfully structure a theme in preparation for component-based design
Improve a content admin's editing experience as it relates to atomic design
Target Audience
This session is best suited for:
Design and development leads who collaborate on projects and make high-level architecture decisions
Anyone who is interested in implementing design systems (components) into their workflows
Anyone who is looking to brush up on best practices
Prerequisites
A general understanding of component-based design
A general understanding of Drupal theming
Speakers
Jessica Ito
UX / Digital Designer @ Elevated Third
After four years in the Marine Corps as a communication specialist, Jessica found herself wanting to go down a more creative path in life. She studied design at the Art Institute of Colorado and has spent the last three years designing in Denver.
Jessica strives to find creative solutions that are authentic, lasting, and impactful. Design systems are her jam, and she is also a little bit of a spreadsheet geek – hooray organization! In her ongoing quest to improve experiences for clients and users alike, her husband and young son are her biggest supporters - always pushing her to be her best self.
Eric Schmidt
Drupal Developer @ Elevated Third
https://www.midcamp.org/2020/topic-proposal/build-it-better-stupid-using-design-systems-scalability