Incom ist die Kommunikations-Plattform der Fachhochschule Potsdam

In seiner Funktionalität auf die Lehre in gestalterischen Studiengängen zugeschnitten... Schnittstelle für die moderne Lehre

Incom ist die Kommunikations-Plattform der Fachhochschule Potsdam mehr erfahren

Doku Virtuelle Typografie - The Fabric of Interface

Doku Virtuelle Typografie - The Fabric of Interface

Die virtuelle Rauminstallation »Fabrics of Interfaces« ist inspiriert durch das zweite Kapitel des gleichnamigen Buches von Stephen Monteiro aus dem Jahr 2017. Monteiro untersucht in diesem Kapitel v.a. Zusammenhänge von technischen Begriffen, die aus der Textilbranche entnommen wurden und heute auch zur Beschreibung von digitalen Interfaces verwendet werden. Für die Installation wurden einige Begriffe ausgewählt und ihre Bedeutung typografisch in der VR-Welt visualisiert. Die Farbigkeit und Struktur des Raumes ist an den Aufbau von Pixelbildern angelehnt und setzt die textilen Begriffe in eine digitale Umgebung.

---English Abstract---

The virtual reality installation »Fabrics of Interfaces« is inspired by the second chapter of Stephen Monteiro’s book »Fabrics of Interfaces« from 2017. In this chapter, Monteiro primarily examines the connections between technical terms that were taken from the textile industry and are also used today to describe digital interfaces. Some terms were selected for the installation and their meaning visualized typographically in the VR-world. The colour and structure of the room is based on the structure of pixel images and places the textile terms in a digital environment.

Aufgabe

Virtual Reality, Mixed Reality und Augmented Reality sind inzwischen Gestaltungsräume für ganz unterschiedliche Handlungsszenarien geworden. Und obwohl für eine Vielzahl von Anwendungen die Verwendung von Text notwendig ist, so fällt insgesamt doch auf, dass der Umgang mit Schrift und Typografie in VR/AR/XR nachrangig behandelt wird. Während die virtuellen Umgebungen häufig opulent durchgestaltet sind, wirkt die Gestaltung mit Typografie oft gehemmt, uninspiriert und wenig experimentell. Ausgehend von dieser Beobachtung sollten wir im Kurs die Herausforderungen und Potentiale von Typografie in VR/AR/XR untersuchen und in konkrete Entwürfe umsetzen.

Die Aufgabe im Kurs war es, textbasierte Informationssysteme (Bücher, Wikis, Nachschlagewerke, Twitter, Forschungsdatenbanken, etc.) als interaktive und vernetzte typografische Strukturen in VR/AR/XR zu konzipieren und prototypisch zu realisieren. Workshops zu Beginn des Kurses gaben uns notwendige Kenntnisse und technische Unterstützung.

Textauswahl und Beschreibung

MONTEIRO, Stephen (2017): The Fabric of Interface. Mobile Media, Design, and Gender, Cambridge, Massachussetts: The MIT Press, pp. 59–84.

2022-04-11_Präsentation_Textures_of_Interface3.png2022-04-11_Präsentation_Textures_of_Interface3.png
2022-04-11_Präsentation_Textures_of_Interface2.png2022-04-11_Präsentation_Textures_of_Interface2.png

Die englischsprachige Studie „The Fabric of Interface. Mobile Media, Design, and Gender„ von Stephen Monteiro beschäftigt sich mit mit der medienhistorischen und wissenschaftlichen Entwicklung der Computertechnologie. Diese setzt er in Bezug zur Textilgestaltung und geschlechtsspezifischen Praktiken der Handarbeit. 

So scrollt der Benutzer bspw. in der digitalen, mobilen Welt ganz alltäglich durchs “Web” oder/und befindet sich in einer konstanten Interaktion mit Interfaces, die aus “Patterns und Grids” bestehen. Stephen Monterio exploriert, untersucht und vergleicht in seiner Studie Terminologien, Metaphern und Anwendungen der digitalen Kommunikation und ihre Entstehungsgeschichte in Bezug auf Gender, Textilien, Werkzeuge, kulturelle Praktiken und bietet damit Einsichten im Bereich der Computertechnologie auf einer tieferen Ebene.

