Adaptacyjna szata graficzna sklepu internetowego z biżuterią na WordPress
Ukraińskiemu brandowi autorskich wyrobów jubilerskich potrzebny był niestandardowy sklep internetowy do prezentacji kolekcji, poszczególnych wyrobów, galerii oraz dalszej integracji z WordPress.
=== MOJE ZADANIE ===
Przygotować responsywny, wielobrowarowy i interaktywny layout według projektu w Figma do dalszego przekazania deweloperowi WordPress.
=== CO ZOSTAŁO ZROBIONE ===
• zaprojektowano główne strony serwisu: Strona główna, Kolekcja, Slug kolekcji, Produkt, Pojedynczy obiekt, Galeria, Strona statyczna;
• zrealizowano responsywny layout dla desktopu, tabletu i mobile;
• przygotowano layout z uwzględnieniem przyszłej integracji z WordPress;
• zrealizowano logikę front-endową dla interaktywnych elementów;
• zrealizowano slidery, animacje i interaktywne bloki;
• przygotowano niestandardową siatkę produktów;
• zrealizowano animowane banery dla stron kolekcji;
• zoptymalizowano layout, aby makieta miała zielone wskaźniki w Google Speed Test.
=== CECHY PROJEKTU ===
Główną cechą projektu jest niestandardowe podejście designerskie do sklepu internetowego. To nie był typowy szablon e-commerce, a wizualnie wyrazista strona dla autorskich biżuterii z niestandardowymi siatkami, animacjami i oddzielną logiką wyświetlania kolekcji.
Szczególnie skomplikowana była strona kolekcji. Na desktopie została zrealizowana w formacie pełnoekranowego pionowego slidery z przewijaniem i animowanym pojawianiem się elementów banera. Na mobile ta sama logika została dostosowana do innego formatu UX: poziomy slider obrazów z opisem pod nim.
Osobno opracowano layout niestandardowego koszyka i checkout.
=== WYNIK ===
Klient otrzymał responsywny działający makietę wszystkich głównych stron sklepu internetowego z gotową funkcjonalnością front-endową do dalszej integracji z WordPress.
Layout zachował niestandardową wizualną koncepcję projektu, poprawnie działał na różnych urządzeniach i był przygotowany do przekazania deweloperowi WordPress.
=== TECHNOLOGIE ===
HTML5, SCSS, JavaScript, jQuery, BEM, Animate.css, Slick.js, layout gotowy do WordPress, Gulp
#layout #responsywnyLayout #HTML #SCSS #JavaScript #jQuery #WordPress #Figma #PixelPerfect #BEM #Gulp #sklepInternetowy #eCommerce #markaJubilerska #handmadeJewelry #SlickJS
=== MOJE ZADANIE ===
Przygotować responsywny, wielobrowarowy i interaktywny layout według projektu w Figma do dalszego przekazania deweloperowi WordPress.
=== CO ZOSTAŁO ZROBIONE ===
• zaprojektowano główne strony serwisu: Strona główna, Kolekcja, Slug kolekcji, Produkt, Pojedynczy obiekt, Galeria, Strona statyczna;
• zrealizowano responsywny layout dla desktopu, tabletu i mobile;
• przygotowano layout z uwzględnieniem przyszłej integracji z WordPress;
• zrealizowano logikę front-endową dla interaktywnych elementów;
• zrealizowano slidery, animacje i interaktywne bloki;
• przygotowano niestandardową siatkę produktów;
• zrealizowano animowane banery dla stron kolekcji;
• zoptymalizowano layout, aby makieta miała zielone wskaźniki w Google Speed Test.
=== CECHY PROJEKTU ===
Główną cechą projektu jest niestandardowe podejście designerskie do sklepu internetowego. To nie był typowy szablon e-commerce, a wizualnie wyrazista strona dla autorskich biżuterii z niestandardowymi siatkami, animacjami i oddzielną logiką wyświetlania kolekcji.
Szczególnie skomplikowana była strona kolekcji. Na desktopie została zrealizowana w formacie pełnoekranowego pionowego slidery z przewijaniem i animowanym pojawianiem się elementów banera. Na mobile ta sama logika została dostosowana do innego formatu UX: poziomy slider obrazów z opisem pod nim.
Osobno opracowano layout niestandardowego koszyka i checkout.
=== WYNIK ===
Klient otrzymał responsywny działający makietę wszystkich głównych stron sklepu internetowego z gotową funkcjonalnością front-endową do dalszej integracji z WordPress.
Layout zachował niestandardową wizualną koncepcję projektu, poprawnie działał na różnych urządzeniach i był przygotowany do przekazania deweloperowi WordPress.
=== TECHNOLOGIE ===
HTML5, SCSS, JavaScript, jQuery, BEM, Animate.css, Slick.js, layout gotowy do WordPress, Gulp
#layout #responsywnyLayout #HTML #SCSS #JavaScript #jQuery #WordPress #Figma #PixelPerfect #BEM #Gulp #sklepInternetowy #eCommerce #markaJubilerska #handmadeJewelry #SlickJS