Siddharth Kshetrapal
@siddharthkp
Designing with React
Submitted Dec 3, 2017
Section:
Full talk on success and failure stories with React; code overheads and code rewrite stories with React
Technical level:
Intermediate
Most of us work with designers and other developers on a daily basis. It isn’t always easy to maintain quality and consistency across teams or even features. Collaboration isn’t always easy with spec handovers, component states, achieving pixel perfection, etc.
Design systems have become really popular in the design world in the past couple of years and for good reason. React’s methodology of thinking in components along with recent tools like react-sketchapp make it feasible for designers and developers to work on a single system.
Outline
[or just watch the video instead]
Most of us work with designers and other developers on a daily basis. It isn’t always easy to maintain quality and consistency across teams or even features. Collaboration isn’t always easy with spec handovers, component states, pixel perfection, etc.
Design systems have become really popular in the design world in the past couple of years and for good reason. React’s methodology of thinking in components along with recent tools like react-sketchapp make it feasible for designers and developers to work on a single system.
In this talk I explain what is a design system (it’s not a just component library*) and try to convince folks about the value of design systems and show the path starting from scratch based on my experience from 2 culturally very different companies.
There are a bunch of technology and people problems to talk about here:
tech:
- Choice of base stack (React over web-components/vue/etc)
- Build your own or customize an existing framework like bluekit/react-bootstrap
- Documentation as a product
- Packaging and distribution strategies
people problems:
- How to convince your boss that this is something that we need :),
- How to drive adoption in other teams (if and why should they refactor their working apps to use this?)
- How do you keep design assets and code in sync, long term maintainence model, etc.
I feel this is a topic worth talking about because we are the dawn of innovation at design + development tools and the more we embrace each other, the better our workflows will become.
*. Component library is part of the design system, it also includes design tokens that are shared across tech stacks, assets for designers to work with, documentation as a product and brand guidelines
Requirements
an open mind?
Speaker bio
Building design systems @auth0 ∙ ex @practo ∙ Built bundlesize & cost-of-modules ∙ Makes youtube videos ∙ Co-organises @ReactBangalore ∙ plays football, noob surfer
{{ gettext('Login to leave a comment') }}
{{ gettext('Post a comment…') }}{{ errorMsg }}
{{ gettext('No comments posted yet') }}