Spree WS 2009/2010 Informationsarchitektur (digitale) Informationsräume strukturieren und...

Spree WS 2009/2010

InformationsarchitekturInformationsarchitektur(digitale) Informationsräume strukturieren und organisieren(digitale) Informationsräume strukturieren und organisieren

@ Fotostrecke: Taj Mahal

http://www.boxesandarrows.com/view/we_are_all_connected_the_path_from_architecture_to_information_architecture

Shilouette

Gesamtansicht Eingangstor (menschlicher Maßstab)

Detail

• Geometry• Scale• Proportion• Rhythm• Symmetry

Thema des SeminarsDefinitionen

Sie haben sich das dieses Thema gewünscht:

(Digitale) Informationsräume strukturieren und organisieren

Bevor ich meinen Programmvorschlag vorstelle, wüsste ich gerne:

Was wünschen Sie sich, was erwarten Sie von dem Thema?

Das vorgestellte Programm ist nur ein Vorschlag: ich bitte um Veränderungen, Ergänzungen Streichungen, …

Seminar I-Prax: Inhaltserschließung visueller Medien, 5.10.2004Spree WS 2009/2010

KartenabfrageDefinitionen

Jede/r darf maximal 3 Wünsche pro Frage äußern zu:

Themen / Fragestellungen

Arbeitsweisen

Prüfungsleistung


DefinitionenDefinitionen

Die IT – Definition

Informationsarchitektur ist die Planung und Verwaltung der IT-Infrastruktur einer Organisation. Darin eingeschlossen ist die Entwicklung von Grundstrukturen und Richtlinien dafür, wie IT-Ressourcen wie Computer, Daten, Software und Kommunikationsmöglichkeiten verwaltet werden sollen.

Die Design – Definition

„Information Architects make the complex clear; they make the information understandable to other human beeings.“ (Wurman, 2003)

Die Wissensorganisations-Definition

Informations-Architektur ist der Prozess des Organisierens, Benennens und des Entwickelns von Navigations- und Suchsystemen um Nutzer bei der Suche nach und dem Management von Informationen zu unterstützen. (Morville & Rosenfeld, 1998)


Definitionen Aufgaben Ordnen Strukturieren Benennen Navigieren Fazit Quellen

Beispiel – Informationsdesign-AnsatzEinstieg

Richard Saul Wurmans minimalistische Darstellung des Verkehrssystems der Stadt Tokyo


http://www.gslis.utexas.edu/~l38613dw/images/WurmanToyko1.jpg

Zu Wurman:

http://www.wurman.com/publications.html

Aufgaben von Informationsarchitekten?Aufgaben

Angenehme Nutzererfahrung schaffen / user experience (Norman / Garrett) http://www.jjg.net/elements/pdf/elements.pdf

Informationen ordnen und strukturieren Informationen benennen Informationen zugänglich und findbar machen

Navigation Suche(Rosenfeld/Morville; Wodtke) http://iainstitute.org/de/



ExplorationsaufgabeAufgaben

Schauen Sie sich bitte diese beiden Startseiten an

http://www.bui.haw-hamburg.de/

http://www.design.haw-hamburg.de/

A) Wie unterscheidet sich die User Experience auf den beiden Seiten? ‚look and feel‘ Informationen geordnet? Informationselemente benannt? Welche Navigations- und Suchmöglichkeiten gibt es?

B) Was gefällt Ihnen, was gefällt Ihnen nicht? Begründen Sie Ihr Urteil



Informationen ordnenInformationen ordnen


Nehmen Sie sich 5 Minuten Zeit und ordnen Sie die unten aufgeführten Begriffe:

Architekt, U-Bahn, Bahnhof, Krankenschwester, Krankenhaus, Lehrer, Haus, Meer, Wissenschaftler, Arzt, Schule, Mechaniker, Seemann

Was fällt an dieser Inhaltsübersicht einer Website einer Bibliothek auf?

- Benutzerausweis beantragen- Bücher vormerken- Erwachsene- Jugendliche- Kultur und Medien- Naturwissenschaften- Teenager- Über uns


OrdnungsschemataOrdnungsschemata


Man unterscheidet unterschiedliche Ordnungsschemata

Exakte Ordnungsschemata

AlphabetischChronologischGeographischSprache…

Mehrdeutige Ordnungsschemata

Nach Themen

Architektur, Bildung, Erziehung,...

Nach Aufgaben

Bearbeiten

Einfügen

Formatieren

Nach Nutzergruppen Studenten, Lehrende, Frauen,…

MetaphorischVirtueller

KlassenraumKandidaten-

Karussel

Umfrage Definitionen Aufgaben Ordnen Strukturieren Benennen Navigieren Fazit Quellen

Ordnung und WebdesignOrdnungsschemata


Die visuellen Muster sollen die logischenund funktionalen Beziehungen zwischen den Informationselementen widerspiegeln Gruppierung

Sind verwandte Elemente durch 'white space', grafische Begrenzungen, gleiche Helligkeit, Farbe oder Textur gruppiert? Sind nicht-verwandte Elemente optisch voneinander unterschieden oder räumlich voneinander getrennt?

Abstufung von BedeutungWird die Abstufung der Bedeutung einzelner Elemente im Verhältnis zu anderen Elementen grafisch unterstützt? Farbgebung, Platzierung, Größe, Isolierung, Komplexität und Kontrast erregen besonders leicht Aufmerksamkeit.

