Web 2.0 und Social Web
Einführung und Begriffsklärung




Marcus Haberkorn | Intermedia Design | 2011                           Probevortrag 02.02.2011
Seminar | Einführung in interaktive & hypermediale Systeme | für 2. Semester
Übung zu den Vorbereitungsmaterialien

- Was versteht O´Reilly unter Web 2.0?
- Was verstehen die Autoren unter Social Web?
- Erläutert beides anhand der interaktiven Arbeit ‚We
  Feel Fine‚von Jonathan Harris & Sep Kamvar!




                                           Probevortrag 02.02.2011
Die aufgabenorientierte Sicht auf Web 2.0

-   Software als Service
-   Software als "immer beta"
-   Lightweight Programming
-   Fokus auf Daten
-   Endgerätevielfalt
-   Rich User Experience
-   Kollektive Intelligenz
-   Neue Geschäftsmodelle

                                Tim O´Reilly


                                               Probevortrag 02.02.2011   3
Jesse James Garrett: Web als Softwareschnittstelle

Vorangehend haben wir das Web
als Hypertextsystem behandelt
(informationsorientiert, rechte
Hälfte der Grafik).

Im ‚Web 2.0‘ tritt die Perspektive
auf das Web als Software-
Schnittstelle (aufgabenorientiert,
linke Hälfte der Grafik) hinzu.


Jesse James Garrett: The Elements of User
Experience
http://www.jjg.net/elements/translations/


                                            Probevortrag 02.02.2011
Jesse James Garrett: Web als Softwareschnittstelle

Benutzer-Bedürfnisse:
Von Außen abgeleitete Site-
Zielsetzungen, welche durch
Benutzerforschung erhoben
werden (ethno-, techno-,
psychografisch etc.)

Inhaltsziele:
Interne Zielsetzungen der Site,
wie etwa Business,
künstlerische oder andere



                                     Probevortrag 02.02.2011
Jesse James Garrett: Web als Softwareschnittstelle

Spezifizierung der Funktionen:
‚Feature-Set‘ als detaillierte
Beschreibung der Funktionalität
der Site, um die
Benutzeranforderungen zu
befriedigen




                                     Probevortrag 02.02.2011
Jesse James Garrett: Web als Softwareschnittstelle

Interaktionsdesign:
Gestaltung der
Anwendungsflüsse zur
erleichterten Wahrnehmung von
Benutzeranforderungen, sowie
Definition des Umgangs mit den
Funktionen




                                     Probevortrag 02.02.2011
Jesse James Garrett: Web als Softwareschnittstelle

Interface/Schnittstellen-
gestaltung:
Gestaltung der Schnittstellen-
Elemente zur Erleichterung der
Handhabung der Funktionen,
wie in der klassischen Human
Computer Interaction (HCI)

Informationsgestaltung:
Informationsgestaltung zur
Erleichterung
des Verständnisses


                                     Probevortrag 02.02.2011
Jesse James Garrett: Web als Softwareschnittstelle

Visuelle Gestaltung:
Grafische Bearbeitung der
Schnittstellenelemente




                                     Probevortrag 02.02.2011
Vertiefung der zwei Aspekte Endgerätevielfalt und
Software als Service in euren Vorträgen:

- RIAS und Cloud Computing (Fabian)
- Always on: Mobile Internetnutzung (Nadine)




                                           Probevortrag 02.02.2011   10
Das Web als Service-Plattform

Web 2.0:    Dienstleistungen / Services
            in Form hochinteraktiver Anwendungen
Social Web: webbasierte Anwendungen für
            Informationsaustausch,
            Beziehungsaufbau und -pflege,
            Kommunikation und Kollaboration,
            in einem gesellschaftlichen oder
            gruppenbezogenen Kontext


                                        Probevortrag 02.02.2011   11
Die informationsorientirete Sicht auf Web 2.0

Das Web 2.0 ist nichts Revolutionäres!


                                             If Web 2.0 for you is
                                            blogs and wikis, then
                                                that is people to
                                                     people.
                                            But that was what the
                                            Web was supposed to
                                                  be all along.
Tim Berners-Lee, Interview with IBM, 2006


                                                      Probevortrag 02.02.2011   12
Probevortrag 02.02.2011   13
Globale Statistiken




                                        Quelle


                      Probevortrag 02.02.2011
Viele viele animierte Infografiken

