Portfolio

Titelbild Portfolio

Auch ich habe keine Mühen gescheut und meine Synapsen angestrengt. Nach langem Nachdenken, intensiver Recherche und einigen schlaflosen Nächten hatte ich schliesslich die zündende Idee:
Ich mache ein Portfolio. 

Okay, ich gebe zu, es ist vielleicht nicht die neuste Idee, aber ich lade euch trotzdem ein, einen Blick darauf zu werfen. Mein Ziel war es, meinen eigenen Stil auf einer Webseite zu präsentieren und meine Leidenschaften darzustellen.

Mein Design soll zum Erkunden einladen und einen auf eine kleine Reise mitnehmen. Mal sehen, ob es mir gelungen ist. 

Für die Umsetzung habe ich WordPress verwendet und mich in die unendlichen Weiten der Plugins gestürzt. Ausgestattet mit Elementor und Co. habe ich mich daran gemacht, mein Portfolio in die Tiefen des Internets zu katapultieren.

Hier kannst du mein Portfolio erkunden.

(stm)

Idee:

Ein ansprechendes Portfolio steht schon seit längerem auf meiner Liste. Als Freelancer, der bisher nur durch Bekannte und Empfehlungen an Aufträge kommt, ist es höchste Zeit, dies zu ändern. Für zukünftige Bewerbungen dient das Portfolio als Zusammenfassung meiner Arbeiten und Projekte und vermittelt einen ersten Eindruck von mir.

 

Vorgehen und Technik:

Als Erstes habe ich mich um das Design gekümmert. Hierfür habe ich im Procreate eine grobe Skizze der Webseite erstellt. Diese Skizze diente jedoch nur als grobe Idee, da sie sich im Laufe des Prozesses oft verändert hat. Im zweiten Schritt bin ich zu Adobe XD gewechselt, um mehr Details auszuarbeiten. Dabei hatte ich die Herausforderung, viele kleine Animationen einzubauen, um der Seite Leben einzuhauchen. Das Animieren der Animationen im XD erwies sich jedoch als zeitaufwändig, daher habe ich mich entschieden, sie nicht komplett zu animieren. Die XD-Vorlage diente lediglich als Inspiration, da ich die Seite letztendlich auch umsetzen musste. Apropos Designprozess, hier habe ich mich vom Titelbild inspirieren lassen, das ich im Procreate gezeichnet habe. Beim Titelbild habe ich an Netzwerke, Verbindungen und die virtuelle Welt gedacht.

Aufsetzen:

Dann ging es daran, die Webseite einzurichten. Für die WordPress-Installation musste ich den Support meines Hosts kontaktieren, konnte jedoch nach kurzer Zeit loslegen. Da ich in der Vergangenheit gute Erfahrungen mit Elementor gemacht hatte, habe ich mich dafür entschieden. Ich habe verschiedene YouTube-Tutorials angesehen, um mich damit vertraut zu machen.

Vorbereitung WordPress:

Das Universum der detaillierten Einstellungen, das sich mir offenbarte, war sowohl ein Segen als auch ein Fluch. Viele Animationen waren hinter einer Paywall versteckt, daher musste ich mich in die Welt der Plugins begeben. Dabei war es wichtig, nicht zu viele Plugins gleichzeitig zu nutzen. Daher habe ich mein eigenes Plugin-Set gebastelt, das sich auf Animationen konzentriert.

Vorbereitung des Inhalts:

Ich habe viele Bilder durchgesehen und einige davon im Lightroom bearbeitet, um einen ähnlichen Stil zu erreichen, damit sie farblich zueinander passen. Für die Projekte habe ich im Illustrator einzelne Titelbilder erstellt. Auch die Bilder für die Fähigkeiten sowie die Icons wurden im Illustrator erstellt.

Designumsetzung:

Die Verwendung verschiedener Plugins hat es mir einerseits ermöglicht, meine gewünschten Spielereien auszuprobieren. Allerdings können sie auch verwirrend sein, da viele ähnliche Funktionen bieten und man schnell den Überblick verlieren kann, wo man eine bestimmte Animation eingefügt hat. Ich habe viele verschiedene Abschnitte auf meiner Webseite verwendet und nur wenige Designwiederholungen. Dadurch wollte ich das Durchscrollen interessanter gestalten. Ein Nachteil dabei ist, dass es länger dauert, da keine Elemente stark wiederholt werden.

Animationen:

Hier konnte ich meiner Detailverliebtheit freien Lauf lassen, was gleichzeitig ein Fluch für eine so detailverliebte Person wie mich ist. Eine Webseite ist bekanntlich nie «fertig», und das gilt auch für meine Animationen. Bei jedem Durchscrollen fällt mir noch etwas auf: Eine Animation wirkt zu schnell, zu langsam, zu gross oder unharmonisch.

Fazit:

Das Designen von Webseiten macht mir grossen Spass. Die Umsetzung selbst… nun ja, es ist eine Hassliebe. Wenn ich mich im Editor und im Flow befinde, vergehen die Stunden wie im Flug. Wenn jedoch etwas nicht funktioniert, vor allem in Bezug auf den Host oder Fehlermeldungen, kann es frustrierend sein. Beispielsweise ist es mir nicht gelungen, SVG-Dateien auf WordPress hochzuladen. Mit Plugins hat es in der Vergangenheit immer funktioniert, aber dieses Mal habe ich wahrscheinlich eine Einstellung übersehen. Meine Detailverliebtheit zeigt sich in den Animationen. Wenn man jedoch zu viel mit Kleinigkeiten herumspielt, gerät man schnell in den Tunnelblick und verliert das Wesentliche aus den Augen. Bereits zu Beginn beim Procreate-Sketch hätte ich den Lesefluss und die Benutzererfahrung stärker berücksichtigen müssen. Es kam vor, dass ich eine Seite fertiggestellt hatte und mich dann fragte: «Was macht der Benutzer jetzt an diesem Punkt?» Dadurch musste ich spontan wieder in die Konzeptphase zurückkehren, was zwar nicht schlimm, aber zeitaufwändig ist.