Das von uns ausgesuchte 2. Kapitel »Image Fabric« untersucht technische Fachbegriffe der Textilverarbeitung, die heute auch im Zusammenhang mit Bildmedien verwendet werden. Digitale Bilder, die aus Pixeln bestehen, sind laut Stephen Monteiro in ihrem Aufbau ähnlich zu Stoffen, die im Raster gewebt, genäht oder gestrickt werden.

Inspiration

Zeitgenössische Inspiration für Typographie im VR-Raum-Darstellungen zu finden, war nicht einfach, da bei der Schriftentwicklung ursprünglich wohl eher nicht an eine Verwendung im VR-Raum oder auf Screens gedacht wurde. Trotzdem sehen wir bspw. in der Umgebung im Alltag allerhand Beispiele für Typographie in dreidimensionaler Ausführung. Auch Print-Designer verpassen ihren typographischen Darstellungen zum Teil eine dreidimensional anmutende Erscheinung. Anhand dieser Überlegungen haben wir erst einmal Inspirationsquellen auf Printprodukten entdeckt. Bei der Ausführung und Weiterentwicklung des Projekts entstand erst am Ende ein schlüssiges Konzept.

2022-04-11_Präsentation_Textures_of_Interface.png2022-04-11_Präsentation_Textures_of_Interface.png

c6a404e3b2a69c2549472abbd6f3d767.jpgc6a404e3b2a69c2549472abbd6f3d767.jpg
3bb6e906756ea82b613d138b96182520.jpg3bb6e906756ea82b613d138b96182520.jpg
90ca998790e684aadc0076ffa7f92485.jpg90ca998790e684aadc0076ffa7f92485.jpg
4b5f3a3d78cdecdb52b2cc1c77844f32.jpg4b5f3a3d78cdecdb52b2cc1c77844f32.jpg

Finales Gestaltungskonzept

Die Gestaltung des Projekts orientiert sich im weiteren Sinne an der Struktur einer “mise en abyme”, einer dreidimensionalen Welt, die aus vergrößerten, von uns gestalteten, begehbaren Pixeln beruhen, welche wiederum aus kleineren Pixeln bestehen, bis hin zu den kleinsten Pixeln, die für das Auge kaum sichtbar sind. Die VR-Darstellung ist nichts anderes, als ein modernes Webstück, dass aus verschieden farbigen Pixeln den Benutzer:innen eine simulierte, dreidimensionale Wirklichkeit vortäuscht. Deswegen haben wir bewusst Schriften von der Londoner Agentur MuirMcNeil gewählt, da diese in ihrer rasterartigen, mathematisch, fast schon gestrickt aussehenden Form vergrösserten Pixeln entsprechen. Diese typographische Auswahl verstehen wir auch als Gegenkonzept zu der Entwicklung von Schriftgestaltung in der Computergrafik. Dort begegnet Schrift den Benutzer:innen heute fast nur noch anti-alised, also geglättet. Dieses gestalterische Konzept passt zum Inhalt des Buches Fabrics of Interface und ist eine illusionsstörende Inszenierung, die der Benutzer:in die eigentliche Konstruiertheit des VR-Raums aufzeigen soll. Auch unsere Farbwahl orientiert sich im weiteren Sinne an der additiven Farbmischung auf Screens und ihren Grundfarben Rot, Grün und Blau.

Schriftwahl

Die Wahl der Schrift orientierte sich nicht nur an dem Konzept hinter dem Schrifttyp, sondern auch an den technischen Möglichkeiten. Hauptkriterium war hier die Einfachheit der Buchstabenform: so wenige Bezierkurven wie möglich. Denn, jede Rundung bedeutet zusätzliche Rechenleistung der Hardware und damit auch mögliche Darstellungsprobleme bei größeren Schriftmengen.

Die Wahl viel auf die Schriftfamilie TwoBlock Type. Die einzelnen Buchstaben bestehen nur aus horizontalen und vertikalen Linien, die Rundungen sind mit quadratischen Leerstellen ausgespart. So entsteht der Eindruck einer „Pixelschrift“. Die Schrift passt konzeptuell gut zu der Farb- und Raumgestaltung.

