david liebermann

HCU Urban Design
http://ud.hcu-hamburg.de
Der Masterstudiengang Urban Design an der HCU Hamburg verbindet sowohl theoretische als auch praktische Disziplinen zum Thema der gegenwärtigen und zukünftigen Stadt. Der Fokus liegt dabei auf der interdisziplinären Forschung und Gestaltung.
Um die Einflüsse des Gegebenen mit in die inhaltliche Gestaltung der Seite einzubeziehen befindet sich auf der Startseite eine Socialwall, die Seiteninhalte mit (vertaggten) Inhalten aus Sozialen Medien mischt. In diesem Bereich zeichnet sich bereits die Aufgabenstellung an die grafische Gestaltung ab, es gilt, sehr heterogenes Bild- und Textmaterial in eine konsumierbare, wiedererkennbare Form zu bringen, dabei jedoch keine Uniformität zu schaffen. Um dies gewährleistet zu können, bildet das Menü den am prägnantesten gestalteten Teil der Seite. Jeder Punkt der Navigation bildet eine Fläche, wobei Home und die Suche statische Elemente bilden, die in jedem Zustand der Seite eine schnelle Orientierung ermöglichen. Die Subnavigation setzt sich in der Ausgangsposition aus den Punkten About und Projects zusammen, die je nach Vertiefung um weitere Bereiche und Navigationsmöglichkeiten erweitert werden. Neben der Nutzung des Hauptmenüs und der Suche sind diverse Querverweise und Verlinkungen innerhalb der Seite als Möglichkeit zur nicht linearen Navigation und zur Gruppierung von Überthemen angelegt.
Die statische, um nicht zu sagen brutal wirkende Seitenstruktur wird durch eine Animation der Menüpunkte gebrochen und verleiht der tabellarischen Ästhetik Verspieltheit. Das typografische Konzept leitet sich aus einer Art Default Gestaltung ab konventionelle Voreinstellungen werden (etwas optimiert) übernommen und lediglich in ihren Proportionen verfremdet.
Um ein farbliches Branding zu vermeiden und alle Optionen, sowohl im Umgang mit der CI der HCU als auch in der Gestaltung von über die Website hinausgehenden Produkten, offen zu halten wird dem User die farbliche Belegung der Seite überlassen.

Diese Seite ist in Zusammenarbeit mit Maximilan Kiepe und Hanna Osen entstanden.
The Urban Design Master study programme at the HCU Hamburg unites theoretical and practical disciplines relating to the city of the present and the city of the future. The focus is on interdisciplinary research and design.
In order to incorporate the influence of given facts into the contentual design of the site, the start page has a “social wall” that mixes page content with (tagged) content from social media. In itself, this area of the site demonstrates the challenge that had to be fulfilled by the site’s graphic design: the idea is to give very heterogeneous image and text material a consumable, recognisable form, without imposing uniformity. In order to ensure this, the menu was given the most striking design of any element on the site. Each navigation point is a surface, whilst “home” and “search” are static elements, enabling quick navigation regardless of the configuration of the site. At the starting point, the sub-navigation is composed of two points – “About” and “Projects” – to which more areas and navigation options are added as one moves more deeply into the site. In addition to using the main menu and the search function, various cross-references and links within the file are provided to allow for non-linear navigation and for grouping under overarching header themes.
The static – not to say brutal – page structure is relieved by an animation for the menu points, lending the tabular ascetic a certain playfulness. The typographic concept is derived from a kind of default design. Conventional defaults (somewhat optimised) were adopted, with only the scale changed to make them different.
In order to avoid a colour branding and to keep all options open relating to working with the CI of the HCU, and also the design of products beyond the website, the colour scheme of the website is left to the user.

This page was created in collaboration with Maximilian Kiepe and Hanna Osen.
david liebermann

hallointer.net
http://hallointer.net
Hallo ist eine Plattform für kontemporäres Internet, die sich auf die fließenden Grenzen zwischen Technik, Interaktion und Ästhetik in der digitalen Welt fokussiert.
Jede Website ist ein in sich geschlossener Raum, welcher nicht dazu konzipiert ist, im direkten visuellen Vergleich mit anderen Räumen zu funktionieren und in seiner Funktion von der interaktiven Installation bis hin zum Shopsystem reichen kann. Umso schwerer ist es, eine Ausstellungsfläche zu finden, die es erlaubt, all diesen unterschiedlichen Funktionen, Interaktionsmöglichkeiten und Visualitäten gerecht zu werden.
Die Website ist als Versuch konzipiert, mit den im Internet gegebenen Möglichkeiten auf spielerische Weise Inhalte erlebbar zu machen. Dieser Versuch manifestiert sich zum einen in den als Navigationselemente eingesetzten Emojis, welche als „Esperanto“ des Internets gesehen werden können, zum anderen in der Möglichkeit, die Seiten im jeweiligen Device zu laden und mit dieser zu interagieren, ohne die Plattform zu verlassen.
Um einen möglichst umfassenden Einblick in die beinahe unbegrenzte Vielfalt des Internets zu geben, ist das „Curation Weekend“ seit dem Launch fester Bestandteil des Konzepts. Im Zuge dieses Formats wird Gestaltern, Programmierern sowie Künstlern die Möglichkeit geboten, für sie relevante oder interessante Websites mit der Gemeinschaft zu teilen.
Hallo is a platform for the contemporary Internet that focuses on the fluid boundaries between technology, interaction, and aesthetics in the digital world.
Each website is a self-contained space; functioning in direct visual comparison with other spaces is not part of its concept. Its function may be anything from interactive installations to shopping systems. This makes it all the more different to find an exhibition space that allows one to do justice to all of these different functions, forms of interaction, and visual qualities.
This website is intended as an experiment in making content available on the Internet in a playful way. This is shown by the emojis used as navigation elements – which could be called the “Esperanto” of the Internet – and by the fact that it is possible to load the pages and to interact with them on any device without leaving the platform.
The “Cura­tion Weekend”, which allows maximum insight into the almost unlimited diversity of the Internet, has been an integral part of the concept since its launch. This format gives designers, programmers and artists the opportunity to share relevant or interesting websites with the community.
david liebermann

WE DO Studio
http://wedo-studio.eu
Dieses Projekt ist beinahe der Stereotyp eines Gestalterportfolios. Der Urheber und dessen Schaffen bildet den Inhalt. In diesem Fall spiegelt der Name des Studios die beiden zu vermittelnden Komponenten und bildet gleichermaßen den Grundstein für die Interaktion der Seite.
Durch die Reduktion der Navigation auf die Bereiche Wer und Was wird eine starke Vereinfachung ermöglicht, welche wiederum Raum für einen spielerischen Umgang mit dem Inhalt erlaubt. Die Aufteilung des Screens führt durch den bei der Interaktion auftretenden thematischen Bruch der Hälften zur Verschmelzung der beiden inhaltlichen Bereiche.
Ein starkes typografisches Auftreten gepaart mit grafischen Repro-Fotografien bildet im unbewegten Zustand die visuelle Erscheinung der Seite. In der Interaktion hingegen wird das strenge Layout durch teilweise fehlerhaft wirkende Transitions sowie unerwartete Modifikationen im Interaktionsdesign gebrochen.
This project is practically the stereotype of a designer’s portfolio. The content is constituted by the originator and his oeuvre. In this case, the name of the studio reflects the two key components that are intended to be conveyed whilst representing the foundation of the site’s interactive character.
Reducing navigation to two areas – “who” and “what”– allows for radical simplification whilst also allowing scope for playful treatment of the content. The division system for the screen leads to a blending of content from the two areas, owing to the thematic breaking up of the two halves that occurs during interaction.
When stationary, the visual configuration of the site is characterised by a strong typographic profile combined with graphics of reproduction photographs. When one interacts with the site, the regularity of its layout is disrupted by transitions that appear erratic and by unexpected modifications to the interaction design.
david liebermann

