Stapelkamp Web X.0

Erfolgreiches Webdesign und professionelle Webkonzepte. Gestaltungsstrategien, Styleguides und Layouts für stationäre und mobile Medien
1. Auflage 2010
ISBN: 978-3-642-02072-8
Verlag: Springer
Format: PDF
Kopierschutz: 1 - PDF Watermark

E-Book, Deutsch, 575 Seiten

Reihe: Computer Science and Engineering (German Language)

Mit diesem Buch werden professionelle Webkonzepte für erfolgreiches Webdesign beschrieben und das Zusammenwirken von Designmethodiken, Informationsarchitektur und Designmanagement aufgezeigt. Es werden sowohl Gestaltungs- als auch Planungsaufgaben vorgestellt und die Zusammenhänge einer Designertätigkeit mit Konzeptions- und Unternehmungsberatung detailliert erläutert.

Wissenschaftliche Auseinandersetzungen und Analysen übersetzt der Autor dabei in direkt anwendbare medienspezifische Gestaltungsmethodiken und beschreibt geeignete Konzepte und Produktionsabläufe.Servicedesign bzw. Experience Design sind dabei die übergeordneten Themen. In diesem Zusammenhang werden die wesentlichen Strategien und Gestaltungskonzepte beschrieben, die erst mit dem Web 2.0 und Web 3.0 aufkamen: "Mitmach-Internet", "Semantisches Internet", "Semantische Suche", "Metadaten", "Microformats", "Augmented Reality", "Ubiquitous Computing" etc.

Weiterführende Informationen zum Thema finden Sie hier:www.designismakingsense.de

Autoren/Hrsg.

Stapelkamp, Torsten

Inhaltsverzeichnis