Als Ersatzschrift wurde die VT323 von Peter Hull gewählt. Diese hat auch den Pixellook erfüllt jedoch zudem Open Font License Kriterien, sodass sie auch für eine spätere Veröffentlichung des Prototypen außerhalb des Universitätskontext verwendet werden kann.

Raumgestaltung

Der virtuelle Raum wurde bewusst auf einen Raum in Würfelform begrenzt. Diese Limitierung erinnert an die klar definierten Größen

Farbgestaltung

Arbeitsprozess

Workshops

Zu Beginn des Semesters gab es eine Einführung in die game-engine Unity von Sebastian Wloch und Tim Ebert aus der Interface-Werkstatt erhalten. Außerdem hat Levi Kolwitz die 3D-Modelling Software Blender vorgestellt und ist dabei speziell auf die Erstellung und Bearbeitung von Text eingegangen. Beide Workshops haben sehr geholfen die technischen Möglichkeiten kennenzulernen. Sie haben aber auch deutlich gemacht, wie aufwendig und zeitintensiv die Erstellung des Projekts werden kann.

Projektentwicklungsphasen

Zuerst war eine Folge von Textblöcken geplant, die teilweise animiert sein sollten. Ziel war es das Bild einer scheinbar unendlichlangen Stoffbahn zu zeigen, mit verschiedenen Musterabschnitten, bereichert durch Pixelbilder, die die verschiedenen Textilherstellungsmethoden und -techniken zeigen sollten. Die Unendlichkeit des virtuellen Raumes sollte ausgenutzt werden.

U9.jpgU9.jpg
U2.jpgU2.jpg
U8.jpgU8.jpg
U6.jpgU6.jpg
U1.jpgU1.jpg

Durch die Diskussionen mit Prof. Boris Müller und die weitere Auseinandersetzung mit dem Textinhalt veränderte sich die Gestaltung. Der Raum wurde begrenzt, die Farbigkeit extremer, der Fokus auf die Visualisierung und Gegenüberstellung von Fachbegriffen aus der Textilindustrie und dem Interfacedesign gesetzt.

n1.PNG.pngn1.PNG.png
n2.PNG.pngn2.PNG.png
11.jpg11.jpg
titel.jpgtitel.jpg

Herausforderungen

Teamarbeit

Die Arbeit am Projekt war nicht immer einfach oder direkt offensichtlich. Vor allem am Anfang, wenn wir uns nicht gegenseitig Arbeit aufgeteilt hatten. Oder nicht jeder das gemacht hat, worauf wir uns geeinigt haben. Jedoch nach einer Eingewöhnungsphase als Team, haben wir die Arbeitsteilung besser hinbekommen und dann ging das Projekt auch schneller voran.

Durch unsere lange Experimentierphase kamen wir auf interessante Zwischenergebnisse, bei denen wir unsere Texte und Objekte auf verschiedenste Arten und Weisen kombiniert haben.

Manche Fehler haben uns viel Zeit gekostet und das hatte auch teilweise die Teamarbeit etwas zurückgeworfen. Als wir jedoch gemeinsam als Team die Fehler beheben konnten, war der Rest schnell erledigt. Also durch gute Arbeitsteilung und gute Teamarbeit kamen wir dann am Ende auf unser finales Projekt.

Technische Herausforderungen

U3 (1).jpgU3 (1).jpg

Die größten Schwierigkeiten gab es am Anfang mit der Einbettung der Schriftart.  Das hatte mit der Renderpipeline zu tun, die wir verwendet hatten, was uns anfangs nicht klar war. Dieses Problem hat uns eine Weile beschäftigt und einiges an Zeit gekostet. Als wir jedoch eine andere Schriftart benutzt haben, konnten wir ohne Probleme unser Projekt auf der Brille laufen lassen.

Unbenannt.PNGUnbenannt.PNG

