document

Dokumentation Zwischenprüfung im Sommersemester 2010

Interfacedesign und Gestaltung eines fiktiven Outernetkonzepts

als Leitsystem im Kölner Central Business District

eine Arbeit von Andreas Jungen

Zwischenprüfung

Interfacedesign und Gestaltung eines fiktiven Outernetkonzepts

als Leitsystem im Kölner Central Business District

eine Arbeit von Andreas Jungen

Betreuung: Herr Robert van Leeuwen

IB-Hochschule Berlin | Fakultät für Kulturwissenschaften | Studiengang Kommunikation

04

06 Einleitung

08 Definition des Terminus „Outernet“

10

14

16

18

20

22

2222242614

15

10

12

28

30

32

34

Definition eines AR-Systems

Augmented Reality

Stand der Technik Aktuelle Phase Zukunftsvision

Reiseführung als Leitsystem

Klassische Rundgänge

Problematik

Bezug auf Kölns CBD

Der elektronische Stadtführer

Problematik

Mein Softwarekonzept

Thematik

Anzeigegerät

Funktionsumfang einer App

Attribute des Iphone-Displays

Unternehmenslogo

Elemente des Logos Reduktion auf Grundelemente Ikonisches Zeichen Produktname

Schriftschnitte

Farbkonzeption

Proportionierung

Technische Hintergründe

Inhalt

05

38

38

40404244485052

5456

54

Gestaltung des Interface

Einführung in die Thematik

Elemente des „agonic“-Interface Raumordnung Piktogramme Menüführung Routenplanung GPS-Radar Schriftfamilie

Bedienung Usability Umfrage (Gestaltung eines Umfragebogen)

58

65

66

58

60

60

61

Above-the-line Marketing

Konzeption

Headline

Grafische Ebene

Anordnung der Elemente

Schlussbetrachtung

Quellennachweis

der Suche nach Antworten führten mich auch in die besagte Stadt meines Studienstandortes Köln. Chaos sollte in diesem Zusammenhang wohl besser großgeschrieben werden, denn das größte Schild gewinnt in diesem Fall zwar nicht den Preis für die beste Gestaltung, aber für den größten Mitläufer des Monats. Vielleicht müsste man sogar sagen des Jahres, denn die Entwicklung eines geeigneten Leitsystems für eine Metropole wie die Stadt am Rhein, stellt die meisten Gestalter wohl vor eine ernst zu nehmende Entwicklungsarbeit, sofern sie nicht den Fehler ihrer Vorgänger machen wollen. Entwicklungsarbeit leistete ich an anderer Stelle. Ich machte mir Gedanken, wie man dieses Problem lösen könnte. Die größten Schwierigkeiten hat der Tourist einer fremden Stadt. Wenn dieser ortsfremd ist und sowieso schnell den Überblick verliert, findet er sich noch schlechter zurecht, als derjenige, der bereits Ortskenntnis besitzt und somit nicht auf alle Schilder angewiesen ist. Ich fokussierte mich deshalb auf diese Gruppe von Menschen, versuchte

06

Einleitung

Die Ausgangsfrage, welche vor und während des Lesens meiner Thesis im Hinterkopf behalten werden sollte, ist die tiefgründige Frage nach dem Sinn einer Innovation. Wäre der Mensch nicht besser aufgehoben, wenn geistreiche neue Erfindungen zukünftig Sache einer übergreifenden, höheren Instanz seien? Deutschlands Schilderfassade beispielsweise braucht definitiv einen neuen Anstrich. Doch wessen Aufgabe ist die Entwicklung einer Lösung, die das Problem der öffentlichen Junglebildung geschickt umgeht? Jeder packt seine Erneuerung vor die seiner Vorgänger. Zuerst war allein die Beschilderung zur Straßenverkehrsordnung, dann ein Wegweiser zum Bahnhof, eine Cafétour durch Kölns Innenstadt, zusätzlich die Markierung prägnanter Wegabschnitte entlang einer Jogger-Route am Rhein. Zuviel für die Gewährleistung einer gesunden menschlichen Wahrnehmung. Das Stoppschild wurde bei der Planung geeigneter innerstädtischer Leitsysteme übersehen. Meine zahlreichen Spaziergänge auf

zu verstehen wie sie ihre Umgebung wahrnehmen, welche Probleme bereits bestehen und welche Lösungen in Erwägung gezogen werden könnten. Schnell wurde mir bewusst, dass etwas Neues entwickelt werden musste. Ich durchstöberte das Internet nach Trends und Forschungserfolgen bezüglich mobiler Multimedianutzung und wurde fündig. Die Zukunft heißt virtuelle Realität. Weg vom Computer soll es möglich sein, technische Hilfsmittel dazu zu nutzen, die reale Umgebung besser wahrnehmen zu können. Gegenwärtige Geräte wie Smartphones könnten mit Hilfe innovativer Software, dem Internet als Datenbank und dem System der globalen Positionierung (nachher kurz GPS) das Schilderchaos beseitigen. Die Idee: Jeder User wählt sein benötigtes Leitsystem aus und das Smartphone lenkt ihn, mit einer ähnlichen Technik wie der in handelsüblichen Navigationssystemen, von A nach B. So einfach ist es dann leider doch nicht, denn um eine gewisse Präsenz von Weiterentwicklung zu verkörpern, muss

das neu entwickelte System Gimmicks besitzen, die bislang noch nirgends zu finden sind. Mein Konzept führt den Reisenden nicht nur von A nach B, sondern besticht durch eine simple Steuerung, die es dem Benutzer ermöglicht, alle im Umfeld des Betrachters befindlichen Gebäude namentlich zu erfassen und weitere Informationen zu liefern. So wird die klassische Stadtführung überflüssig, der Tourist umgeht das Chaos der komplizierten Leitsysteme und kann zudem individueller die Stadt erkunden.

07

bezüglich Interaktion und Kommunikation mit Hilfe technischer Mittel, wäre der Verzicht auf die Trennung zwischen Web und Realität. Es gibt Möglichkeiten, mit Hilfe spezieller Software und funktionstüchtiger Maschinerie die Realität technisch so zu ergänzen, dass virtuelle Elemente dort angezeigt werden können. Könnte man beispielsweise einen Stadtplan entwickeln, der seine Informationen aus dem riesen Speicher des Web bekommt, zudem den Menschen auf einer Stadtführung real greifbar begleitet, so wäre eine Brücke zwischen dem Internet und der realen Welt geschaffen. Das Internet ist fortschrittlich, denn ein System welches Milliarden verknüpfte Datenmengen organisieren kann, die ganze Welt miteinander verbindet und zudem mit Hilfe geeigneter Mittel überall präsent ist, gibt es bislang kein zweites Mal. Nutzt man diese Datenbank und verbindet sie mit der Realität, entwickelt sich ein neues System, welches heute schon als Outernet-Konzept betitelt wird. Das Net geht sinngemäß hinaus aus dem virtuellen Raum und rein in das reelle Leben der Menschen2.

08

1 siehe Tim O‘Reilly, Was ist Web 2.0? Entwurfsmuster und Geschäftsmodelle für die nächste Software Generation, vgl. http://www.oreilly.de/artikel/web20_trans.html [12.06.2010]

2 siehe WELT KOMPAKT, Die Zukunft des Internet heißt Outernet, vgl. http://www.youtube.com/watch?v=ouvWaHYuNB8&feature=related [13.06.2010]

Definition des Terminus „Outernet“

„Das Web ist nicht länger eine Welt für sich - das Web ist die Welt!“1 , so definierte der Softwareentwickler und Begründer des Web 2.0 Tim O‘Reilly, seine Vorstellung der Entwicklung des Internets. Bislang galt das Internet als Plattform für elektronische Kommunikation zwischen Menschen, sei es im Austausch von Schriften, Video oder Audio. Zwar waren und sind die Inhalte des Internets in den meisten Fällen real und fassbar, das Internet an sich ist aber eine virtuelle Einrichtung. Es funktioniert nur mit Hilfe von Maschinen wie Computern und Providern. Eine neue Vision, die heute bereits technisch umsetzbar ist, ist der Gedanke an eine virtuelle Realität. Der typische Internetuser sitzt meist stundenlang vor seinem Rechner und durchforstet das Web zur Befriedigung seines Informationsdurstes. Dabei merkt er selten, dass er sich immer weiter von der Realität entfernt. Das Leben beschränkt sich auf virtuelle Kontakte und ungreifbar weitentfernte Objekte. Natürlich kann man das Internet auch sinnvoller nutzen. Die zahlreichen Onlineshops, Blogs und Videotutorials sind kontextbezogen nicht weit von der Realität entfernt. Dennoch bleibt das Internet eine Welt für sich. Der technische Fortschritt

09

Eine Übersicht über die künftige Entwicklung des Internets und deren Erweiterungen.

vgl. http://blog.trendone.de/ [17.08.2010]

zu verbessern, dass virtuelles, reelle Eigenschaften enthält, ist kritisch gesehen aber nichts weiter als eine Täuschung des Menschen. Zwar ist realistisch, dass sich die Technik im Laufe der Zeit immer weiter in Richtung reale Virtualität entwickeln könnte; doch einen Nutzen daraus zieht der Mensch kaum. Man muss also eine Möglichkeit finden, den realen Raum virtuell nutzbar zu machen. Diese Idee bezeichnet man als „Augmented Reality“, was übersetzt soviel bedeutet wie „erweiterte Realität“. Unsere reale Umgebung wird mit Hilfe von Computertechnik so erweitert, dass sich neue Horizonte öffnen. Handys beispielsweise funktionieren bereits in der realen Welt. Sie sind zwar technische Geräte, erweitern die Realität in sofern, als das sie dem Menschen neue Kommunikationsmöglichkeiten bieten, die seine Umgebung ergänzen.

