From design to development: How do you deal with a broken workflow?
Introduction
Introduction IXDS
Introduction Sketch Runner
Sketch Runner
Introduction Design Tools Network
Design Tools Network
Topic of this talk
Breaking down the topic: design
Breaking down the topic: development
Breaking down the topic: the workflow
Breaking down the topic: how to deal with it?
Chapter 1: Design
Illustration vs. Interface Design
Interface Design
Chapter 2: Development
Overview of roles
Highlight of roles
Chapter 3: The broken workflow
Velocipedia: Sketch of a bike
Velocipedia: 3d render of the bike sketch
Introduction 3d modeling
Utah teapot model
3d printed Utah teapot
3d modeling output a video
3d modeling output a video, static image
Introduction Print Design
Print Design
The Gap in UI Design is Bigger
Our tools are optimized for illustration
They’re great for ideation
But not the best for Interface Design
Button Layout in Design and code
Conclusion illustration tools
Chapter 4: How to deal with it?
No one-size-fits-all solution
We need a mindset change: The 1:1 workflow
Explore the medium
Video of Kelly Slater surfing on a table
Tool limitations: “If all you have is a hammer"
“If all you have is a hammer, everything looks like a nail”
Examples of good workflows
IXDS Sketch to Framer Workflow
Sketch plugin: Map Generator
Framer X: Design with Coded Components
Takeaways
1. Stop painting UI, start constructing it.
2. Fully understand the platform and medium of your product
3. Know your tool limitations
ting
5. Always Be Communicating
Ask me questions ⁉
Project: Solar Sinter, Markus Kayser, 2011
Takeaways of Solar Sinter
We need innovation in tools! #DTHack18 in Tel Aviv
Closing title slide: Roy van Rooijen