Mein Portfolio

Grossformatige Typografie mit dem Namen „Ricarda Schirato“ in Weiss und Rosa über einem schwarz-weiss Portrait einer lachenden Frau vor Industrierohren.

Schon wieder ist es soweit, die Diggezz-Abgabe eilt. Etwas Sinnvolles wollte ich machen. Etwas das meine Skills erweitert und nicht an meiner Motivation scheitert. Entschieden habe ich mich deshalb für eine Portfolio-Website.

Zur Website: Portfolio.RicardaSchirato

Angefangen hat das Ganze mit dem Design. Als Inspirationsquelle diente mir primär das Internet. Ich stiess dabei aber entweder auf sehr komplexe Seiten oder auf zu generische Vorlagen. Ich wollte jedoch mein eigenes Design erstellen, das zu meiner Persönlichkeit passt. Genau hier lag die grösste Herausforderung: Ich hatte lange keine klare Vorstellung und habe viel mit Farben, Schriften und Layouts experimentiert, nur um vieles wieder zu verwerfen. Rückblickend würde ich das Design heute bereits wieder anders umsetzen, doch irgendwann musste der Fokus auf das Coden gelegt werden.

Das Moodboard sowie erste Design-Entwürfe dienten als visuelle Grundlage für die Gestaltung meines Portfolios und halfen mir, Farben, Typografie und Stil zu definieren.

Das Coden selbst war für mich eine grosse Hürde. Davor hatte ich sehr, sehr viel Respekt, zumal ich leider keine Programmierqueen bin und ich mich mit den Programmiersprachen zusehends in den Algebraunterricht aus der Oberstufenschule zurückversetzt fühle. Trotz meiner Algebra-Flashbacks und gelegentlicher Schweissausbrüche habe ich mich erfolgreich durch die Code-Zeilen geschrieben.

Technik

Den Prototyp habe ich zuerst vorbildlich in Figma erstellt. Aufgrund von Zeitmangel habe ich dabei das Prinzip «mobile first» nicht konsequent umgesetzt und mich auf einen Desktop-Entwurf beschränkt. Die Portfolio-Website ist als Onepager konzipiert. Die Umsetzung erfolgte mit HTML und CSS, Animationen wurden mit einfachem JavaScript realisiert. Besonders herausfordernd war es die Animationen responsive zu gestalten. Ausserdem wäre ich ohne das Codex als KI-gestützte Unterstützung wahrscheinlich verzweifelt.

Fazit

Allein die Tatsache, dass die Website funktioniert und online ist, macht mich bereits stolz. Das Portfolio ist vielleicht kein Meisterwerk und im Nachhinein würde ich schon vieles anders machen. Dennoch repräsentiert mich und meinen Lernprozess. Ich habe viel Neues gelernt und vor allem meine Angst vor dem Coden überwunden.

Die Website ist einsehbar unter: Portfolio.RicardaSchirato

Gut
Im Projekt habe ich sowohl technisch als auch gestalterisch viel dazugelernt. Vor allem im Coden verstehe ich Zusammenhänge nun besser und fühle mich sicherer. Das Arbeiten mit Dummys, Ausprobieren und Testen hat mir dabei sehr geholfen. Auch wenn ich das Design mittlerweile ganz anders gestalten würde, habe ich durch das Projekt ein besseres Gespür entwickelt, eigene Entscheidungen getroffen und anschliessend versucht, diese technisch umzusetzen.

Verbesserungspotenzial
Ich hätte früher mit dem Projekt starten sollen. Durch den späten Einstieg entstand Zeitdruck, wodurch weniger Raum für das Ausprobieren blieb. Im Design hätte ich zudem noch mutiger und experimentierfreudiger sein können. Ich habe mich teilweise selbst eingeschränkt, aus Angst, dass sich gewisse Ideen technisch nicht oder nur schwer umsetzen lassen.

Schwierigkeiten
Eine grosse Herausforderung war der Umgang mit KI-generiertem Code. Durch die KI entstandene Fehler zu erkennen und nachträglich zu beheben war nicht immer einfach, besonders bei den Boxen-Animationen im Bereich Ausbildung in der Mobile-Version, bei denen der Trigger nicht wie erwartet funktionierte. Nebst den JavaScript-Animationen war auch die responsive Umsetzung für Mobile eine der grössten Herausforderungen beim Coden.