Alles bleibt, wie es ist, alles andere werfen wir über Bord. 10. Oktober, 2014, WAM Workshop Michael Brügmann ([email protected]) Marek Claussen ([email protected]) Jörg Pechau ([email protected]) Die Aufgabe Ein bekanntes, anspruchsvolles, über die Jahre gewachsenes Produkt in die Neuzeit holen. Quellen: elitepartner.de, Wikipedia Die Rahmenbedingungen •  Bekanntheit der Marke erfordert behutsamen Umgang bei der Schaffung Neuem •  Anspruchsvolle, zahlende Nutzer erwarten hohe Qualität •  Es muss auf ein, über die Jahre gewachsenes Backend aufgesetzt werden Herausforderung 1 Behutsamer Umgang mit der Marke Denn… –  über 10 Jahre Markenaufbau –  hoher Bekanntheitsgrad –  ElitePartner muss hohem Qualitätsanspruch gerecht werden –  Attribute, die mit der Marke verbunden werden, müssen erhalten bleiben Alles bleibt wie es ist. Herausforderung 2 Anspruchsvolles Umfeld Denn die Kunden –  zahlen nicht für Halbwertiges –  erwarten einen funktionalen Umfang, wie über etablierte Kanäle, z.B. die Web-Seite –  wollen das Gleiche bzw. Vertraute, nur besser Herausforderung 3 Aufbauen auf dem vorhandenen Backend „Big Ball of Mud“ –  Über Jahre gewachsenes Backend, das seine bisherigen Aufgaben gut erfüllte –  Ein kompletter Umbau ist Aufgrund beschränkter Kapazitäten nicht möglich –  Betrieb muss reibungslos weiterlaufen Quelle: Bethany Ericson Projektziele Das übergeordnete Ziel Eine Die iPad-App –  Web-Seite definiert Funktionsumfang –  Fokus auf Frontend & UX Ein weiteres Ziel –  Schaffung / Überarbeitung des APIs parallel zur Entwicklung und dem laufenden Betrieb Ganz weit hinten im Hinterkopf verstecktes Ziel UX-Prinzipien & neue Architektur sollen auch für Remake der iPhone App greifen können Quelle: wikipedia.com UMSETZUNG Prinzipien Ausreichend Zeit –  Für die Vorbereitung –  Geduld in Konzeptionund Umsetzung Interaktion & Kollaboration –  –  –  –  Design, Interaktions-Design, Client-Entwicklung, API-Entwicklung und User-Tests parallelisiert und verzahnt Prinzipien Konzepte „begreifbar machen“ –  Feedback sammeln und einarbeiten –  Nutzer schon während Konzeption („Papier“-Prototypen) befragt –  Software früh zum Testen gegeben –  Messen Quellen: elitepartner.de, Wikipedia Produkt 1. Skizze Autonome Teams von Beginn an –  –  –  –  Entscheider / Product Owner Designer Mobile Experts / Developer API-Teams in „Zurufreichweite“ Arbeiten wie ein internes StartUp –  Frei von hausinternen Prozessen –  Keine „gesetzten“ Werkzeuge –  Eigene Taktung Quelle: canstartchat.wordpress.com Architektur für Wiederverwendung „Neues altes“ API –  Fast alles wurde überarbeitet –  Einiges ergänzt –  Ein Rest von ca. 5-10% belassen aus wirtschaftlichen Gründen belassen wie es war –  Ziel erreicht Model und View zu trennen Alles andere werfen wir üb er Bord. Komponenten –  Im Client eigenständige funktionale Einheiten gebildet –  API entlang der funktionalen Einheiten gebaut –  Aus dem Client Funktionalität auf den Server verschoben Wiederverwendbare UIs (Ohne ein echtes Code-Beispiel fehlt doch was...) Statt StoryBoard programmatisches Autolayout / Layout Quellen: developer.apple.com, icnh.de ZIELE ERREICHT? Die iPad-App Der Lackmus-Test – die Nebenziele UX Prinzipien –  Funktionierten „im Prinzip“ –  Anpassung IxD an kleineren Screen –  Neuinterpretation einiger Funktionen an kleineren Screen Architektur –  Komponenten und –  API funktionierten „out of the box“ Aufwand –  iPhone ~ 1/3 iPad Und jetzt „Butter bei die Fische“ DEMO-ZEIT Ansprechpartner Marek Claussen Head of Product [email protected] EliteMedianet GmbH Am Sandtorkai 50 20457 Hamburg Jörg Pechau Geschäftsführer [email protected] / 0151 5258 2921 I.C.N.H GmbH Eifflerstraße 43 22769 Hamburg