Friedrich Siever

12. Mai 2021

FredArt - Portfolio Page mit Page Transitions und next.js

  • gsap
  • next.js
  • Serverless
  • react
title screenshot

Projektbeschreibung

Die Triebkraft hinter diesem Projekt war die Suche nach einem neuen Zuhause für meine digitale Kunst aus der Pre-AI-Ära. Insbesondere reagierte ich auf die Veränderungen bei Instagram, das verstärkt auf Videos setzte, um sich den neuesten Trends anzupassen. Mein Hauptanliegen bestand jedoch darin, die Möglichkeiten von Page Transitions und Next.js zu erkunden. Dabei ließ ich mich von den beeindruckenden Arbeiten der eleganten Seagulls inspirieren, insbesondere von Ryan LaBar.

Herausforderungen

Die Gestaltung von Page Transitions war mit next.js generell nie wirklich intuitiv und einfach. Zusätzlich hatte ich das Ziel, eine vollständig serverlose Website zu schaffen, und dabei bewusst auf Vercel zu verzichten, um maximale Unabhängigkeit und Kosteneffizienz zu gewährleisten. Eine besondere Herausforderung war es, die Features der Next.js Image-Komponente in eine statische Website zu integrieren. An dieser Stelle möchte ich einen besonderen Dank an Niels aus Hamburg aussprechen und seine herausragende Bibliothek next-image-export-optimizer.

Rollen

  • Chef meiner eigenen Design-Studie

Zur Demo Page