Außerdem hatten wir dann noch Schwierigkeiten mit der Fortbewegung. Wir hatten versucht eine Teleportationsplattform zusammen mit Teleportationspunkten zu benutzen, diese Vorgehensweise war aber nicht nötig für unser eigentliches Vorhaben. Als wir uns dann nur für die Plattform entschieden haben gab es keine Probleme mehr und wir konnten problemlos damit arbeiten.

Gestalterische Herausforderungen

4eb3f954-8411-415b-90ac-8c269cb016a9.jpg4eb3f954-8411-415b-90ac-8c269cb016a9.jpg
efa88a2f-95cb-466c-8a5f-da053eab88e6.jpgefa88a2f-95cb-466c-8a5f-da053eab88e6.jpg

Es gab weniger Hindernisse bei der Erstellung der Grafiken und Designs, die wir verwendet haben. Es gab mehr Hindernisse bei der Einbringung oder Übertragung in Unity. In erster Linie die verwendete Schriftart in Verbindung mit TextMeshPro von Unity. Deswegen haben wir uns dafür entschieden, die Schrift größtenteils schon vorher in unsere Designs für die Würfel zu packen und dann auf Unity zu übertragen.

Ergebnis

Fazit

Leonie

Helene

Generell habe ich noch nie VR-Projekte bearbeitet und deswegen stellte dieser Kurs für mich eine neue Möglichkeit zum Entdecken der simulierten Wirklichkeit dar. Die vielen verschiedenen Möglichkeiten, eine Inszenierung für den Benutzer zu gestalten, haben mich erst ein wenig überwältigt, da der virtuelle Raum nicht nur vorgegebene 2D Animationen mit Ton vor den Augen des Benutzers abspielen lässt, sondern uns als Designer:innen auch die Möglichkeit des Spiels mit Interaktion, Textur, Schärfe/Unschärfe, Distanz/Nähe, Licht/Schatten, Bewegung, Perspektive, Raum- und Zeitgefühl etc. gibt. All das konkurriert als simulierte Wirklichkeit mit der Wirklichkeit und die Simulation ist noch nicht perfekt. In manchen Teilbereichen jedoch scheint mir die Simulation fast besser als die Wirklichkeit zu sein. Deswegen war es gut, dass das Projekt in einem Rahmen der typografischen Auseinandersetzung mit einem Textkörper begrenzt war, weil das an sich schon genug Arten der Auseinandersetzung mit VR mit sich bringt. Auch Unity als Programm kennen zu lernen war eine Herausforderung und sehr lehrreich. Zufrieden bin ich auch mit der Entwicklung und dem Endergebnis unseres Projektes, da wir alle kaum Erfahrung mit dem Arbeiten in Unity hatten und jetzt auf ein vollständiges und benutzbares Projekt schauen können, das meine Erwartungen absolut übertroffen hat.

Melvin

Die Wahl dieses Kurses fiel aufgrund des innovativen Themas der Typografie in der Virtual Reality. Angesichts des hohen Potenzials für neue Gestaltungsmöglichkeiten und da ich in diesem Bereich noch keine Erfahrungen gesammelt hatte, war die Erwartungshaltung entsprechend groß. Die Teilnahme am Kurs, die zunächst nicht sicher schien, erwies sich rückblickend als äußerst bereichernd. Durch die Auseinandersetzung mit Unity und den vielfältigen Textgestaltungsmöglichkeiten konnten sowohl neue als auch verborgene Kenntnisse reaktiviert werden. Der Kurs hat deutlich gemacht, wie viel Entwicklungspotenzial in diesem Bereich der VR-Entwicklung steckt. Das Ergebnis des Gruppenprojekts übertraf die ursprünglichen Erwartungen in seiner Qualität und Komplexität. Die hohe Motivation und der Einsatz aller Gruppenmitglieder waren beeindruckend. Dieser Kurs stellt in meiner akademischen Laufbahn bisher den Höhepunkt dar.

Fachgruppe

Interfacedesign

Art des Projekts

Studienarbeit im zweiten Studienabschnitt

Betreuung

foto: Prof. Boris Müller

Entstehungszeitraum

Wintersemester 2021 / 2022

Keywords