Medienproduktion

» Alle die den Style-Guide noch nicht abgegeben (also online-gestellt) haben UND noch nicht die Infomail versandt haben, schleunigst nachholen! » Erstellen Sie für Ihren Webblog ein passendes Konzept für ein Interface Design, sowie für ein Screendesign. Auf Basis beider Konzepte erstellen Sie schließlich einen Style-Guide für Ihren Blog.

» Abgabe in Form eines Eintrages/Beitrages auf Ihren Webblog und zusätzlich eine Infomail an mlechner@gmail.com mit dem Hinweis, dass das Konzept fertig ist und online steht. » Späteste Abgabe: 21. 5. 2008, 10 Uhr.

Um die Aufgabe lösen zu können, bzw. um Informationen über Interface-Design, Screen-Design und dem Style-Guide zu erhalten, lesen Sie dazu den Beitrag über Design-Digital

Beispiel für ein Inhaltsverzeichnis des Style-Guides für die Website:

ZIELSETZUNG & ZIELPUBLIKUM

• Zielpublikum bestimmen
• Erwartungen der Nutzer (Was erwartet sich der Nutzer?)
• Absichtserklärung formulieren
• Was sind die wichtigsten Ziele
• Knappe Gliederung für den informativen Gehalt der Web-Site

INTERFACE-DESIGN

• Informationsarchitektur (Aufbau und Struktur)
  • Strukturformen (Welche Struktur weißt der Blog auf: Lineare Strukturform, Netzstruktur, Hierarchische Struktur, …)
  • Aufbau (Wie ist der Blog aufgebaut – welche Bereiche gibt es: Aktionsbereiche, Informationsbereiche, Inhaltsbereiche, …)
• Navigation & Subnavigation (+ Benennung)
• Inhaltsseiten (Welche Inhalte befinden sich auf dem Blog und wie sind sie gegliedert?)
• Wording (Wie ist der sprachliche Stil der Seite?)
• Startseite (Wie sieht die Front-Seite aus?)
• MultiMedia (Werden Filme, Animationen, Sounds, etc. benötigt?)
• Interaktionsdesign (betrifft alle Interaktiven Abläufe, z. B. registrieren, ein Produkt auswählen oder eine Bestellung aufgeben, Suchfunktion, Kalender, Polls, …)

SCREEN-DESIGN

• Layout und Layoutverhalten von Fenstern (Wie groß ist das Fenster? Wie lange ist die Seite? Muss gescrollt werden oder nicht?)
• Typografie (Wie wird die Seite gestaltet, wie wird der Text gestaltet?)
• Schrift (Welche Arten von Schriften kommen wo zum Einsatz?)
• Farben/Farbverläufe (Welche Farben werden für welchen Zweck verwendet?)
• Icons (Wann und wo werden Icons verwendet?)
• Grafiken (Welche Art von Grafiken werden wo verwendet?)
• Fotos (Welches Bildkonzept liegt vor und wo werden Bilder/Fotos eingesetzt?)
• Formate – Zahlen, Datum, Adressen usw. (Wie werden bestimmte wiederkehrende Abschnitte im Text geschrieben bzw. formatiert?)
• Tabelle (Wie sieht die Gestaltung der Tabellen aus?)
• Einheitlichkeit (Gibt es eine gewisse ersichtliche Einheit und Struktur auf der Website, oder sieht jede Seite anders aus?)

[ SUCHMASCHINENOPTIMIERUNG ] Im Konzept nicht erforderlich (außer als Zusatzaufgabe ;-). » Je genauer der Style-Guide definiert ist, desto besser und einfacher auch die Umsetzbarkeit. (desto besser auch die Bewertung! ;-)

Weiterführende Informationen

Einen übersichtlichen Web-Style-Guide finden Sie hier http://www.tu-chemnitz.de/docs/yale/contents.html » Übernehmen Sie daraus Infos und passen Sie diese auch auf das Konzept Ihres Interface-Designs/Screen-Designs an.

Quellen: Web Usability, Galileo Design Wikipedia http://www.ergosign.de/de/user-centered-design/specification/style-guide.php