android development slovenia meetup #4 - how to have a working designer developer relationship
TRANSCRIPT
Working designer-developer relationship
What tools to use to get your ideas across?
Sketch
Sketch ● Vector based - easy scale to any resolution.
● Symbols and Styles - once you establish some rules, easily replicate
designs for different flows.
● Export for different resolutions.
● Plugins and extensions provided by the community.
● Price - 99$.
Plugins and additional programs
FLUID pluginhttps://github.com/matt-curtis/Fluid-for-Sketch
Measure pluginhttps://github.com/utom/sketch-measure
Data parserhttps://github.com/florianpnn/sketch-data-parser
zeplin.io
Alternatives
2016
Invision
Why Invision?
● Signal based prototyping● Commenting - collaboration● Developer notes● Version control● Assets management
invisionapp.com
invisionapp.com
invisionapp.com
invisionapp.com
Framer
Why Framer?● Works on coffeescript
● Import designs directly from sketch
● Preview on device
● Share anywhere
● Code snippets
framerjs.com
framerjs.com
framerjs.com
Workflow
1. Design 1x mdpi or 2x xhdpi2. Build styleguide - Atomic design3. Build prototypes instead of writing specification4. Polish interactions and animation 5. Export assets and keep them up to date in Invision or
Dropbox
Something to think about for the next projectEstablish ownership.
Establish agreement.
Treat documentation as a dialog.
Involve everybody in the early stages of feature design.
Check-in about design status every day.
Show evolution of designs.
Represent design needs with labels.
Learn from each other.