10

3 siehe Ralph Baer, Der (Ping)Pong-Erfinder, vgl. http://www.3sat.de/page/?source=/neues/sendungen/magazin/123467/index.html [13.06.2010]


Alles begann vor mehr als 30 Jahren mit der Erfindung des Pong. Bis zu diesem Zeitpunkt wurde Freizeit, sei es Ping Pong oder jegliche andere Sportarten an der frischen Luft fabriziert, strengte den Körper an, machte zugleich aber fit und vital. In den 70iger Jahren verknüpfte die Firma „Atari“ diesen Freizeitsport mit technischer Raffinesse und schaffte eine Verbindung zwischen Computertechnik und dem Drang nach Unterhaltung3. Diese neue Form des Entertainments projizierte ein Videospiel auf einen Fernseher oder ein Computerdisplay und setzte damit den Grundstein für eine virtuelle Welt. Im Laufe der Jahre wurde diese Parallelwelt eine immer realere. Durch verbesserte Technik in den Computern und immer hochauflösendere Grafiken, gelingt es den Entwicklern immer besser, reale und virtuelle Elemente miteinander zu verbinden. Die Technik so

Augmented Reality

11

Quelle: http://www.slipperybrick.com

Webcam halten und der Spieler wird, auf der Karte stehend, am Computer sichtbar5. Mobil ist die Nutzung der Idee einer erweiterten Realität ebenso umsetzbar. So entwarfen Softwareentwickler eine einmalige Route durch London, die Beatle-Fans eine interaktive Führung entlang der Lieblingsplätze der Band vorgibt. Interessierte laden sich zuvor die Software auf ihr Smartphone und können mit Hilfe ihrer Handykamera ein erweitertes Bild, ähnlich dem des Fußballspiels, einschalten. Absolutes Highlight der innovativen Reiseführung ist die Tatsache, dass zeitweise auf dem Kamerabild die Musiker sichtbar werden. Sie laufen quer über die Straße und grüßen freundlich, verschwinden anschließend in ihrer Lieblingskneipe. Natürlich kann man diese 3D Charaktere der Beatles nur virtuell wahrnehmen, doch der reale Raum der virtuellen Bühne ist die Straße auf der die Fans gerade stehen6. Das ist ein Erlebnis, welches es kein zweites Mal gibt. Diese drei Beispiele zeigen exemplarisch, was heute bereits möglich ist.

12

4 siehe Ronald Azuma (HRL Laboratories), Recent Advances in Augmented Reality, S. 42

5 siehe Kevin Bonsor, How Augmented Reality Works, S. 2

6 vgl. http://www.augmentreality.co.uk/blog/augmented-reality-featurin-the-beatles.html [15.08.2010]


Schon heute finden sich erste Entwicklungen hin zur virtuellen Realitätserweiterung. Beispiel: Jedes Fußballspiel wird virtuell erweitert4. Der Fußballfreund im Stadion nimmt das Spiel anders wahr, als der Mensch vor dem Fernseher. Dieser sieht nämlich, den zusätzlich im oberen Bildschirmbereich eingeblendeten Torstand. Die Kamera im Stadion zeichnet das Spiel auf und sendet via Funkübertragung die Daten live an eine Sendestation. Diese fügt zum Bild ein Interface hinzu, welches den Zuschauer mit weiteren Informationen versorgt. Das reale Bild des Fußballspiels wird erweitert. Dieses Beispiel ist eine einfache Form der virtuellen Realitätserweiterung.Unsere gegenwärtige Technik kann heute schon weit aus kompliziertere Verknüpfungen realisieren. Eine US-amerikanische Firma namens „Total Immersion“ entwickelte eine Software, welche mit Hilfe einer Webcam und einer speziellen Baseballcard einen virtuellen Baseballspieler zeigt, der zwar real unsichtbar ist, doch auf dem Bildschirm als 3D Spieler Würfe und Schläge wie seine realen Vorbilder ausführt. Der Kartenbesitzer muss dazu einfach seine Karte in die

Stand der Technik

Aktuelle Phase

Leitsysteme mehr, teure Beschilderungen fallen weg, Schaufensterbeleuchtungen, Diebstahlschutz, alles würde überflüssig werden. Ein neuer Markt an Dienstleistungen wird sich erschließen. Wenn ich als Tourist in einer fremden Stadt bin, schalte ich einfach das Touristen Leitsystem an und finde schnell meine Ziele und Reisewünsche. Der Graffitikünstler sucht sich eine Wand und fängt an mit virtuellen Farben auf diese zu sprühen. In einem Onlineforum postet er die Koordinaten seiner Werke und teilt die Information mit Interessierten. Diese können, je nach Belieben, seine Arbeit in ihrer virtuellen Welt ein oder ausblenden. Denkbar wären auch Schaufenster, die virtuelle Gegenstände präsentieren. Zwar wären diese nicht haptisch greifbar, doch Schaufenster unserer Generation stellen bekanntlich ja auch nur zur Schau. Ganze Kaufhäuser könnten so funktionieren. Heutzutage steigen die Verkaufszahlen über Onlineshops immer rasanter an. Das Wort der Zukunft heißt: Virtuelle Realität. Solche Beispiele der visuellen Wahrnehmung bieten grenzenlose Möglichkeiten und wären theoretisch heute schon technisch umsetzbar.

13

Zukunftsvisionen existieren so lange es uns Menschen gibt. Eine rege Phantasie ist die Grundvoraussetzung für eine Vision, die zukünftig vielleicht Realität sein könnte. Jeder Mensch hat einen anderen Eindruck und Vorstellungen von seiner Zukunft, sei sie dystopisch oder Utopie. Deshalb möchte ich in diesem Unterpunkt nur meine eigene Vorstellung formulieren: Die Entwicklung einer virtuellen Realität birgt in meinen Augen immense Vorteile. Sie könnte zukünftig dazu beitragen, die Welt besser zu strukturieren. Man stelle sich eine Stadt vor, die ohne Werbung auskommt. Weiße Fassaden, keine grellen Schriftzüge, leere Schaufenster und eine kühle, puristische Umgebung prägen das Bild der Metropolen der Zukunft. Schaltet der Mensch aber seine virtuelle Sehhilfe ein, öffnet sich ihm eine neue Welt. Er befindet sich zwar körperlich in der selben Umgebung, doch er taucht in eine bunte, neue Landschaft. Vorteile: Wirtschaftlich spart diese Maßnahme Unmengen an Geldern. Es wird keine Druckerei mehr benötigt, die große Plakatwände produziert, kein Ordnungsdienst, der Graffiti auf Wänden entfernen muss, keine

Zukunftsvision

und Informationstafeln offenbaren detailliertere Auskunft. Diese drei Punkte treten als System auf. Sie sind ein in sich geschlossenes, geordnetes und gegliedertes Ganzes8. Die Wahrnehmung als geschlossene Einheit dieser Systeme ist von höchster Priorität (vgl. Einheitsregel9). Ein Beispiel: Der Tourist muss erkennen, dass es sich bei der braunen Wanderroute um dieselbe handelt, die auch auf der Karte eingetragen ist und zu der er in seinem Reiseführer zuvor Informationen fand. Somit muss eine Art Corporate Design geschaffen werden, welches Wiedererkennung gewährleistet und den Touristen weder verwirrt, noch zu falschen Plätzen führt. Durch eine einheitliche Gestaltung soll das Erfassen der Inhalte erleichtert werden. Die Form, Farbwahl und eventuell verwendete Piktogramme oder Symbole müssen zusammen passen und sollten sich von anderen Leitsystemen unterscheiden.

14

7 siehe Dr. Hartmut Rein, Funktion und Aufbau touristischer Leitsysteme, S. 8ff

8 siehe Dr. Hartmut Rein, Funktion und Aufbau touristischer Leitsysteme, S. 13

9 siehe Verkehrsclub Deutschland, Wegweisungssysteme für den Fußverkehr, S. 2

Reiseführung als Leitsystem

Die klassische, zielorientierte Wegweisung kann entweder mit einer ortskundigen Person als Führer koordiniert werden oder der Tourist orientiert sich an Schildern und schafft einen Überblick mit Hilfe geeigneter Karten. Beide Möglichkeiten sind klassische Varianten, um als Ortsfremder eine Stadt zu erkunden. Hauptziel hierbei ist das Schaffen einer Orientierungshilfe vor Ort und das Informieren des Interessierten durch Wissen des ortskundigen Begleiters oder Informationsübertragung mit Hilfe von Infotafeln7. Generell sollten Informationen möglichst gebündelt vermittelt werden. Lediglich die Tafeln haben eine größere Informationsfülle und liefern bei Interesse eine tiefere Informationsdichte, die zudem in ausführlicherer Textform vorliegt. Ein Leitsystem als Reiseführung besteht somit aus drei elementaren Funktionen. Eine Karte schafft den Überblick, Schilder leiten den Touristen durch die Stadt

Klassische Rundgänge

15

10 vgl. http://www.rp-online.de/duesseldorf/ratingen/nachrichten/ratingen/Konzept-gegen-Schilder-Chaos_aid_715534.html [15.08.2010]

oben: Schmierereien und Schilderchaos sind allgegenwärtig in Kölns City.

unten: Verschmutzte Infotafel am Kölner Rheinufer