State of the Internet:
http://vimeo.com/9641036
„Did you know? Shift happens“ 1-4:
http://thefischbowl.blogspot.com/
Social Media Revolution:
http://www.youtube.com/watch?v=2_Ig0ClYlmM
Social Media in Europe & Germany:
http://www.youtube.com/watch?v=LxWahcXfwCg
u.v.m.
                                     Probevortrag 02.02.2011   15
Vergleich von Konzepten des Web 1.0 und Web 2.0

Web 1.0 ca. 1996             Web 2.0 ca. 2010
vorwiegend read-only         read-write
45 Millionen User            ca. 2 Milliarden User
Fokus auf Unternehmen        Fokus auf User
Homepages                    Blogs, Social Media-Profile
Content besitzen             Content teilen
Autoren & Leser              Prosumer
HTML, Portale                XML, CSS, CMS, APIs, AJAX
Verzeichnisse / Taxonomien   Tagging / Folksonomies
Webformulare                 Webanwendungen


                                             Probevortrag 02.02.2011
Web 1.0 und Web 2.0: Produktion/Konsumption




                                    Probevortrag 02.02.2011   17
Typische Werkzeuge & Konzepte



Feeds | Video- & Podcasts
Weblogs
Wikis
Social Networking / Communities
Social Bookmarking / Tagging / Folksonomies
Social Media Sharing
Offene Programmierschnittstellen (APIs)


                                          Probevortrag 02.02.2011   18
Probevortrag 02.02.2011   19
Wandel der Medienproduktion und -rezeption

Fokus nicht mehr auf reiner Informationsübermittlung
sondern auf dem
kooperativem Austausch von Wissen und der
kollektiven Generierung von Inhalten

 "Social Software" bezieht sich auf
Inhalt UND Aktivität UND Kontext



                                           Probevortrag 02.02.2011   20
Media is …

…the connective tissue of society.
Media is how you know when your friend's birthday party is.
Media is how you know what's happening in Tehran, who's
in charge in Tegucigalpa, or the price of tea in China.
Media is how you know why Kierkegaard disagreed with
Hegel.
Media is how you know about anything more than ten yards
away.

                                    Clay Shirky, Cognitive Surplus, 2010

                                                 Probevortrag 02.02.2011   21
Media is …

All these things used to be separated into public media
(like visual or print communications made by a small
group of professionals) and personal media (like letters
 and phone calls made by ordinary citizens).
Now those two modes have fused.




                                      Clay Shirky, Cognitive Surplus, 2010

                                                   Probevortrag 02.02.2011   22
Cartoon




          http://wulffmorgenthaler.com/strip/2011/04/07/


                            Probevortrag 02.02.2011        23
Probevortrag 02.02.2011   24
Technologie & Gesellschaft: Beispiel 1950er Jahre




                                          Probevortrag 02.02.2011   25
Clay Shirky: Stufenmodell der Social Web-Aktivität




                                      Probevortrag 02.02.2011   29
Aufgabe

Findet und beschreibt Beispiele für Shirkys Modell!




                                            Probevortrag 02.02.2011
Bild- und Quellennachweise nach Foliennummern

Insofern nicht auf den Folien vermerkt:

BILDER
13 Social Media Timeilne http://networkconference.netstudies.org/2010/04/is-it-fact-fiction-or-fantasy-check-under-the-bonnet-before-
      risking-a-wikipedia-citation/
19 Social Media Prisma http://www.ethority.de/weblog/2010/04/15/we-proudly-present-das-social-media-prisma-version-2-0/
24 Web2.0-Logos http://3oneseven.com/29/web20-logos/
24 Menschen im Netz http://www.ebay.de/itm/IFB-4876-MENSCHEN-NETZ-FILMPROGRAMM-/160462577086
25 Icons/Clipart : Iconfinder.net

QUELLEN
Ebersbach, Glaser, Heigl (2008): Social Web
Garrett, Jesse James (2010): The Elements of User Experience
Zittrain, John (2009): The Future of the Internet
Kelly, Kevin (2007): The next 5.000 Days of the Web
O´Reilly, Tim (2010): State of the Internet Operating System




                                                                                                           Probevortrag 02.02.2011      31
Marcus Haberkorn

Intermediales Design
Vertretungsprofessur Hypermedia: Interaktive & vernetzte Systeme

Fachhochschule Trier
Irminenfreihof 8
Postfach 1826
D-54208 Trier

