Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Essential tools and tips for an effective desig...
Search
Gabriele Marangon
May 03, 2016
Design
1
600
Essential tools and tips for an effective design workflow
Talk I've hold with my collegue Andrea Lucibello @Droidcon Italy 2016
Gabriele Marangon
May 03, 2016
Tweet
Share
Other Decks in Design
See All in Design
読書シェア会 vol.5 / Yumemi.grow 20250526
rakus_dev
0
1.6k
sachi_y_portfolio
sachi337
0
300
エンジニアでも捗る デザイナー的思考入門
tinykitten
PRO
1
1.1k
[2025.6.30 もがく中堅デザイナー、キャリアの分岐点] なんでもやる系デザイナーのもがきかた
taka_piya
1
1.3k
児童相談所における養育里親委託時の親権者同意に向けたコミュニケーションの実態
trivia
0
480
“ブロック”で作る、WordPress制作フロー変革のすすめ
koots2021
4
1.8k
AI動画生成ガチャ紹介
piyo7
1
130
AI時代に淘汰されないデザインのしごと
akinen
1
140
問いの変遷
iflection
0
160
DC Style Redesign
mcduckyart
0
130
Design Studio Deck | インクルーシブデザインスタジオCULUUM
culumu
3
1.8k
「批評」を習慣にするための仕組みと場のデザイン/uxdesign202507
nikkei_engineer_recruiting
1
190
Featured
See All Featured
Visualization
eitanlees
146
16k
A designer walks into a library…
pauljervisheath
207
24k
KATA
mclloyd
30
14k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
248
1.3M
Building Flexible Design Systems
yeseniaperezcruz
328
39k
Docker and Python
trallard
44
3.5k
jQuery: Nuts, Bolts and Bling
dougneiner
63
7.8k
Site-Speed That Sticks
csswizardry
10
690
The World Runs on Bad Software
bkeepers
PRO
69
11k
GitHub's CSS Performance
jonrohan
1031
460k
Intergalactic Javascript Robots from Outer Space
tanoku
271
27k
Designing for humans not robots
tammielis
253
25k
Transcript
ESSENTIAL TOOLS AND TIPS for an effective design workflow
You talkin’ to me?
Being a Team is cool!
Where do I start? Where do I begin?
My way
The workflow: 1/4
The workflow: 2/4
The workflow: 3/4
The workflow: 4/4
2 years ago…
Start with pencil and paper
Wireframing with illustrator
Info Servizi Listino
Final UI with Photoshop
Photoshop was not meant to design UI
God bless this guy
Myriad Pro 30sp #2083A5 60dp 60dp Blueprint with illustrator
190dp 72dp icn-favourite icn-favourite-active 1px #cccccc Font Awesome 22sp #ffd200
Lato Bold 18sp #353535 Lato Regular16sp #717171 16dp 16dp
Tell me it’s over!!
None
ALWAYS start with pencil and paper + use Marvel
A free, simple and useful prototyping tool
An awesome design tool!
Sketch (exposed) • Intuitive (you can learn it in a
day or even less) • Design Organization (with pages and flexibles multi-artboards) • Eyedrop (the most powerful you’ve ever used) • Performances (few crashes, constant updates and bug solving) • Symbols & Styles (and many others productive features) • Plenty of useful shorcuts (eg. copy-paste object style/properties)
Sketch (exposed)
Sketch (plugins) • Sketch App Rocks (sketchapp.rocks) • Sketch Toolbox
(plugin of plugins) (sketchtoolbox.com/) • Sketch Android Assets (github.com/zmalltalker/sketch-android-assets) • Sketch plugin scripts (github.com/makzan/Sketch-Plugin-Scripts) • Relabel Button (github.com/kenmoore/sketch-relabel-button) • Craft (invisionapp.com/craft)
Sketch (integrations) • Invisionapp (invisionapp.com) • Zeplin (a good buddy
so far) (zeplin.io) • Symply (what you were waiting for dude!) (sympli.io) • Slack (Nerd-proof communication) (slack.com) • Marvelapp (marvelapp.com) • Prott (prottapp.com) + more & more
Looks like a big breakthrough
Android Studio Plugin
What if I can’t use Sketch • Avocode (avocode.com) •
Photoshop CC15 (‘Design Space’ mode + CC sharing)
None
Tips & Tricks
Draw/Design in MDPI
Always test on real screens
Abcdefghihijklmnopqrstuvwxyz Abcdefghihijklmnopqrstuvwxyz Hint text Hint text Use resources and stencils
from the web
Follow good designers on G+ (or other socials)
Stay up to date
Follow the guidelines
Questions?
Thanks for watching!
None
Gabriele Marangon UI / Interaction Designer@synesthesia +GabrieleMarangon
[email protected]
Andrea Lucibello Android developer@synesthesia +AndreaLucibello
[email protected]
Enjoy your day at Droidcon Italy!