Wem der Begriff „Schilderwald“ nicht geläufig ist, der kennt wohl Deutschlands Chaos im Städteleitsystem noch nicht. Die oben beschriebene klassische Touristenführung innerhalb deutscher Städte sieht in der Praxis anders aus, als es theoretisch dargestellt wird. Ein Problem welches zwangsläufig zur Schilderüberwucherung unserer Straßen und öffentlichen Verkehrsräume führt, ist die Tatsache, dass es nicht nur touristische Leitsysteme gibt, sondern für fast alles eigens entwickelte Beschilderungen und Informationen angebracht werden. Das man irgendwann den Überblick verliert, ist geradezu offensichtlich10. Der Ortsfremde hat ein noch viel größeres Handicap, denn er ist auf eine einfache Leitung angewiesen. Um das Problem zu lösen, müsste ein System entwickelt werden, welches überflüssige Beschilderungen ausblendet und nur die für den Touristen von Bedeutung notwendigen Informationen darstellt.

Problematik

16

11 vgl. http://www.koelntourismus.de/stadtfuehrungen/oeffentliche-fuehrungen/i-guide-stadtrundgang-mit-kopfhoerer.html [15.08.2010]

Bezug auf Kölns CBD

„Elektronische Reiseführung für Individualisten“, so wirbt der Hersteller für sein Produkt. Auf einer circa 100 minütigen Route quer durch die Kölner Innenstadt können Reisende Informationen zu 47 Orten abrufen. Die Führung kann zeitlich nach den Bedürfnissen des Touristen angepasst werden. Wünscht dieser ein längeres Verweilen an einer für ihn besonderen Sehenswürdigkeit, kann er das Gerät pausieren. Nach vier Stunden muss der elektronische Reiseführer, der sogenannte iGuide, wieder zurückgebracht werden. Man kehrt hierfür zum zentralen Infocenter „KölnTourismus“ zurück, liefert den iGuide ab und bekommt im Gegenzug seinen, als Pfand dienenden, Personalausweis wieder. Die Leihgebühren für diesen Zeitraum betragen 8 Euro11. Grundlage für die Software liefert ein Pocket PC-basierter PDA.

Zwar wirkt das Konzept gut und strukturiert, doch die Technik ist veraltet und unflexibel. Auf mich macht das iGuide-System keinen multimedial funktionalen Eindruck. Die Stadtführung ist zwar individueller, weil man keinem klassischen Touristenführer folgen muss, doch der Umfang und Umgang des Programms ist nicht zufriedenstellend.„KölnTourismus“ bietet in diesem Zusammenhang noch Alternativen für Touristen.Stadtführungen in und um Köln sollen dem Reisenden und kulturell Interessierten das Kölner Stadtleben näher bringen. Das Angebot ist groß, doch die Qualität der Führungen lässt zu wünschen übrig. Die Marktlücke eines Touristen-App für das Iphone ist noch ungenutzt. Dieses wäre für den Nutzer weit aus kostengünstiger und man spart Zeit durch das Wegfallen für Anmeldung und Warten auf den Reiseleiter. Zusammenfassend ist der iGuide zwar zielgruppenorientierter, als allgemeine Reiseführungen, doch technisch besitzt er nicht die Eigenschaften des fortschrittlichen Informationsaustauschs per Internet.

Der elektronische Stadtführer Problematik

17

Quelle: http://www.koelntourismus.de/

Die Software scannt mit Hilfe von GPS und dem Internet den aktuellen Standort. Die Website Wikipedia bietet des Weiteren eine riesige Datenbank mit Informationen und Koordinaten zu Gebäuden rund um die Welt. Eine Verbindung zwischen Standortscan und Datenaustausch mit dieser Datenbank ermöglicht eine routenunabhängige Informationsabfrage. Man wird zu jedem bekannten Gebäude Informationen bekommen können. Sitzt man beispielweise in einem Biergarten in der Kölner Innenstadt und fragt sich wann genau das gegenüberliegende Barockbauwerk erbaut würde, nimmt man sein Handy zu Hilfe, startet die Software und scannt dieses mit der eingebauten Kamera. Per GPS Standortsuche und Datenaustausch mit dem Internet erhält man binnen Sekunden die Antwort.

18

12 vgl. http://www.wikitude.org/ [15.08.2010]

Mein Softwarekonzept

Nachdem bereits einige AR-Lösungen für die Unterhaltungsbranche entwickelt wurden, schließe ich mich dem Grundgedanken der Iphone Softwarentwickler von „Wikitude“12 an und entwerfe ein Konzept für eine Applikation, die zukünftig Touristen einen multimedialeren Rundgang durch eine Stadt geben kann, als es bis jetzt bei der klassischen Stadtführung der Fall ist. Als angehender Kommunikationsdesigner entwerfe ich ein übertragbares Interface für eine selbst entwickelte Programmidee, das einfach, verständlich und übersichtlich gestaltet ist. Sowohl der Name des Unternehmens, Logogestaltung und Softwareoberfläche, sowie eine übersichtliche Funktionsordnung des Interface umfasst meine Konzeptarbeit. Innovativ ist eine Funktion, die die Iphone Applikation nicht ausschließlich in der Tourismusbranche bekannt machen könnte.

Thematik

19

Der Startbildschirm meiner Applikation im Format 1:1

Die Anzeigedisplays der verschiedenen Iphone Varianten unterscheiden sich augenscheinlich kaum voneinander. Ein 3,5“ Multi-Touch-Widescreen-Display schafft Übersichtlichkeit für Anwendungen und die Nutzung der Mobilfunkapplikationen. Grundlegende technische Änderungen, die für den Zweck meiner App wichtig scheinen, sind die Qualität der Auflösung des Displays, verschiedene Kontrastverhältnisse und die eingebaute Digitalkamera. Das neueste Modell der Iphone Reihe, namentlich mit Iphone 4 betitelt, besitzt ein hochauflösen-des 960 x 640 Pixel bei 326 Pixel pro Zoll Display. Ich arbeitete während der Entwicklung meiner App ausschließlich mit dieser Auflösung, da ansons-ten die notwendige Vergrößerung einer kleine-ren Auflösung auf das Iphone 4 Format zu einem Qualitätsverlust führen würde. Ob es sich bei dem Display um ein Retina-Display, ein LED, OLED oder anderes handelt, ist für eine fehlerfreie Anzeige irrelevant. Die Qualität der Kamera spielt eine weit aus wichtigere Rolle, denn eine niedrigauflösende VGA-Kamera, würde eine problemlose Nutzung der App nicht gewährleisten. Glücklicherweise besitzt

auch das erste Modell des Iphone eine 2 Megapixel Kamera, welche für diese Zwecke völlig ausreichend ist. Letzter Punkt ist der Touchscreen. Ohne diese Funktion wäre die Applikation unmöglich zu bedienen. Doch: Alle Iphone Anzeigegeräte ver-fügen über eine Bildschirmbedienung per Fingerdruck14.

20

13 vgl. http://www.youtube.com/watch?v=iEnw3bJuOPc&feature=player_embedded [15.08.2010]

14 vgl. http://www.apple.com/de/iphone/specs.html [10.06.2010]

Das Anzeigegerät

Eine App ist der Neologismus zum Wort Applikation. Im Laufe der Zeit hat sich diese Abkürzung durchgesetzt und steht seither stellvertretend für die Bezeichnung jeder kleinen Anwendungssoftware auf mobilen Kommunikationsgeräten13. In einem Onlineshop der Firma Apple Inc. finden sich zahlreiche nützliche Applikationen, die gegen eine produktabhängige Gebühr erworben werden können. Mittlerweile ist die Technik der mobilen Geräte so fortschrittlich, dass sogar 3D Spiele ruckelfrei angezeigt werden können. Hierbei handelt es sich lediglich um kleinere Unterhaltungsspiele, die zum Zeitvertreib dienen, die aber keine Konsole oder Computerspiele ersetzen können. Ähnlich umfangreich sind andere Applikationen. Stundenlange Unterhaltung oder umfangreiche Programmierungen sind bis dato ausnahmslos nicht vorhanden. Die Objective C++ Programmierung ermöglicht den Entwicklern zwar ein großes Maß an Möglichkeiten zur Softwareentwicklung, doch alleine die Tatsache, dass es sich beim Anzeigegerät um ein Handy mit geringer Displaygröße handelt, entkräftet momentan die Vision einer stundenlangen, bedienfreundlichen Handhabung.

Funktionsumfang einer App Attribute des Iphone-Displays

22

15+16 vgl. http://www.ewrite.de/mg/downloads/daten/pdf_operating/logogestaltung.pdf [10.06.2010]

17 vgl. http://www.designenlassen.de/hilfe/design-tipps-logo-design [10.06.2010]

18 vgl. http://www.designguide.at/logodesign.html [10.06.2010]

Unternehmenslogo

Das Logo setzt sich aus zwei primären Elementen zusammen. Zum einen aus einer Bildmarke und zum anderen aus der Wortmarke, welche zugleich der Name der Anwendungssoftware ist. Bei ihrer Gestaltung sollte Wert auf eine gute Reproduzierbarkeit15 gelegt werden. Aus diesem Grund verwende ich für das Signet ausschließlich Grundformen16 und reduziere die Arbeit soweit, dass eine möglichst einfache Wahrnehmung gewährleistet ist. So bleibt das Logo länger im Gedächtnis des Betrachters17 und kann auch mit komplizierten Drucktechniken produziert werden. Zwei Vorteile, welche wichtig für die gute Gestaltung eines Logos sind. Außerdem schaffen Grundformen wie Dreiecke, Kreise und Quadrate einen stärkeren Kontrast18 und bringen eine Spannung in das Signet.

Elemente des Logos

Reduktion auf Grundelemente

23

Das „agonic“-Logo, zerlegt in seine einzelnen Bestandteile

agonicnavigation