Ingo Offermanns
http://ingooffermanns.com
Der Gestalter und Professor für Grafikdesign Ingo Offermanns bewegt sich in seinen Arbeiten zwischen Tradition und Moderne, Konvention und Experiment. Umso schwerer ist es, für all diese Facetten und Möglichkeiten der inhaltlichen Interpretation eine passende, der Vielfalt gerecht werdende digitale Form der Präsentation zu finden.
Es besteht immer eine Spannung in der Fokussierung auf Inhalt oder Objekt. So bietet der Umgang mit ihrer Darstellung zu Beginn immer die Fragestellung nach der Möglichkeit der Vermittlung der in den Arbeiten aufbereiteten Inhalte.
In Offermanns Worten ist "Grafik Design […] eine Disziplin der Weltbemächtigung, des Übersetzens, der Konstruktion, der Repräsentation, der Erinnerung und der Multiplikation.“¹
In diesem Fall münden die Versuche der exakten Abbildung der von Offermanns erwähnten Dimensionen von Grafikdesign darin, den Geist, die Vielfalt und das Gefühl seiner Arbeiten als visuellen Auszug widerzuspiegeln.
Die typografische Animation der Startseite stellt die visuelle Interpretation der auftretenden Kontraste dar. Sie transferiert traditionelle Arbeiten in die Jetztzeit und fungiert gleichermaßen als Bruch, um die Seitengestaltung von den gezeigten Arbeiten zu trennen.
Im Weiteren beschränkt sich die Seite auf klares und minimalistisches Interaktions- und Grafikdesign. Sowohl im Bild als auch im Text liegt der Fokus dabei in jedem Zustand auf dem Inhalt. Einzelne Projekte bewegen sich auf der Z-Achse, Metainformationen auf der Y-Achse und die Navigation zwischen den Projekten auf der X-Achse. Dies ermöglicht trotz maximaler Reduktion eine abwechslungsreiche User Journey.

Diese Seite ist in Zusammenarbeit mit Maximilian Kiepe entstanden.

¹ Ingo Offermanns, Hamburg, 2015
The works of designer and professor of graphic design Ingo Offermanns combine tradition and modernity, convention and experiment. This makes it all the more difficult to find a digital form of presentation that does full justice to all this diversity and all the facets and possible interpretations of the content.
There is always a tension in focusing on content or object. At the beginning, working with their representation always poses a question about the possibilities for conveying the content contained in the artworks.
In Offermanns’ words, graphic design is “[…] a discipline of mastering the world, of translation, of construction, of representation, of memory and of multiplication.”¹
In this case, the efforts to accurately represent the dimensions of graphic design described by Offermanns are expressed by reflecting the spirit, the diversity, and the feeling of his artworks in visual extract form.
The typographic animation of the start page represents a visual interpretation of the contrasts that emerge. It transfers traditional artworks into the here and now, but also functions as a “break” element, dividing the page design from the works on display.
Beyond this, the site restricts itself to clear and minimalist interaction design and graphic design. In images and texts alike, the focus is on the content, in every case. Individual projects are shown along the z-axis, meta-information on the y-axis, and navigation between the projects on the x-axis. This permits a varied journey for the user, in spite of maximal reduction.

This page was created in collaboration with Maximilian Kiepe.

¹ Ingo Offermanns, Hamburg, 2015
david liebermann

Roman Gysin
http://www.romangysin.com
Die Webpräsenz von Roman Gysin ist nur bedingt als Portfolio konzipiert. Es geht viel mehr um die Möglichkeit, Inspiration, Arbeitsprozess und Resultat gleichberechtigt zu behandeln und es dem Betrachter zu ermöglichen, seine eigenen gedanklichen Ansätze aus der Kombination der Elemente zu ziehen.
Anlässlich einer Ausstellung von Gysin schrieb die Zürcher Galerie Herrmann & Germann Contemporary „[...] Zufall und Absicht, die Geste und der Akt spielen eine ausschlaggebende Rolle in der Inszenierung der aufeinander treffenden Einzelarbeiten“.¹ Ähnlich verhält sich auch das Interaktionskonzept für die digitalen Ausstellungsfläche. Der Interagierende kann aus Versehen zum Gestaltenden werden, in dem er mit dem Eintritt der Maus in ein bestimmtes Areal der Seite einen Mechanismus betätigt der Farbe und Bildwelt der Seite manipuliert und somit die Arbeit in einen neuen Kontext rückt.
Auch die eher konventionelle digitale Interpretation eines Kunstkataloges, durch indexikalisch gelistete Bilder und die dazugehörigen Beschreibungen, wird durch das zufällig wirkende Streben der Bilder in den linken oberen Seitenrand und die damit entstehenden Weißräume erst auf den zweiten Blick gebrochen.

¹ Herrmann & Germann Contemporary (2016), Zürich
Roman Gysin’s web presence is not exactly intended as a portfolio. Instead, the idea is to put opportunity, inspiration, the working process, and the result on an equal footing, and to enable the viewer to combine the elements to form their own mental pattern.
An exhibition of Gysin’s work prompted the Zürich gallery of Herrmann & Germann Contemporary to write that: “[...] coincidence and intention, gesture and action play a critical role in the presentation of the individual artworks in confrontation.”¹ The interactive concept for the digital exhibition space is similar. A user who interacts with the content may also inadvertently become a designer: if the mouse cursor enters a specific area of the site, it activates a mechanism that manipulates the website’s colour and image world, giving the artwork a new context.
When one looks more closely, the seemingly chance images at the upper left-hand edge of the page and the resulting white spaces instantly do away with the other conventional digital interpretation of an art catalogue, with pictures listed in an index with an accompanying description.

¹Herrmann & Germann Contemporary, Zürich, 2015
david liebermann

Analytische Grafik
http://klassegrafik.de
Terminkalender, Portfolio und Informationen zu Studium und Lehre sind die auf der Webpräsenz der Klasse Grafik verhandelten Überpunkte. Diese Vielzahl an heterogenem Inhalt fordert ein klares Grafikdesign und bedingt ein noch klareres Interaktionsdesign.
Der Vorhang fällt auf der Startseite, ein beinahe bombastischer Schriftzug macht Platz für ein sehr aufgeräumtes, beinahe tabellarisch anmutendes Layout. Die Kategorisierung der Inhalte in zwei übergeordnete Rubriken (Studierende/Studium) wird durch einen Splitscreen ermöglicht. Dieser bildet gleichzeitig die Bühne für jeglichen Bildinhalt der Seite. Diese Art der Trennung ermöglicht es, trotz maximaler Klarheit und Strukturierung die Inhalte spielerisch zu erkunden.
Trotz der hohen Präsenz der inhaltlichen Ausrichtung stehen die Studierende und deren Arbeiten im Vordergrund, zum einen durch die ausschließlich in diesem Kontext vorkommende visuelle Hinterlegung mit Bildmaterial (Portfolio/Blog) zum anderen durch einen Bruch der Gestaltung im Studierendenbereich.

Diese Seite ist in Zusammenarbeit mit Jana Reddemann, Max Prediger und Roman Fischer entstanden.
“Appointment calendar”, “portfolio” and “study and learning information” are the main headings on the Klasse Grafik web presence. Such a large quantity of heterogeneous content requires a clear graphic design, and an even clearer interaction design.
As the curtain falls on the start page, an almost bombastic line of text makes way for a very clear and tidy, almost tabular layout. The categorising of content into two overarching rubrics (students/study) is enabled by a split screen. At the same time, these provide the stage for all picture content of the site. This form of separation enables a playful investigation of the content, juxtaposed with maximal clarity and structuring.
In spite of the site being strongly oriented toward content, the students and their pieces of work are in the foreground: firstly, through the visual placement of image material which appears exclusively in this context (portfo­lio/blog), and secondly through a “break” in the design to mark the “students” area.

This page was created in collaboration with Jana Reddemann, Max Prediger, and Roman Fischer.
david liebermann

Benjamin Gottwald
http://benjamingottwald.com
Erzählung bildet den Grundstein für Gottwalds Arbeit, sei es in als Einzelbilder funktionierenden Illustrationen oder in den Sequenzen seiner (unter Bachwald erscheinenden) Comics.
Die in den Büchern und Zeichnungen fehlende Dimension der Zeit wird auf der Startseite seiner Webpräsenz herangezogen, um durch Bewegung den Interagierenden zum Akteur der Geschichte zu machen und ihn letztendlich in den Kosmos des Inhalts zu ziehen.
Im weiteren Verlauf bildet ein klares, lineares Layout in Kombination mit verspielter Typografie den Rahmen, in dem die mit viel Witz erzählten und teilweise etwas absurden Szenarien Gottwalds ihr Eigenleben ungestört entfalten können.
Narrative is the keystone of Gottwald’s artwork, both in his individual images functioning as illustrations and in the sequences of his comics (published by Bachwald).
The start page of his web presence draws on the dimension of time – absent from books and drawings – by using movement to make the person interacting with the content an active part of the story, and, ultimately, to draw that person into the cosmos of the content.
In the pages that follow, a clear, linear layout combined with playful typography provides a framework in which Gottwald’s wittily related and sometimes rather absurd scenarios can unfold and reveal a life of their own.
david liebermann