Konsistenz und VorhersagbarkeitIst das Design konsistent und vorhersagbar? Werden Elemente, die logisch oder funktional gleich sind, optisch gleich behandelt? Ist das Platzierungsmuster der Elemente auf den Seiten konsistent? Ist der Hintergrund konstant?

ReihenfolgeUnterstützt das Design die Reihenfolge, in der der Besucher die Informationselemente wahrnehmen soll?

vgl. Website von Ursula Schulz: <http://www.bui.fh-hamburg.de/pers/ursula.schulz/webusability/praesentation.html>


StrukturierenStrukturieren

b c

Home

a

Home

Inhalt

BA

ba


Die Struktur einer Site ist dadurch bestimmt, in welcher Beziehung Informationen zueinander stehen:

Abb. 1 Flache Hierarchie

Abb. 2 Tiefe Hierarchie

Abb. 3 Hypertext/Netz


Abb. 4 Facettenstruktur

Farbe: gelb

Rand: ohne

Form: Rechteck

StrukturierenStrukturieren


Die richtige Struktur für eine Aufgabe finden

Für welche Aufgaben würden Sie eine flache Hierarchie wählen?

Für welche Aufgaben würden Sie eine tiefe Hierarchie wählen?

Für welche Aufgaben würden Sie eine Hypertextstruktur wählen?

Aufgaben Ordnen Strukturieren Benennen Navigieren Fazit Quellen

BenennenBenennung


Anforderungen an Benennungen Konsistenz

z.B. im Sprachstileine Benennung sollte nicht auf verschiedenen Seiten unterschiedliche Bedeutungen haben

Berücksichtigung von bestehenden Konventionenwenn Sie abweichen, sollte das einen Grund haben

Linkbenennungen: z. B. keywords als LinksBenennungen im Kontext und ohne KontextBilder?

ein Wort sagt mehr als tausend Worte?


NavigierenNavigieren


Funktionen von Navigationssystemen

Offensichtliche Funktionen von Navigationssystemen

Standortbestimmung Suchhilfe / Browsingstruktur

'Übersehene' Funktionen von Navigationssystemen Orientierungsfunktion - bietet Sicherheit und Kontrolle Macht die Inhalte der Site sichtbar Zeigt, wie die Seite zu nutzen ist

Wo ist der Anfang? Welche Auswahlmöglichkeiten gibt es?

Schafft Vertrauen in die Urheber der Seite "...denn sie wissen, was sie tun"

(vgl. Steve Krug: Don't make me think! A Common Sense Approach toWeb Usability. Indianapolis: Macmillan, 2000)


Typen von NavigationssystemenNavigieren


Typen von Navigationssystemen

Hierarchie / Architektur der Site globale Navigationssysteme

Hilfsmittel, die die Navigation quer zur Hierarchie erlauben Navigationsleiste Home-Button Frames

lokale Navigationssysteme für Unterbereichespontane Navigationssysteme durch interne und externe Linksausgelagerte Navigationssysteme

Inhaltsverzeichnis Index Site map


FazitFazit



Informationsarchitektur nutzt bewährte Methoden der Wissensorganisation

Information audit / Information needs Ordnung und Struktur, Konsistenz Klassifikation Benennung Indexierung und Thesaurus Navigation Recherchesysteme, Browsinghierarchien

Quellen und weiterführende Ressourcen

Quellen / Ressourcen

Seminar I-Prax: Inhaltserschließung visueller Medien, 5.10.2004

Umfrage Definitionen Aufgaben Ordnen Strukturieren Benennen Navigieren Fazit Quellen

Chiou, Fu-Tien: We are all connected : The path from Architecture to Information-Architecture. In: Boxes and Arrows, 2003/11/10 http://www.boxesandarrows.com/view/we_are_all_connected_the_path_from_architecture_to_information_architecture

Kalmbach, James: Designing Web Navigation. Sebastopol, CA: O'Reilly & Associates,2007

Krug, Steve: Don‘t make me thiink! Indianapolis: Macmillan, 2000

Rosenfeld, Louis Rosenfeld und Peter Morville: Information Architecture for the World Wide Web. Sebastopol, CA: O'Reilly & Associates, 1998

Shiple, John: Information Architecture Tutorialhttp://webmonkey.wired.com/webmonkey/design/site_building/tutorials/tutorial1.html einführender E-learningkurs

Weiterführende Links:

The Information Architecture Institutehttp://iainstitute.org/en/

University of Minnesota: Web Design Referenceshttp://www.d.umn.edu/itss/support/Training/Online/webdesign/architecture.html

Semesterapparat Spree: IWS WM 1–3: Informationssysteme und -dienstleistungen http://semapp.bbt.haw-hamburg.de/index.php

Spree WS 2009/2010Spree WS 2009/2010

Spree WS 2009/2010



http://webmonkey.wired.com/webmonkey/design/site_building/tutorials/tutorial1.html











http://iainstitute.org/en/

Spree WS 2009/2010 Informationsarchitektur (digitale) Informationsräume strukturieren und...

Documents

Transcript of Spree WS 2009/2010 Informationsarchitektur (digitale) Informationsräume strukturieren und...