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
Design Deliverables
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
Peter Kaizer
January 03, 2015
Design
570
1
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Design Deliverables
Alternatives to Multi-Layered Photoshop Comps in a Responsive World
Peter Kaizer
January 03, 2015
More Decks by Peter Kaizer
See All by Peter Kaizer
Rapid Wireframing with front-end frameworks
pdkaizer
1
180
Web Design Workflow
pdkaizer
6
290
Rapid CMS Enabled site development with Wordpress
pdkaizer
0
120
Other Decks in Design
See All in Design
再設計される業務 - AIにより再設計される "デザインワークフロー" / AI Ops Lab #2 Redesigned orkflows
kgsi
0
810
“なんとなくFigma”から一歩先へ。AI時代も活きるWeb制作フロー
ayumidesign
0
160
kintone開発におけるライターの役割の変化〜AI活用を添えて〜 / Changes in the Role of Writers in Kintone Development
keroyama
0
160
「使いやすさ」だけでは、「勝てる」サービスにはならない。〜KPIとUXの分断を埋める、サービス戦略という「指針」〜
nbkouhou
2
550
デザインワークフローの最前線。 ログラスでのAI活用の現在地
ukaoli
1
1.8k
PLATEAUで白い街を作る
aikautau
0
140
Figma MCPを活用するためのデザインハンドブック
vivion
8
19k
なぜ、インサイトを貯めるのか?
tajima_kaho
3
2.6k
(2026 AmA Keynote) Sociotechnical Architecture - Having your Agile and agility too.pdf
xinyao
2
110
保育現場にAIを 〜人と技術に橋を架けるデザインで考えてきたこと〜 uiuxcamp2026-hoiku-ai-design
hiro93n
1
360
もう迷わない!“なんとなく”を卒業するフォントの選び方【村田俊英】
toshihidemurata
0
820
「ツール」から「パートナー」へ。AI伴走時代のUXデザインとは?~操作を減らし、成果を最大にするための設計~
ncdc
1
730
Featured
See All Featured
The SEO identity crisis: Don't let AI make you average
varn
0
530
How to Build an AI Search Optimization Roadmap - Criteria and Steps to Take #SEOIRL
aleyda
1
2.1k
Why You Should Never Use an ORM
jnunemaker
PRO
61
10k
Fireside Chat
paigeccino
42
4k
The Mindset for Success: Future Career Progression
greggifford
PRO
0
440
First, design no harm
axbom
PRO
2
1.2k
KATA
mclloyd
PRO
35
15k
Optimizing for Happiness
mojombo
378
71k
Building Better People: How to give real-time feedback that sticks.
wjessup
370
20k
Leveraging Curiosity to Care for An Aging Population
cassininazir
1
460
RailsConf 2023
tenderlove
30
1.5k
How to Get Subject Matter Experts Bought In and Actively Contributing to SEO & PR Initiatives.
livdayseo
0
170
Transcript
Design Deliverables Alternatives to Multi-Layered Photoshop Comps in a Responsive
World
Design Deliverables? Our best thinking and our design process +
What we need to communicate about our design solution to our clients
What do we need communicate in our design deliverables •
Color palette • Typography • Iconography • Tone • Concept • UI Elements • Interactions
None
Why we need to rethink our design deliverables in this
responsive era
A multi layered Photoshop comp is like a painting hanging
on a wall Our designs usually are not hung on a wall
Some alternative approaches
http://styletil.es/
Element collage
Pattern library
Pattern lab
Typecast
Rapid prototyping • Code • Frameworks: • Bootstrap • Foundation
• Neat • Curated library • Rock Hammer • Applications • Hammer • Mixture • Visual • Adobe Re-Flow • Macaw
–Dan Mall “Replace ‘sign off’ with ‘go on’.”
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/
Thank you! peterkaizer.com @pdkaizer