Sophie Schweighart
http://sophieschweighart.com
Erzählungen aus der eigenen Welt sind das Leitmotiv der Arbeiten von Sophie Schweighart. Surreale Motive stehen im Fokus ihrer Fotografien und performativen Darstellungen, in denen inszenierte Szenen aus dem nicht Existierenden künstlich zum Leben erweckt werden.
Die in ihrer Dramaturgie beinahe filmisch wirkenden Arbeiten werden in der Struktur der Webseite ausschnittsweise in den Kontext ihres Gesamtwerks gestellt. Dabei wird die Dimension der einzelnen Arbeiten erst durch die Interaktion und das Erscheinen der Metainformationen ersichtlich.
Der Zoom, welcher sich auf die komplette Seite bezieht und einzelne Bilder in den Fokus stellt, ermöglicht dem Betrachter, seine oberflächlichen Eindrücke mit Details anzureichern. Im gezoomten Zustand besteht die Möglichkeit, zwischen den Arbeiten zu navigieren, ohne diesen dabei zu verlassen.
Auch die passive Interaktion in Form der Betrachtung hat Einfluss auf das Verhalten der Darstellung. Die Seite versinkt nach einigen Sekunden der Ruhe in der Dunkelheit und rahmt Schweigharts Arbeiten in Schwärze.
Narratives from her own world provide a common thread that runs through the artworks of Sophie Schweighart. Her photographs focus on surreal motifs, and on performative representations that breathe artistic life into non-existent choreographed scenes.
The structure of the website allows Schweighart’s artworks, whose dramaturgy gives them an almost filmic quality, to be shown in the context of her overall oeuvre (a selection). The dimension of the individual artworks becomes visible only through interaction and the appearance of meta-information.
The zoom function, which can be applied to the whole site, and places individual images in focus, enables the viewer to reveal details that enhance their superficial impressions. When the page is in zoom mode, it is possible to navigate between the artworks without cancelling zoom mode.
Passive interaction – viewing – also influences the presentation. If it is left undisturbed for a number of seconds, the page goes dark, framing Schweighart’s artworks in black.
david liebermann

Edward Greiner
http://edwardgreiner.de
Fotografie spielt in jedem Medium eine Rolle, allerdings ist nicht jede Art für jedes Medium gedacht oder gar geeignet. So kann ein digitales Fotografieportfolio im Optimalfall zwar den Charakter der einzelnen Serien repräsentieren, doch nie die für eine Ausstellungssituation gedachten fotografischen Serien in ihrer Ganzheit erfassen.
Greiners künstlerische Arbeit rangiert zwischen Grafik und Architektur, verhandelt dabei immer wieder die Thematik einer künstlichen, vom Menschen geschaffenen und manipulierten Welt. Die Verfremdung des eigentlich Gezeigten spiegelt sich im typografischen Umgang mit den Titeln wider. Nie ist die Serie, geschweige denn das einzelne Bild aus dem Kontext gelöst zu sehen. Der um die Arbeiten entstehende Weißraum wird durch die Typografie gebrochen und lässt dem Betrachter nur das Gesamtbild.
Um eine Trennung und Herarchisierung der Inhalte vorzunehmen, wurde eine Teilung in drei Ebenen vorgenommen. Auf der Einstiegsebene befinden sich die künstlerischen Arbeiten in Form eines linearen Gangs durch eine Ausstellungssituation, in der zweiten Ebene sämtliche Zusatzinformationen sowie der Zugang zu einem Passwortgeschütztem Bereich der Greiners kommerzielle Arbeit beinhaltet.
Die Reduktion der Interaktion auf zwei der konventionellsten Elemente (Klick, Scroll) bedarf nach einigen Tests allerdings einer Einführung, die in diesem Fall durch eine dem Cursor folgende „Bedienungsanleitung“ direkt in den einzelnen Bereichen gegeben wird.
Photography plays a role in every medium, but not every kind of photography is intended for– or even suitable for – every medium. For instance, a digital photographic portfolio may, in optimal conditions, be able to represent the character of the individual series, but it can never capture the totality of several photographic series intended for an exhibition context.
Greiner’s artistic work extends to both graphics and architecture, and repeatedly addresses the theme of an artistic world that is created and manipulated by human beings. The quality of alienation in what is actually shown is reflected in the typographical handling of the titles. Individual pictures and series alike cannot be disassociated from their context. The white space around the artworks is broken up by the typography, leaving the viewer with only the overall picture.
In order to undertake a separation and hierarchisation of the content, it was divided into three levels. At the entry level, the artworks appear in the form of a linear path through an exhibition setting. All additional information, plus access to a password-protected area containing Greiner’s commercial work, is located on the second level.
A number of tests, however, showed that if interaction was to be reduced to two of the most conventional elements (click and scroll), then an introduction would be required. In this case, this is done by means of “operating instructions” that follow the cursor, located directly in the individual areas.
david liebermann

T H E PRESS GROUP
http://thepressgroup.de
Die Option, im digitalen Raum Zeit in Form von Ton und Bewegung als Gestaltungselement einzusetzen, bildet die Grundbedingungen zur Entstehung von Interaktionskonzepten, die in ihren Möglichkeiten mit materiellen Objekten verwandt sind.
Im Fall der Interimsseite des Plattenlabels The Press Group wird durch wenige Effekte, die auf die physische Imitation eines Klangkörpers abzielen, eine Art interaktives, digitales Glockenspiel erzeugt.
Diese Interpretation von Klang im digitalen Raum bildet den inhaltlichen Bogen der Seite zur musikalischen Experimentierfreude der auf dem Label vertretenen Künstler.

Diese Seite ist in Zusammenarbeit mit Max Prediger entstanden.
In the case of the record label The Press Group’s interim site, a small number of effects that aim to physically imitate a resonating body are used to produce a kind of interactive, digital glockenspiel.
This interpretation of sound in digital space provides the arc for the content on this site, which showcases the experimental activities of the artists represented by the record label.

This page was created in collaboration with Max Prediger.
david liebermann

Julian Charriere
http://julian-charriere.net
Der Künstler Julian Charrière bewegt sich in seinen Arbeiten im Raum zwischen jetzt und früher und ermöglicht es dem Betrachter, sich verstärkt als Teil einer vergänglichen, gefährdeten, sich im stetigen Umbruch befindenden Welt zu sehen.
"Charrière ist ein neoromantischer Naturabenteurer, der auf das Schmelzen der Pole aufmerksam macht, indem er an Ort und Stelle Löcher ins Eis brennt. Gerade erst schliff er für seine Installation We Are All Astronauts Globen ab, um zu zeigen, dass sich die Welt selbst kaputtmacht.“¹
Der white cube artige digitale Ausstellungsraum orientiert sich an einem klassischen Kunstkatalog und bildet einen grafischen Rahmen, der genug Platz zur Entfaltung der teilweise fragil wirkenden Arbeiten lässt. Die Funktionsweise der Navigation erschließt sich auf der Landingpage, eine numerische Auflistung der Projekte bildet den Index. – Im Verlauf der Interaktion rückt dieser zur Seite und bildet, nun in minimierter Form, die Möglichkeit zur schnellen Navigation.
Die Abbildungen von Charrièrs Einzelarbeiten und Serien beleuchten diese aus unterschiedlichen Perspektiven, dokumentieren Prozess und Ausstellungssituation. Durch die Präsenz der vorangehenden und nachfolgenden Bilder steht jede einzelne Ansicht im Kontext des Ganzen und kann vom Betrachter durch die visuelle Zurücknahme der Angrenzenden jedoch auch als Einzelbild gesehen werden.

Diese Seite ist in Zusammenarbeit mit Maximilian Kiepe entstanden.

¹Art Magazin / Birgit Sonna /12.08.2014
In his artworks, the artist Julian Charrière moves between present and past, allowing viewers to see themselves as part of a transient, endangered world in a state of constant upheaval.
“Charrière is a neo-romantic nature adventurer who draws attention to the melting of the poles by burning holes in the ice in certain locations. In his installation We Are All Astronauts, he ground down globes, in order to show that the world is destroying itself.”¹
The white cube-like digital exhibition space is based on a classical art catalogue and constitutes a graphical framework that provides sufficient space for the unfolding of the sometimes fragile-looking artworks. The functioning of the navigation is revealed on the landing page, whilst an index is provided by the numerical listing of the projects. – As one interacts, this moves to the side, and, in minimised form, allows for quick navigation.
The reproductions of Charrièr’s individual artworks and series illuminate them from different perspectives, documenting the process and the exhibition context. Each individual view is placed in the context of the whole through the presence of the preceding and following image, but can also be viewed as an individual image thanks to the visual unobtrusiveness of the neighbouring pictures.

This page was created in collaboration with Maximilian Kiepe.

¹Art Magazin / Birgit Sonna /12.08.2014
david liebermann

