SlideShare ist ein Scribd-Unternehmen logo
1 von 284
DIGITAL
PUBLISHING
WAS PRINT-DESIGNER
VON WEBDESIGNERN
LERNEN KÖNNEN
Hallo!
Was ist eigentlich
unser Problem?
http://www.flickr.com/photos/26320335@N06/4647058825/
http://www.flickr.com/photos/richardgiles/4759491799/
http://www.flickr.com/photos/richardgiles/4759491799/
http://www.flickr.com/photos/adactio/6153481666/
/o
Das ist unser Job!
Grafiker
Editorial Designer
User Interface
Designer
User Experience
Designer
Interaction Designer
Webdesigner
http://www.flickr.com/photos/94062764@N07/8558004261/
Good art is
interpreted,
good design is
understood“
“ John O‘Nolan @JohnONolan
„
Design löst Probleme,
Kunst findet sie.
Good art is a talent.
Good design is a skill“
“ John O‘Nolan @JohnONolan
„
?
Variierende Größe
http://www.flickr.com/photos/adactio/6153481666/
Variierendes Format
http://www.flickr.com/photos/adactio/6153481666/
http://www.flickr.com/photos/56164003@N02/8419208409/
Verschiedene
Auflösungen
Verschiedene
Performance
http://www.flickr.com/photos/adactio/6153481666/
http://www.flickr.com/photos/dlukz1/359224581
http://bradfrost.github.io/this-is-responsive/
http://interfacesketch.tumblr.com/
http://www.lukew.com/ff/entry.asp?1514
http://zurb.com/responsive/design
http://ia.net/blog/responsive-typography-the-basics/
Was ist eigentlich
unser Produkt?
http-//www.flickr.com/photos/rodrigogalindez/4637637597/
http://www.flickr.com/photos/nnova/2965208854/
App
Design
Inhalt
http://www.flickr.com/photos/peretzpup/2084387730/
Präsentation
Design
Verschiedene
Formate
http://www.flickr.com/photos/adactio/6153481666/
Usability
http://www.flickr.com/photos/nnova/2965208854/
http://www.flickr.com/photos/baldiri/5734993652/
Konzepte
testen
Verschiedene
Formate
http://www.flickr.com/photos/adactio/6153481666/
The control which designers know in
the print medium, and o!en desire in
the web medium, is simply a function of
the limitation of the printed page. We
should embrace the fact that the web
doesn’t have the same constraints, and
design for this flexibility.“
,‘John Allsopp @johnallsopp
„
http://mediaqueri.es
http://mediaqueri.es
http://mediaqueri.es
http://mediaqueri.es
Responsive
Webdesign
http://www.flickr.com/photos/likeablerodent/5896226033/
flüssig
http://goldengridsystem.com/
http://www.flickr.com/photos/m4tik/1857978
flexibel
http://ryanswarts.com/responsive/plain/
http://ryanswarts.com/responsive/plain/
http://www.flickr.com/photos/zeldman/8491607991
medien-abhängig
http://worldwildlife.org/
http://worldwildlife.org/
http://worldwildlife.org/
Keine festen
Layouts möglich
http://clearleft.com/thinks/visualdesignexplorations/
Style tiles
http://www.flickr.com/photos/conchur/2443635669
Modular
denken
Usability
http://www.flickr.com/photos/nnova/2965208854/
http-//www.flickr.com/photos/rodrigogalindez/4637637597/
http://www.flickr.com/photos/fleur-design/2679443469
Gesten
1cm
7mm Menüpunkt 23
Menüpunkt 22
Menüpunkt 24
2mm
Checkbox 188
Checkbox 187
Checkbox 189
Animation
http://uxdesign.smashingmagazine.com/2012/10/30/motion-animation-new-mobile-ux-design-material/
http://uxdesign.smashingmagazine.com/2012/10/30/motion-animation-new-mobile-ux-design-material/
http://uxdesign.smashingmagazine.com/2012/10/30/motion-animation-new-mobile-ux-design-material/
Bsp.
Feedback
Senden Senden
Konsistenz
You already
know how
to use it“
„
http://www.flickr.com/photos/acaben/541301944/
http://www.flickr.com/photos/baldiri/5734993652/
Konzepte
testen
Scribbles
versus
Storyboards
http://boxesandarrows.com/storyboarding-ipad-transitions/
Statische
Wireframes
versus
interaktive
Prototypen
http://boxesandarrows.com/storyboarding-ipad-transitions/
http://popapp.in/
http://pinterest.com/pin/80994493268796619/
http://pinterest.com/pin/80994493268796619/
Auch auf
alten & billigen
Geräten testen
Mit echten
Inhalten testen
Lorem impsum
is fucking evil“
“ Josh Brewer @jbrewer
„
Guten und schlechten
Inhalt testen
Inhalt
Kontext
http://www.flickr.com/photos/officialgdc/6811976872/
Weiterverwertung
Aktualität und
Beständigkeit
Kontext
http://www.flickr.com/photos/officialgdc/6811976872/
Smartphones
http://www.flickr.com/photos/stignygaard/7220404362
http://www.flickr.com/photos/clanlife/6369793391/
http://www.flickr.com/photos/officialgdc/6811976872/
http://www.flickr.com/photos/33498942@N04/7546974252/
http://www.flickr.com/photos/ironypoisoning/8137119136/
Tablets
http://www.flickr.com/photos/antmcneill/4686147794/
http://www.flickr.com/photos/juhansonin/7206924392
knackige Sätze
weniger Füllwörter
aktive Sprache
http://xkcd.com/773/
Inhalte anpassen
oder nicht?
besser anpassbar
mehr Kontrolle
speziellere Erfahrung
http://wtfmobileweb.com/image/51641083595
http://wtfmobileweb.com/image/51557753956
Weiterverwertung
Content first
Eindeutige
Dateinamen
2013-03-12 Rolling Stone Template CS6 V1.8.indt
2013-03-12 Rolling Stone Template CS6 V1.8.indt
2013-03-12 Rolling Stone Template CS6 V1.8.indt
Selbsterklärende
und flexible
Dateistruktur
_archive
_input
_links
_temp
HTMLRessources
ios.640x960
ios.1024x768
_archive
_input
_links
_temp
HTMLRessources
ios.640x960
ios.1024x768 000-title
010-editorial
020-letters
030-topstory1
_archive
_input
_links
_temp
HTMLRessources
ios.640x960
ios.1024x768 000-title
010-editorial
011-ad1
020-letters
030-topstory1
_archive
_input
_links
_temp
HTMLRessources
ios.640x960
ios.1024x768 000-title
010-editorial
011-ad1
020-letters
030-topstory1
topstory1_h.indd
topstory1_v.indd
thumb.png
Kommentieren und
Dokumentieren
Aktualität und
Beständigkeit
http://www.flickr.com/photos/nnova/2965208854/
Kontinuierliche
Verbesserung
Präsentation
http://www.flickr.com/photos/tschiae/8417927326/
Frameworks
Native Apps
Native Apps
maßgeschneidert
Native Apps
maßgeschneidert
beschränkt
Native Apps Webapps
maßgeschneidert
beschränkt
Native Apps Webapps
maßgeschneidert
beschränkt
offene Standards
Native Apps Webapps
maßgeschneidert
beschränkt
offene Standards
Quellcode
Native Apps Webapps
E-Books
maßgeschneidert
beschränkt
offene Standards
Quellcode
Native Apps Webapps
E-Books
maßgeschneidert
beschränkt
offene Standards
Quellcode
barrierefrei
http://www.flickr.com/photos/pazca/8394938882
Native Apps Webapps
E-Books
maßgeschneidert
beschränkt
offene Standards
Quellcode
barrierefrei
kaum Design
Native Apps Webapps
E-Books PDF-Maker
maßgeschneidert
beschränkt
offene Standards
Quellcode
barrierefrei
kaum Design
Native Apps Webapps
E-Books PDF-Maker
maßgeschneidert
beschränkt
offene Standards
Quellcode
barrierefrei
kaum Design
schnell
Native Apps Webapps
E-Books PDF-Maker
maßgeschneidert
beschränkt
offene Standards
Quellcode
barrierefrei
kaum Design
schnell
funktioniert nicht
Native Apps Webapps
E-Books PDF-Maker ID-Plugins
maßgeschneidert
beschränkt
offene Standards
Quellcode
barrierefrei
kaum Design
schnell
funktioniert nicht
Native Apps Webapps
E-Books PDF-Maker ID-Plugins
maßgeschneidert
beschränkt
offene Standards
Quellcode
barrierefrei
kaum Design
schnell
funktioniert nicht
schöne Layouts
Native Apps Webapps
E-Books PDF-Maker ID-Plugins
maßgeschneidert
beschränkt
offene Standards
Quellcode
barrierefrei
kaum Design
schnell
funktioniert nicht
schöne Layouts
pixelgenau
Native Apps Webapps
E-Books PDF-Maker ID-Plugins
maßgeschneidert
beschränkt
offene Standards
Quellcode
barrierefrei
kaum Design
schnell
funktioniert nicht
schöne Layouts
pixelgenau
Native Apps Webapps
ID-Plugins
maßgeschneidert
beschränkt
offene Standards
Quellcode
schöne Layouts
pixelgenau
PDF-Maker ID-Plugins
schnell
funktioniert nicht
schöne Layouts
pixelgenau
Native Apps
E-Books
maßgeschneidert
beschränkt
barrierefrei
kaum Design
http://www.flickr.com/photos/nnova/2965208854/
Cover
Inhaltsverzeichnis
Überblick und
Navigation
Navigation
Überblick
Erweitertes
Universum
http://www.flickr.com/photos/44080248@N03/4439432594
Eine Menge Arbeit
schneller
weniger redundant
spannender!
DRY
Don‘t Repeat
Yourself
Rock & Roll
Features
Reviews
Rock & Roll
Features
Reviews
Das sinnvollste Tools
verwenden
Proprietäre
Lösungen vs.
Webstandards
An die Zukun!
denken
<3 Alpha
Neues lernen
Es lohnt sich
Geringere Größe
Wiederverwendbar
Typografie
Grafik Design
Editorial Design
http://www.flickr.com/photos/adactio/6153558098
Danke!
http://www.flickr.com/photos/adactio/6153558098

