mobile und trends

Download Mobile und Trends

Post on 14-Apr-2017

1.426 views

Category:

Business

0 download

Embed Size (px)

TRANSCRIPT

Fachtagung. Mobile. CMS. Ausgabekanle. Trends. Responsive Design. Namics.

1Fachtagung. Mobile. CMS. Ausgabekanle.Trends. Responsive Design. Namics.Johannes Waibel. Senior Consultant.

Namics.

Optimale Auslieferung der CMS-Inhalte fr mobile Endgerte.

http://www.flickr.com/photos/rkottonau/571288490/

Namics.> Sie haben bei sich im Unternehmen ein Corporate CMS im Einsatz. > Die Frage die sich nun stell: Wie gehen sie mit mobile Endgerten um?> Mobile ist sehr vereinfacht gesagt Tablets & Smartphones.2

Agenda.Digitale Welt gestern & heuteMultiple AusgabekanleImplementierungsvariantenResponsive LayoutEigene mobile Website(s)Mobile Applikation(en)Content Erfassung & DarstellungZusammenfassungFragen

03.03.2011Content. Mobile. Devices. Auslieferung.3

Namics.Damit Sie am Schluss wissen Weg Sie gehen sollten, habe ich folgende Agenda zusammengestellt.3

Die digitale Welt gestern & heute.

03.03.20114Content. Mobile. Devices. Auslieferung.

Namics.Ich starte mit der digitalen Welt von gestern. Dies so inetwa so aus:4

Gestern.Die digitale Welt gestern & heute.03.03.2011Content. Mobile. Devices. Auslieferung.5WebbrowserTastaturNotebook

Namics.> Die Welt von gestern sah in etwa so aus: D.h.> 1 Dimensional 1 Computer oder Notebook mit Webbroser; Eingabe ber Tastatur & Maus> Internet = Webbrowser5

Heute.Die digitale Welt gestern & heute.03.03.2011Content. Mobile. Devices. Auslieferung.6NotebookTablet ScreenMobile ScreenLarge ScreenSpielkonsoleTelefonChat

Namics.Die Welt von Heute ist umfassender geworden:

Einen PC gibt es immer noch, aber die Umwelt hat sich stark verndert!

6

Fazit.Das Internet ist nur das Medium und berall verfgbarVerschiedenste Endgerte konsumieren Inhalte und Informationen ber dieses MediumDesktop ComputerNotebooksMobile DevicesTabletsTVObjekte (Internet of things)Heute: Fokus auf Mobile Devices & TabletsDie digitale Welt gestern & heute.03.03.2011Content. Mobile. Devices. Auslieferung.7

Namics.Gartner Web Zugriffe 2013. Die digitale Welt gestern & heute.03.03.2011Content. Mobile. Devices. Auslieferung.8

Web ZugriffeZeit

2013

By 2013, mobile phones willovertake PCs as the most commonon Web access device worldwide.

Quelle: http://www.gartner.com/it/page.jsp?id=1278413 (Januar 2010)

Desktop WebMobile Web

Namics.> Wenn wir uns auf den Teil Mobile Endgerte mit Internet Connection fokussioren schafft die Studie von Gartner eine Interessante Aussage:

> Immer mehr Zugriffe erfolgen global ber das mobile Web / Im Gegensatz zu Desktop Zugirff> Im Jahre 2014 werden die Mobilen Zugriffe die normalen Zugriffe bersteigen. > In gewissen Populationen oder Anwendungen ist die Schnittpunkt heute schon erreicht/berschritten. 8

Bild: http://www.flickr.com/photos/snapeverything/4941793006/

Websites not optimized for the smaller-screen formats will become a market barrier for their owners much content and many sites will need to be reformatted/rebuilt.

Quelle: http://www.gartner.com/it/page.jsp?id=1278413

und wie sieht es mit Ihrer Corporate Website aus?

Corporate Website = Mobile Site?

Namics.> Key Fazit: Websites die nicht auf die Eigenschaften des mobile Kanals eingehen stellen einen Hrde dar.

> Damit sie entscheiden knnen welchen Weg sie bzgl. Mobile gehen knnen, stelle ich im folgenden 3 Varienten vor, wie sie dem Kanal mobileentgegnen knnen.

> Ich starte mit einer Sicht auf die Benutzer und gehe dann auf die 3 Lsungsvarianten ein.9

Multiple Ausgabekanle.

03.03.201110Content. Mobile. Devices. Auslieferung.

Namics.Der Weg in die Konzeption der Lsung startet mit der Anwendersicht.

Je nach Ausgabekanal gibt es einen ganz eigenen Kontext.

Die Maxime Kontext ist King gilt insbesonerds in den mobilen Ausgabekanlen.10

Ausgabevarianten Anwendersicht.Multiple Ausgabekanle.03.03.2011Content. Mobile. Devices. Auslieferung.11

Webbrowser

DesktopSmartphones

Zuhause / Business (B2B)

BeratungReprsentierung / PrsentationMedien Konsum

Zugriffsdauer: variabel

berall (always on, always carried)

Dringende AufgabenWiederholte AufgabenRealtime Kommunikation

Zugriffsdauer: kurzIm Bro / Zuhause

Komplexe AufgabenResearch Aufgaben

Zugriffsdauer: langMobileTablets

Namics.Der Weg in die Konzeption der Lsung startet mit der Anwendersicht.

Je nach Ausgabekanal gibt es einen ganz eigenen Kontext.

Die Maxime Kontext ist King gilt insbesonerds in den mobilen Ausgabekanlen.

11

Ausgabevarianten - Technische Sicht.Multiple Ausgabekanle.03.03.2011Content. Mobile. Devices. Auslieferung.12