Hannah Sophie Dunkelberg
http://hannahsophiedunkelberg.com
Sowohl in der Inszenierung als auch in ihren Arbeiten beschäftigt sich Hannah Dunkelberg mit der abstrakten Abzeichnung des Raumes auf dort positionierte Objekte. Durch diese Herangehensweise kommt es immer wieder zur Neukombination durch Überlagerungen, eine in sich statische Arbeit interagiert mit seiner Umwelt und kann somit an jedem Ort neu gesehen und gelesen werden.
Das blogartige Portfolio ist ein Versuch, die dabei entstehende Leichtigkeit auf den digitalen Raum zu übertragen. Transparenz und Überlagerung werden aufgegriffen in dem eine zufällig gewählte Form als multiplizierte Ebene den Inhalt überlagert und somit zu einer neuen Gesamtkomposition führt. Bei Scroll nach unten verschwindet die Navigation und mit ihr das einzige in seiner Visualität statische Element der Seite
In terms of presentation and in her works, Hannah Dunkelberg interests herself in the abstract tracing of the space onto objects positioned there. This approach constantly produces new combinations through overlappings. An artwork that is, in itself, static interacts with its environment, and can therefore be seen and read in a new way in every location.
The blog-like portfolio is an attempt to apply this sense of ease to digital space. Transparency and layering are incorporated by overlaying a randomly chosen shape, multiplied to cover the whole surface, onto the content, thereby generating a new overall composition. When one scrolls down, the navigation – the only visually static element on the page – vanishes.
The option of deploying time in the form of sound and movement as a design element in digital space provides the basic conditions for the production of interaction concepts whose potential relates to material objects.
david liebermann

David Schiesser
http://davidschiesser.com
Der digitale Ausstellungsraum für den Künstler David Schiesser bezieht sich auf die medialen Konsumgewohnheiten der Nutzer. Nichtverfügbarkeit spielt in Zeiten des unbegrenzt scheinenden Angebotes und dessen Erreichbarkeit beinahe keine Rolle mehr. Einer der negativen Aspekte ist die daraus resultierende mangelnde Wertschätzung des Inhalts. Visuelle Eindrücke werden zum Konsumgut, das Gesehene zum vorüberziehenden Rauschen in einer mit Reizen überladenen Welt.
Das Seitenkonzept beinhaltet einen häufigen Wechsel des gesamten Inhalts, was zu einer zeitlich begrenzten Verfügbarkeit und somit zu einer künstlich herbeigeführten Verknappung des Bildmaterials führt. Jede gezeigte Bildabfolge hat ein nicht vorherzusagendes Verfallsdatum. Die so erzeugte Vergänglichkeit wird durch das Anzeigen des Änderungsdatums ins Bewusstsein gerufen.
Der häufige und radikale Wechsel des Inhalts ermöglicht es Schiesser, seine Seite frei zu kuratieren und dabei ein Spektrum abzudecken, welches von einer temporären Ausstellung bis hin zu banalen oder gar lustigen Inhalten reicht und diese miteinander vermischt.
The digital exhibition space for the artist David Schiesser responds to the user’s media consumption habits. In an age of seemingly unlimited product ranges and attainability, non-availability is barely a factor anymore. One negative aspect of this is the resulting lack of awareness of the value of content. Visual impressions become a consumer commodity, and everything we see becomes simply a passing buzz in a world overloaded with stimuli.
The site concept includes frequent changes of the entire content; this means that content is available for a limited time only, and also leads to a restricted quantity of image material. Each displayed sequence of images will be removed at a non-specified future date. To remind viewers of this transient quality, the date of the change being made is displayed on the site.
This frequent and radical changing of the content enables Schiesser to curate his site without restrictions, thereby covering a wide spectrum – including a temporary exhibition, but also banal or even comical content – and mixing these areas together.
david liebermann

Von Zehn
http://vonzehn.de
Die Fotografieausstellung „Von Zehn, junge Positionen zur Wirklichkeit“ bot, wie der Name bereits vermuten lässt, zehn Hamburger Fotografen die Möglichkeit, ihre persönliche Sicht auf die Welt mit den Besuchern zu teilen. Das Spektrum hierbei reicht von schwarzweißer analogfotografie über dokumentarische Arbeiten bis hin zu digitalen Snapshots.
Im Gegensatz zum Print bietet eine digitale Darstellung die Option, mit statischen und nicht statischen Flächenbelegungen zu spielen, im Falle dieser Ausstellung wurde die Möglichkeit verwendet, um ein hierarchisches Gleichgewicht in der visuellen Representation der einzelnen Fotografen und ihrer Arbeiten herzustellen. Der Ausstellungstitel wird beim Laden der Seite durch einen Zufallsmechanismus im Viewport positioniert und überschneidet sich somit für jeden Besucher mit einem anderen Bild. Die Seite ist in zehn Schaltflächen geteilt und jede ermöglicht den Blick auf eine neue Arbeit und dessen Autor.

Diese Seite ist in Zusammenarbeit mit Julian Mader entstanden.
As the name suggests, the photography exhibition “Von Zehn, junge Positionen zur Wirklichkeit” (lit. “From ten, new positions on reality”) gives ten Hamburg photographers the chance to share their own personal view of the world with visitors. The spectrum ranges from black-and-white analogue photography to documentary photography work to digital snapshots.
Unlike printed formats, a digital representation offers the option of playing with the filling of surfaces in a static and non-static way. In the case of this exhibition, this provided the opportunity to create a hierarchical balance in the visual representation of the individual photographers and their artworks. When the page loads, a random generator positions the exhibition’s title within the viewport, so that each viewer sees it in intersection with a different picture. The page is divided into ten function buttons, each of which reveals to view a new artwork and its author.

This page was created in collaboration with Julian Mader.
david liebermann

Disziplinäre Grenzgänge
http://disziplinaeregrenzgaenge.de
In der Stadtplanung wird aufgrund veränderter Anforderungen über neue Wege nachgedacht. Das Symposium „Disziplinäre Grenzgänge“ beschäftigt sich verstärkt mit dem Wunsch einer dichteren Vernetzung von Theorie und Praxis. Im Rahmen des Veranstaltungsprogramms setzen sich in einzelnen Modulen Experten unterschiedlicher Professionen gemeinsam mit aktuellen Themen der Stadtplanung und Entwicklung auseinander, Ergebnisse werden während und nach des Symposiums dokumentiert und evaluiert.
Die Webseite orientiert sich in ihrem Aufbau an einem konventionellen Onepager, bricht die Erwartungen allerdings in ihrer Interaktion und Navigation. Das Grafik- und Interaktionsdesign lehnt sich an den der Thematik innewohnenden Wunsch an, neue Wege zu finden, Konventionen zu überdenken und diese gegebenenfalls zu brechen. So löst die Betätigung der Navigation eine Kettenreaktion aus und verdeutlicht den Zusammenhang zwischen den einzelnen Bereichen.
Um die während des Symposiums stattfindende Erarbeitung von Inhalten abzubilden, startet die Seite mit Platzhaltern für Bilder und analysierende/evaluierende Texte, welche nach Abschluss der Veranstaltung ausgetauscht werden.
In urban planning, new ways of working are being considered, in response to changed requirements. The symposium “Disziplinäre Grenzgänge” (“Disciplinary Boundary Crossing”) looks intensively at the wish for a closer interconnection of theory and praxis. In connection with the programme of events, a number of modules take place in which experts from different professions come together to discuss topical themes in urban planning and development, with the proceedings documented and evaluated during and following the symposium.
The website’s construction is modelled on a conventional one-pager. Its interaction and navigation models, however, break with all expectations. The graphic and interaction design references the subject matter: the desire to find new paths, to rethink conventions, and occasionally to break with them. Using the navigation triggers a chain reaction, revealing the connections between the individual areas.
In order to reflect the development of content over the course of the symposium, the page starts with placeholders for images and analysis/evaluation texts, which will be exchanged following the events.
HCU Urban Design
http://ud.hcu-hamburg.de
Der Masterstudiengang Urban Design an der HCU Hamburg verbindet sowohl theoretische als auch praktische Disziplinen zum Thema der gegenwärtigen und zukünftigen Stadt. Der Fokus liegt dabei auf der interdisziplinären Forschung und Gestaltung.
Um die Einflüsse des Gegebenen mit in die inhaltliche Gestaltung der Seite einzubeziehen befindet sich auf der Startseite eine Socialwall, die Seiteninhalte mit (vertaggten) Inhalten aus Sozialen Medien mischt. In diesem Bereich zeichnet sich bereits die Aufgabenstellung an die grafische Gestaltung ab, es gilt, sehr heterogenes Bild- und Textmaterial in eine konsumierbare, wiedererkennbare Form zu bringen, dabei jedoch keine Uniformität zu schaffen. Um dies gewährleistet zu können, bildet das Menü den am prägnantesten gestalteten Teil der Seite. Jeder Punkt der Navigation bildet eine Fläche, wobei Home und die Suche statische Elemente bilden, die in jedem Zustand der Seite eine schnelle Orientierung ermöglichen. Die Subnavigation setzt sich in der Ausgangsposition aus den Punkten About und Projects zusammen, die je nach Vertiefung um weitere Bereiche und Navigationsmöglichkeiten erweitert werden. Neben der Nutzung des Hauptmenüs und der Suche sind diverse Querverweise und Verlinkungen innerhalb der Seite als Möglichkeit zur nicht linearen Navigation und zur Gruppierung von Überthemen angelegt.
Die statische, um nicht zu sagen brutal wirkende Seitenstruktur wird durch eine Animation der Menüpunkte gebrochen und verleiht der tabellarischen Ästhetik Verspieltheit. Das typografische Konzept leitet sich aus einer Art Default Gestaltung ab konventionelle Voreinstellungen werden (etwas optimiert) übernommen und lediglich in ihren Proportionen verfremdet.
Um ein farbliches Branding zu vermeiden und alle Optionen, sowohl im Umgang mit der CI der HCU als auch in der Gestaltung von über die Website hinausgehenden Produkten, offen zu halten wird dem User die farbliche Belegung der Seite überlassen.

