PORTFOLIO
Strona portfolio zbudowana tak, żeby osoba która już jest zainteresowana — i przyszła z CV — mogła dotrzeć do tego co ważne bez zbędnych kliknięć.
ZAŁOŻENIE
"Człowiek który trafił na portfolio już podjął decyzję żeby zajrzeć. Każde dodatkowe kliknięcie to koszt który można wyeliminować."
KONTEKST
Portfolio to pierwsze wrażenie u rekrutera który jest już zainteresowany — przyszedł z CV. Architektura strony powinna to uszanować — nie wymagać dodatkowych akcji żeby dotrzeć do tego co ważne.
PODEJŚCIE
Jeden spójny widok zamiast struktury z nawigacją. Projekty, proces myślowy i kontakt — wszystko dostępne bez przechodzenia między stronami.
ONE-PAGER
Wiele portfolio działa tak samo: strona główna z przyciskiem, lista projektów po kliknięciu, projekt po kolejnym kliknięciu. Każde przejście to decyzja którą użytkownik musi podjąć.
Każda akcja którą użytkownik musi podjąć to moneta którą wydaje. Portfolio powinno być zaprojektowane tak żeby te monety wydawał na treść, nie na nawigację.
Istnieje eksperyment dotyczący domyślnej zgody na oddawanie organów — kraje z formularzem opt-in mają kilkanaście procent zgód, kraje z opt-out dobijają do stu. Nie dlatego że ludzie mają inne przekonania — dlatego że domyślny stan ma znaczenie.
Zrezygnowałem z osobnej strony /projects i karty projektów jako punktu wejścia. Timeline na stronie głównej pokazuje projekty od razu — bez kliknięcia. Po projektach sekcja o mnie, zanim użytkownik trafi na footer.
SYSTEM MDX
Każdy projekt to folder: meta.json z metadanymi, config.ts z motywem wizualnym, pl.mdx i en.mdx z treścią. Zero centralnej bazy, zero zewnętrznych zależności.
System nigdy nie zaskoczy mnie wymaganiem zewnętrznego serwisu. Pliki są lokalne, format jest otwarty, migracja nie wymaga przepisywania logiki.
ANIMACJE
Trzy różne narzędzia do trzech różnych zadań — nie dlatego że więcej znaczy lepiej, ale dlatego że każde z nich ma inny stosunek możliwości do kosztu.
FRAMER MOTION
Mikrointerakcje, stany UI, przełącznik motywu. Lekki, reaktywny na stan Reacta, wystarczający do prostych animacji.
GSAP
Animacja Hero (velocity-driven skew), SectionScroller, sekwencje scroll-triggered. Płynne, precyzyjne, niezbędne przy złożonych timeline'ach.
THREE.JS
Wireframe kostka w footerze — właściwe narzędzie do 3D i tylko do tego jest tu używane. EdgesGeometry + LineSegments, alpha canvas, cleanup na unmount.
REFLEKSJA
To jedyny projekt bez zewnętrznego terminu czy zleceniodawcy — cała presja czasu była wewnętrzna. Największym wyzwaniem nie był brak wiedzy, tylko brak naturalnego "stop": łatwo było dalej dopieszczać animacje i strukturę zamiast uznać wersję za gotową do pokazania. Granicę ostatecznie wyznaczyłem sam — kiedy treść i case studies są kompletne, dalsze poprawki wizualne przestają być priorytetem.
Outcome
Portfolio live z własną domeną, responsywne na mobile. Dodawanie nowych projektów nie wymaga modyfikowania kodu aplikacji — tylko pliki MDX w nowym folderze. Następny etap: dalsze projekty w timeline.