46
MobileTech Conference 2015 @webinterface Peter Rozek Responsive Workflow Break the rules or die

Responsive Workflow, Break the rules or die

Embed Size (px)

Citation preview

MobileTech Conference 2015

@webinterface Peter Rozek

Responsive Workflow Break the rules or die

SpeakerPeter Rozek

@webinterface

Arbeite bei ecx.io (Digital Agentur)

Themengebiete: UX,

Usability, Accessibility

Frontend

twitter: @webinterface

Wer bin ich

@webinterface Peter Rozek

„Responsive Workflow“

@webinterface

Was heißt das eigentlich?

Wie sieht das aus?

Wie können wir das messen?

@webinterface

Responsive Workflow heißt mit alten Regeln, Prozessen

und Denkweisen brechen.

@webinterface

Break the rules

@webinterface

Break the rules

Steve Jobs präsentiert am 09. Januar 2007 der Welt das iPhone.

Paradigmenwechsel in der Interaktion.

@webinterface

Ablösung der grafischen Benutzeroberfläche und

ihren Desktopmetaphern.

@webinterface

@webinterface

Von der Methaper (GUI) Zur natürlichen Interaktion (NUI)

GUI NUI

@webinterface

Break the rules

27. Januar 2010 das iPad wird vorgestellt.

@webinterface

Nutzer sind nicht mehr mit einem Gerät Online.

„People use any platform to do anything“– Giles Colborne, (Colborne 2012)

@webinterface www.flickr.com

@webinterface msxbook.com/stuff/MSX_Diagramm.pdf

@webinterface

*Bildschirmauflösungen

2010

232*97*

2013

https://www.4stats.de/market-share/browser/

@webinterface http://alistapart.com/article/responsive-web-design

Mai 2010 Ethan Marcotte verwendet den Begriff Responsive Webdesign.

@webinterface

Break the rules

Responsive Webdesign „vereint“ unterschiedliche Interaktionsprinzipien.

GUI NUI

what's next?

@webinterface

Die graphische Repräsentation wird immer

mehr von den Bedienelementen

entkoppelt.

@webinterface

@webinterface

Break the rules

Microsoft Holo Lens

@webinterface

@webinterface

Was heißt das für unseren Prozess?

@webinterface

Ein „neuer“ Workflow muss her.

@webinterface

Break the rules or die.

Vergesst das Wasserfallmodell.

@webinterface

Es war schon immer „Mist“.

Developer und Designer an einem Tisch.

@webinterface

Alle an einem Tisch.

@webinterface

Auch der Auftaggeber!

Agentur-Workflow

@webinterface

VS.

Kunden-Workflow

@webinterface

Arbeitsprozess ändernBreak the rules

„Design your site in the medium it’s going to live“.

@webinterface

„Using photoshop/fireworks for responsive design is like bringing a knife to a gunfight“

Andy Clarke (@Malarkey)

@webinterface Image by Geri Coady.

Photoshop als das sehen was es ist.

@webinterface

Idee mit Photoshop visualisieren.

@webinterface

@webinterface

Moodboards / Style Tiles

http://bradfrostweb.com/blog/post/atomic-web-design/

@webinterface

Brad Frost - Atomic Design

http://bradfrostweb.com/blog/post/atomic-web-design/

Breakpoints nach Inhalten und nicht nach Geräten

definieren.

@webinterface

@webinterface http://www.businessinsider.com/android-fragmentation-2014-8

18796 Android Geräte

@webinterface

Denkweise ändernBreak the rules

In Wirkungsweisen und Handlungen denken, nicht in Funktionen und festen

Strukturen.

@webinterface

„Understandig your users, their devices and how they use them should be every

designer’s first step.“ – Andy Gilliland and Nate Cox, Punchcut

@webinterface

„Give up control – not quality“Jeremy Keith (@adactio)

@webinterface

„Responsive design is not about mobile. Its not about tablets. Its not about desktops. Its

about The Web.“Jeremy Keith (@adactio)

@webinterface

Vielen Dank und Merci…

@webinterface Peter Rozek

email: [email protected]

Noch Fragen…

?

@webinterface Peter Rozek

…für meine Ellen

@webinterface@webinterface Peter Rozek

Responsive Workflow Break the rules or diePeter Rozek, 24.03.2015 München