Diese Seite ist in Zusammenarbeit mit Maximilan Kiepe und Hanna Osen entstanden.
The Urban Design Master study programme at the HCU Hamburg unites theoretical and practical disciplines relating to the city of the present and the city of the future. The focus is on interdisciplinary research and design.
In order to incorporate the influence of given facts into the contentual design of the site, the start page has a “social wall” that mixes page content with (tagged) content from social media. In itself, this area of the site demonstrates the challenge that had to be fulfilled by the site’s graphic design: the idea is to give very heterogeneous image and text material a consumable, recognisable form, without imposing uniformity. In order to ensure this, the menu was given the most striking design of any element on the site. Each navigation point is a surface, whilst “home” and “search” are static elements, enabling quick navigation regardless of the configuration of the site. At the starting point, the sub-navigation is composed of two points – “About” and “Projects” – to which more areas and navigation options are added as one moves more deeply into the site. In addition to using the main menu and the search function, various cross-references and links within the file are provided to allow for non-linear navigation and for grouping under overarching header themes.
The static – not to say brutal – page structure is relieved by an animation for the menu points, lending the tabular ascetic a certain playfulness. The typographic concept is derived from a kind of default design. Conventional defaults (somewhat optimised) were adopted, with only the scale changed to make them different.
In order to avoid a colour branding and to keep all options open relating to working with the CI of the HCU, and also the design of products beyond the website, the colour scheme of the website is left to the user.

This page was created in collaboration with Maximilian Kiepe and Hanna Osen.
hallointer.net
http://hallointer.net
Hallo ist eine Plattform für kontemporäres Internet, die sich auf die fließenden Grenzen zwischen Technik, Interaktion und Ästhetik in der digitalen Welt fokussiert.
Jede Website ist ein in sich geschlossener Raum, welcher nicht dazu konzipiert ist, im direkten visuellen Vergleich mit anderen Räumen zu funktionieren und in seiner Funktion von der interaktiven Installation bis hin zum Shopsystem reichen kann. Umso schwerer ist es, eine Ausstellungsfläche zu finden, die es erlaubt, all diesen unterschiedlichen Funktionen, Interaktionsmöglichkeiten und Visualitäten gerecht zu werden.
Die Website ist als Versuch konzipiert, mit den im Internet gegebenen Möglichkeiten auf spielerische Weise Inhalte erlebbar zu machen. Dieser Versuch manifestiert sich zum einen in den als Navigationselemente eingesetzten Emojis, welche als „Esperanto“ des Internets gesehen werden können, zum anderen in der Möglichkeit, die Seiten im jeweiligen Device zu laden und mit dieser zu interagieren, ohne die Plattform zu verlassen.
Um einen möglichst umfassenden Einblick in die beinahe unbegrenzte Vielfalt des Internets zu geben, ist das „Curation Weekend“ seit dem Launch fester Bestandteil des Konzepts. Im Zuge dieses Formats wird Gestaltern, Programmierern sowie Künstlern die Möglichkeit geboten, für sie relevante oder interessante Websites mit der Gemeinschaft zu teilen.
Hallo is a platform for the contemporary Internet that focuses on the fluid boundaries between technology, interaction, and aesthetics in the digital world.
Each website is a self-contained space; functioning in direct visual comparison with other spaces is not part of its concept. Its function may be anything from interactive installations to shopping systems. This makes it all the more different to find an exhibition space that allows one to do justice to all of these different functions, forms of interaction, and visual qualities.
This website is intended as an experiment in making content available on the Internet in a playful way. This is shown by the emojis used as navigation elements – which could be called the “Esperanto” of the Internet – and by the fact that it is possible to load the pages and to interact with them on any device without leaving the platform.
The “Cura­tion Weekend”, which allows maximum insight into the almost unlimited diversity of the Internet, has been an integral part of the concept since its launch. This format gives designers, programmers and artists the opportunity to share relevant or interesting websites with the community.
WE DO Studio
http://wedo-studio.eu
Dieses Projekt ist beinahe der Stereotyp eines Gestalterportfolios. Der Urheber und dessen Schaffen bildet den Inhalt. In diesem Fall spiegelt der Name des Studios die beiden zu vermittelnden Komponenten und bildet gleichermaßen den Grundstein für die Interaktion der Seite.
Durch die Reduktion der Navigation auf die Bereiche Wer und Was wird eine starke Vereinfachung ermöglicht, welche wiederum Raum für einen spielerischen Umgang mit dem Inhalt erlaubt. Die Aufteilung des Screens führt durch den bei der Interaktion auftretenden thematischen Bruch der Hälften zur Verschmelzung der beiden inhaltlichen Bereiche.
Ein starkes typografisches Auftreten gepaart mit grafischen Repro-Fotografien bildet im unbewegten Zustand die visuelle Erscheinung der Seite. In der Interaktion hingegen wird das strenge Layout durch teilweise fehlerhaft wirkende Transitions sowie unerwartete Modifikationen im Interaktionsdesign gebrochen.
This project is practically the stereotype of a designer’s portfolio. The content is constituted by the originator and his oeuvre. In this case, the name of the studio reflects the two key components that are intended to be conveyed whilst representing the foundation of the site’s interactive character.
Reducing navigation to two areas – “who” and “what”– allows for radical simplification whilst also allowing scope for playful treatment of the content. The division system for the screen leads to a blending of content from the two areas, owing to the thematic breaking up of the two halves that occurs during interaction.
When stationary, the visual configuration of the site is characterised by a strong typographic profile combined with graphics of reproduction photographs. When one interacts with the site, the regularity of its layout is disrupted by transitions that appear erratic and by unexpected modifications to the interaction design.
Ingo Offermanns
http://ingooffermanns.com
Der Gestalter und Professor für Grafikdesign Ingo Offermanns bewegt sich in seinen Arbeiten zwischen Tradition und Moderne, Konvention und Experiment. Umso schwerer ist es, für all diese Facetten und Möglichkeiten der inhaltlichen Interpretation eine passende, der Vielfalt gerecht werdende digitale Form der Präsentation zu finden.
Es besteht immer eine Spannung in der Fokussierung auf Inhalt oder Objekt. So bietet der Umgang mit ihrer Darstellung zu Beginn immer die Fragestellung nach der Möglichkeit der Vermittlung der in den Arbeiten aufbereiteten Inhalte.
In Offermanns Worten ist "Grafik Design […] eine Disziplin der Weltbemächtigung, des Übersetzens, der Konstruktion, der Repräsentation, der Erinnerung und der Multiplikation.“¹
In diesem Fall münden die Versuche der exakten Abbildung der von Offermanns erwähnten Dimensionen von Grafikdesign darin, den Geist, die Vielfalt und das Gefühl seiner Arbeiten als visuellen Auszug widerzuspiegeln.
Die typografische Animation der Startseite stellt die visuelle Interpretation der auftretenden Kontraste dar. Sie transferiert traditionelle Arbeiten in die Jetztzeit und fungiert gleichermaßen als Bruch, um die Seitengestaltung von den gezeigten Arbeiten zu trennen.
Im Weiteren beschränkt sich die Seite auf klares und minimalistisches Interaktions- und Grafikdesign. Sowohl im Bild als auch im Text liegt der Fokus dabei in jedem Zustand auf dem Inhalt. Einzelne Projekte bewegen sich auf der Z-Achse, Metainformationen auf der Y-Achse und die Navigation zwischen den Projekten auf der X-Achse. Dies ermöglicht trotz maximaler Reduktion eine abwechslungsreiche User Journey.

