Idee, Konzeption, Architektur: Erfolgreicher Start für ein App-Projekt iks Thementag Mobile Applikationen Es lebe die Vielfalt?! 20.11.2012 Autor: Hans-Jörg Stangor
Agenda Einführung und Grundbegriffe Die eigene App (Idee) App Design (Konzeption Teil 1) Mock-Up Phase (Konzeption Teil 2) Aufgabenverteilung zwischen App & Backend (Architektur) Zusammenfassung Seite 3 / 53
Agenda Einführung und Grundbegriffe Die eigene App (Idee) App Design (Konzeption Teil 1) Mock-Up Phase (Konzeption Teil 2) Aufgabenverteilung zwischen App & Backend (Architektur) Zusammenfassung Seite 4 / 53
Apps sind das neue Web Android (Google) ios (Apple) Windows Phone 8 / Surface Tablet (Microsoft) Andere OS Hersteller folgen dem Trend Seite 5 / 53
Warum die hohe Popularität? Aktive Entwicklergemeinde dank App Store Modell 70:30 Regel (Umsatzteilung) Inkasso als Dienstleistung Preispunkt < 1 Euro möglich Impulskäufe durch Benutzer Preispunkt < 1 Euro profitabel ios zeigte wie ein mobiles Betriebssystem aussehen muss Human Interface Guidelines intuitive Benutzung Android erschließt Märkte die Apple nicht erreicht Auch kostengünstige Geräte Vielfältige Anpassungen möglich (Individualität) Seite 6 / 53
Warum auch im Unternehmen? Mehr und mehr Produktiv-Apps Privater Einsatz führt zum Wunsch nach Firmeneinsatz Angetrieben durch Mitarbeiter Angetrieben durch Kunden Firmengeräte können konfiguriert werden (ios) Sinnvolle Einschränkung der Funktionen Seite 7 / 53
Anwendungen für das Unternehmen Seite 8 / 53
Stark umkämpfter Marktplatz Einige sehr erfolgreiche Apps > 100.000 Apps im Store Hoher Konkurrenzdruck Anwendungen gehen unter Nutzer sehr wechselfreudig Fokus auf Nutzen/Mehrwert Design und Features extrem wichtig Seite 9 / 53
Anwendungs-Typen (Smartphone/Tablet) Web App (HTML & JavaScript) Läuft im Mobile Browser Läuft auch im großen Browser Großes Potential durch HTML5 Selten auf Homescreen installiert App (native, via App Store geladen) Kann alle Features nutzen Hoch performant Spezialfall: verpackte Web App: Hybrid App Seite 10 / 53
App-Features die über Web Apps hinausgehen Offline-Modus (neben Wifi, EDGE, 3G, LTE ) GPS Funktionalität Beschleunigungs-/Neigungs-Sensoren Kamera, Mikrofon SDK: Multimedia und 2D/3D ist leicht Operationen aus dem Standby heraus (Push-Nachrichten / Pull) App-Kooperation / Weiterleiten der Inhalte durch Öffnen in Tipp: Aktuelle Möglichkeiten HTML5 auf http://mobilehtml5.org/ Seite 11 / 53
Agenda Einführung und Grundbegriffe Die eigene App (Idee) App Design (Konzeption Teil 1) Mock-Up Phase (Konzeption Teil 2) Aufgabenverteilung zwischen App & Backend (Architektur) Zusammenfassung Seite 12 / 53
Stakeholder & Projektteam Sponsor / Budgetverantwortlicher Eigene IT App-Entwickler (falls nicht schon durch eigene IT abgedeckt) Marketing Prozessverantwortliche Seite 13 / 53
Ideen für die eigene App Kreativen Rahmen zur Diskussion von Ideen schaffen Welche Webanwendungen existieren bereits? Würden Nutzer durch den mobilen Einsatz profitieren? Würde ein Offline-Modus zusätzlich Nutzen bringen? Nutzung existierender Backends? Gibt es Content Ströme? (News, Zeitung, Prospekt, Reporting ) Profitiert Nutzer / Kunde durch Multimedia? Soll etwas präsentiert werden? (Produkte, Inhalte, Ideen ) Vor Ort -Erfassung von Daten (Ablesen, Bestellprozesse, Angebote) Maßgeschneiderte Kundenunterstützung (Wo immer er ist (GPS)) Seite 14 / 53
Welche Plattform, welche Geräte? ios: Wenige Geräte (Developer-Vorteil, Nutzer-Nachteil) Dasselbe OS für iphone, ipad & ipod Stets Zugang zu aktuellster Firmware Über Hüllen nachdenken (Alltagstauglichkeit) Android Gerätevielfalt (+) <-> Fragmentierung (-) Lücke Tablet/Phone gelöst durch Android 4.x Testen, testen, testen! Windows Phone 8 Verschiedene Geräte-Anbieter (lizenzierbar) Ansonsten sehr nah an der geschlossenen ios Grundidee Blackberry, weiterhin noch auf dem Weg Seite 15 / 53
Entscheidungskriterien für Betriebssysteme Was setzen die Nutzer meiner Apps ein? Logs analysieren Umfragen (Fachabteilungen oder Endbenutzer (falls möglich)) Gewünschte Verteilungsmethode (Store oder frei, B2C oder B2B) Firmen-intern: Ausgewählte Zielgeräte Marktanteile Seite 16 / 53
Store-Analyse Andere Apps anschauen Erwartete Standardfeatures Bedienungs- und Designmuster Von den Besten lernen Fehler der Anderen identifizieren Wie reagieren Nutzer auf erfolgreiche / erfolglose Apps? Seite 17 / 53
Konkurrenz analysieren Über Kategorien Über Schlüsselworte Über Suchmaschinen und Keywords wie: App Android iphone, ios Windows Phone 8 Seite 18 / 53
ROI / RONI Bedenken Was ist der ROI? Kundenorientierung / Service Produktivitätssteigerung Einsparungen / Bessere Unterstützung des Außendienstes Klicks (Webseite oder Werbung) In manchen Fällen Umsatz Opportunitätskosten (RONI): Die Welt wird immer mobiler Ihre Webauftritte profitieren von Apps als Client Ist Ihre Konkurrenz bereits aktiv? Seite 19 / 53
Zahlungsmodelle Free / Werbefinanziert Paid Freemium Upgrade Free auf Paid (via In App Purchase) Abos und Subskription bei Content Seite 20 / 53
Agenda Einführung und Grundbegriffe Die eigene App (Idee) App Design (Konzeption Teil 1) Mock-Up Phase (Konzeption Teil 2) Aufgabenverteilung zwischen App & Backend (Architektur) Zusammenfassung Seite 21 / 53
Der ideale Platz auf dem Homescreen Seite 22 / 53
Wie bleibe ich auf dem Homescreen? Andere Apps mit gleicher Idee / Aufgabe verdrängen Erwartungen unserer Zielgruppe erfüllen (Interviews) App macht Benutzer produktiver App entwickelt sich stetig weiter Benutzer erhält Unterstützung / Hilfe Hält Benutzer auf dem Laufenden (Updates, News) Prestige, sozialer Faktor Herumzeigen (Design, Gimmicks) Analysieren Sie Featured Apps Apps, die die App Store Anbieter auszeichnen Seite 23 / 53
Design-relevant: Wer sind die erhofften Nutzer? Welche Funktionen werden erwartet? Wann / Wo / Wie wird die App genutzt? Online oder Offline? Welche Störungen treten dabei auf? Seite 24 / 53
Mobile Nutzung Umgebung A Seite 25 / 53
Mobile Nutzung Umgebung B Seite 26 / 53
Falls mit Ablenkung zu rechnen ist: Seite 27 / 53
Das Rad nicht neu erfinden Human Interface Guidelines (HIG) Nutzen Sie Featured Apps als Muster Es gibt auch Seiten die erfolgreiche Muster sammeln http://mobile-patterns.com/ http://pttrns.com/ Vorteil wenn Sie den HIG und Mustern folgen: Ihre Anwendung wird intuitiv bedienbar Eine gute App braucht keine Anleitung Seite 28 / 53
Anleitung unnötig Seite 29 / 53
Daumenregeln Seite 30 / 53
Verdecktes sichtbar machen Seite 31 / 53
Die magische 44 Seite 32 / 53
Thematisch zur App passende Bedienelemente Seite 33 / 53
Design-relevant und oft vergessen Platz reservieren für rechtliche Aspekte & Pflichten Seite 34 / 53
Tablets: Mehr als ein großes Smartphone! ipad Google Nexus Tabs, Samsung Galaxy Tab, Amazon Kindle, Microsoft Surface etc. Beim Design gelten völlig andere Regeln! Geänderte Daumenregeln Ort der Nutzung Nicht als Netbook oder Laptop ohne Tastatur sehen App Klassen: Hochskalierte Apps (automatisch) HD Apps (nur Tablet) Universal Apps (parallel Smartphone und Tablet) Seite 35 / 53
Vergleich Phone & Tablet Design Seite 36 / 53
Agenda Einführung und Grundbegriffe Die eigene App (Idee) App Design (Konzeption Teil 1) Mock-Up Phase (Konzeption Teil 2) Aufgabenverteilung zwischen App & Backend (Architektur) Zusammenfassung Seite 37 / 53
Mock-Up: Was ist das? Werkzeug zur Präsentation und Diskussion vor Entwicklung Modell der Benutzeroberfläche, zeigt Layout & Design Abbildung des Workflows Form kann frei gewählt werden: Skizze auf Papier Excel Spezielles Mock-Up Werkzeug Seite 38 / 53
Mock-Up Beispiel Seite 39 / 53
ios Apps Seite 40 / 53
Android Apps Seite 41 / 53
und die eigene App? Seite 42 / 53
Warum Zeit für Mock-Up investieren? Fokus bei mobiler App klar auf Benutzeroberfläche (GUI) Auf kleiner Fläche komplexe Workflows abbilden Mock-Up illustriert Benutzeroberfläche schon vor der Entwicklung Unklarheiten, Fehler, Schwächen werden frühzeitig erkannt Je später im Entwicklungsprozess eine Unschärfe gefunden wird, desto teurer ist deren Behebung In Folge: Zeitersparnis bei Implementierung der GUI Seite 43 / 53
Beispiel DHL Active Tracing: Erste Mock-Ups Seite 44 / 53
Wie viel investieren? Denken Sie in Versionen Starten Sie mit eher wenig Funktionen, setzen Sie diese aber perfekt um Bei Erfolg der Version 1.0: Halten Sie die Anwendung frisch Immer wieder neue Features nachschießen Seite 45 / 53
Agenda Einführung und Grundbegriffe Die eigene App (Idee) App Design (Konzeption Teil 1) Mock-Up Phase (Konzeption Teil 2) Aufgabenverteilung zwischen App & Backend (Architektur) Zusammenfassung Seite 46 / 53
Zusammenspiel Frontend <-> Backend Seite 47 / 53
Backend Eigenes Backend nicht immer notwendig (Standalone Native App oder Third Party Backend) Implementierung kann großen Teil des Gesamtaufwands ausmachen (bei komplexer Geschäftslogik) Technologien sind in der Regel geräteunabhängig REST Schnittstellen, JSON Formate Kommunikation via XML über WebServices (SOAP) Bedient gleichzeitig alle Endgeräte / Betriebssysteme Seite 48 / 53
Backend-Einsatz Vorteile Änderung Geschäftslogik oft ohne Änderungen der App möglich Schneller auf Fehler in der Geschäftslogik reagieren Unterschiedliche Apps / App-Typen können das Backend nutzen Wichtig Hosting Skills notwendig In der Regel 24 / 7 Betrieb notwendig Skalierungsspezialisten (bei hoher Last / erfolgreicher App) App kann ggf. nur online benutzt werden Seite 49 / 53
Agenda Einführung und Grundbegriffe Die eigene App (Idee) App Design (Konzeption Teil 1) Mock-Up Phase (Konzeption Teil 2) Aufgabenverteilung zwischen App & Backend (Architektur) Zusammenfassung Seite 50 / 53
Zusammenfassung Strategie finden Idee erarbeiten die Mehrwert bringt Geräte / Betriebssysteme App Store Analyse Konkurrenz Analyse (Stärken, Schwächen) App definieren & passendes Design finden Human Interface Guidelines und Design-Muster nutzen Mock-Up erstellen, Architektur planen Version 1.0 festlegen (evtl. auch weitere Ausbaustufen) Weitere Schritte: in den Folgevorträgen Seite 51 / 53
Fragen?
www.iks-gmbh.com