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
Realistic responsive design - Awwwards 2016
Search
Inayaili de León
January 28, 2016
Design
0
240
Realistic responsive design - Awwwards 2016
Awwwards conference, Amsterdam, 28 January 2016
Inayaili de León
January 28, 2016
Tweet
Share
More Decks by Inayaili de León
See All by Inayaili de León
8 things I learned from building a pattern library
yaili
0
71
Realistic responsive design - Responsive Day Out 2014
yaili
7
600
The most important part of your job
yaili
0
330
Other Decks in Design
See All in Design
231129_FOSS4G-ASIA-2023_kato
hjmkth
0
270
Designship 2023|想いを可視化するデザインの力
weddingpark
0
210
LT:11年前の「ここにいる」の話 #fukuoka_a11yconf_前夜祭
garyuten
0
110
デザインをみんなのものに 「デザインの脱植民地化」を日本の文脈で考える
mayunak
6
4k
The Fight
euralisw
0
100
言語やロールの違いを超えて、一緒にデザインしていくための挑戦
hrtnde
0
1.2k
Backlogのイロハ・ やさしい使い方(基本編)
wattlaa
0
280
1人歩きする営業資料作成
yutoshukuya
0
110
Webアプリケーションアクセシビリティ解説ウェビナー「8章 アクセシブルなUI設計の原理を導く」
magi1125
0
150
Lecciones de desarrollo de producto en Get on Board
getonbrd
0
200
共創のための地域基盤としての非公式組織の形成 / Informal community as an infrastructure for co-creation
fumiyaakasaka
0
170
UX/UI改善に貢献するユーザーテストとは? 基礎知識から実施のプロセスまで解説
ncdc
0
280
Featured
See All Featured
Atom: Resistance is Futile
akmur
258
25k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
1
1.2k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
1
3.3k
Stop Working from a Prison Cell
hatefulcrawdad
265
19k
Fontdeck: Realign not Redesign
paulrobertlloyd
75
4.8k
10 Git Anti Patterns You Should be Aware of
lemiorhan
644
57k
Optimising Largest Contentful Paint
csswizardry
7
2.3k
Intergalactic Javascript Robots from Outer Space
tanoku
266
26k
Producing Creativity
orderedlist
PRO
335
39k
The Straight Up "How To Draw Better" Workshop
denniskardys
227
130k
Build your cross-platform service in a week with App Engine
jlugia
223
17k
VelocityConf: Rendering Performance Case Studies
addyosmani
319
23k
Transcript
Realistic responsive design by Inayaili de León Persson Awwwards, Amsterdam,
2016
1. Define a project leader
flic.kr/p/8JJDer
2. Buy lots of sticky notes
None
3. Involve all the right people
flic.kr/p/dMpken
4. Make a wishlist and plan from there
flic.kr/p/oRsPbM
5. Deprioritise other projects
flic.kr/p/oepoQQ
6. Aim for a date, but be flexible
flic.kr/p/odGXUV
7. Prioritise what you want to do first
None
8. Write down everything you will NOT do
flic.kr/p/a3KRS4
9. List all your pages
None
10. Allow plenty of time for device testing
flic.kr/p/bu2gfG
11. Get test devices based on analytics
14% APPLE IPHONE 11% APPLE IPAD 2% MICROSOFT SURFACE 1%
GOOGLE NEXUS 5 1% GOOGLE NEXUS 7 1% SONY READER PRS-T1 1% SAMSUNG GALAXY S5 …
12. Create a document with initial rules
flic.kr/p/65C7c3
13. Make a component inventory
None
14. Have a style guide
None
15. Clean up your CSS
flic.kr/p/ovrq1Y
16. Have a solid grid
https://flic.kr/p/do6BHg
17. Convert grid to percentages
None
18. Evolve instead of change
flic.kr/p/oeJcBM
19. Don’t be afraid to copy
None
20. Don’t use everyone at once, and use everyone at
once
flic.kr/p/xNXbL1
21. Show your prototypes
flic.kr/p/bB7EAF
22. Quick and dirty UX
None
23. Experiment on smaller projects
None
24. What can we do in 1 hour?
flic.kr/p/oy4MFD
25. Make an image inventory
None
26. Optimise your images
flic.kr/p/5ZU8DZ
27. Adjust type based on real devices
flic.kr/p/uCVKGp
28. Don't keep two code bases for longer than you
need to
flic.kr/p/i6PjYM
29. Keep a record of all decisions
None
30. Talk and write about it
flic.kr/p/9MhxcX
Read more at design.canonical.com
Thank you. @yaili bit.ly/viewsource2015