Die minimale Stauchung der vier Seiten ist sonst eher unüblich, schafft aber zusätzlich eine Distanz zu ähnlichen Produkten, da diese Bildmarken allesamt im quadratischen Raum liegen. Außerdem wirken die Pfeile so noch dynamischer, denn es scheint, als würden sie das Quadrat an seinen Ecken auseinanderdrücken. Der leichte Verlauf- und Reflexionseffekt ist ein Web 2.0 Element19. Er macht das Signet dynamischer, setzt eine Verbindung zur Welt der digitalen Medien und schafft die Anmutung eines dreidimensionalen Raums innerhalb des Quadrats.

24

19 vgl. http://www.designbote.com/102/web-20-buttons [15.06.2010]

Unternehmenslogo

Zu sehen sind vier Pfeile, welche scheinbar in die vier Ecken des Quadrats laufen. Dabei ist wichtig, dass sich die Pfeile nicht in die vier Himmelsrichtungen bewegen, da für das Auge sonst eine Art von waagerechter und senkrechter Statik entstehen würde. Mein Produkt soll Mobilität und Bewegung verkörpern. Ein statischer oder ruhiger Eindruck kontrastiert meine Umsetzung der diagonalen Spannung und wäre ungeeignet. Die Tatsache, dass dieses Produkt eine Applikation für das Iphone ist, soll schon im Logo erkennbar werden. Ich wählte das Quadrat, als typisches Formelement der zahlreichen Iphone-Apps.

Elemente des Logos

Ikonisches Zeichen

25

Die stark vergrößerte Bildmarke des Logos

umfangreich sein, dass jeder versteckte Winkel ausfindig gemacht werden kann. So gibt es keine Ecken mehr, die nicht entdeckt werden könnten. Ohne Winkel also. Zusätzlich zum Produktnamen gibt es eine nähere Bezeichnung. Diese befindet sich unterhalb des Wortes „agonic“ und weist eine deutlich kleinere Schriftgröße auf. Optisch beginnt der Zeilenanfang bei der Unterlänge des Buchstaben „g“ von „agonic“. Nach rechts ist viel Platz, damit gegebenenfalls auch längere Wörter ausreichend Raum haben. Sinn und Zweck dieser Unterzeile ist eine nähere Produktbezeichnung. In der Theorie gibt es zahlreiche Unterprodukte von „agonic“: „agonic navigation“, „agonic shopping“, „agonic cologne“,… Die Produktpalette lässt sich nach Belieben erweitern. Diese Option erlaubt Freiräume, die nicht zwingend notwendig sind, aber garantieren, dass bei einer Erweiterung kein neues Logo nötig ist.

26

20 vgl. http://www.dict.cc/?s=agonic+ [15.06.2010]

21 vgl. http://www.dict.cc/?s=agonic+line [15.06.2010]

Unternehmenslogo

Der Produktname „agonic“ ist ein englisches Wort und bedeutet übersetzt „ohne Winkel“20. Wichtig für weitere Schritte bezüglich Rechtslage und Markenschutz ist die Tatsache, dass dieser Begriff für einen ähnlichen Verwendungszweck noch nicht vergeben ist. Recherche diesbezüglich lassen mich zufriedenstimmen, denn „agonic“ taucht online in diesem Zusammenhang noch nicht auf. Lediglich die Wortkombination „agonic-line“ hat im Englischen eine Bedeutung, die oft im Internet zu finden ist. Ich distanziere mich zwar von diesem Begriff, seine Bedeutung könnte aber für die Bekanntmachung meiner Software günstig sein. Die „agonic-lines“ sind die englische Bezeichnung für die Breitengrade des Erdball21. Assoziationen hinsichtlich Navigation und Geografie liegen nicht weit auseinander, sodass sich dieser Begriff durchaus auf mein Produkt übertragen lassen würde. Der Zusammenhang zwischen der Übersetzung „ohne Winkel“ und meiner Applikation ist schnell erklärt. Die Applikation ist in erster Linie ein Leitsystem. Meine Idee: Die Software wird so

Elemente des Logos

Produktname

27

navigationagonic

28

22 siehe Die 100 besten Schriften, fontshop.de [17.06.2010]

23 siehe Frank Barth, Typografisches Gestalten von digitalen Displaymedien, S.8

Unternehmenslogo

Der Produktname ist in der Interstate condensed gesetzt. Ich wählte eine Grotesk Schrift, da diese deutlich besser als Displayschrift geeignet ist, als eine serifenbetonte Antiqua. Frei von Schnörkeln und Serifen ist meine Wahl auf einen serifenlosen Condensed-Schnitt der Interstate gefallen. Dieser hebt sich von der Gestaltung anderer Wortmarken im Bereich Navigation ab und schafft eine Verbindung zum eher kurzen Produktnamen. Der Condensed-Schnitt wirkt nicht statisch, denn der Buchstabe „O“ beispielsweise hat eine gestauchte Form, statt zweier Symmetrieachsen, die optisch jede Form von Bewegung rauben würde. Die Interstate ist außerdem seit Jahrzehnten im Gebrauch auf Schildern an US-Highways22 und stellt für Kenner den Bezug zu Fortbewegung und Navigation dar. Die untere Zeile steht im Schnitt der Schrift Myriad Pro23. Diese gilt ebenfalls als gute Displayschrift, da sie auch bei geringem Schriftgrad leicht leserlich ist.

Schriftschnitte

29

Antiqua-Schriftbeispiel – serifenlose Grotesk

werden. Dennoch wähle ich diesen Farbton, um eine Art von Dynamik und Bewegung zu erzielen. Dunkle und kühle Farben wirken eher starr und statisch. Eine ähnliche Aufmerksamkeit wie mein Logo erzielt das der Internetfirma „amazon.de“. Produktähnliche Marken wie navigon26 nutzen ebenfalls einen kontraststarken, gesättigten Orangeton, wenn auch mit einer deutlichen Tendenz in Richtung Rot. Dennoch distanziere ich mich typografisch und inhaltlich von diesen und beuge einer Verwechslungsgefahr vor.

30

24 siehe Terry Marks, Color harmony: Layout, S.227

25 siehe R. Klanten (Hrsg.), Der kleine Besserwisser-Grundwissen für Gestalter, 2. Auflage, S.12

26 vgl. http://www.navigon.com/portal/de/index.html [18.08.2010]

Unternehmenslogo

Das Logo besteht aus zwei Farben. Ein kräftiger Orangeton steht im Kontrast zu einem satten Schwarz24. Das Signet ist im sRGB-Farbton 255 150 0 (0 50 100 0; ffa 500) angelegt, nicht zuletzt, weil diese Farbe die Wärmste des Farbspektrums ist. Sie liegt in ihrem Gewicht zwischen der schwereren Farbe Rot und dem leichteren Gelb. So wirkt dieses Orange deutlich frischer und kräftiger, als es bei einer Dreikomponentenmischung der Fall sein würde. Allgemein formuliert symbolisiert die archetypische Wirkung des Orange Energie und Aktivität, aber auch Freude, Effizienz, Extrovertiertheit und Spaß25. Diese Wirkung ist natürlich eine subjektive Empfindung und sollte deshalb keinesfalls dogmatisch verstanden

Farbkonzeption

31

oben: Farbverlauf und Farbtonangaben

unten: ähnliche Logos bekannter Marken

sRGB 255 165 0

CMYK 0 50 100 0

#ffa500

sRGB 0 0 0

CMYK 100 100 100 100

#000000

32

27 siehe R. Klanten (Hrsg.), Der kleine Besserwisser-Grundwissen für Gestalter, 2. Auflage, S.44

Unternehmenslogo

Um nach Jan Tschichold ein möglichst harmonisches Gesamtbild der Logoelemente zu erreichen, sind die Wortmarke und Bildmarke im Verhältnis 5:8 angeordnet. Das schafft zusätzliche Spannung, verbindet das Signet mit der Wortmarke und macht das Logo interessanter27. Würde das Signet theoretisch mittig über die Wortmarke gesetzt werden, so wäre die Wirkung eine völlig andere. Statt Spannung zu assoziieren, würde das Logo nun statisch und bewegungslos wirken. Diesen Effekt wollte ich unter keinen Umständen erzielen.

Proportionierung

33

Das Logo wurde im Verhältnis „Goldner Schnitt“ gesetzt.

5 : 8

navigationagonic

geringe Kosten, da nicht zusätzliche Farben im Offsetdruck verwendet werden müssen. Ein guter Druck ist sowohl farblich, als auch schwarz-weiß möglich. So ist auf Kopien oder Faxen das Logo gut erkennbar, auch wenn es nicht in Farbe gedruckt wird. Letzter Punkt ist die Skalierung. Ein gutes Logo wird nicht als Pixelgrafik angelegt, sondern vektorisiert und ist deshalb ohne Qualitätsverlust beliebig groß skalierbar. Dieser Schritt zu Beginn der Arbeit verhindert späteren Nachbau des Logos, falls dieses größer skaliert abgebildet werden soll29.

34

28 vgl. http://www.designenlassen.de/hilfe/design-tipps-logo-design [18.08.2010]

29 siehe Peter Reichard, typosition scripts • Logogestaltung, S.1f

Unternehmenslogo

Reproduzierbarkeit spielt sowohl eine wichtige Rolle im Bereich der Logogestaltung, als auch in anderen Bereichen des Designs. Einige Regeln sind zu beachten, damit beim Logo spätestens im Druck keine Änderungen nötig sind. Erster Punkt ist die extreme Verkleinerung. Ein Logo muss auch als Werbung auf einem Kugelschreiber anzubringen sein28. „Agonic“ ist auch noch bei 2 cm Logogröße gut leserlich zu erkennen. Zweiter wichtiger Punkt ist das Thema Kosten. Die Druckkosten eines Logos sollten so niedrig wie möglich gehalten werden. Die Tatsache, dass lediglich zwei Farben verwendet werden, suggeriert

Technische Hintergründe

35

Eine sw-Umsetzung des Logos und die Wort-/ Bildmarke in extremer Verkleinerung

