Philipp Naderer (ORF.at): Bridging the Gap: Datenjournalistische Anwendungen für Mobile und Desktop

Philipp Naderer (ORF.at): Bridging the Gap: Datenjournalistische Anwendungen für Mobile und Desktop

Vortrag am Symposium: Infografik und Datenjournalismus
2.-3.12.2013, #dataviz13
Department Medien und Design, FH JOANNEUM Graz
http://datablog.fh-joanneum.at/symposium

Transcript

  1. 2.

    botic Philipp Naderer, BSc Web Developer – Frontend Seit 2007

    bei ORF.at Freier Fotojournalist Diplomarbeit TU Wien
  2. 3.

    ORF Online und Teletext GmbH & Co KG { news,

    sport, oesterreich: {steiermark, wien, noe, ooe, ...} wetter, debatte, science, iptv, help, tv, fm4, oe3, ... }
  3. 4.
  4. 5.

    Wahlen 2013 01-20 – Volksbefragung Wehrpflicht 03-03 – Landtagswahl Kärnten

    03-03 – Landtagswahl Niederösterreich 04-28 – Landtagswahl Tirol 05-05 – Landtagswahl Salzburg 09-29 – Nationalratswahl
  5. 6.
  6. 7.
  7. 8.
  8. 11.
  9. 14.

    Ticket #4 – Sortierung der Gemeinden Umlaute + Sankt vs.

    St. Verschiedene Normen & Möglichkeiten: - DIN 31628 - DIN 5007 - ÖNORM EN 13710:2011 05 15 (nicht einsehbar) - „Österreichische Ordnung“ - Nach GKZ (Gemeindekennziffer) Entscheidung: ö = oe, Sankt = St. Aber: Unicode vs. Windows 1252 vs. ISO 8859-15
  10. 15.
  11. 16.

    Nicht lustig: 2 Wahlen parallel - 2 Landeswahlbehörden - 2

    Anlieferungskanäle - 2 Redaktionen in Ländern + news.ORF.at - 19 Listen (nicht nur Ja oder Nein) - BZÖ vs. FPK in Kärnten – Vergleichswerte? - 29 Bezirke und 6 Statutarstädte - 25 Listenreihungen für Bezirke - Gleiches Kernteam wie bei Volkbefragung
  12. 17.

    Kleine Randnotiz: Das Team Stronach ... TS – „Team Stronach

    für Kärnten“ FRANK – „Team Frank Stronach“ STRONACH – „Team Stronach für Tirol“ TEAM – „Team Stronach für Salzburg“ FRANK – „Team Frank Stronach“
  13. 18.

    Ticket #5: Mandatsschieber „+/- 0“ Platzproblem bei wenigen Mandaten Testfall

    nicht vergessen! 50% muss genau bei der Hälfte liegen Reihung nach Sitzplan? Reihung nach bisheriger Stärke? Reihung nach neuer Stärke?
  14. 19.

    Ticket #6: Perzentile der SPÖ - SPÖ legte mehr zu

    als erwartet - Spannweite Hochburgen vs. Schwache Gemeinden
  15. 20.

    Ticket #7: Balken vs. Labels Balken lang genug Stimmen im

    Balken Alle anderen Parteien zu schwach, Stimmen neben Balken
  16. 21.

    Tirol & Salzburg - 2 Monate Verschnaufpause - Neuer Entwickler

    für mobile Anwendungen - Gleiches Schema wie andere Landtagswahlen - Testballon für die Nationalratswahl > Mobile Ansicht dank Responsive Webdesign
  17. 22.

    Kleine Randnotiz: Piratenpartei in Salzburg ... PIRAT Salzburger Piraten -

    Bürgerbeteiligung, Transparenz und 340 Millionen mehr Gründe dieses Mal die Piratenpartei zu wählen
  18. 23.

    Was bedeutet Responsive Webdesign? Webseite kann reagieren auf: * Breite

    und Höhe vom Browserfenster * Breite und Höhe vom Gerät * Orientierung des Geräts * Auflösung des Geräts * Farbkomponenten des Display (Farbe vs. Mono) - Eine Webseite für Mobil und Desktop
  19. 24.

    Mobil != Smartphone != Unterwegs - Smartphone am Sofa parallel

    zur TV-Sendung - Tablet im Zug mit WESTlan bzw. ÖBB-Wifi - Tablet oder Phone im Uni-Hörsaal mit 100 MBit - Tablet mit externer Tastatur > Mobil = einen mobilen Kontext haben > Mobil != iPhone 5S / High-End Android
  20. 25.

    Strategie für mobile News-Anwendungen - Design für unterschiedliche Nutzungskontexte -

    Touch ist unpräziser als Maus / Tastatur - High-End-Hardware haben nicht alle - Bandbreite sparen, Caching intelligent machen - Retina Grafiken für Tablet vorsehen - EDGE-Verbindung ist eine gute Testumgebung „Optimize Everything!“
  21. 28.
  22. 29.
  23. 30.
  24. 31.
  25. 32.
  26. 33.
  27. 34.
  28. 35.

    Ticket #8 – Blurbs Die Grafik zeigt den Verlauf der

    Stimmenanteile der im Nationalrat vertretenen Parteien seit 1945. Am unteren Rand der Grafik sind die Regierungskoalitionen für den jeweiligen Zeitraum dargestellt. Für 1949 und 1953 zeigt die FPÖ-Kurve die Ergebnisse der Vorgängerpartei Verband der Unabhängigen (VdU). Die Verlaufskurve für die Grünen zeigt die Ergebnisse für die jeweils im Nationalrat vertretenen Vorläuferparteien. 1986: Die Grüne Alternative - Liste Freda Meissner-Blau; 1990: Die Grüne Alternative/Grüne im Parlament; ab 1994: Die Grünen - Die Grüne Alternative (Grüne). Quelle: Innenministerium
  29. 37.

    Ticket #9 – Android und SVG - Basierend auf SVG

    / D3 - SVG erst ab Android 3 - Implementierung mangelhaft - Fallback mit PNG-Grafik
  30. 40.

    Touch-Events != Click-Events WebKit-Browser (Android & iOS) versuchen Touch-Events in

    Click-Events umzuwandeln - So funktionieren alle Webseiten weiterhin - 300 ms Verzögerung - Ursache: Double Tap for Zoom erkennnen - Oft aber schnellere Reaktion erwünscht - Lösung: „touchstart“ statt „click“ verwenden
  31. 41.
  32. 42.

    Fazit - Responsive = Mobil und Desktop auf einmal -

    Gute Performance ist enorm wichtig - Gesten sind kompliziert, genau überlegen - Daten komprimieren, Bandbreite sparen - Layouts kompakt halten - Detailinfos / Blurbs über Sub-Ebene anzeigen - Testen! - Auf User-Feedback hören! - App ersetzt keine Mobilansicht im Browser