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
570
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
The Very Small Creatures - dressing up warm sequence
lizziestoryboards
0
200
FANCL×CA流アプリリニューアルPJ 成功の秘訣とそのプロセス / dx-fancl-renewal
cyberagentdevelopers
PRO
2
840
東急URBAN HACKSのデザイナーって何やってるの? 〜Designer Night #1〜 移動・不動産領域の取り組み
tmtgtkhs
0
200
1年目のクリエイターがつくりあげた!採用冊子CANVAS制作の裏側 / creator-canvas
cyberagentdevelopers
PRO
1
520
コンセプトで経営・事業・組織を動かす、 Ameba20周年ブランディング / ameba-20th-branding
cyberagentdevelopers
PRO
1
560
【Adobe MAX Japan 2025】上手にFireflyにお願いしてウェブデザイン案を出すぞ!
cremacrema
3
3.3k
LayerX DesignersDeck
layerx
PRO
0
2.5k
ゲーム開発における、Figma活用事例の紹介 / applibot-figma
cyberagentdevelopers
PRO
2
640
ユーザーに向き合うデザインが介護・福祉の現場を変える / User-facing design changes the field of care and welfare
sms_tech
0
240
Les petites aventures de CSS, saison 2025
goetter
3
3.9k
Dinosaur Mayhem
storyartist
0
140
portfolio2025_kanakoohata
kanako106
0
670
Featured
See All Featured
Intergalactic Javascript Robots from Outer Space
tanoku
270
27k
Keith and Marios Guide to Fast Websites
keithpitt
411
22k
Documentation Writing (for coders)
carmenintech
67
4.6k
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
3.7k
We Have a Design System, Now What?
morganepeng
51
7.4k
Faster Mobile Websites
deanohume
306
31k
The Cult of Friendly URLs
andyhume
78
6.2k
The Power of CSS Pseudo Elements
geoffreycrofte
75
5.5k
Making Projects Easy
brettharned
116
6k
Embracing the Ebb and Flow
colly
84
4.6k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
280
13k
Large-scale JavaScript Application Architecture
addyosmani
510
110k
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!