Slide 1

Slide 1 text

Design Deliverables Alternatives to Multi-Layered Photoshop Comps in a Responsive World

Slide 2

Slide 2 text

Design Deliverables? Our best thinking and our design process + What we need to communicate about our design solution to our clients

Slide 3

Slide 3 text

What do we need communicate in our design deliverables • Color palette • Typography • Iconography • Tone • Concept • UI Elements • Interactions

Slide 4

Slide 4 text

No content

Slide 5

Slide 5 text

Why we need to rethink our design deliverables in this responsive era

Slide 6

Slide 6 text

A multi layered Photoshop comp is like a painting hanging on a wall Our designs usually are not hung on a wall

Slide 7

Slide 7 text

Some alternative approaches

Slide 8

Slide 8 text

http://styletil.es/

Slide 9

Slide 9 text

Element collage

Slide 10

Slide 10 text

Pattern library

Slide 11

Slide 11 text

Pattern lab

Slide 12

Slide 12 text

Typecast

Slide 13

Slide 13 text

Rapid prototyping • Code • Frameworks: • Bootstrap • Foundation • Neat • Curated library • Rock Hammer • Applications • Hammer • Mixture • Visual • Adobe Re-Flow • Macaw

Slide 14

Slide 14 text

–Dan Mall “Replace ‘sign off’ with ‘go on’.”

Slide 15

Slide 15 text

Resources • Style Tiles - http://styletil.es/ • Element collage - http://danielmall.com/articles/rif-element- collages/ • Pattern libraries - http://ux.mailchimp.com/patterns • Typecast - http://typecast.com/

Slide 16

Slide 16 text

Thank you! peterkaizer.com @pdkaizer