Content Management System

WebbrowserIE, FF, Chrome,...

Eigene Mobile Website(s)

(Browser)

Applikationen

(Nativ)

Responsive Layout

(Browser)Desktop

Mobile

Namics.> Sie alle haben ein Corporate CMS im Einsatz. > Wie gehen sie mit der Mobile Thematik um? > Das CMS bildet die Datenquelle fr ihre Mobilen Ausgabekanle.

12

Beispiele fr Implementierungsvarianten.

03.03.201113Content. Mobile. Devices. Auslieferung.

Namics.

Responsive Layout (Liquid Layout).Umsetzungsvarianten im Mobile Web.03.03.2011Content. Mobile. Devices. Auslieferung.14 http://2010.dconstruct.org/

Namics.

14

Responsive Layout (Liquid Layout).Umsetzungsvarianten im Mobile Web.03.03.2011Content. Mobile. Devices. Auslieferung.15

http://2010.dconstruct.org/

Namics.

15

Responsive Layout - Key Facts.Es gibt nur 1 Website fr alle Devicetypen & Gruppen(One Web)Es gibt keine eigene mobile URLResponsive Content bedeutetUmordnung von ModulenReduktion von ContentDynamische Berechnung von GrssenverhltnissenResponsive Content wird gesteuert ber ScreengrssePrimr clientseitig mit Frontendtechnik (CSS, Java Script)Meist nur Online Nutzung, inkl. HTML503.03.2011Content. Mobile. Devices. Auslieferung.16Umsetzungsvarianten im Mobile Web.

Namics.Eigene mobile Website(s).

03.03.201117Content. Mobile. Devices. Auslieferung.

Namics.

Raiffeisen Mobile Website.

Namics.Eigene Mobile Website(s) - Key Facts.Eigene Mobile Website(s) zustzlich zur Corporate WebsiteMobile URL (m.company.com)Kombination mit User Agent ErkennungAnpassung Content und Applikationslogik erfolgt primr serverseitigMeist nur Online Nutzung, inkl. HTML5Umsetzungsvarianten im Mobile Web.

03.03.2011Content. Mobile. Devices. Auslieferung.19

Namics.HTML: schaftt neue Mglichkeiten. Voraussetzung sind morderne Browser auf Mobiletelefonen> Offline Cache fr static content> Offline Storage> Geo Location API> Touch API19

Native Applikationen.

03.03.201120Content. Mobile. Devices. Auslieferung.

Namics.

Raiffeisen Hypothekenrechner.

Namics.Im Kern 1 spezischer Use Case mit hoher Interaktivt

21

Namics.> Spielerischer Ansatz mit Schiebreglern> Einfaches erkennen der Zusammenhngen fr die Hypothekarberechnung (Eigenkapital, Einkommen und Kaufpreis). Was ist meine Tragbarkeit?22

Namics.> Auswertung Berechnungsergebnisse (1te und 2te Hypothek)> Vorschlag mglicher Immobliien> Conversion

23

Native Applikationen - Key Facts.Native Applikationen stehen oft nur teilweise mit dem CMS in einer Beziehung und haben starken ApplikationscharakterVerwenden keinen Browser sondern laufen nativBezug und Vertrieb erfolgt ber Applicationstores (kosystem)Die Entwicklung erfolgt pro Plattform (iOS, Android,...) mit geringen SynergienEinbezug von Hardware Features (Kamera, GPS, Dokumente,..) mglichFlexible Kombination aus Offline & OnlineUmsetzungsvarianten im Mobile Web.

03.03.2011Content. Mobile. Devices. Auslieferung.24

Namics.- Apps auf Basis von Website-Technologien: z.B. PhoneGap, Titanium resp. NIWEA-Idee

24

Wann welche Mobile Variante whlen?

03.03.201125Content. Mobile. Devices. Auslieferung.

Namics.

Wann welche Mobile Variante whlen?Umsetzungsvarianten im Mobile Web.

03.03.2011Content. Mobile. Devices. Auslieferung.26Responsive LayoutEigene Mobile Website(s)Applikationen1 WebsiteEigene Website(s) fr definierte DevicegruppenAusreizen von plattformspezifischen FunktionenAnsatzGleicher Content bei unterschiedlicher DarstellungMobiler Content mit eigener Darstellung

Mobiler Content mit hoher InteraktivittContent und InteraktionNormale WebsiteNormale Website, reduzierter Umfang

Eigenes kosystem: Sichtbarkeit, Ratings, Bezahlsystemkosystemgering

gering + geringhochKosten fr Entwicklung

Namics.

26

Content Erfassung & Darstellung.

03.03.201127Content. Mobile. Devices. Auslieferung.

Namics.

Wie sieht der Mobile Content auf den verschiedenen Mobile Devices aus?

Namics.Herausforderung!28

Heute.03.03.2011Content. Mobile. Devices. Auslieferung.29Content Erfassung & Darstellung.

Namics.> Externe Mobile Emulatoren geben einen ersten Eindruck wie eine Webseite auf den Mobile Devices aussieht.> 29

Zukunft.CMS mit integrierten Mobile EmulatorenWie geht das?Content Erfassung & Darstellung.

03.03.2011Content. Mobile. Devices. Auslieferung.30

Namics.Demo.Content Erfassung & Darstellung.03.03.2011Content. Mobile. Devices. Auslieferung.31

Demo

Namics.Aus31

Zusammenfassung.

03.03.201132Content. Mobile. Devices. Auslieferung.

Namics.Zusammenfassung.Jedes Display (Desktop Browser, Notebook, Tabl