×
Copy
Open
Link
Embed
Share
Beginning
This slide
Copy link URL
Copy link URL
Copy iframe embed code
Copy iframe embed code
Copy javascript embed code
Copy javascript embed code
Share
Tweet
Share
Tweet
Slide 1
Slide 1 text
Responsive Design Process for Designers and Developers by Natalie MacLees *
Slide 2
Slide 2 text
No content
Slide 3
Slide 3 text
Introductions *
Slide 4
Slide 4 text
What is responsive design? *
Slide 5
Slide 5 text
A few quick things… *
Slide 6
Slide 6 text
One hour!?!?
Slide 7
Slide 7 text
Lots of tools
Slide 8
Slide 8 text
No single correct way
Slide 9
Slide 9 text
The things we *do* know *
Slide 10
Slide 10 text
Blurred lines
Slide 11
Slide 11 text
Collaboration
Slide 12
Slide 12 text
Usable deliverables
Slide 13
Slide 13 text
Device agnostic
Slide 14
Slide 14 text
A proposed process *
Slide 15
Slide 15 text
Discovery
Slide 16
Slide 16 text
Content strategy
Slide 17
Slide 17 text
Content prioritization
Slide 18
Slide 18 text
Layout sketches
Slide 19
Slide 19 text
Common responsive layout patterns
Slide 20
Slide 20 text
Mostly fluid
Slide 21
Slide 21 text
Column drop
Slide 22
Slide 22 text
Layout shifter
Slide 23
Slide 23 text
Off-Canvas
Slide 24
Slide 24 text
Layout sketches
Slide 25
Slide 25 text
Develop-y Design Work
Slide 26
Slide 26 text
Typography Browser or Typecast http://typecast.com/
Slide 27
Slide 27 text
Shape
Slide 28
Slide 28 text
Color
Slide 29
Slide 29 text
Style tiles http://styletil.es/
Slide 30
Slide 30 text
Style prototypes https://github.com/sparkbox/style-prototype
Slide 31
Slide 31 text
Element collages http://danielmall.com/articles/rif-element-collages/
Slide 32
Slide 32 text
Design-y Development Work
Slide 33
Slide 33 text
Developer Sprint Review Action Items
Slide 34
Slide 34 text
Experiment *
Slide 35
Slide 35 text
Collaborate *
Slide 36
Slide 36 text
Communicate *
Slide 37
Slide 37 text
Questions? *
Slide 38
Slide 38 text
http://goo.gl/9jUJPO