Crossmedia Grundlagen WS 2011/12

Mockup

Stellt man sich vor, HEAD würde das Ziel verfolgen seine Webseitenbesucher zu Tennisprofis auszubilden, so ist in der modernen Zeit der Gedanke nicht fern, dieses Vorhaben mit einer Anwendung für das Mobiltelefon zu unterstützen.

Doch wie kann ein Programm jemandem effektiv etwas beibringen?

Ich habe mir gedacht, dass diese Anwendung in der Lage sein müsste das Verhalten des Spielers zu erfassen, auszuwerten und danach mit Lehrvideos Tipps zum besser werden geben.

Diese Anwendung könnte sich beim Start mit einem vorbereiteten Tennisschläger über Funk oder Bluetooth verbinden(bei Problemen auch über eine Schaltfläche auf dem Display).

Nach betätigen einer speziellen Schaltfläche auf dem Display(“record”) würde sie jede Bewegung des Schlägers aufzeichnen und einer entsprechenden Bewegung aus dem Tennissport zuweisen. Die Abweichung von der idealen Bewegung wertet sie dann aus und gibt sie in statistischer Form wieder. Aufbauend auf dieser Auswertung, weiß die Anwendung, wie der Spieler seine Bewegung optimieren kann und berät ihn dann mit den oben erwähnten Lehrvideos in seinem Training.

Aufbauend auf meinem zuvor selbst erstellten Raster, habe ich mich an drei unterschiedlichen Layouts der Landingpage versucht.

Es war für mich wichtig das aktuelle Programm der Marke, What’s your Game?, das auch zu unserem Thema “Wie werde ich Tennis-Profi?” passt, an oberster Stelle zu platzieren. Ungünstig hierfür waren die vier Spalten meines Rasters, wo die Kampagne sich allerdings um fünf Stile dreht.

Beim ersten Layout habe ich den neusten Stil noch rausgelassen, da die Kampagne bis vor Kurzem noch mit nur vier Stile hatte und der fünfte noch ganz neu ist. Es war auch schwer an Bildmaterial für eben diesen Stil heranzukommen.

Layout 01 (3-seitige PDF, inkl. Raster)

Dem Hauptprogramm der Marke folgen die für unser Thema “Wie werde ich Tennis-Profi?” die besonders wichtigen Bereiche Fitness und Gesundheit. Direkt neben den großen Überschriften der Bereiche finden sich weiterführende Links, die das entsprechende Thema, das den Besucher interessiert näher beleuchten.

Ebenfalls sehr wichtig zum Verbessern im Sport ist die Community, die ebenfalls in allen Layouts weit oben ihren Platz gefunden hat.

Layout 02 (3-seitige PDF, inkl. Raster)

Beim zweiten Layout habe ich die Darstellung der fünf Stile in die Vertikale gebracht, womit nun alle sauber und passend zum Gesamtbild abgebildet sind.

Erst am unteren Ende findet sich der bei HEAD heutzutage stark vertretene, für das Thema aber nebensächliche, Shop-Bereich. Unter Equipment sieht man die von HEAD vertretenen Produkte nebeneinander aufgereiht und über weiterführende Links erreichbar.

Direkt darunter finden sich die Technologie-Informationen, die  das jeweils darüber liegende Produkt näher beleuchten.

Layout 03 (3-seitige PDF, inkl. Raster)

Die in Layout 03 verwendeten Tennisspieler-Vektorgrafiken im Hintergrund stammen von hier.

Alle anderen Grafiken sind entweder selbst entworfen oder Eigentum von HEAD.

Das erstellte Raster ist lediglich 4 Spalten breit, was zum einen stark einschränkt, zum anderen aber auch deutlich für Ordnung sorgt.

Das kleinste Element ist 215px breit und 100px hoch. Bei Bedarf können daraus auch zwei 105x100px Felder entstehen.

Die Abstände betragen in der Vertikalen 10px und in der Horizontalen 15px, was unterbrechungsfreien Text der Schriftart Helvetica in der Größe 12pt ermöglicht.

Drei Felder in der Höhe und zwei in der Breite erlauben das Darstellen von Grafiken im 4:3 Format.

Einteilung einer Webseite in geordnete Bereiche:

Die Animation zeigt das Raster sowie eine vorgeschlagene Größennutzung für verschiedenen Webseiten-Elemente. Die “Platzhalter” bzw. Flächen können jetzt pixelgenau mit Inhalt gefüllt werden.

Gestaltungsraster Demo

Das Gestaltungsraster:

Das Raster hat eine Gesamt-Pixelbreite von 960px in der Breite.

In der Höhe ist es variabel.

Analyse der Webseite: www.acics.com

Zuerst schauten wir uns die vorhandenen Inhalte genau an. Dabei viel uns auf, dass vieles da ist, aber leider zum Teil sehr versteckt. Die Idee war nun: Eine Landingpage zu erstellen, von der aus man einfach zu den gewünschten Produkten und Informationen findet. Um uns einen besseren Überblick zu verschaffen, schrieben wir uns alle relevanten Themen auf Karteikarten um diese in eine sinnvolle Reihenfolge zu bringen und variabel zu Ordnen.

Bildbeschreibung:

Auf den grünen Kärtchen sind unsere neuen Ideen. Auf den roten Kärtchen die bereits vorhandenen Ideen.

Als Thema für eine Landingpage hat sich unsere Gruppe, David, Niklas und ich, mit dem Sportequipment-Hersteller HEAD auseinandergesetzt.

Wir haben uns für das Thema “Wie werde ich Tennisprofi?” entschieden und haben demnach die Landingpage der Tennis-Rubrik von Head unter die Lupe genommen(Link).

Im ersten Schritt haben wir den Inhalt der Seite analysiert, um im Anschluss eine Liste von Bereichen, die zum Thema  passen würden, aber auf der Seite nicht vorhanden sind, zu erstellen.

Folgende Punkte haben wir der Seite bereits entnehmen können:

• What’s your game

5 Kategorien

Zuordnung Schläger / Spieler

Identifikation

• Nachrichten rund um den Sport
• Spielerprofile
• Ausrüstung
• Händler
• Team Elite (Sponsorprogramm)
• Play & Stay Programm

Initiative zur Förderung junger Einsteiger

Inkl. passendes Equipment

• Technologie

Ball

Schuh

Schläger

(Partnerfirmen)

Folgende Bereiche fehlen unserer Meinung nach, wenn man das Ziel Tennisprofi zu werden hat und die Seite besucht:

• Community

Mitspieler finden

Tennisplätze in der Umgebung finden

Support-Forum

• Fitness

Individueller Trainingsplan

Allgemeine Tipps

• Gesundheit

Getränke / Ernährung

Verletzungsprävention

Schuhe (Bodenbelag)