20140703 Grenzen von Responsive Design Fonda Auer

GRENZEN VON RESPONSIVE DESIGN SUMMIT 2014

3 Grenzen von Responsive Design

COPE

CREATE ONCE PUBLISH EVERYWHERE

tap it


scan it


view it


swipe it


scroll it


read it


touch it


scale it


do what you want with it



2010 ……. 2014 …


Qualität vs. Performance


Qualität vs. Performance

Picture Element. Danke.

>


Tabellen und Übersicht


Tabellen und Übersicht

• Prioritäten • Scrolling • Selektionen

>


Komplexe Struktur und wenig Platz


Komplexe Struktur und wenig Platz


Wie groß ist ein Finger? In Pixel!

45 – 57 Pixel

24

RESS

RESS: Responsive Design und Server Side Components

Ich kann doch nicht alles machen! RESS bitte.

Alles lösbar – alles gut?

Konzept, Design und Technik machen’s möglich?


Oje 1 Oje 2 Oje 3 Oje 4


RESPONSIVE DESIGN WON’T FIX YOUR CONTENT PROBLEM.

-‐ Karen McGrane

Oje 1


CONTENT

Website

Intranet

Social Media

Mobile Web

Smartphone Apps

Tablet Apps

Print Uhren

Car Entertainment

Toaster

Smart TV

Google Glasses

Landingpages

Microsites

Kühlschrank

Blogs


“ Verpflichte dich dem Multi-Channel-Anspruch. Sorg dafür, dass die Leute über besseren und strukturierteren Content nachdenken.“ - Leisa Reichelt, die Leiterin des Government Digital Services in UK


“ For example, because our recipes were never properly tagged by ingriedients and cooking time, we floundered for about 15 years trying to figure out how to create a useful recipe database. We can do it now, but only after spending a huge sum to retroactively structure the data.“ - The New York Times Innovation Report


Typ Headline

Kategorie

Betonung

Text

Autor

Lead in

Tags

Bilder

Videos EIN

ARTIKEL

Geo Location


“ The future of content management systems is in their ability to capture the content in a clean, presentation-independent way.“ - Daniel Jacobson, Netflix


Content Management statt Web Publishing

Source: Rasmus Skjodan, der Typo3 NEOS UX Lead

Bye bye - WYSIWYG!

Welcome multi-device and multi-channel!


EINE FÜR ALLE IST BILLIGER.

Oje 2


“ Wir möchten eine neue Website. Was kostet das?“ - Ein Kunde

“ XX,-“ - Agentur


“ Wir möchten eine neue Website. Was kostet das? Ach ja – und sie soll auf allen Geräten optimal funktionieren.“ - Ein Kunde

“ XX,- + 50%“ - Agentur


“ Wir wollen unsere Website optisch modernisieren. - Ein Kunde

“ OK – also ein Refreshment!“ - Agentur


“ Ja genau – ein Refreshment. Ach ja – und sie soll auf allen Geräten optimal funktionieren.“ - Ein Kunde

“ Stopp! Also doch ein Komplettrelaunch!“ - Agentur


RESPONSIVE WEB ERSETZT KEINE APP!

Oje 3


Nein, die Website kann nicht …

… offline genutzt werden!

… so performant sein!

… verkauft werden

… zu 100% auf die User-Situation eingehen.

… alle Gerätefunktionen nutzen

… im App-Store beworben werden

… die gleiche UX bieten


WE PROUDLY PRESENT: THE HAMBURGER

Oje 4


“ No one understands the icon, let’s add the word menu. The word is too small, let’s add a pop-up calling it out.“

Luke Wroblewski - pic.twitter.com/Jargi7gavX


Hamburger A/B Test: 1. Test

Source: hDp://exisweb.net/mobile-‐menu-‐abtest




✔




Baseline

Menü + Border Hamburger + Menü Menü




✔

Baseline

Menü + Border Hamburger + Menü Menü

Fonda Interaktive Medien und Kommunikation GmbH Neubaugasse 57/36 1070 Wien www.fonda.at

Danke!

20140703 Grenzen von Responsive Design Fonda Auer

Marketing