Weitere ähnliche Inhalte

Empfohlen

PEPSICO Presentation to CAGNY Conference Feb 2024
PEPSICO Presentation to CAGNY Conference Feb 2024PEPSICO Presentation to CAGNY Conference Feb 2024
PEPSICO Presentation to CAGNY Conference Feb 2024Neil Kimberley
 
Content Methodology: A Best Practices Report (Webinar)
Content Methodology: A Best Practices Report (Webinar)Content Methodology: A Best Practices Report (Webinar)
Content Methodology: A Best Practices Report (Webinar)contently
 
How to Prepare For a Successful Job Search for 2024
How to Prepare For a Successful Job Search for 2024How to Prepare For a Successful Job Search for 2024
How to Prepare For a Successful Job Search for 2024Albert Qian
 
Social Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie InsightsSocial Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie InsightsKurio // The Social Media Age(ncy)
 
Trends In Paid Search: Navigating The Digital Landscape In 2024
Trends In Paid Search: Navigating The Digital Landscape In 2024Trends In Paid Search: Navigating The Digital Landscape In 2024
Trends In Paid Search: Navigating The Digital Landscape In 2024Search Engine Journal
 
5 Public speaking tips from TED - Visualized summary
5 Public speaking tips from TED - Visualized summary5 Public speaking tips from TED - Visualized summary
5 Public speaking tips from TED - Visualized summarySpeakerHub
 
