Osobista Strona-Portfolio
To mój pierwszy kompleksowy projekt, stworzony od zera. Głównym celem było opracowanie nowoczesnej, czystej i interaktywnej strony-wizytówki, aby zaprezentować moje umiejętności, doświadczenie i przyszłe prace.
Cel Projektu
Stworzenie responsywnej strony, która będzie służyć jako moje cyfrowe CV. Ważne było zademonstrowanie nie tylko umiejętności technicznych, ale także zrozumienia zasad projektowania i UX/UI, których nauczyłem się podczas studiów.
Użyte Technologie
- HTML5 - Do tworzenia semantycznie poprawnej struktury strony.
- CSS3 - Do stylizacji, w tym Flexbox i Grid do układu, a także do implementacji animacji.
- JavaScript - Do dodawania interaktywności: animacji podczas przewijania, dynamicznego nagłówka i płynnych przejść.
- Font Awesome - Do używania ikon wektorowych.
Proces Pracy i Kluczowe Decyzje
Praca została podzielona na kilka etapów:
- Projekt i Planowanie: Na tym etapie opierałem się na swoich umiejętnościach projektowych, aby stworzyć minimalistyczny i intuicyjny interfejs. Wybrano spokojną paletę kolorów i czystą typografię dla lepszego odbioru informacji.
- Kodowanie i Stylizacja: Stworzono podstawowy szkielet i style. Szczególną uwagę zwrócono на responsywność, aby strona poprawnie wyświetlała się na różnych urządzeniach.
- Dodawanie Interaktywności: Za pomocą JavaScript zaimplementowano kilka kluczowych funkcji: animację pojawiania się elementów podczas przewijania, animację na pierwszym ekranie i ukrywający się nagłówek. To sprawiło, że strona stała się bardziej "żywa" i przyjemna w użyciu.
Wyzwania i Zdobyte Doświadczenie
Najciekawszym wyzwaniem było zaimplementowanie płynnych animacji, które uzupełniałyby stronę bez jej przeciążania. Praca z JavaScript `IntersectionObserver` do śledzenia wyglądu elementów była doskonałą praktyką. Najtrudniejszą częścią było dostosowanie projektu do urządzeń mobilnych. Ten projekt pozwolił mi również połączyć moje matematyczne myślenie w logice skryptu z moją kreatywnością w części wizualnej.