Diese Seite ist in Zusammenarbeit mit Maximilian Kiepe entstanden.

¹ Ingo Offermanns, Hamburg, 2015
The works of designer and professor of graphic design Ingo Offermanns combine tradition and modernity, convention and experiment. This makes it all the more difficult to find a digital form of presentation that does full justice to all this diversity and all the facets and possible interpretations of the content.
There is always a tension in focusing on content or object. At the beginning, working with their representation always poses a question about the possibilities for conveying the content contained in the artworks.
In Offermanns’ words, graphic design is “[…] a discipline of mastering the world, of translation, of construction, of representation, of memory and of multiplication.”¹
In this case, the efforts to accurately represent the dimensions of graphic design described by Offermanns are expressed by reflecting the spirit, the diversity, and the feeling of his artworks in visual extract form.
The typographic animation of the start page represents a visual interpretation of the contrasts that emerge. It transfers traditional artworks into the here and now, but also functions as a “break” element, dividing the page design from the works on display.
Beyond this, the site restricts itself to clear and minimalist interaction design and graphic design. In images and texts alike, the focus is on the content, in every case. Individual projects are shown along the z-axis, meta-information on the y-axis, and navigation between the projects on the x-axis. This permits a varied journey for the user, in spite of maximal reduction.

This page was created in collaboration with Maximilian Kiepe.

¹ Ingo Offermanns, Hamburg, 2015
Roman Gysin
http://www.romangysin.com
Die Webpräsenz von Roman Gysin ist nur bedingt als Portfolio konzipiert. Es geht viel mehr um die Möglichkeit, Inspiration, Arbeitsprozess und Resultat gleichberechtigt zu behandeln und es dem Betrachter zu ermöglichen, seine eigenen gedanklichen Ansätze aus der Kombination der Elemente zu ziehen.
Anlässlich einer Ausstellung von Gysin schrieb die Zürcher Galerie Herrmann & Germann Contemporary „[...] Zufall und Absicht, die Geste und der Akt spielen eine ausschlaggebende Rolle in der Inszenierung der aufeinander treffenden Einzelarbeiten“.¹ Ähnlich verhält sich auch das Interaktionskonzept für die digitalen Ausstellungsfläche. Der Interagierende kann aus Versehen zum Gestaltenden werden, in dem er mit dem Eintritt der Maus in ein bestimmtes Areal der Seite einen Mechanismus betätigt der Farbe und Bildwelt der Seite manipuliert und somit die Arbeit in einen neuen Kontext rückt.
Auch die eher konventionelle digitale Interpretation eines Kunstkataloges, durch indexikalisch gelistete Bilder und die dazugehörigen Beschreibungen, wird durch das zufällig wirkende Streben der Bilder in den linken oberen Seitenrand und die damit entstehenden Weißräume erst auf den zweiten Blick gebrochen.

¹ Herrmann & Germann Contemporary (2016), Zürich
Roman Gysin’s web presence is not exactly intended as a portfolio. Instead, the idea is to put opportunity, inspiration, the working process, and the result on an equal footing, and to enable the viewer to combine the elements to form their own mental pattern.
An exhibition of Gysin’s work prompted the Zürich gallery of Herrmann & Germann Contemporary to write that: “[...] coincidence and intention, gesture and action play a critical role in the presentation of the individual artworks in confrontation.”¹ The interactive concept for the digital exhibition space is similar. A user who interacts with the content may also inadvertently become a designer: if the mouse cursor enters a specific area of the site, it activates a mechanism that manipulates the website’s colour and image world, giving the artwork a new context.
When one looks more closely, the seemingly chance images at the upper left-hand edge of the page and the resulting white spaces instantly do away with the other conventional digital interpretation of an art catalogue, with pictures listed in an index with an accompanying description.

¹Herrmann & Germann Contemporary, Zürich, 2015
Analytische Grafik
http://klassegrafik.de
Terminkalender, Portfolio und Informationen zu Studium und Lehre sind die auf der Webpräsenz der Klasse Grafik verhandelten Überpunkte. Diese Vielzahl an heterogenem Inhalt fordert ein klares Grafikdesign und bedingt ein noch klareres Interaktionsdesign.
Der Vorhang fällt auf der Startseite, ein beinahe bombastischer Schriftzug macht Platz für ein sehr aufgeräumtes, beinahe tabellarisch anmutendes Layout. Die Kategorisierung der Inhalte in zwei übergeordnete Rubriken (Studierende/Studium) wird durch einen Splitscreen ermöglicht. Dieser bildet gleichzeitig die Bühne für jeglichen Bildinhalt der Seite. Diese Art der Trennung ermöglicht es, trotz maximaler Klarheit und Strukturierung die Inhalte spielerisch zu erkunden.
Trotz der hohen Präsenz der inhaltlichen Ausrichtung stehen die Studierende und deren Arbeiten im Vordergrund, zum einen durch die ausschließlich in diesem Kontext vorkommende visuelle Hinterlegung mit Bildmaterial (Portfolio/Blog) zum anderen durch einen Bruch der Gestaltung im Studierendenbereich.

Diese Seite ist in Zusammenarbeit mit Jana Reddemann, Max Prediger und Roman Fischer entstanden.
“Appointment calendar”, “portfolio” and “study and learning information” are the main headings on the Klasse Grafik web presence. Such a large quantity of heterogeneous content requires a clear graphic design, and an even clearer interaction design.
As the curtain falls on the start page, an almost bombastic line of text makes way for a very clear and tidy, almost tabular layout. The categorising of content into two overarching rubrics (students/study) is enabled by a split screen. At the same time, these provide the stage for all picture content of the site. This form of separation enables a playful investigation of the content, juxtaposed with maximal clarity and structuring.
In spite of the site being strongly oriented toward content, the students and their pieces of work are in the foreground: firstly, through the visual placement of image material which appears exclusively in this context (portfo­lio/blog), and secondly through a “break” in the design to mark the “students” area.