ChatGPT and the Future of Work - Clark Boyd
ChatGPT and the Future of Work - Clark Boyd ChatGPT and the Future of Work - Clark Boyd
ChatGPT and the Future of Work - Clark Boyd Clark Boyd
 
Getting into the tech field. what next
Getting into the tech field. what next Getting into the tech field. what next
Getting into the tech field. what next Tessa Mero
 
Google's Just Not That Into You: Understanding Core Updates & Search Intent
Google's Just Not That Into You: Understanding Core Updates & Search IntentGoogle's Just Not That Into You: Understanding Core Updates & Search Intent
Google's Just Not That Into You: Understanding Core Updates & Search IntentLily Ray
 
Time Management & Productivity - Best Practices
Time Management & Productivity -  Best PracticesTime Management & Productivity -  Best Practices
Time Management & Productivity - Best PracticesVit Horky
 
The six step guide to practical project management
The six step guide to practical project managementThe six step guide to practical project management
The six step guide to practical project managementMindGenius
 
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...RachelPearson36
 
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...Applitools
 
12 Ways to Increase Your Influence at Work
12 Ways to Increase Your Influence at Work12 Ways to Increase Your Influence at Work
12 Ways to Increase Your Influence at WorkGetSmarter
 
Ride the Storm: Navigating Through Unstable Periods / Katerina Rudko (Belka G...
Ride the Storm: Navigating Through Unstable Periods / Katerina Rudko (Belka G...Ride the Storm: Navigating Through Unstable Periods / Katerina Rudko (Belka G...
Ride the Storm: Navigating Through Unstable Periods / Katerina Rudko (Belka G...DevGAMM Conference
 

Empfohlen (20)

Skeleton Culture Code
Skeleton Culture CodeSkeleton Culture Code
Skeleton Culture Code
 
PEPSICO Presentation to CAGNY Conference Feb 2024
PEPSICO Presentation to CAGNY Conference Feb 2024PEPSICO Presentation to CAGNY Conference Feb 2024
PEPSICO Presentation to CAGNY Conference Feb 2024
 
Content Methodology: A Best Practices Report (Webinar)
Content Methodology: A Best Practices Report (Webinar)Content Methodology: A Best Practices Report (Webinar)
Content Methodology: A Best Practices Report (Webinar)
 
How to Prepare For a Successful Job Search for 2024
How to Prepare For a Successful Job Search for 2024How to Prepare For a Successful Job Search for 2024
How to Prepare For a Successful Job Search for 2024
 
Social Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie InsightsSocial Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie Insights
 
Trends In Paid Search: Navigating The Digital Landscape In 2024
Trends In Paid Search: Navigating The Digital Landscape In 2024Trends In Paid Search: Navigating The Digital Landscape In 2024
Trends In Paid Search: Navigating The Digital Landscape In 2024
 
5 Public speaking tips from TED - Visualized summary
5 Public speaking tips from TED - Visualized summary5 Public speaking tips from TED - Visualized summary
5 Public speaking tips from TED - Visualized summary
 
ChatGPT and the Future of Work - Clark Boyd
ChatGPT and the Future of Work - Clark Boyd ChatGPT and the Future of Work - Clark Boyd
ChatGPT and the Future of Work - Clark Boyd
 
Getting into the tech field. what next
Getting into the tech field. what next Getting into the tech field. what next
Getting into the tech field. what next
 
Google's Just Not That Into You: Understanding Core Updates & Search Intent
Google's Just Not That Into You: Understanding Core Updates & Search IntentGoogle's Just Not That Into You: Understanding Core Updates & Search Intent
Google's Just Not That Into You: Understanding Core Updates & Search Intent
 
How to have difficult conversations
How to have difficult conversations How to have difficult conversations
How to have difficult conversations
 
Introduction to Data Science
Introduction to Data ScienceIntroduction to Data Science
Introduction to Data Science
 
Time Management & Productivity - Best Practices
Time Management & Productivity -  Best PracticesTime Management & Productivity -  Best Practices
Time Management & Productivity - Best Practices
 
The six step guide to practical project management
The six step guide to practical project managementThe six step guide to practical project management
The six step guide to practical project management
 
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
 
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...
 
12 Ways to Increase Your Influence at Work
12 Ways to Increase Your Influence at Work12 Ways to Increase Your Influence at Work
12 Ways to Increase Your Influence at Work
 
ChatGPT webinar slides
ChatGPT webinar slidesChatGPT webinar slides
ChatGPT webinar slides
 
More than Just Lines on a Map: Best Practices for U.S Bike Routes
More than Just Lines on a Map: Best Practices for U.S Bike RoutesMore than Just Lines on a Map: Best Practices for U.S Bike Routes
More than Just Lines on a Map: Best Practices for U.S Bike Routes
 
Ride the Storm: Navigating Through Unstable Periods / Katerina Rudko (Belka G...
Ride the Storm: Navigating Through Unstable Periods / Katerina Rudko (Belka G...Ride the Storm: Navigating Through Unstable Periods / Katerina Rudko (Belka G...
Ride the Storm: Navigating Through Unstable Periods / Katerina Rudko (Belka G...
 

Digital Publishing