navigationagonic

37

Sinn und Wesen einer Sache sollten vom Design ausgedrückt, seine Funktion intuitiv sichtbar werden.

Professor Ferdinand Alexander Porsche

38


Die Schnittstelle, fachbegrifflich mit Interface bezeichnet, ist grundsätzlich nichts anderes als ein Verbindungsglied zwischen Mensch und Maschine. Die grafische Gestaltung seiner Benutzeroberfläche setzt ein gewisses Verständnis im Bereich Interaktionsgestaltung und Wahrnehmung voraus. Letzteres werde ich im folgenden Kapitel näher erläutern. Im Allgemeinen gibt es zwei Elemente des Interfacedesign. Auf der einen Seite der Mensch und seine Wahrnehmung, auf der anderen Seite der Computer mit seiner Softwareoberfläche, die mit Hilfe menschlicher Koordination, in diesem Fall ausschließlich der Hände, interagieren kann. Ich werde mich mit meiner Arbeit in den Bereich des Softwaredesigners wagen, mich hierbei aber auf Gestaltungselemente beschränken. Diese müssen natürlich theoretisch funktionieren und sollten deshalb möglichst funktional gestaltet sein, ohne dabei in die Tiefen der Programmierung einzutauchen.

Einführung in die Thematik

39

Umrisse des „agonic“-Interface zeigen die Struktur des Interface, ohne Texturen.

Intuitiv werden die meisten Anwender ihr Iphone während der Bedienung herunter nehmen. Wenn nun die Kamera weiter laufen würde, würde sie den Asphalt filmen. Abhilfe schafft der neue 3-Achsen-Gyrosensor30. Durch den Sensor registriert das Iphone automatisch, wenn das Gerät gedreht wird. Sobald sich zur Bedienung der Software die Lage des Iphone ändert, schaltet sich die Kamera aus und der Hintergrund färbt sich in einem dezenten Weißfarbton. Großer Vorteil bei diesem Gimmick ist eine Einsparung der Energie des Mobilfunktelefons, da die Kamera der größte Energieverbraucher während der Anwendung der Software ist.Das Grundgerüst des Programms sieht wie folgt aus: Der Hauptbildschirm ist in drei primäre Bereiche unterteilt. Der obere Teil grenzt an den zentrierten Inhalt-Bereich. Der Mensch ist gewohnt, Überschriften oberhalb des Fließtextes zu sehen. So macht es Sinn, den oberen Teil des Bildschirmes für gerade diese Überschriften zu nutzen. Ferner findet sich im

rechten Teil dieses Bereichs eine Art Radar, zu dem ich erklärend aber erst später kommen werde. Der zentrierte Content-Bereich31 bietet sowohl Platz für Fließtext, das Bild der Kamera und Eingabegeräte als auch für eine virtuelle Tastatur. Diese Funktionen lassen sich einzeln öffnen und nutzen den kompletten Raum des Content-Bereichs. Der untere Bereich hat ausreichend Raum für das Menü. Hier finden sich die Piktogramme zur Navigation der Software.

40

30 vgl. http://www.apple.com/de/iphone/specs.html [28.07.2010]

31 zu deutsch „Inhalt-Bereich“


Der Raum zur Gestaltung ist in meinem Fall sehr eingegrenzt. Aus diesem Grund ist es notwendig, die Gestaltungselemente günstig zu positionieren, ohne dabei einen Verlust der Benutzerfreundlichkeit in Kauf nehmen zu müssen. Die meiste Zeit wird der Anwender (User) das Programm in waagerechter Position nutzen. So wird gewährleistet, dass eine Art Panoramaaufnahme der Umgebung entsteht. Würde das Iphone statt horizontal waagerecht gehalten, so wäre der Bildausschnitt bedeutend kleiner. Für unser Auge ist ein 16:9 Querformat angenehmer, da sich unsere Wahrnehmung am Horizont orientiert. Eine gute Orientierung im Raum ist wichtig, damit die reale Wahrnehmung des Users und die Projektion der Umgebung mit der Videokamera möglichst nahe beieinander liegen. Die Anwendung wird somit ausschließlich waagerecht benutzt. Dabei unterscheidet die Software zwischen zwei Modi. Wenn der User die Umgebung mit Hilfe der Kamera scannt, sieht er im Hintergrund das Bild der eingebauten Digitalkamera.

Elemente des „agonic“-Interface

Raumordnung

für ungeübte Augen unleserlich erscheinen, gibt es sekundär noch die Möglichkeit einer auditiven Informationsübermittlung. Das Piktogramm „Hörfunktion“ öffnet eine Zeitleistennavigation, parallel liest eine Computerstimme den Text vor. Weiter rechts auf dem Bildschirm findet sich das Piktogramm einer Pinnnadel. Diese ermöglicht das Setzen einer Marke an einem Punkt, zu dem man später eventuell noch einmal zurückkehren möchte. Ähnlich wie es im Browser die Funktionen „Favoriten“ oder „Lesezeichen“ gibt, dient zu diesem Zweck auch die Funktion der Pinnnadel. Ebenso nützlich ist das Ikon „Route“. Bei Klick öffnet sich eine Übersicht von vorgefertigten Karten und Routen im Raum Köln. Mit Hilfe dieser Funktion ist es dem Interessierten möglich, eine themenbezogene Route auszuwählen. Wünscht er beispielsweise einen Rundgang mit dem Inhalt historische Bauwerke, so lenkt das System ihn automatisch zu den Wichtigsten. Die Bedeutsamkeit dieser Funktion in bezug auf die Stadtrundführung ist so substanziell, dass zu Beginn der Navigation gefragt wird, ob der User eine freie Routenführung wünscht, oder eine der Vorgeschriebenen in Anspruch nehmen wird. Entscheidet er sich für eine programmgesteuerte Führung, besteht im nächst rechten Ikon die Option eine Karte aufzurufen, die

überblickend eine Sicht des bisher zurückgelegten Weges präsentiert. Falls eine freie Stadterkundung im Interesse des Users liegt, gibt das „Auge-Piktogramm“ eine Übersicht über die aktuelle Umgebung des Anwenders. Zuvor definierte Favoriten sind in beiden Kartenversionen markiert. Vorletztes Ikon zeigt eine Lupe und dient zur routenunabhängigen Suche von Gebäuden oder Orten. Das System gleicht die Suchdaten mit der Wikipedia-Datenbank ab und ermöglicht so eine fundierte Grundinformation, die eventuell auftretende, routenunabhängige Fragen beantworten kann. Die Kritiker an der teils fraglichen Qualität der Sachinformationen von Wikipedia sind zahlreich, doch für eine Beantwortung einfacher Fragen reicht diese Onlinedatenbank völlig aus. Das Zahnrad Ikon steht sinngemäß als Synonym für Einstellungen. Dieses Piktogramm zeigt ein, sich aus und einfahrendes, Untermenü.

42


Die Gestaltung der Piktogramme zitiert das „agonic“ Logo. Zur Wiedererkennung sollte ein möglichst enger Bezug zum Produktlogo geschaffen werden. Ebenso taucht hier der Farbton Orange (255 165 0) erneut auf. Grafisch sind die Piktogramme mit einem leichten, weißen Verlaufseffekt gestaltet. Wie zuvor erwähnt wirken diese im Web 2.0 Stil plastischer und räumlicher, als bei einer einfarbigen Oberfläche. Das jeweilige Symbol ist im besten Fall selbsterklärend und hebt sich durch das prägnante Orange und dem 75 % Weiß vom Hintergrund ab. Dies ist notwendig, denn die Piktogrammoberfläche trennt sich optisch nicht vom Content-Bereich. Ein unruhiges Kamerabild, beispielsweise die Fassade des Kölner Doms oder die Abbildung von Bäumen, könnte sonst das Erkennen der Piktogramme erschweren. Die Bedeutung und Funktion der einzelnen Ikons wird nachstehend erklärt. Von links betrachtend, sieht der User eine Kamera abgebildet. Wählt er diese Option, ändert sich das Interface und bietet Fotofunktionen für Schnappschüsse der Umgebung. Unwichtige Funktionen, die hierfür nicht notwendig sind, werden ausgeblendet, sodass der Benutzer einen Bildschirm, ähnlich dem einer Digitalkamera hat. Das kleine „i“ steht für Information und liefert in schriftlicher Form nähere Auskünfte über das anvisierte Objekt. Sollte der Text


Piktogramme

43

Diese Übersicht über die Funktionen der Piktogramme könnte auch als Anleitung Verwendung finden.

Kamera Funktion Blendet das Interface aus und bietet Fotofunktionen für Schnappschüsse der Umgebung.

Information Liefert in schriftlicher Form nähere Infomationen über das angeklickte Objekt.

HörfunktionEs öffnet sich ein Menü zur Zeitleis-tennavigation und eine Stimme liest den Informationstext vor.

Pinnnadel Ermöglicht das Setzen einer Marke an einem Punkt, zu dem man später eventuell noch einmal zurückkehren möchte.

Auge Diese Funktion zeigt einen Stadtplan mit Wegmarkierungen

Lupe Suchfunktion zur routenunabhängigen Navigation

Einstellungen Dieses Ikon lässt sich aus und einfahren und zeigt die verschiedenen Möglichkeiten zu Einstellungen.

Route Liefert eine Übersicht über vorgefertig-te Routen im Raum Köln.