This page was created in collaboration with Jana Reddemann, Max Prediger, and Roman Fischer.
Benjamin Gottwald
http://benjamingottwald.com
Erzählung bildet den Grundstein für Gottwalds Arbeit, sei es in als Einzelbilder funktionierenden Illustrationen oder in den Sequenzen seiner (unter Bachwald erscheinenden) Comics.
Die in den Büchern und Zeichnungen fehlende Dimension der Zeit wird auf der Startseite seiner Webpräsenz herangezogen, um durch Bewegung den Interagierenden zum Akteur der Geschichte zu machen und ihn letztendlich in den Kosmos des Inhalts zu ziehen.
Im weiteren Verlauf bildet ein klares, lineares Layout in Kombination mit verspielter Typografie den Rahmen, in dem die mit viel Witz erzählten und teilweise etwas absurden Szenarien Gottwalds ihr Eigenleben ungestört entfalten können.
Narrative is the keystone of Gottwald’s artwork, both in his individual images functioning as illustrations and in the sequences of his comics (published by Bachwald).
The start page of his web presence draws on the dimension of time – absent from books and drawings – by using movement to make the person interacting with the content an active part of the story, and, ultimately, to draw that person into the cosmos of the content.
In the pages that follow, a clear, linear layout combined with playful typography provides a framework in which Gottwald’s wittily related and sometimes rather absurd scenarios can unfold and reveal a life of their own.
Sophie Schweighart
http://sophieschweighart.com
Erzählungen aus der eigenen Welt sind das Leitmotiv der Arbeiten von Sophie Schweighart. Surreale Motive stehen im Fokus ihrer Fotografien und performativen Darstellungen, in denen inszenierte Szenen aus dem nicht Existierenden künstlich zum Leben erweckt werden.
Die in ihrer Dramaturgie beinahe filmisch wirkenden Arbeiten werden in der Struktur der Webseite ausschnittsweise in den Kontext ihres Gesamtwerks gestellt. Dabei wird die Dimension der einzelnen Arbeiten erst durch die Interaktion und das Erscheinen der Metainformationen ersichtlich.
Der Zoom, welcher sich auf die komplette Seite bezieht und einzelne Bilder in den Fokus stellt, ermöglicht dem Betrachter, seine oberflächlichen Eindrücke mit Details anzureichern. Im gezoomten Zustand besteht die Möglichkeit, zwischen den Arbeiten zu navigieren, ohne diesen dabei zu verlassen.
Auch die passive Interaktion in Form der Betrachtung hat Einfluss auf das Verhalten der Darstellung. Die Seite versinkt nach einigen Sekunden der Ruhe in der Dunkelheit und rahmt Schweigharts Arbeiten in Schwärze.
Narratives from her own world provide a common thread that runs through the artworks of Sophie Schweighart. Her photographs focus on surreal motifs, and on performative representations that breathe artistic life into non-existent choreographed scenes.
The structure of the website allows Schweighart’s artworks, whose dramaturgy gives them an almost filmic quality, to be shown in the context of her overall oeuvre (a selection). The dimension of the individual artworks becomes visible only through interaction and the appearance of meta-information.
The zoom function, which can be applied to the whole site, and places individual images in focus, enables the viewer to reveal details that enhance their superficial impressions. When the page is in zoom mode, it is possible to navigate between the artworks without cancelling zoom mode.
Passive interaction – viewing – also influences the presentation. If it is left undisturbed for a number of seconds, the page goes dark, framing Schweighart’s artworks in black.
Edward Greiner
http://edwardgreiner.de
Fotografie spielt in jedem Medium eine Rolle, allerdings ist nicht jede Art für jedes Medium gedacht oder gar geeignet. So kann ein digitales Fotografieportfolio im Optimalfall zwar den Charakter der einzelnen Serien repräsentieren, doch nie die für eine Ausstellungssituation gedachten fotografischen Serien in ihrer Ganzheit erfassen.
Greiners künstlerische Arbeit rangiert zwischen Grafik und Architektur, verhandelt dabei immer wieder die Thematik einer künstlichen, vom Menschen geschaffenen und manipulierten Welt. Die Verfremdung des eigentlich Gezeigten spiegelt sich im typografischen Umgang mit den Titeln wider. Nie ist die Serie, geschweige denn das einzelne Bild aus dem Kontext gelöst zu sehen. Der um die Arbeiten entstehende Weißraum wird durch die Typografie gebrochen und lässt dem Betrachter nur das Gesamtbild.
Um eine Trennung und Herarchisierung der Inhalte vorzunehmen, wurde eine Teilung in drei Ebenen vorgenommen. Auf der Einstiegsebene befinden sich die künstlerischen Arbeiten in Form eines linearen Gangs durch eine Ausstellungssituation, in der zweiten Ebene sämtliche Zusatzinformationen sowie der Zugang zu einem Passwortgeschütztem Bereich der Greiners kommerzielle Arbeit beinhaltet.
Die Reduktion der Interaktion auf zwei der konventionellsten Elemente (Klick, Scroll) bedarf nach einigen Tests allerdings einer Einführung, die in diesem Fall durch eine dem Cursor folgende „Bedienungsanleitung“ direkt in den einzelnen Bereichen gegeben wird.
Photography plays a role in every medium, but not every kind of photography is intended for– or even suitable for – every medium. For instance, a digital photographic portfolio may, in optimal conditions, be able to represent the character of the individual series, but it can never capture the totality of several photographic series intended for an exhibition context.
Greiner’s artistic work extends to both graphics and architecture, and repeatedly addresses the theme of an artistic world that is created and manipulated by human beings. The quality of alienation in what is actually shown is reflected in the typographical handling of the titles. Individual pictures and series alike cannot be disassociated from their context. The white space around the artworks is broken up by the typography, leaving the viewer with only the overall picture.
In order to undertake a separation and hierarchisation of the content, it was divided into three levels. At the entry level, the artworks appear in the form of a linear path through an exhibition setting. All additional information, plus access to a password-protected area containing Greiner’s commercial work, is located on the second level.
A number of tests, however, showed that if interaction was to be reduced to two of the most conventional elements (click and scroll), then an introduction would be required. In this case, this is done by means of “operating instructions” that follow the cursor, located directly in the individual areas.
T H E PRESS GROUP
http://thepressgroup.de
Die Option, im digitalen Raum Zeit in Form von Ton und Bewegung als Gestaltungselement einzusetzen, bildet die Grundbedingungen zur Entstehung von Interaktionskonzepten, die in ihren Möglichkeiten mit materiellen Objekten verwandt sind.
Im Fall der Interimsseite des Plattenlabels The Press Group wird durch wenige Effekte, die auf die physische Imitation eines Klangkörpers abzielen, eine Art interaktives, digitales Glockenspiel erzeugt.
Diese Interpretation von Klang im digitalen Raum bildet den inhaltlichen Bogen der Seite zur musikalischen Experimentierfreude der auf dem Label vertretenen Künstler.

Diese Seite ist in Zusammenarbeit mit Max Prediger entstanden.
In the case of the record label The Press Group’s interim site, a small number of effects that aim to physically imitate a resonating body are used to produce a kind of interactive, digital glockenspiel.
This interpretation of sound in digital space provides the arc for the content on this site, which showcases the experimental activities of the artists represented by the record label.

This page was created in collaboration with Max Prediger.
Julian Charriere
http://julian-charriere.net
Der Künstler Julian Charrière bewegt sich in seinen Arbeiten im Raum zwischen jetzt und früher und ermöglicht es dem Betrachter, sich verstärkt als Teil einer vergänglichen, gefährdeten, sich im stetigen Umbruch befindenden Welt zu sehen.
"Charrière ist ein neoromantischer Naturabenteurer, der auf das Schmelzen der Pole aufmerksam macht, indem er an Ort und Stelle Löcher ins Eis brennt. Gerade erst schliff er für seine Installation We Are All Astronauts Globen ab, um zu zeigen, dass sich die Welt selbst kaputtmacht.“¹
Der white cube artige digitale Ausstellungsraum orientiert sich an einem klassischen Kunstkatalog und bildet einen grafischen Rahmen, der genug Platz zur Entfaltung der teilweise fragil wirkenden Arbeiten lässt. Die Funktionsweise der Navigation erschließt sich auf der Landingpage, eine numerische Auflistung der Projekte bildet den Index. – Im Verlauf der Interaktion rückt dieser zur Seite und bildet, nun in minimierter Form, die Möglichkeit zur schnellen Navigation.
Die Abbildungen von Charrièrs Einzelarbeiten und Serien beleuchten diese aus unterschiedlichen Perspektiven, dokumentieren Prozess und Ausstellungssituation. Durch die Präsenz der vorangehenden und nachfolgenden Bilder steht jede einzelne Ansicht im Kontext des Ganzen und kann vom Betrachter durch die visuelle Zurücknahme der Angrenzenden jedoch auch als Einzelbild gesehen werden.

Diese Seite ist in Zusammenarbeit mit Maximilian Kiepe entstanden.

¹Art Magazin / Birgit Sonna /12.08.2014
In his artworks, the artist Julian Charrière moves between present and past, allowing viewers to see themselves as part of a transient, endangered world in a state of constant upheaval.
“Charrière is a neo-romantic nature adventurer who draws attention to the melting of the poles by burning holes in the ice in certain locations. In his installation We Are All Astronauts, he ground down globes, in order to show that the world is destroying itself.”¹
The white cube-like digital exhibition space is based on a classical art catalogue and constitutes a graphical framework that provides sufficient space for the unfolding of the sometimes fragile-looking artworks. The functioning of the navigation is revealed on the landing page, whilst an index is provided by the numerical listing of the projects. – As one interacts, this moves to the side, and, in minimised form, allows for quick navigation.
The reproductions of Charrièr’s individual artworks and series illuminate them from different perspectives, documenting the process and the exhibition context. Each individual view is placed in the context of the whole through the presence of the preceding and following image, but can also be viewed as an individual image thanks to the visual unobtrusiveness of the neighbouring pictures.

This page was created in collaboration with Maximilian Kiepe.