1;1EinführungForm und Funktion;9
2;2 Wahrnehmung;14
2.1;Gesichtsfeld;20
2.2;Räumlichkeit;22
2.3;Nähe;23
2.4;Geschlossenheit;23
2.5;Aufmerksamkeit;24
2.6;Erkennbarkeit;25
2.7;Kontext;26
2.8;Plastizität;26
2.9;Figur und Grund;27
2.10;Auffälligkeit;28
2.11;Intensität;28
2.12;Ähnlichkeit;29
2.13;Abweichung;29
2.14;Mustererkennung;30
3;3 Farbe;32
3.1;3.1;33
3.2;3.2;33
3.3;3.3;37
3.4;3.4;39
3.5;3.5;40
3.6;3.6;42
3.7;Dithering;44
3.8;3.7;46
3.9;3.8;47
3.10;3.9;48
3.11;Simultankontrast;48
3.12;Komplementärkontrast;50
3.13;Farbe-an-sich-Kontrast;52
3.14;Quantitätskontrast;54
3.15;Bunt-Unbunt-Kontrast;56
3.16;Hell-Dunkel-Kontrast;58
3.17;Kalt-Warm-Kontrast;60
3.18;Qualitätskontrast;62
3.19;3.10;64
3.20;Druckerzeugnisse;65
3.21;Fernseh-Röhrenmonitor;66
3.22;Plasmamonitor;67
3.23;Computer-Röhrenmonitor;67
3.24;Liquid Crystal Display (;68
3.25;Anzeigetafeln, Displays;69
3.26;Architektur als Medium bzw. Display;70
3.27;3.11;76
3.27.1;3.11.1 Farbkodierung – Farbe als Symbol;76
3.27.2;3.11.2 Farbkodierung – Farbe als Struktur;80
3.27.3;3.11.3 Farbkodierung – Farbe für Funktionsabläufeund Funktions zustände;81
3.27.4;3.11.4 Farbkodierung – Farbe zur Benutzerführung;82
3.27.5;3.11.5 Farbkodierung – Farbe und Kontrast;84
3.27.6;3.11.6 Farbbedeutung;86
3.27.7;3.11.7 Farbe, Text und Hintergrund;88
3.27.8;3.11.8 Farbenfehlsichtigkeit;90
3.27.9;3.11.9 Visualisierung von Farbenfehlsichtigkeit;92
3.28;Regeln und Tipps zum Gebrauch von Farbe beim Screenund Interfacedesign;94
4;4 Typografi e;96
4.1;4.1;97
4.1.1;serifenbetonte Schriften;98
4.1.2;Antiquaschriften;98
4.1.3;Groteskschriften;99
4.1.4;themenspezifische Schriften;99
4.2;4.2;102
4.3;4.3;103
4.4;4.4;104
4.5;4.5;105
4.6;4.6;106
4.7;4.7;107
4.8;4.8;110
4.9;4.9;114
4.10;Fernseh-Monitor;116
4.11;Computermonitor;122
4.12;Medizinische Geräten;124
4.13;Produktionsmaschinen;125
4.14;Multimediakioske;126
4.15;Mobile Geräte;128
4.16;Mobiltelefone;130
4.17;e-Paper;131
4.18;LED-Informationsdisplays;132
4.19;Architekturfassade;133
4.20;4.10;134
5;5 Projektentwicklung –Workfl ow;140
5.1;5.1;143
5.2;5.2;144
5.2.1;5.2.1 Kriterien für das Pflichtenheft;145
5.3;5.3;147
5.3.1;5.3.1 Scrum – Projektmanagement auf Basis von Zeitmanagement;148
5.3.2;5.3.2 Designprozess/Problemlösung;151
5.3.3;5.3.3 Zeitplanung/Tabelle;152
5.3.4;5.3.4 Kostenkalkulation;154
5.3.5;5.3.5 Software für Projektmanagement – CRM, ERP;159
5.3.6;5.3.6 Hilfsmittel für die Projektentwicklung;163
5.4;5.4;169
5.4.1;5.4.1 Benutzerprofil;169
5.4.2;5.4.2 Polaritätsprofil;170
5.5;5.5;174
5.5.1;5.5.1 Moodboard;174
5.5.2;5.5.2 Farbschema;178
5.6;5.6;182
5.6.1;5.6.1 Exemplarische Flowcharts;186
5.6.2;Hinweise und Empfehlungen zur Erstellung eines Flowcharts;198
5.7;5.7;199
5.8;5.8;211
5.9;5.9;219
5.9.1;Gründe für ein Funktionslayout und seine Vorteile;218
5.9.2;5.9.1 Drehbuch;219
5.9.3;5.9.2 Exposé;219
5.9.4;5.9.3 Treatment;219
5.9.5;5.9.4 Das literarische und das technische Drehbuch;219
5.9.6;5.9.5 Storyboard;220
5.9.7;5.9.6 Die äußere Form des Drehbuchs;226
5.10;5.10;228
5.11;5.10.1 Fläche;228
5.12;5.10.2 Format;229
5.13;Goldener Schnitt;230
5.14;Fibonacci-Zahlenfolge;230
5.15;Format;231
5.16;Display-Formate;232
5.17;softwarebedingte Formate;234
5.18;5.10.3 Raster/Layout-Framework;236
5.19;8 × 8 Pixel Submatrix;240
5.20;960Pixel-System;242
5.21;5.10.4 Komposition;246
5.22;5.10.5 Dynamik mit System;274
5.22.1;5.11;284
5.23;5.11.1 Styleguide für Funktionssoftware;286
5.24;GNOME;286
5.25;KDE;286
5.26;Mac OS X;286
5.27;Palm OS;287
5.28;Java;287
5.29;Windows Vista;287
5.30;Styleguide für Informationssoftware;288
5.31;Passepartout;288
5.32;www.bundesregierung.de;292
5.33;Gebote und Kriterien für einen Styleguide;306
5.34;Anhaltspunkte zur Erstellung eines Styleguides und mögliche Bestandteile;306
5.35;5.12;308
5.36;Gebote, Tipps, Eigenschaften und Voraussetzungen barrierefreier Angebote;314
5.37;5.12.1 Barrierefreie Automaten und interaktive Multimediakioske;316
6;6 Screendesignbeispiele;318
6.1;6.1;321
6.1.1;6.1.1 Layout;321
6.1.2;6.1.2 Inhalte;322
6.1.3;6.1.3 Orientierung;324
6.1.4;6.1.4 Anreize, Motivation;330
6.1.5;6.1.5 Auswahl- und Interaktionsmöglichkeiten;334
6.2;6.2;342
6.2.1;Fernsehfernbedienung;344
6.2.2;Desk Tools;346
6.3;6.3;348
6.3.1;JODI;348
6.3.2;shiftcontrol;350
6.3.3;[kleine welt];352
6.3.4;JetBlue Check-in-Terminal;354
6.3.5;MetroCard;356
6.3.6;Navigationsgeräte;358
6.3.7;Computer-Betriebssysteme;359
6.4;6.4;362
6.4.1;Perspektive und Raumdarstellung;363
6.4.2;Murphys Loch;364
6.4.3;Schöne Heimat;366
6.4.4;1944: Operation Teddybär;370
6.4.5;Myst;372
6.4.6;The Endless Forest;374
6.5;6.5;378
6.5.1;Antizipation;380
6.5.2;Verbrechen der Wehrmacht;382
6.5.3;Made in MTL;384
6.5.4;Nanoreisen;386
7;7 Web 1.0;388
8;8 Web 2.0 –Das Mitmach-Internet;396
8.1;8.1 Web 2.0 – Soziale Netzwerke;398
8.1.1;Wikipedia;398
8.1.2;mySpace;398
8.1.3;del.icio.us;398
8.1.4;mevio;399
8.1.5;flickr;399
8.1.6;XING;399
8.1.7;YouTube;399
8.2;8.2;416
8.3;8.3;418
8.4;8.4;422
8.5;8.5;423
8.6;8.6;436
8.7;8.7;440
8.8;8.8;444
8.9;8.9;461
8.10;8.10;464
9;9 Web 3.0;474
9.1;9.1;476
9.2;9.2;484
9.3;9.3;489
9.4;9.4;490
9.5;9.5;491
9.6;9.6;493
9.7;9.7;506
9.8;9.8;510
9.9;9.9;517
9.10;9.10;518
9.11;9.11;525
9.11.1;Protosphere;547
9.11.2;Entropia Universe;547
9.11.3;Active Worlds;547
9.11.4;OpenSimulator;548
9.11.5;web.alive;548
9.11.6;Forterra OLIVE Plattform;548
9.11.7;Qwaq Forums;549
9.11.8;There;549
9.12;9.12;551
9.13;9.13;556
10;10 Anhang;560
10.1;10.1;561
10.2;10.2;562
10.2.1;10.2.1 Haftungsausschluss für Dateien und Programme;562
10.2.2;10.2.2 Verweise und Links;563
10.3;10.3;564
10.4;10.4;565
10.4.1;Corporate Identity / Corporate Design;565
10.4.2;Farben, Farbwirkung, Farbbedeutung;565
10.4.3;Informationdesign, Leiten und Orientieren;565
10.4.4;Interactiondesign, Interaktivität;566
10.4.5;Interfacedesign;567
10.4.6;Konzeptentwicklung;569
10.4.7;Lehr-/Lerntheorie;569
10.4.8;Marketing;569
10.4.9;Medientheorie;570
10.4.10;Ontologie;571
10.4.11;Projektmanagement;571
10.4.12;Screendesign;571
10.4.13;Semantic Web;572
10.4.14;Semiotik;572
10.4.15;Typografie, Layout;573
10.4.16;Usability;573
10.4.17;Visualisierung;573
10.4.18;Wahrnehmung;574
10.4.19;Web 2.0;574
10.4.20;Web 3.0;575
10.4.21;Zeichen, Symbole, Icons;575
10.5;10.5;576