weiteres Menü verbirgt. Bestätigt man dieses Ikon, öffnet sich das Untermenü. Gleichzeitig werden sowohl das „Einstellungen-Piktogramm“, als auch die drei Menüpunkte im linken Bildbereich verkleinert dargestellt. Das Untermenü steht im Vordergrund. Beim erneuten Klicken des „Einstellungen-Piktogramm“ schließt sich das Untermenü und die Funktionen des Normalmodus sind wieder erreichbar. Vorteil dieser Aufteilung ist das Schaffen von Übersichtlichkeit. Alle Funktionen, die nicht oft in Anspruch genommen werden, stören das Blickfeld des Users und werden deshalb zusammenfassend unter den Menüpunkt „Einstellungen“ gestellt. Damit der User erkennt, welche Funktion er gerade aktiv hat, wird das dazugehörige Piktogramm bei Aktivität mit einem weißen Rand markiert und bleibt solange aktiv, bis es per Fingertipp deaktiviert wird.

44


Das Navigationsmenü unterscheidet sich grundlegend von Konkurrenzsoftware diesen Bereichs. Statt nach dem Startbildschirm eine Listung untereinanderstehender Funktionen zu zeigen, befindet sich das „agonic“- Navigationsmenü im Interface des Hauptbildschirms. Das Menü ist in zwei Modi verfügbar. Zum einen der eingefahrenen Variante und zum anderen einer ausgeklappten Version mit einem Untermenü zum Piktogramm „Einstellungen“. Im linken Bereich ist Raum für die drei Hauptfunktionen der Software.Die „Kamerafunktion“, „Information“ und „Hörfunktion“ werden am häufigsten verwendet. Deshalb sind diese im Normalmodus ausreichend groß und gut erreichbar platziert. Rechts befindet sich das „Einstellungen-Piktogramm“. Durch die kleine Anmutung eines Pfeils am linken oberen Rand innerhalb des Piktogramm wird kenntlich gemacht, dass sich hinter diesem ein


Menüführung

45

oben: Der normale Modus der Software, ohne Anvisierung eines Objekts

mittig: Interface mit anvisiertem Dom und ausgeklapptem „Einstellungen-Menü“

unten: Das Interfacemenü zeigt den auditiven Modus, inklusive Zeitleistensteuerung.

46

links: Die Fotofunktion öffnet ein neues Menü, ähnlich dem Bildschirm einer Digitalkamera.

rechts: Die eigens entworfene Tastatur erfüllt jegliche Anforderungen an eine gute Usability.



Menüführung

47

links: Informationen zum Gebäude können bei Bedarf vergrößert dargestellt werden.

rechts: Vergrößerte Ansicht des Wikipediatext zum Kölner Dom

werden. Zwar hilft ein richtungsweisender Pfeil dabei, die Route zu halten, man sollte sich aber vor Augen führen, dass essentiell der Zweck der Software das Erkennen von Objekten und Gebäuden ist. Die Themen-Routen sind das Leitsystem, welches den Touristen oder Ortsfremden an die Hand nimmt und eine unterhaltsame Alternative zum Alleingang durch die Stadt bietet. Mit einem Update können gegen einen kleinen Kostenaufwand zusätzliche Routen heruntergeladen werden. Die Tatsache, dass ein organisatorischer Aufwand nötig ist, um geeignete Routenpunkte herauszuarbeiten und Informationen zu diesen zu sortieren, rechtfertigt die kleine Aufwandsentschädigung.

48

32 siehe Unterkapitel 9.2.2 Piktogramme


Um alle Anforderungen an ein gutes Navigationssystem zu erfüllen, sind eine Planung der Reiseroute und die Funktion einer routenabhängigen Richtungsweisung unumgänglich. Der Menüpunkt Route schafft Abhilfe, wenn sich der User nicht auf seinen Orientierungssinn verlassen will. Beim Klicken des entsprechenden Zeichens32 öffnet sich das Menü Routenplanung. Der User kann interessenabhängig zwischen einigen Routen wählen. Alle Routen, sei es zur Kölner Stadtgeschichte, Romanische Kirchen, Museen und eine Route entlang des Rheins, sind vom Zentrum aus zu Fuß zu bewältigen. Es macht wenig Sinn, die Start-Ziel-Funktion eines handelsüblichen Navigationssystems zu übernehmen. In erster Linie soll mit „agonic“ kein direktes Ziel in Augenschein genommen werden, sondern entweder eine freie Stadtführung oder ein Themen-Rundgang geplant


Routenplanung

49

oben: Der Kartenmodus der Software funktioniert wie „Karten“ auf dem Iphone.

unten: Ebenfalls die Sicht auf eine Landkarte. Für die Visualisierung der Routenplanung blieb leider keine Zeit mehr.

gezeigt, doch mit dieser Übersicht kann der User abschätzen, wie weit das nächste Informationsobjekt entfernt ist. Weit entfernte Objekte werden als kleine Punkte wahrgenommen. Kommt man diesen näher, vergrößern sich die Punkte und erscheinen zusätzlich, sofern die Objekte in Sichtweite sind, im Content-Bereich. Nun kann er mit einem Klick auf den Punkt am Bildschirm das Objekt fokussieren und weitere Informationen aufrufen. Ferner hat der User mit Hilfe des Radars einen 360° Rundumblick, ohne ein Objekt zu erkennen oder zu wissen um was es sich handelt. So kann er entweder mit Hilfe des Radars die Stadt auf eigene Faust erkunden oder direkt die Route abgehen, die er vorher auswählte. Letztere Option blendet nur die Punkte ein, die innerhalb der Route liegen. Falls er die Straßen und Kartenübersicht wünscht, kann er diese mit Hilfe des „Auge-Piktogramm“ einblenden. Das Radar dient einzig und allein zur richtungsweisenden Objektwahrnehmung und einer groben Einschätzung der Entfernung.

50


Die Software ist mit dem GPS-Sender des Handys verbunden und kann somit die Position des Anwenders auf den Meter genau orten. Nur mit dieser Technik kann die Software fehlerfrei funktionieren. Ein Menü zur Einstellung des GPS-Senders ist nicht nötig, denn dieses ist bereits im System des Iphone OS zu finden. Eine räumliche Orientierung mit Hilfe einer Karte und eines Radars liefert „agonic“. Im oberen rechten Bildschirmbereich befindet sich ein rundes Radar. Visuell ist dieses in drei Kreise unterteilt, die nach außen hin immer transparenter werden. Der Punkt im Zentrum des Kreises steht stellvertretend für die Position des Users. Ein keilförmiges, zum Rand des äußeren Kreises laufendes, weißes Dreieck stellt den Blickwinkel der Person dar. Je weiter dieser ist, desto weniger sieht er und desto geringer erscheint die Deckkraft des Kreises. Sinn und Zweck dieser Visualisierung ist eine Orientierung im Raum. Zwar werden keine Straßen


GPS-Radar

Bei einer Displayauflösung von 960 px x 640 px und einer Größe von 75 mm x 50 mm ist die Überschrift im Schnitt AbsaraSans-Medium mit einer Größe von 8,5 pt. Die Fließtextschriftgröße ist ungezoomt 4,5 pt und gezoomt 6 pt groß und im Lightschnitt gesetzt. Die Größe des Textes von 6 pt ist zwar klein, doch falls Probleme beim Lesen der Schrift auftreten sollten, gibt es die Option den Text per Computerstimme vorlesen zu lassen. Diese Möglichkeit macht den Stadtrundgang zudem multimedialer und interessanter. Die Wahl größerer Typografie ist aus Platzmangel nicht möglich und bring zudem die Proportionierung der Interfaceordnung aus dem Gleichgewicht.

52

33 vgl. http://www.klingspor-museum.de/KlingsporKuenstler/Schriftdesigner/Dupre/XDupr%8E.pdf [18.08.2010]

Die Wahl der Schriftfamilie setzt einige Punkte voraus. Zum einen sollte die Hausschrift von „agonic“ weder die im Logo auftauchende Interstate oder Myriad Pro sein, noch eine Schriftfamilie, an der sich das geübte Auge eines guten Gestalters bereits satt gesehen hat. Außerdem muss sich der Font als Displayschrift eignen. Serifenbetonte Antiqua-Schriften fallen somit weg. Der Type Directors Club zeichnete 2005 eine noch bis dato unbekannte Grotesk-Schriftfamilie aus. Die von Xavier Dupré entwickelte Gill ähnliche FF Absara Sans33 erfüllt alle verlangten Kriterien. Ein weiterer Vorteil ist die Tatsache, dass diese in vielen verschiedenen Schnitten verfügbar ist.



Schriftfamilie

53

Die Abbildung des Iphone ist im 1:1 Format, um das Verhältnis zur Schrift realistisch wahrzunehmen.

AbsaraSans-LightÜberschrift 20 ptÜberschrift 15 pt

Überschrift 12pt

Überschrift 10pt

Überschrift 8pt

Überschrift 7pt

Überschrift 6pt

Überschrift 5pt

ebenso die Wahl des Menüikons. Leicht zu deutende Piktogramme sind verständlicher als aufwändige Grafiken innerhalb der Menübuttons34. Zusätzlich sind diese, anders als in schriftlicher Form, auch verkleinert gut erkennbar. Der User wird schnell mit den Funktionen der acht Menüpunkte vertraut sein. Überflüssige Spielereien in den Einstellungen wurden entfernt. So findet sich als einziger Zusatz unter dem Radar eine kleine Anzeige mit GPS-Empfang und Akkustand. Auf Displayhelligkeit, Lautstärke, Datum und Uhrzeit sowie Landeseinstellungen wurde bewusst verzichtet. Diese zusätzlichen Funktionen würden ungeübten Benutzern den Umgang mit dem Programm unnötig erschweren. An dieser Stelle gilt das Oxymoron „Weniger ist mehr“.

54

34 siehe Professor Conradin Wolf HGK Zürich, Piktogramme- Seminararbeit Semiotik, S. 12