¹Art Magazin / Birgit Sonna /12.08.2014
Hannah Sophie Dunkelberg
http://hannahsophiedunkelberg.com
Sowohl in der Inszenierung als auch in ihren Arbeiten beschäftigt sich Hannah Dunkelberg mit der abstrakten Abzeichnung des Raumes auf dort positionierte Objekte. Durch diese Herangehensweise kommt es immer wieder zur Neukombination durch Überlagerungen, eine in sich statische Arbeit interagiert mit seiner Umwelt und kann somit an jedem Ort neu gesehen und gelesen werden.
Das blogartige Portfolio ist ein Versuch, die dabei entstehende Leichtigkeit auf den digitalen Raum zu übertragen. Transparenz und Überlagerung werden aufgegriffen in dem eine zufällig gewählte Form als multiplizierte Ebene den Inhalt überlagert und somit zu einer neuen Gesamtkomposition führt. Bei Scroll nach unten verschwindet die Navigation und mit ihr das einzige in seiner Visualität statische Element der Seite
In terms of presentation and in her works, Hannah Dunkelberg interests herself in the abstract tracing of the space onto objects positioned there. This approach constantly produces new combinations through overlappings. An artwork that is, in itself, static interacts with its environment, and can therefore be seen and read in a new way in every location.
The blog-like portfolio is an attempt to apply this sense of ease to digital space. Transparency and layering are incorporated by overlaying a randomly chosen shape, multiplied to cover the whole surface, onto the content, thereby generating a new overall composition. When one scrolls down, the navigation – the only visually static element on the page – vanishes.
The option of deploying time in the form of sound and movement as a design element in digital space provides the basic conditions for the production of interaction concepts whose potential relates to material objects.
David Schiesser
http://davidschiesser.com
Der digitale Ausstellungsraum für den Künstler David Schiesser bezieht sich auf die medialen Konsumgewohnheiten der Nutzer. Nichtverfügbarkeit spielt in Zeiten des unbegrenzt scheinenden Angebotes und dessen Erreichbarkeit beinahe keine Rolle mehr. Einer der negativen Aspekte ist die daraus resultierende mangelnde Wertschätzung des Inhalts. Visuelle Eindrücke werden zum Konsumgut, das Gesehene zum vorüberziehenden Rauschen in einer mit Reizen überladenen Welt.
Das Seitenkonzept beinhaltet einen häufigen Wechsel des gesamten Inhalts, was zu einer zeitlich begrenzten Verfügbarkeit und somit zu einer künstlich herbeigeführten Verknappung des Bildmaterials führt. Jede gezeigte Bildabfolge hat ein nicht vorherzusagendes Verfallsdatum. Die so erzeugte Vergänglichkeit wird durch das Anzeigen des Änderungsdatums ins Bewusstsein gerufen.
Der häufige und radikale Wechsel des Inhalts ermöglicht es Schiesser, seine Seite frei zu kuratieren und dabei ein Spektrum abzudecken, welches von einer temporären Ausstellung bis hin zu banalen oder gar lustigen Inhalten reicht und diese miteinander vermischt.
The digital exhibition space for the artist David Schiesser responds to the user’s media consumption habits. In an age of seemingly unlimited product ranges and attainability, non-availability is barely a factor anymore. One negative aspect of this is the resulting lack of awareness of the value of content. Visual impressions become a consumer commodity, and everything we see becomes simply a passing buzz in a world overloaded with stimuli.
The site concept includes frequent changes of the entire content; this means that content is available for a limited time only, and also leads to a restricted quantity of image material. Each displayed sequence of images will be removed at a non-specified future date. To remind viewers of this transient quality, the date of the change being made is displayed on the site.
This frequent and radical changing of the content enables Schiesser to curate his site without restrictions, thereby covering a wide spectrum – including a temporary exhibition, but also banal or even comical content – and mixing these areas together.
Von Zehn
http://vonzehn.de
Die Fotografieausstellung „Von Zehn, junge Positionen zur Wirklichkeit“ bot, wie der Name bereits vermuten lässt, zehn Hamburger Fotografen die Möglichkeit, ihre persönliche Sicht auf die Welt mit den Besuchern zu teilen. Das Spektrum hierbei reicht von schwarzweißer analogfotografie über dokumentarische Arbeiten bis hin zu digitalen Snapshots.
Im Gegensatz zum Print bietet eine digitale Darstellung die Option, mit statischen und nicht statischen Flächenbelegungen zu spielen, im Falle dieser Ausstellung wurde die Möglichkeit verwendet, um ein hierarchisches Gleichgewicht in der visuellen Representation der einzelnen Fotografen und ihrer Arbeiten herzustellen. Der Ausstellungstitel wird beim Laden der Seite durch einen Zufallsmechanismus im Viewport positioniert und überschneidet sich somit für jeden Besucher mit einem anderen Bild. Die Seite ist in zehn Schaltflächen geteilt und jede ermöglicht den Blick auf eine neue Arbeit und dessen Autor.

Diese Seite ist in Zusammenarbeit mit Julian Mader entstanden.
As the name suggests, the photography exhibition “Von Zehn, junge Positionen zur Wirklichkeit” (lit. “From ten, new positions on reality”) gives ten Hamburg photographers the chance to share their own personal view of the world with visitors. The spectrum ranges from black-and-white analogue photography to documentary photography work to digital snapshots.
Unlike printed formats, a digital representation offers the option of playing with the filling of surfaces in a static and non-static way. In the case of this exhibition, this provided the opportunity to create a hierarchical balance in the visual representation of the individual photographers and their artworks. When the page loads, a random generator positions the exhibition’s title within the viewport, so that each viewer sees it in intersection with a different picture. The page is divided into ten function buttons, each of which reveals to view a new artwork and its author.

This page was created in collaboration with Julian Mader.
Disziplinäre Grenzgänge
http://disziplinaeregrenzgaenge.de
In der Stadtplanung wird aufgrund veränderter Anforderungen über neue Wege nachgedacht. Das Symposium „Disziplinäre Grenzgänge“ beschäftigt sich verstärkt mit dem Wunsch einer dichteren Vernetzung von Theorie und Praxis. Im Rahmen des Veranstaltungsprogramms setzen sich in einzelnen Modulen Experten unterschiedlicher Professionen gemeinsam mit aktuellen Themen der Stadtplanung und Entwicklung auseinander, Ergebnisse werden während und nach des Symposiums dokumentiert und evaluiert.
Die Webseite orientiert sich in ihrem Aufbau an einem konventionellen Onepager, bricht die Erwartungen allerdings in ihrer Interaktion und Navigation. Das Grafik- und Interaktionsdesign lehnt sich an den der Thematik innewohnenden Wunsch an, neue Wege zu finden, Konventionen zu überdenken und diese gegebenenfalls zu brechen. So löst die Betätigung der Navigation eine Kettenreaktion aus und verdeutlicht den Zusammenhang zwischen den einzelnen Bereichen.
Um die während des Symposiums stattfindende Erarbeitung von Inhalten abzubilden, startet die Seite mit Platzhaltern für Bilder und analysierende/evaluierende Texte, welche nach Abschluss der Veranstaltung ausgetauscht werden.
In urban planning, new ways of working are being considered, in response to changed requirements. The symposium “Disziplinäre Grenzgänge” (“Disciplinary Boundary Crossing”) looks intensively at the wish for a closer interconnection of theory and praxis. In connection with the programme of events, a number of modules take place in which experts from different professions come together to discuss topical themes in urban planning and development, with the proceedings documented and evaluated during and following the symposium.
The website’s construction is modelled on a conventional one-pager. Its interaction and navigation models, however, break with all expectations. The graphic and interaction design references the subject matter: the desire to find new paths, to rethink conventions, and occasionally to break with them. Using the navigation triggers a chain reaction, revealing the connections between the individual areas.
In order to reflect the development of content over the course of the symposium, the page starts with placeholders for images and analysis/evaluation texts, which will be exchanged following the events.
David Liebermann, Wilhelmsburger Platz 14, 20539 Hamburg – Germany
Mail: hallo@davidliebermann.de / Tax ID: 46/144/03301

Image licensing for: Roman Gysin © Roman Gysin, We Do Studio © We Do Studio, Edward Greiner © Edward Greiner, Ingo Offermanns © Ingo Offermanns, Von Zehn © Jonas Fischer, Benjamin Gottwald © Benjamin Gottwald, Julian Charrière © Julian Charriére, Sophie Schweighart © Sophie Schweighart, Hannah Sophie Dunkelberg © Hannah Sophie Dunkelberg, David Schiesser © David Schiesser

This website uses Google Analytics, a web analytics service provided by Google, Inc. (“Google”). Google Analytics uses “cookies”, which are text files placed on your computer, to help the website analyze how users use the site. The information generated by the cookie about your use of the website will be transmitted to and stored by Google on servers in the United States . In case IP-anonymisation is activated on this website, your IP address will be truncated within the area of Member States of the European Union or other parties to the Agreement on the European Economic Area. Only in exceptional cases the whole IP address will be first transfered to a Google server in the USA and truncated there. The IP-anonymisation is active on this website. Google will use this information on behalf of the operator of this website for the purpose of evaluating your use of the website, compiling reports on website activity for website operators and providing them other services relating to website activity and internet usage. The IP-address, that your Browser conveys within the scope of Google Analytics, will not be associated with any other data held by Google. You may refuse the use of cookies by selecting the appropriate settings on your browser, however please note that if you do this you may not be able to use the full functionality of this website. You can also opt-out from being tracked by Google Analytics with effect for the future by downloading and installing Google Analytics Opt-out Browser Addon for your current web browser: http://tools.google.com/dlpage/gaoptout?hl=en.