Tel.  +49 651 8103-839
Mail: m.haberkorn@fh-trier.de
G+:   https://plus.google.com/100837354767941533143/



                                                               Probevortrag 02.02.2011   32

Hypermedia: Einführung Web 2.0 & Social Web (2. Sitzung)

  • 1.
    Web 2.0 undSocial Web Einführung und Begriffsklärung Marcus Haberkorn | Intermedia Design | 2011 Probevortrag 02.02.2011 Seminar | Einführung in interaktive & hypermediale Systeme | für 2. Semester
  • 2.
    Übung zu denVorbereitungsmaterialien - Was versteht O´Reilly unter Web 2.0? - Was verstehen die Autoren unter Social Web? - Erläutert beides anhand der interaktiven Arbeit ‚We Feel Fine‚von Jonathan Harris & Sep Kamvar! Probevortrag 02.02.2011
  • 3.
    Die aufgabenorientierte Sichtauf Web 2.0 - Software als Service - Software als "immer beta" - Lightweight Programming - Fokus auf Daten - Endgerätevielfalt - Rich User Experience - Kollektive Intelligenz - Neue Geschäftsmodelle Tim O´Reilly Probevortrag 02.02.2011 3
  • 4.
    Jesse James Garrett:Web als Softwareschnittstelle Vorangehend haben wir das Web als Hypertextsystem behandelt (informationsorientiert, rechte Hälfte der Grafik). Im ‚Web 2.0‘ tritt die Perspektive auf das Web als Software- Schnittstelle (aufgabenorientiert, linke Hälfte der Grafik) hinzu. Jesse James Garrett: The Elements of User Experience http://www.jjg.net/elements/translations/ Probevortrag 02.02.2011
  • 5.
    Jesse James Garrett:Web als Softwareschnittstelle Benutzer-Bedürfnisse: Von Außen abgeleitete Site- Zielsetzungen, welche durch Benutzerforschung erhoben werden (ethno-, techno-, psychografisch etc.) Inhaltsziele: Interne Zielsetzungen der Site, wie etwa Business, künstlerische oder andere Probevortrag 02.02.2011
  • 6.
    Jesse James Garrett:Web als Softwareschnittstelle Spezifizierung der Funktionen: ‚Feature-Set‘ als detaillierte Beschreibung der Funktionalität der Site, um die Benutzeranforderungen zu befriedigen Probevortrag 02.02.2011
  • 7.
    Jesse James Garrett:Web als Softwareschnittstelle Interaktionsdesign: Gestaltung der Anwendungsflüsse zur erleichterten Wahrnehmung von Benutzeranforderungen, sowie Definition des Umgangs mit den Funktionen Probevortrag 02.02.2011
  • 8.
    Jesse James Garrett:Web als Softwareschnittstelle Interface/Schnittstellen- gestaltung: Gestaltung der Schnittstellen- Elemente zur Erleichterung der Handhabung der Funktionen, wie in der klassischen Human Computer Interaction (HCI) Informationsgestaltung: Informationsgestaltung zur Erleichterung des Verständnisses Probevortrag 02.02.2011
  • 9.
    Jesse James Garrett:Web als Softwareschnittstelle Visuelle Gestaltung: Grafische Bearbeitung der Schnittstellenelemente Probevortrag 02.02.2011
  • 10.
    Vertiefung der zweiAspekte Endgerätevielfalt und Software als Service in euren Vorträgen: - RIAS und Cloud Computing (Fabian) - Always on: Mobile Internetnutzung (Nadine) Probevortrag 02.02.2011 10
  • 11.
    Das Web alsService-Plattform Web 2.0: Dienstleistungen / Services in Form hochinteraktiver Anwendungen Social Web: webbasierte Anwendungen für Informationsaustausch, Beziehungsaufbau und -pflege, Kommunikation und Kollaboration, in einem gesellschaftlichen oder gruppenbezogenen Kontext Probevortrag 02.02.2011 11
  • 12.
    Die informationsorientirete Sichtauf Web 2.0 Das Web 2.0 ist nichts Revolutionäres! If Web 2.0 for you is blogs and wikis, then that is people to people. But that was what the Web was supposed to be all along. Tim Berners-Lee, Interview with IBM, 2006 Probevortrag 02.02.2011 12
  • 13.
  • 14.
    Globale Statistiken Quelle Probevortrag 02.02.2011
  • 15.
    Viele viele animierteInfografiken State of the Internet: http://vimeo.com/9641036 „Did you know? Shift happens“ 1-4: http://thefischbowl.blogspot.com/ Social Media Revolution: http://www.youtube.com/watch?v=2_Ig0ClYlmM Social Media in Europe & Germany: http://www.youtube.com/watch?v=LxWahcXfwCg u.v.m. Probevortrag 02.02.2011 15
  • 16.
    Vergleich von Konzeptendes Web 1.0 und Web 2.0 Web 1.0 ca. 1996 Web 2.0 ca. 2010 vorwiegend read-only read-write 45 Millionen User ca. 2 Milliarden User Fokus auf Unternehmen Fokus auf User Homepages Blogs, Social Media-Profile Content besitzen Content teilen Autoren & Leser Prosumer HTML, Portale XML, CSS, CMS, APIs, AJAX Verzeichnisse / Taxonomien Tagging / Folksonomies Webformulare Webanwendungen Probevortrag 02.02.2011
  • 17.
    Web 1.0 undWeb 2.0: Produktion/Konsumption Probevortrag 02.02.2011 17
  • 18.
    Typische Werkzeuge &Konzepte Feeds | Video- & Podcasts Weblogs Wikis Social Networking / Communities Social Bookmarking / Tagging / Folksonomies Social Media Sharing Offene Programmierschnittstellen (APIs) Probevortrag 02.02.2011 18
  • 19.
  • 20.
    Wandel der Medienproduktionund -rezeption Fokus nicht mehr auf reiner Informationsübermittlung sondern auf dem kooperativem Austausch von Wissen und der kollektiven Generierung von Inhalten  "Social Software" bezieht sich auf Inhalt UND Aktivität UND Kontext Probevortrag 02.02.2011 20
  • 21.
    Media is … …theconnective tissue of society. Media is how you know when your friend's birthday party is. Media is how you know what's happening in Tehran, who's in charge in Tegucigalpa, or the price of tea in China. Media is how you know why Kierkegaard disagreed with Hegel. Media is how you know about anything more than ten yards away. Clay Shirky, Cognitive Surplus, 2010 Probevortrag 02.02.2011 21
  • 22.
    Media is … Allthese things used to be separated into public media (like visual or print communications made by a small group of professionals) and personal media (like letters and phone calls made by ordinary citizens). Now those two modes have fused. Clay Shirky, Cognitive Surplus, 2010 Probevortrag 02.02.2011 22
  • 23.
    Cartoon http://wulffmorgenthaler.com/strip/2011/04/07/ Probevortrag 02.02.2011 23
  • 24.
  • 25.
    Technologie & Gesellschaft:Beispiel 1950er Jahre Probevortrag 02.02.2011 25
  • 26.
    Clay Shirky: Stufenmodellder Social Web-Aktivität Probevortrag 02.02.2011 29
  • 27.
    Aufgabe Findet und beschreibtBeispiele für Shirkys Modell! Probevortrag 02.02.2011
  • 28.
    Bild- und Quellennachweisenach Foliennummern Insofern nicht auf den Folien vermerkt: BILDER 13 Social Media Timeilne http://networkconference.netstudies.org/2010/04/is-it-fact-fiction-or-fantasy-check-under-the-bonnet-before- risking-a-wikipedia-citation/ 19 Social Media Prisma http://www.ethority.de/weblog/2010/04/15/we-proudly-present-das-social-media-prisma-version-2-0/ 24 Web2.0-Logos http://3oneseven.com/29/web20-logos/ 24 Menschen im Netz http://www.ebay.de/itm/IFB-4876-MENSCHEN-NETZ-FILMPROGRAMM-/160462577086 25 Icons/Clipart : Iconfinder.net QUELLEN Ebersbach, Glaser, Heigl (2008): Social Web Garrett, Jesse James (2010): The Elements of User Experience Zittrain, John (2009): The Future of the Internet Kelly, Kevin (2007): The next 5.000 Days of the Web O´Reilly, Tim (2010): State of the Internet Operating System Probevortrag 02.02.2011 31
  • 29.
    Marcus Haberkorn Intermediales Design VertretungsprofessurHypermedia: Interaktive & vernetzte Systeme Fachhochschule Trier Irminenfreihof 8 Postfach 1826 D-54208 Trier Tel. +49 651 8103-839 Mail: m.haberkorn@fh-trier.de G+: https://plus.google.com/100837354767941533143/ Probevortrag 02.02.2011 32