Die Software kann mit Hilfe eines einzigen Fingers bedient werden. Im Grunde ist zur Bedienung nur eine Hand notwendig. Ein leichter Umgang und die daraus resultierende benutzerfreundliche Navigation, sind für jede Handyapplikation von höchster Priorität. Das Interface von „agonic“ ist so gestaltet, das es auf Anhieb einen möglichst guten Überblick schafft. Komplizierte Menüpunkte und Untermenüs wie sie beispielsweise bei unübersichtlichen Handymenüs zu finden sind, wären hier völlig deplatziert. Menschen mit wenig Erfahrung im Bereich Medien und Multimedia, sollten gut mit der Benutzeroberfläche der Applikation zurechtkommen. Zur Benutzerfreundlichkeit des Geräts zählt nicht nur eine Übersichtlichkeit der Navigationspunkte und die einfache ein-Finger-Bedienung, sondern

Die Bedienung

Usability

56

12 Herman Schmidt, S 15 nis dolorepudis evenimi lluptin ventinv ellomoluptae nullatis am, que cusant.24 Hsfn Schmidt, S 15 nis doloreklsjflsföskf


Die Bedienung

Geübte Gestalter wissen, dass eine Arbeit auf dem Bildschirm eine andere Wirkung hat, als es beim vorliegenden Druck der Fall ist. Beim „agonic“-Interface ist es genau andersherum. Die Programmabbildungen innerhalb meiner Dokumentation werden anders wahrgenommen, als die Software auf dem Display eines Iphone. Leider bleibt interessierten Lesern dieser Bachelor-Thesis keine andere Wahl, als die abgedruckten Abbildungen zu bewerten. Ich entwickelte aus diesem Grund einen Fragebogen, der die Benutzerfreundlichkeit der Software an Freiwilligen testen sollte. Das verschafft Klarheit und bietet

für mich die Option eventueller Änderungen in der Gestaltung des Interface durchzuführen, falls grobe Probleme aufgetreten wären. Zusätzlich zur zweiseitigen Befragung hatten die Probanden eine Einsicht der Interfacegestaltung im 1:1 Format auf dem Iphone. Um eine hilfreiche Folgerung aus der Erhebung zu erschließen, befragte ich 30 Personen unterschiedlichen Alters und Wissensstand im Bereich Medien zur Benutzerfreundlichkeit meiner Interfacegestaltung. Zusammenfassend sprechen 87 % für eine übersichtliche Navigation und 13 % finden sich mit der Bedienung nicht zurecht.

Umfrage

57

Die DIN A4 Bögen wurden per PDF-OnlineFormular versendet und konnten digital ausgefüllt werden.

Befragung zur Benutzerfreundlichkeit eines App-Interface

Diese Umfrage ist der Teilbereich einer Bachelor-Thesis Zwischenprüfung der IB-Hochschule Berlin SS 10 mit dem Thema „Interfacedesign und Gestaltung

eines fiktiven Outernetkonzepts, als Leitsystem im Kölner Central Business District“. Die Verantwortung für den Inhalt und das Copyright liegt beim Autor:

Andreas Jungen, Wilhelm-Gräser Str.12, 41515 Grevenbroich, [email protected]

Bitte füllen Sie folgende Fragen nach bestem Wissen und Gewissen aus!

Bei der Iphone Applikation handelt es sich um einen Stadtführer, der mit Hilfe neuester Technik erkennt, welches Gebäude man gerade anvisiert und Informationen wünscht.

Allgemeine InformationenDiese Daten dienen ausschließlich zur Statistischen Erhebung zum Zwecke der o.g. Bachelor-Thesis und werden nicht anderweitig verwendet oder an Dritte weiter gereicht.

1. Wie alt sind Sie?

2. Geschlecht:männlich

ja

ja

ja

Jahre

weiblich

nein

nein

nein wenig

3. Ihre Kompetenz im Bereich Medien (Internet, Computer, Navigationssysteme,Handy,...)?

4. Besitzen Sie ein Navigationssystem?

5. Sind Sie Besitzer eines Apple Iphones?

6. Haben Sie Erfahrung mit ITunes Applikationen?

1

9

1 /2

Nummer /30

Befragung zur Benutzerfreundlichkeit eines App-Interface

Diese Umfrage ist der Teilbereich einer Bachelor-Thesis Zwischenprüfung der IB-Hochschule Berlin SS 10 mit dem Thema „Interfacedesign und Gestaltung

eines fiktiven Outernetkonzepts, als Leitsystem im Kölner Central Business District“. Die Verantwortung für den Inhalt und das Copyright liegt beim Autor:

Andreas Jungen, Wilhelm-Gräser Str.12, 41515 Grevenbroich, [email protected]

Interface spezifische BefragungDiese Daten dienen ausschließlich zur Statistischen Erhebung zum Zwecke der o.g. Bachelor-Thesis und werden nicht anderweitig verwendet oder an Dritte weiter gereicht.

7. Wirkt neben stehendes Interface auf Sie ansprechend?

8. Haben Sie Probleme die Piktogramme zu erkennen?

9. Wofür könnten einzelne Ikons stehen?

ja

ja

nein

nein

10. Bitte bewerten Sie die Benutzerfreundlichkeit der Piktogramme von 1 wie einfallslos bis 9 wie perfekt:

Danke für Ihre Hilfe!

2 /2

1

1

1 2 3 4 5 6 7 8 9

2

3

4

5

6

7

8

2 34 5 6 7

8

58

35 vgl. http://www.marketing-blog.biz/blog/archives/3198-Was-ist-eigentlich-...-Above-the-line-Below-the-line.html [18.08.2010]


Above-the-line Marketing bedeutet in erster Linie Werbemaßnahmen, wie so genannte „klassische“ oder „traditionelle“ Werbung35. Grundsätzlich ist das primäre Ziel eine effektive Manifestierung der neuen Marke und eine daraus resultierende Veröffentlichung, welche möglichst viele Menschen erreichen wird. Da es sich bei dem Produkt um eine Iphone Applikation handelt, müssen einige besondere Punkte vorab geklärt werden. Werbung für das Iphone als Mobilfunkgerät sind nicht selten- eine Kampagne für eine einzelne Iphone-Applikation ist aber eher unüblich. Der Werbeeffekt verbreitet sich üblicherweise durch Mund zu Mund Propaganda. Wenn ein neues App funktional und innovativ ist, dann verkauft es sich auch gut. Das reicht mir aber nicht, denn mein Produkt soll

als eigenständiges Programm angeboten werden, ist umfangreicher als kleine Spielereien in Form von Apps und schafft einen enormen Sprung hin zur erweiterten Realität. Deshalb entscheide ich mich für eine Plakatumsetzung als Marketingmaßnahme. Thema meiner App ist ein neues Leitsystem innerhalb deutscher Städte. Plakatwände in und um diese Städte sollen dieses Konzept unterstreichen. Außerdem erreicht man dadurch mehr Menschen, als durch Inserate in Fachzeitschriften, kleinere Anzeigen oder Flyer. Beim Betrachten sollte sich jeder angesprochen fühlen. Es gibt kein bestimmtes Klientel, welches durch das Plakat erreicht werden soll. Ein Tourist war jeder schon mal, also sollte die Produktwerbung auch für jeden sichtbar und verständlich sein.

Konzeption

Abgebildet ist eine freigestellte Hand mit Iphone, auf weißem Grund. Eine Person nutzt das Programm und richtet sein Iphone auf den Kölner Dom. Die Kamera nimmt das Bild auf und stellt es auf dem Bildschirm des Smartphones dar. Der interessierte Betrachter des Plakats sieht schnell, das es sich bei der Software um das geworbene Produkt handeln muss, denn dieses steht im Mittelpunkt des Wahrnehmungsfeldes. Das Plakat zeigt eine Szene, die die Nutzung der Software symbolisch darstellt. Zwar sind Hand und Handy reale Elemente, doch die Umgebung um die Hand ist als weißer, steriler Hintergrund dargestellt. Lediglich die Silhouette der Kölner Skyline ist in Form einer feinen Linie zu erkennen. Botschaft: Jeder der in Köln unterwegs ist, nimmt die Formen der Gebäude zwar wahr, kann in den meisten Fällen aber nicht wissen, um welche Einrichtungen es sich dabei handelt. „Agonic“ macht aus dieser Schattenform der Unwissenheit ein klares, farbliches Bild, denn das Wesentliche lässt sich nur mit „agonic“ erkennen und ist für die Augen unsichtbar.

60

36 vgl. http://www.zitate-online.de/literaturzitate/allgemein/2365/man-sieht-nur-mit-dem-herzen-gut-das-wesentliche.html [15.08.2010]

Die Headline, zugleich auch Claim der Marke, kommt ursprünglich aus einem anderen Bereich, nämlich dem der Philosophie. Der erfolgreiche französische Autor Antoine de Saint-Exupéry, schrieb in seinem Bestseller „Der kleine Prinz“: „Hier ist mein Geheimnis. Es ist ganz einfach: Man sieht nur mit dem Herzen gut. Das Wesentliche ist für die Augen unsichtbar!“36 Ich wählte dieses Zitat in gekürzter Form, als Überschrift für meine Produktwerbung. „Agonic“ ist ein Programm, das die Welt so wie wir sie wahrnehmen mit Hilfe geeigneter Technik ergänzt. Das worauf es ankommt, nämlich die Information, die man allein durch das Betrachten eines Gegenstandes gar nicht erfahren könnte, liefert die Software. Ich zeige durch diesen Slogan also, dass „agonic navigation“ Horizonte erweitern kann und Lösungen liefert, die über das Wissen des einzelnen hinaus gehen.


Headline Grafische Ebene

