Multiscreen Experience(Projektvorstellung von Wolfram Nagel, IA Konferenz Essen, 12. Mai 2012)Der Vortrag und das Projekt ...
Wolfram NagelHead of Design / digiparden GmbHKonzeption, Strategie und BeratungCo-Initiator Design Methoden Finderwww.desi...
digiparden GmbHSoftwareentwicklung, Content Management,Beratung, Philosophy of Data, Content Strategy,Next Generation Info...
Medien- und plattformübergreifendesInformationsmanagementfür die Digitale GesellschaftProjektvorstellung                  ...
Status quo
Laptop                                                                            Smartphone     Tablet                   ...
Herausforderungen>	 Fragmentierter Tagesablauf>	Nutzungsverhalten>	Multiscreener*>	 Multiscreen Services* User, die ständi...
Einflussfaktoren1)	 Device / Screen2)	Benutzer3)	NutzungskontextDrei relevante Faktoren für eine medien- und plattformüber...
MultiscreenExperienceVIER SCREENS               NUTZER (TYPEN)             NUTZUNGSKONTEXT           KONZEPTION           ...
Multiscreen>	 Eine Multiscreen Anwendung ist mit verschiedenen   Endgeräten nutzbar und somit Cross Device-fähig.>	 In ein...
Vier Screens
Geräteklassen>	Nutzungskontext>	Interaktion>	Haupt-Eingabemethode*>	 Durchschnittliche Displaygröße>	 Typische Entfernung*...
Entfernung User < – Screen                –>  10 – 30 cm     30 – 50 cm               1m                    3m
Screens kombinierenEs gibt verschiedene Möglichkeiten mehrere Endgeräte bzw. Screens miteinander zu kombinieren.*Die Muste...
NUTZER (TYPEN)
People use any platform                  to do anything.                           Giles Colborne                         ...
NUTZER VERSTEHEN>	   Tagesabläufe und Device Touchpoints>	   Umfelder, Motive und Bedürfnisse>	   Relevante Personas ident...
PersonasDie potentiellen Anwender der Digitalen Gesellschaft (archetypische Personas)
Die Digitale GesellschaftVerteilung der Bevölkerung 2011(Prozentualer Anteil)                                             ...
Personas derDigitalen Gesellschaft>	 Digitale Außenseiter>	Gelegenheitsnutzer>	Berufsnutzer>	Trendnutzer>	 Digitaler Profi...
Trendnutzer                                           »Neue Geräte besitze ich meistens                                   ...
Chris Kulig, Trendnutzer | Wohnung und privates Umfeld
Nutzungs-kontext
Nutzungskontext                                               s                                          du               ...
Lean Back ModusDer Anwender ist vorwiegend entspannt und passiv (temporäre Interaktion / lässt sich berieseln).
Öffentlicher RaumÖffentlicher Raum ist grundsätzlich für jedermann zugänglich und nicht privat.
Sonderfall !!!
MobilerNutzungs-kontext
http://www.flickr.com/photos/lexnger/4596784697/ (Foto von Alexa Clark)
http://www.flickr.com/photos/tomschenkenberg/4393981503/ (Foto von Tom Schenkenberg)
http://www.flickr.com/photos/velovotee/5493428527/ (Foto von » velovotee«)
Quelle: engadget (http://www.engadget.com/2010/09/29/exclusive-vws-terminal-mode-prototype-has-a-nokia-n97-at-the-h/)
Quelle: Handy-Tests (http://www.handy-tests.net/27188-mercedes-benz-neue-a-klasse-mit-siri-unterstuetzung)
Verhaltensmuster>	Micro-tasking>	 Wiederholend / Statusupdate>	 Langeweile / Ablenkung / Freizeit>	 Lokal / ortsbezogen>	D...
Mobiler Nutzungskontext>	 Mobile Situation ≠ mobiler Nutzungskontext>	 Unvorhersehbar / kann überall auftreten>	 Sonder-So...
Don‘t cut content or                      features just because                      people happen to be on               ...
Einflussfaktoren>	Screen>	Benutzer>	NutzungskontextDrei Faktoren als Basis für Multiscreen Konzepte und Strategien
KonzeptIONund strategie
Mobile vs DesktopVerkaufszahlen Smartphones vs. PCs(Statistik und Prognose)                                               ...
Mobile FirstFür das wichtigste Gerät zuerst entwickeln. Kleinster Screen zwingt zur Strukturierung der Informationen.(Luke...
Thinking »one eyeball,one thumb« forces you tosimplify mobile designs.  Luke Wroblewski  Autor von Mobile First
SimultanNutzung                                                       sehr häufig                               k.A.      ...
Parallele, ergänzende Zusatzinformationen am zweiten Screen.(http://www.designbynotion.com/metamirror-next-generation-tv)
Social TVUser können während dem Fernsehen miteinander kommunizieren und sich über eine Sendung unterhalten(z.B. Couchfunk...
Device Shifting					   Device Shifting: Beispiel »Apple AirPlay«					   (Bildmaterial: Copyright © 2012 Apple Inc.)
Device Shifting>	 Beliebige Geräte nutzen>	 Informationen auf bevorzugtem   Device darstellen>	 Passend zum Kontext>	 Flex...
SynchronisationDropbox synchronisiert geräteübergreifend Dateien zwischen verschiedenen Rechnern und Benutzern.Über eine S...
Synchronisation>	 geräteübergreifende Daten>	Interoperabilität>	 Unabhängigkeit von Gerät,   Zeitpunkt und Ort>	 Abgleich ...
Coherence / FluidityDer Video on Demand Service Netflix sieht geräteübergreifend ähnlich aus und funktioniert auch ähnlich...
Coherence / Fluidity>	 Interface, Funktion, Interaktion   sollten kohärent sein>	 Responsive Design>	 Individuelle Gerätee...
Smart ContentOpen API von npr: »Create Once, Publish Everywhere« (http://bit.ly/nprCOPE)
Smart Content>	 Strukturierte Informationen>	 Granulare Daten>	 Content like water>	 Zentrale Contentpflege>	 Backend / CM...
Metadata is the new art direction.   Ethan Resnick, @studip101
MashabilityQwiki und Storify nutzen Schnittstellen anderer Services um verschiedene Inhalte (Text, Bild, Video) zu einemne...
Samsung Smart TV: Apps (tagesschau.de, YouTube, Facebook), Social TV und Web Browser(http://samsung.de/de/microsites/smart...
Mashability>	Mashups>	 Schnittstellen intelligent nutzen>	Aggregation>	 Flexible Inhalte>	 Kombinieren und synchronisieren...
CommunificationBeispiel Nike+ mit iPhone App, Social Network-Integration, eigener Community und Gamification-Elementen.
Communification>	 Digitale Community als Win-Win>	Kommunikationskanal>	 Social Involvement>	 User Generated Content>	 »lik...
EmotionalityInstagram iPhone App für Social Foto Sharing: »Ein schneller, schöner und lustiger Weg, Deine Freunde durchBil...
Emotionality>	Psychologie>	 Bedürfnisse und Motive>	 Informationen emotionalisieren>	 Mehrwert bieten>	 Alle Touchpoints r...
Technische Herausforderungen>	 Desktop vs Mobile / Web vs Native>	 Exakte Erkennung der Geräteklasse>	 Media Queries* für ...
Zusammenfassung>	   Multiscreen ist kein »netter Zusatz« mehr>	   Screens und Kombinationsmöglichkeiten>	   Unterschiedlic...
MultiscreenExperienceMehr Infos unter:www.multiscreen-experience.com
Ausblick>	 Publikation (in Arbeit)>	 Website / Plattform (in Planung)>	 Artikel in aktueller WEAVE (03.2012)>	 Noch mehr E...
A part of Multi-devicestrategy is simplyembracing the uncertainty.  Josh Clark  https://twitter.com/#!/globalmoxie/status/...
Vielen Dank!
InformationenMultiscreen ExperienceProjekt von Wolfram Nagel und Valentin FischerWeb: www.multiscreen-experience.comWolfra...
Nächste SlideShare
Wird geladen in …5
×

Multiscreen Experience (Mai 2012, IA Konferenz, Essen)

4.973 Aufrufe

Veröffentlicht am

Vortrag von Wolfram Nagel (digiparden GmbH) und Vorstellung des Projekts "Multiscreen Experience" auf der IA Konferenz 2012 in Essen (www.iakonferenz.org).

Die Gerätelandschaft wird immer dynamischer, fragmentierter und vernetzter. Zukünftig müssen Informationen und Services auf möglichst allen (relevanten) Screens und Ausgabekanälen verfügbar sein und geräteübergreifend funktionieren. In dem Vortrag stelle ich Prinzipien, Muster und Empfehlungen vor, die man bei der Konzeption von Multiscreen Projekten und der Entwicklung einer passenden Content Strategy berücksichtigen sollte.

Veröffentlicht in: Design
0 Kommentare
10 Gefällt mir
Statistik
Notizen
  • Als Erste(r) kommentieren

Keine Downloads
Aufrufe
Aufrufe insgesamt
4.973
Auf SlideShare
0
Aus Einbettungen
0
Anzahl an Einbettungen
218
Aktionen
Geteilt
0
Downloads
0
Kommentare
0
Gefällt mir
10
Einbettungen 0
Keine Einbettungen

Keine Notizen für die Folie

Multiscreen Experience (Mai 2012, IA Konferenz, Essen)

  1. 1. Multiscreen Experience(Projektvorstellung von Wolfram Nagel, IA Konferenz Essen, 12. Mai 2012)Der Vortrag und das Projekt werden freundlicherweise unterstützt von der digiparden GmbH.
  2. 2. Wolfram NagelHead of Design / digiparden GmbHKonzeption, Strategie und BeratungCo-Initiator Design Methoden Finderwww.designmethodenfinder.deE-Mail: wn@digiparden.deWeb: http://about.wolframnagel.comTwitter: @wolframnagel
  3. 3. digiparden GmbHSoftwareentwicklung, Content Management,Beratung, Philosophy of Data, Content Strategy,Next Generation Information ExperienceWeb: www.digiparden.deTwitter: @digiparden
  4. 4. Medien- und plattformübergreifendesInformationsmanagementfür die Digitale GesellschaftProjektvorstellung Twitte @ w o lf r:IA Konferenz Essen, 12. Mai 2012 ra m n a #Mult ge lReferent: Wolfram Nagel, digiparden GmbH i s c re e n #iak12
  5. 5. Status quo
  6. 6. Laptop Smartphone Tablet TVDigitale Gesellschaft (2012): Zunehmende Gerätefragmentierung und Parallelnutzung. Informationen mussman zukünftig für verschiedene Screens anbieten. Vier Geräteklassen stehen im Fokus.
  7. 7. Herausforderungen> Fragmentierter Tagesablauf> Nutzungsverhalten> Multiscreener*> Multiscreen Services* User, die ständig mit irgendeinem Gerät online sind und zwischen mehreren Bildschirmen wechseln.Nach einer Microsoft-Studie lebten bereits 2010 (!) rund 20 Mio. Multiscreener in Europa (bit.ly/mams2010).
  8. 8. Einflussfaktoren1) Device / Screen2) Benutzer3) NutzungskontextDrei relevante Faktoren für eine medien- und plattformübergreifende Content Strategy
  9. 9. MultiscreenExperienceVIER SCREENS NUTZER (TYPEN) NUTZUNGSKONTEXT KONZEPTION UND STRATEGIEMuster, Empfehlungen und Methoden, die man bei der Konzeption von (Multiscreen) Projektenberücksichtigen sollte. Das Toolkit besteht aus vier Themenblöcken.
  10. 10. Multiscreen> Eine Multiscreen Anwendung ist mit verschiedenen Endgeräten nutzbar und somit Cross Device-fähig.> In einem Multiscreen Szenario werden mehrere Endgeräte oder Bildschirme (und damit auch Informationsangebote) gleichzeitig genutzt.
  11. 11. Vier Screens
  12. 12. Geräteklassen> Nutzungskontext> Interaktion> Haupt-Eingabemethode*> Durchschnittliche Displaygröße> Typische Entfernung* z. B.: Fernbedienung, Gesten, Maus, Tastatur, (Multi-)Touch, Sensoren, Ziffernblock, Minitastatur
  13. 13. Entfernung User < – Screen –> 10 – 30 cm 30 – 50 cm 1m 3m
  14. 14. Screens kombinierenEs gibt verschiedene Möglichkeiten mehrere Endgeräte bzw. Screens miteinander zu kombinieren.*Die Muster basieren auf den Multiscreen Patterns von Precious Design Studio aus Hamburg.
  15. 15. NUTZER (TYPEN)
  16. 16. People use any platform to do anything. Giles Colborne http://www.cxpartners.co.uk/cxblog/mobile-app-or-mobile-web/http://www.cxpartners.co.uk/cxblog/mobile-app-or-mobile-web/
  17. 17. NUTZER VERSTEHEN> Tagesabläufe und Device Touchpoints> Umfelder, Motive und Bedürfnisse> Relevante Personas identifizieren> Device Priorität abschätzen> Für relevante/wichtigste Geräte gestalten
  18. 18. PersonasDie potentiellen Anwender der Digitalen Gesellschaft (archetypische Personas)
  19. 19. Die Digitale GesellschaftVerteilung der Bevölkerung 2011(Prozentualer Anteil) 5 21 12 28 7 26Die Persona-Archetypen basieren auf den Nutzertypen aus der Studie »D21 – Die Digitale Gesellschaft«.(Quelle: http://www.initiatived21.de/publikationen)
  20. 20. Personas derDigitalen Gesellschaft> Digitale Außenseiter> Gelegenheitsnutzer> Berufsnutzer> Trendnutzer> Digitaler Profi> Digitale AvantgardeFokus auf Medienaffinität, Gerätenutzung, Nutzungskontext und Nutzerbedürfnissen
  21. 21. Trendnutzer »Neue Geräte besitze ich meistens als Erster. Ich weiß auch schon was mein nächstes Smartphone wird. Ein Leben ohne Facebook ist unvorstellbar – alle meine Freunde sind dort.«Chris Kulig | 35 Jahre, ledig | Eventmanager, Mittlere Reife und Ausbildung
  22. 22. Chris Kulig, Trendnutzer | Wohnung und privates Umfeld
  23. 23. Nutzungs-kontext
  24. 24. Nutzungskontext s du Si o sm tu ati ng o Nutzu n UmfeldDer Nutzungskontext wird neben dem Anwender und dem verwendeten Endgerät durch die ParameterNutzungsmodus, Situation und Umfeld beeinflusst.
  25. 25. Lean Back ModusDer Anwender ist vorwiegend entspannt und passiv (temporäre Interaktion / lässt sich berieseln).
  26. 26. Öffentlicher RaumÖffentlicher Raum ist grundsätzlich für jedermann zugänglich und nicht privat.
  27. 27. Sonderfall !!!
  28. 28. MobilerNutzungs-kontext
  29. 29. http://www.flickr.com/photos/lexnger/4596784697/ (Foto von Alexa Clark)
  30. 30. http://www.flickr.com/photos/tomschenkenberg/4393981503/ (Foto von Tom Schenkenberg)
  31. 31. http://www.flickr.com/photos/velovotee/5493428527/ (Foto von » velovotee«)
  32. 32. Quelle: engadget (http://www.engadget.com/2010/09/29/exclusive-vws-terminal-mode-prototype-has-a-nokia-n97-at-the-h/)
  33. 33. Quelle: Handy-Tests (http://www.handy-tests.net/27188-mercedes-benz-neue-a-klasse-mit-siri-unterstuetzung)
  34. 34. Verhaltensmuster> Micro-tasking> Wiederholend / Statusupdate> Langeweile / Ablenkung / Freizeit> Lokal / ortsbezogen> DringendTypische Interaktions- und Verhaltensmuster im mobilen NutzungskontextQuellen: Josh Clark (oreil.ly/clarktapworthy) und Google Mobile UX Strategy (bit.ly/googlemobileux)
  35. 35. Mobiler Nutzungskontext> Mobile Situation ≠ mobiler Nutzungskontext> Unvorhersehbar / kann überall auftreten> Sonder-Sonderfall »Automotive«> Unterschiedliche Bedürfnisse> Voller Funktionsumfang
  36. 36. Don‘t cut content or features just because people happen to be on a small screen. Cennydd Bowles https://twitter.com/#!/globalmoxie/status/192268677305999361http://www.cxpartners.co.uk/cxblog/mobile-app-or-mobile-web/
  37. 37. Einflussfaktoren> Screen> Benutzer> NutzungskontextDrei Faktoren als Basis für Multiscreen Konzepte und Strategien
  38. 38. KonzeptIONund strategie
  39. 39. Mobile vs DesktopVerkaufszahlen Smartphones vs. PCs(Statistik und Prognose) Smartphones PCs 2005 2006 2007 2008 2009 2010E 2011E 2012E 2013ESmartphone Verkaufszahlen überholen PCs. Gleiches gilt für die Internetnutzung.Zunehmende Bedeutung mobiler Endgeräte. via http://bkaprt.com/mf/4
  40. 40. Mobile FirstFür das wichtigste Gerät zuerst entwickeln. Kleinster Screen zwingt zur Strukturierung der Informationen.(Luke Wroblewski: Mobile First, A Book Apart – http://bkaprt.com/mf)
  41. 41. Thinking »one eyeball,one thumb« forces you tosimplify mobile designs. Luke Wroblewski Autor von Mobile First
  42. 42. SimultanNutzung sehr häufig k.A. oft gelegentlich nie seltenStudie (Dezember 2011): Jeder zweite Fernsehzuschauer surft parallel zum Fernsehen im Internet.(http://bit.ly/tvonlineparallel2011)
  43. 43. Parallele, ergänzende Zusatzinformationen am zweiten Screen.(http://www.designbynotion.com/metamirror-next-generation-tv)
  44. 44. Social TVUser können während dem Fernsehen miteinander kommunizieren und sich über eine Sendung unterhalten(z.B. Couchfunk, TunedIn). In Social TV-Konzepten wird eine Familiensituation emuliert.
  45. 45. Device Shifting Device Shifting: Beispiel »Apple AirPlay« (Bildmaterial: Copyright © 2012 Apple Inc.)
  46. 46. Device Shifting> Beliebige Geräte nutzen> Informationen auf bevorzugtem Device darstellen> Passend zum Kontext> Flexible Informationsaufnahme (Watch / Read Later)Die Anzeige von Inhalten oder Informationen wird von einem auf ein anderes Gerät verschoben. Die Darstellungwird zwischen den beteiligten Screens umgeschaltet.
  47. 47. SynchronisationDropbox synchronisiert geräteübergreifend Dateien zwischen verschiedenen Rechnern und Benutzern.Über eine Schnittstelle können auch andere Applikationen den Service nutzen (z.B. iAWriter und Plaintext).
  48. 48. Synchronisation> geräteübergreifende Daten> Interoperabilität> Unabhängigkeit von Gerät, Zeitpunkt und Ort> Abgleich von Daten(status)> Cloud Computing / Data Sharing> Datenschutz> Connectivity (Funklöcher, etc.)Informationen und Daten geräteübergreifend synchron und auf dem gleichen Stand halten
  49. 49. Coherence / FluidityDer Video on Demand Service Netflix sieht geräteübergreifend ähnlich aus und funktioniert auch ähnlich.Nutzt Erkenntnisse aus TV-Interface (Content = Interface).
  50. 50. Coherence / Fluidity> Interface, Funktion, Interaktion sollten kohärent sein> Responsive Design> Individuelle Geräteeigenschaften> Native Experience> Plattform- und markenkonform> Content Availability> Content FirstEin Informationsangebot sollte auf jedem Screen ähnlich aussehen und funktioneren (Fluid Experience).Layouts und (!) Inhalte müssen sich dynamisch und flexibel anpassen (Responsive Design).
  51. 51. Smart ContentOpen API von npr: »Create Once, Publish Everywhere« (http://bit.ly/nprCOPE)
  52. 52. Smart Content> Strukturierte Informationen> Granulare Daten> Content like water> Zentrale Contentpflege> Backend / CMS Workflows> Content Availability> Open Content, API, Metadata> Neue GeschäftsmodelleJe granularer die Inhalte sind, desto flexibler lassen sie sich geräteübergreifend einsetzen und publizieren.
  53. 53. Metadata is the new art direction. Ethan Resnick, @studip101
  54. 54. MashabilityQwiki und Storify nutzen Schnittstellen anderer Services um verschiedene Inhalte (Text, Bild, Video) zu einemneuen Informationspaket zu aggregieren.
  55. 55. Samsung Smart TV: Apps (tagesschau.de, YouTube, Facebook), Social TV und Web Browser(http://samsung.de/de/microsites/smarttv)
  56. 56. Mashability> Mashups> Schnittstellen intelligent nutzen> Aggregation> Flexible Inhalte> Kombinieren und synchronisierenPlattformunabhängige und flexible Inhalte, Daten und Informationen lassen sich durch Nutzungentsprechender Schnittstellen zu neuen mehrwertigen Services kombinieren.
  57. 57. CommunificationBeispiel Nike+ mit iPhone App, Social Network-Integration, eigener Community und Gamification-Elementen.
  58. 58. Communification> Digitale Community als Win-Win> Kommunikationskanal> Social Involvement> User Generated Content> »liken«, empfehlen, verkaufen> Geo-Location und -Checkin> GamificationSoziale Vernetzung oder eine Community können ein Informationsangebot für dessen Nutzer attraktiver machen.Anwender können Inhalte erstellen, teilen, bewerten und kommentieren.
  59. 59. EmotionalityInstagram iPhone App für Social Foto Sharing: »Ein schneller, schöner und lustiger Weg, Deine Freunde durchBilder an Deinem Leben teilhaben zu lassen.« (http://instagram.com)
  60. 60. Emotionality> Psychologie> Bedürfnisse und Motive> Informationen emotionalisieren> Mehrwert bieten> Alle Touchpoints relevant> Spielelemente> Soziale KomponentenServices sind emotional ansprechender, wenn sie Spaß machen, einen gerätefragmentierten Tagesablaufunterstützen und eine fließende Multiscreen Experience bieten.
  61. 61. Technische Herausforderungen> Desktop vs Mobile / Web vs Native> Exakte Erkennung der Geräteklasse> Media Queries* für optimale Layout-Anpassung> Interaktion (Hover, Click, Swipe, etc.)> Unterstützung aktueller Webtechnologien> Plattform-Eigenheiten> Effiziente und breitgefächerte Testumgebung*Responsive Layout Beispiele unter: http://mediaqueri.es
  62. 62. Zusammenfassung> Multiscreen ist kein »netter Zusatz« mehr> Screens und Kombinationsmöglichkeiten> Unterschiedliche Nutzungskontexte> Flexible und dynamische Layouts und (!) Inhalte> Multiscreen-fähige Daten> Datensicherheit und -verbindungen> Passende Content Management Workflows> Fluid Experience> Muster oder Toolkit als Hilfestellung
  63. 63. MultiscreenExperienceMehr Infos unter:www.multiscreen-experience.com
  64. 64. Ausblick> Publikation (in Arbeit)> Website / Plattform (in Planung)> Artikel in aktueller WEAVE (03.2012)> Noch mehr Endgeräte und Screens> Internet der Dinge
  65. 65. A part of Multi-devicestrategy is simplyembracing the uncertainty. Josh Clark https://twitter.com/#!/globalmoxie/status/192276891913297920
  66. 66. Vielen Dank!
  67. 67. InformationenMultiscreen ExperienceProjekt von Wolfram Nagel und Valentin FischerWeb: www.multiscreen-experience.comWolfram NagelMail: wn@digiparden.deWeb: http://about.wolframnagel.comTwitter: @wolframnageldigiparden GmbHWeb: www.digiparden.deTwitter: @digiparden

×