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
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
@webinterface@webinterface Peter Rozek
Responsive Workflow Break the rules or diePeter Rozek, 24.03.2015 München