eventuell vorgesehen Produktpalettenerweiterung könnte natürlich jede andere Skyline einer Stadt Verwendung finden. „Agonic“ kann beispielsweise auch in Berlin funktionieren. Dann würde man die Skylinesilhouette so anpassen, dass sie wichtige Kulturgüter und Bauwerke der Berliner Stadt zeigt. Zwei wichtige Details würden aber bestehen bleiben: Unten links steht ein gut sichtbares App Store Hinweislogo. Dieses kennen einige aus anderen Iphonewerbungen, andere wissen schnell worum es sich handelt. Interessierte erkennen mit einem Blick nach links, wo sie das Produkt erwerben können und im rechten unteren Plakatbereich befindet sich das Logo der Marke „agonic“.

61

37 vgl. http://www.der-lernberater.de/mat/Leitfaden_Poster.pdf, PDF S. 5

38 vgl. http://www.der-lernberater.de/mat/Leitfaden_Poster.pdf, PDF S. 2

Die Menschen unserer Kultur lesen von links nach rechts und von oben nach unten37. Deshalb steht der Slogan oberhalb der grafischen Ebene. Er ist ohne das Betrachten der kompletten Anzeige unverständlich, aber interessant. Somit sollte man diesen möglichst als erstes wahrnehmen. In der Mitte findet sich die Hand mit dem Iphone. Alles dreht sich um das Produkt, also sollte dieses auch sprichwörtlich im Mittelpunkt der Anzeige stehen38. Die Skyline reicht von links bis zum rechten Rand des Plakats, ist zusätzlich im Golden Schnitt gesetzt und schafft eine Beziehung zur Waagerechten. Diese Maßnahme ist nötig, denn sonst wäre für den Betrachter, aufgrund des neutral weißen Hintergrundes unkenntlich, wo sich die Szene abspielt. Bei einer

Anordnung der Elemente

erkennende Piktogramme als Navigationselemente und Übersichtlichkeit sind die drei Säulen der einfachen Handhabung. Das als Anzeigegerät dienende Iphone eignet sich hervorragend, da es jegliche für die Funktionsnutzung des Programms notwendige Hardware beinhaltet. Die Fortschrittlichkeit der Technik des Smartphones spiegelt sich auch in der Gestaltung der Produktmarke wieder. Die Reduktion auf Grundelemente im Signet schafft eine Unkompliziertheit die sich für Nutzer auch in der Handhabung der Software wiederspiegeln wird. Eine geeignete Wahl der Schriftfamilie, Proportionierung sowie Farbkomposition vervollständigen die Entwicklung der Marke. Zwar wurde das fertige Interface praktisch nicht auf seine Alltagstauglichkeit geprüft, doch wurden viele Faktoren beachtet, die auch ohne Programmierung später auftretende Probleme bezüglich Funktionstüchtigkeit theoretisch ausschließen. Die intelligente Menüführung beispielsweise setzt

auf Einfachheit und Übersichtlichkeit und beschränkt sich auf die nötigsten Funktionen des Programms. Das Konzept soll funktionieren, mehr Optionen als herkömmliche Iphone-Spielereien bieten und zudem benutzerfreundliche Eigenschaften haben. Dieses Konzept greift die Headline und Gestaltung des Werbeplakats auf. Einfach aber innovativ. Eine Idee, die durch Gedankenarbeit und Fleiß eine greifbare Gestaltung erfahren konnte.

65

Schlussbetrachtung

Einleitend wurde ein kurzer Fokus hinsichtlich der Entwicklung des Internets und der Zukunftsvision Outernet gegeben. Die erwähnten Themengebiete sollen lediglich exemplarisch aufführen, inwiefern sich der Nutzen des Internets für den Menschen zukünftig verändern könnte und welche Entwicklung ein neu gestaltetes Konzept, nämlich das der virtuellen Realität, haben könnte. Nachdem alle wichtigen Fachtermini diesbezüglich erläutert wurden, befasst sich der zweite Teil der Arbeit mit der Problematik deutscher Touristenleitsysteme im Städtewesen im Allgemeinen und der spezifischen Situation der Reiseführung in Kölns Innenstadt. Diese beiden Punkte erörtern die momentane Situation. Das dritte Kapitel der Arbeit beschäftigt sich mit der Entwicklung einer fortschrittlicheren Alternative zur klassischen Reiseführung. Dies ist zugleich der Hauptteil der Thesis und dokumentiert die Ausarbeitung eines Softwarekonzepts, das in dieser Form noch keine Marktreife erlangte. Eine klar strukturierte Interfaceordnung, einfach zu

66

Quellenverzeichnis

Literatur

Ronald Azuma (HRL Laboratories), Recent Advances in Augmented Reality

Die 100 besten Schriften, fontshop.de

Frank Barth, Typografisches Gestalten von digitalen Displaymedien

Terry Marks, Color harmony: Layout

R. Klanten (Hrsg.), Der kleine Besserwisser-Grundwissen für Gestalter, 2. Auflage

Bibliographisches Institut & F.A. Brockhaus, Duden. Das Fremdwörterbuch.

Rudolf Arnheim, Kunst und Sehen Eine Psychologie des schöpferischen Auges

Enrico Morteo, Designatlas von 1850 bis heute

Alistair Dabbs + Alastair Campbell, Digitales Mediendesign

Ronald T. Azuma (HR Laboratories), A Survey of Augmented Reality

Dipl.-Ing. Bernd Lutz aus Aschaffenburg, Konzepte für den Einsatz von Virtueller und Erweiterter Realität zur interaktiven Wissensvermittlung

Jegliche Fotos und Grafiken, die nicht im Text als Fremdquellen gekennzeichnet wurden, wurden vom Studenten selbst angefertigt. Die im grauen Farbton gekennzeichneten Quellen im Quellenverzeichnis dienten als Grundwissen und Vorbereitung auf die Ausarbeitung dieser Bachelor-Thesis.

Fachartikel

Kevin Bonsor, How Augmented Reality Works

Dr. Hartmut Rein, Funktion und Aufbau touristischer Leitsysteme

Verkehrsclub Deutschland, Wegweisungssysteme für den Fußverkehr

Peter Reichard, typosition scripts • Logogestaltung

Professor Conradin Wolf HGK Zürich, Piktogramme- Seminararbeit Semiotik

der-lernberater.de/mat/Leitfaden_Poster.pdf

BBC News, Michael Fitzpatrick, Mobile phones get cyborg vision

Ronald Ecker, Benutzerschnittstellen für Erweiterte Realität

Paul Milgram + Haruo Takemura, Augmented Reality: A class of displays on the reality-virtuality continuum

Alpengluehen, Das Handy als Reiseführer – Mobile Applikationen im Tourismus

Tim O‘Reilly, Was ist Web 2.0? Entwurfsmuster und Geschäftsmodelle für die nächste Software Generation, vgl. http://www.oreilly.de/artikel/web20_trans.html

67

68

Elektronische Quellen

Ralph Baer, Der (Ping)Pong-Erfinder,

www.3sat.de/page/?source=/neues/sendungen/magazin/123467/index.html

WELT KOMPAKT, Die Zukunft des Internet heißt Outernet,

www.youtube.com/watch?v=ouvWaHYuNB8&feature=related

www.augmentreality.co.uk/blog/augmented-reality-featurin-the-beatles.html

www.youtube.com/watch?v=iEnw3bJuOPc&feature=player_embedded

www.apple.com/de/iphone/specs.html

www.ewrite.de/mg/downloads/daten/pdf_operating/logogestaltung.pdf

www.designenlassen.de/hilfe/design-tipps-logo-design

www.designguide.at/logodesign.html

www.designbote.com/102/web-20-buttons

www.klingspormuseum.de/KlingsporKuenstler/

Schriftdesigner/Dupre/XDupr%8E.pdf

www.rp-online.de/duesseldorf/ratingen/nachrichten/ratingen/Konzept-gegen-Schilder-Chaos_aid_715534.html

www.marketing-blog.biz/blog/archives/3198-Was-ist-eigentlich-...-Above-the-line-Below-the-line.html

www.zitate-online.de/literaturzitate/allgemein/2365/man-sieht-nur-mit-dem-herzen-gut-das-wesentliche.html

http://www.koelntourismus.de/stadtfuehrungen/oeffentliche-fuehrungen/i-guide-stadtrundgang-mit-kopfhoerer.html

69

Elektronische Quellen

Ralph Baer, Der (Ping)Pong-Erfinder,

www.3sat.de/page/?source=/neues/sendungen/magazin/123467/index.html

WELT KOMPAKT, Die Zukunft des Internet heißt Outernet,

www.youtube.com/watch?v=ouvWaHYuNB8&feature=related

www.augmentreality.co.uk/blog/augmented-reality-featurin-the-beatles.html

www.youtube.com/watch?v=iEnw3bJuOPc&feature=player_embedded

www.apple.com/de/iphone/specs.html

www.ewrite.de/mg/downloads/daten/pdf_operating/logogestaltung.pdf

www.designenlassen.de/hilfe/design-tipps-logo-design

www.designguide.at/logodesign.html

www.designbote.com/102/web-20-buttons

www.klingspormuseum.de/KlingsporKuenstler/

Schriftdesigner/Dupre/XDupr%8E.pdf

www.rp-online.de/duesseldorf/ratingen/nachrichten/ratingen/Konzept-gegen-Schilder-Chaos_aid_715534.html

www.marketing-blog.biz/blog/archives/3198-Was-ist-eigentlich-...-Above-the-line-Below-the-line.html

www.zitate-online.de/literaturzitate/allgemein/2365/man-sieht-nur-mit-dem-herzen-gut-das-wesentliche.html

http://www.koelntourismus.de/stadtfuehrungen/oeffentliche-fuehrungen/i-guide-stadtrundgang-mit-kopfhoerer.html

navigationagonic IB-Hochschule Berlin | Fakultät für Kulturwissenschaften | Studiengang Kommunikation

document

Documents