Crossmedia Grundlagen WS 2011/12 » jonastsigos

iPhone UI Kit

jonastsigos — Wed, 04 Jan 2012 10:28:20 +0000

Asics App. Startseite iPhone User Interface mit UI Kit

4. Aufgabe: iPhone Wireframes (asics.com)

jonastsigos — Wed, 04 Jan 2012 10:02:10 +0000

Viewpoints der Asics App./Webapp. Die Mockups dienen als erste Visualisierung der geplanten features.

Auswahl zwischen normaler Webseite und mobiler Seite

Startseite (globale Landingpage) der App.

Suche der App. mit Vorschlägen und Visualisierung der Suchergebnisse

Kartenansicht. Welche Stores sind in der nähe?

3. Aufgabe: Landingpage mit Inhalt (asics.com)

jonastsigos — Sun, 18 Dec 2011 22:24:44 +0000

Füllung der geordnete Bereiche mit Inhalt:

In diesem Arbeitsschritt wurde aus dem erstellen Gestaltungsraster eine passende Aufteilung gewählt. Diese Aufteilung gliedert die Themen nach Wichtigkeit und Aktualität. Im folgenden Schritt wurde die Einteilung mit Inhalten gefüllt.

Inhalt der Landingpage:

- Fit durch den Winter

- Winter 2012 Collection

- Asics Winter Lauf 2012

- Finde die passende Bekleidung

- Online Store

2. Aufgabe: Landingpage Gestaltungsraster (asics.com)

jonastsigos — Mon, 28 Nov 2011 22:23:48 +0000

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.

1. Aufgabe: Landingpage Themenfindung (asics.com)

jonastsigos — Mon, 28 Nov 2011 22:21:48 +0000

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.