Behance Twitter LinkedIn Facebook
Startseite Portfolio Kontakt

Webdesign und Prototypenaufbau für einen freiberuflichen Fotografen

Kurzbeschreibung der Fallstudie

Mir wurden ein Logo (eine Kameraöffnung in Form eines weiblichen Symbols), einige Bilder für die Galerie und eine kurze Biografie zum Arbeiten präsentiert. Die Anfrage des Kunden sah folgendermaßen aus:
  • Das Design soll mutig und doch einfach sein.
  • Die Zielseite muss hervorstechen und besonders sein.
  • Die Bildergalerie sollte konventionell und einfach zu bedienen sein.

Angewandte Lösungen

Visuelles Design

Webseiten Design

Design der mobilen Website

Desktop/Laptop-Prototyp

Mobiler Prototyp

Details zum Projekt

Die Zielseite

TDie Idee hinter einem weiblichen Auge war es, das Konzept zu vermitteln, was ein Künstler macht: die Welt durch die Linse seiner eigenen Lebenserfahrung zu betrachten, die von ihren Ansichten geprägt und manchmal, wenn man es so sagen möchte, von ihren eigenen Vorurteilen getrübt wird. Sie erfassen etwas, das ihnen wichtig ist, und ein Teil davon kann auch bei uns Resonanz finden.
SDa Dorothy eine starke Feministin ist, habe ich beschlossen, ihr weibliches symbolförmiges Logo in die Pupille eines weiblichen Auges zu setzen. Ich verfärbte die Haut und ließ die Iris des Auges ihre ursprüngliche Farbe behalten. Ich dachte, es wäre ziemlich cool, die Logo-Blende in einen Link zu verwandeln, der beim draufklicken die Linse öffnet und den Betrachter zur Bildergalerie führt, mit anderen Worten, den Betrachter in die Welt des Künstlers hineinversetzt. Leider funktioniert dieser Effekt aufgrund eines Fehlers in der Online-Freigabefunktion von Adobe XD nur offline. Die im folgenden beschriebene Prototypsequenz kann jedoch zur Visualisierung des Übergangs beitragen.
Ich habe für das Leitbild eine abgerundete und ziemlich scharfe Schrift gewählt. Die Zielseite erwies sich als ziemlich mutig und doch weiblich, also genau das was Dorothy wollte.

Different dvices screens displaying Inspires marketing's services, testimonials and expertise sections
Phone and ipad screens showing the front page and the gallery of a photographer's web design

Mobiles Design

Die Ausrichtung des Porträts würde nicht zulassen, dass das Bild des Auges den gesamten Bildschirmbereich einnimmt. Deshalb habe ich es in der Mitte des Bildschirms mit dem Leitbild unten und dem Menü oben platziert. Die Galerie ist sehr einfach und minimalistisch dargestellt. Es hat Konsistenz in dem eigenen Design und dem Layout auf allen Bildschirmgrößen mit sehr dünnen Navigationspfeilen und schwarzem Hintergrund.

Prototypen

Ich habe zwei separate Prototypen erstellt: einen für die Geräte mit Querformat und einen für Geräte mit Hochformat (normalerweise mobile Geräte). Beide verwenden den Zeitübergang, um den Effekt des sich öffnenden Kameraobjektivs in der Mitte des Auges zu erzielen. Ich habe ursprünglich 7 Zeichenflächen verwendet, um den Übergang reibungsloser zu gestalten. Adobe XD konnte diese Anzahl von Zeitübergängen jedoch nicht verarbeiten und ist des Öfteren eingefroren, sodass ich die Anzahl der Zeichenflächen auf vier reduzieren musste (drei auf einem Mobiltelefon). Derzeit funktioniert es jedoch nur offline, und das Adobe-Team versucht, das Problem zu beheben.
Anhand das durchwischen wird auf den Mobilgeräten innerhalb der Galerie navigiert.

desktop prototype for a photographer's website design mobile prototype for a photographer's website design