Redesign iCal

Projekt Redesign des Kalenderprogramms iCal von Apple im Fach Application Design 1.

Aufgabenstellung

Die Aufgabe war es, ein Redesign einer Free- bzw. Shareware zu entwerfen. Im Vordergrund stehen die Recherche, die Analyse, die Interaktion mit dem Programm und die Gestaltung der Software.

 

iCal

iCal ist ein Kalenderprogramm, welches von Apple mit dem Betriebssystem Mac OS X mitgeliefert wird. Das Programm wurde 2002 auf der Macworld vorgestellt.

Mit iCal können Termine eingetragen und verwaltet werden. Es können Kalender veröffentlicht und abonniert werden und man kann sie mit mehreren Benutzern teilen und Anhänge hinzufügen.

 

iCal2

 

 

Redesign

 

 

Informationsarchitektur

In der Informationsarchitektur haben wir einige Redundanzen gefunden, welche wir für unser Redesign entfernt haben. Das Card Sorting hat uns dabei geholfen, die Menüpunkte neu zuzuordnen und festzustellen, dass viele Punkte in anderen Menüpunkten besser funktionieren.

 

bild von ia

 

Usecases

Im nächsten Schritt haben wir verschiedene Usecases erstellt, welche für uns wichtig waren. Danach haben wir sie selbst getestet und andere Personen testen lassen, welche sich sowohl mit iCal auskennen, als auch das Programm zum ersten Mal nutzten.

 

bild von helena

 

Icons und Buttons

Wichtig waren auch die einzelnen Buttons und Icons in iCal.

 

 

bild von buttons/icons

 

 

Wireframe

Nachdem wir mit der Analyse fertig waren, haben wir erste Bleistiftskizzen erstellt, die wir dann kurz darauf am Screen umgesetzt haben. So sind erste Wireframes entstanden.

Wir haben verschiedene Layouts und Anordnungen ausprobiert und uns überlegt, was Usecase-spezifisch und Benutzerorientiert am Besten funktioniert.

 

 

bild von 2-3 wireframes

 

Umsetzung

Im nächsten Schritt haben wir die einzelnen Wireframes in Adobe Fireworks umgesetzt.

 

Angefangen haben wir mit dem Hauptfenster, welches wir im OS X-Style angelegt haben um es adaptiv zum Betriebssystem zu machen.

 

bild von hauptfenster

 

 

Die Fenster für Ereignisse, Kalender und Einstellungen.

 

bild von fenstern

 

 

Die Zeitleiste zur Navigation im Kalender.

 

bild von zeitleiste

 

 

Und die einzelnen Icons und Buttons.

 

bild von buttons

 

 

Simulation

Im finalen Schritt sind wir an die Simulation gegangen. Wie funktioniert das neue iCal, wie lege ich neue Termine an und wie sieht die Interaktion im Allgemeinen aus.

 

video von der simulation