Blog

12.12.2013
Funkcje

Nowy szablon domyślny - (r)ewolucja

System AtomStore przez ostatnie kilkanaście miesiący rozwijał się bardzo dynamicznie. Spowodowało to znaczący przyrost funkcji i elementów dostępnych w szablonie sklepu. Intensywny rozwój i zmiany związane z urządzeniami mobilnymi (technologia RWD) sprawiły, iż podjęliśmy decyzje o przygotowaniu nowego szablonu domyślnego.

Szablon domyślny wykorzystywany jest przez nas do prezenetowania możliwości AtomStore, pozwala on nam także na wstępną konfigurację sklepu, a Klientowi na rozpoczęcie prac nad ofertą w sklepie, podczas gdy nasz zespół grafików i programistów tworzy szablon dedykowany dla Klienta.

 

Na bazie szablonu domyślnego tworzymy także szablony dla naszych Klientów, wiele elementów pomimo iż zmienia swój wygląd jest więc z niego dziedziczone. Z tego względu istotne jest aby szablon domyślny był nowoczesny, użyteczny i elastyczny.

 

W połowie roku podjęliśmy decyzje o stworzeniu nowego szablonu, który stanie się bazą wdrożeń w roku 2014. Został on stworzony z wykorzystaniem bootstrap-a i zoptymalizowany dla urządzeń mobilnych (ang. responsive web design). 

 

Raczej rewolucja niż ewolucja

Ze względu na ilość zmian które pojawiły się w ostatnich miesiącach w Atomie oraz nowy trend budowania stron responsywnych (dopasowujacych swoją rozdzielczość i układ do ekranu urządzenia na którym są otwierane) postanowiliśmy zacząć prace praktycznie od zera.

 

Tworząc nowy szablon bazowaliśmy na doświadczeniach nabytych w kilkudziesięciu projektach realizowanych w ostatnich 3 latach. Nowy szablon zawiera także wiele usprawnień i pomysłów naszych klientów - za co im serdecznie dziękujemy :)

 

Wyróżniające się elementy

Cieżko wymienić i opisać wszystkie usprawnienia i udogodnienia które wprowadziliśmy. Wiele zmieniło się zarówno w wyglądzie jak i "pod maską". Nowe szablony stanowią duże usprawnienie dla naszych web developerów, którzy wdrażają projekty Klientów. Postaramy się omówić kilka najważniejszych zmian.

 

Na listingu dodaliśmy belkę z filtrami z opcją rozwijania dodatkowych filtrów. W szablonie można także skonfigurować filtrowanie w lewym lub prawym łamie. Boksy produktowe zyskały efekt onMouse z informacją o dostępnych wariantach oraz linkami do koszyka i schowka.

 

Filtrowanie w kategorii

 

Przepisaliśmy jednocześnie mechanizmy odpowiedzialne za przeładowywanie listy produktów (doczytywanie kolejnych stron, zawężanie listy przez filtry).

 

Stronnicowanie AJAX

 

Karta produktu została wzbogacona przez wiele przydatnych funkcji:

  • okienko z dostępnymi formami dostawy i ich kosztami
  • opcje wyboru wariantów z zawężaniem kolejnych atrybutów (np. po wybraniu koloru lista atrybutów zawęża się tylko do dostępnych)
  • informacje nt. czasu realizacji zamówienia

 

Nowa karta produktu

 

Wiele zmian w koszyku

W koszyku pojawiły się dodatkowe opcje jak zawężanie form dostawy dla kraju, wybór gratisów do koszyka, informacja na temat czasu realizacji (dostępność produktu + czas realizacji wybranej formy dostawy).

 

Koszyk wraz z podsumowaniem

 

Przygotowaliśmy także rozwijany koszyk oraz okno z informacją o produkcie dodanym do koszyka, zawierające sekcje z rekomendacjami.

 

Dodaj do koszyka

 

 

Wyszukiwarka zyskała nowy moduł graficznych podpowiedzi produktowych (btw. dwa miesiące temu dodaliśmy ranking fraz wyszukiwanych przez klientów). 

 

Podpowiedzi w wyszukiwarce

 

 

Wersja responsywna

Nie można zapomnieć o fakcie iż nowy szablon przygotowany został w technologii responsywnej co oznacza iż dopasowuje się do rozdzielczości ekranu urządzenia na którym jest wyświetlany. 

 

Wersja responsywna

 

Mamy nadzieje, iż nowy szablon posłuży do wielu ciekawych wdrożeń w zbliżającym się 2014.

:)


Autor: Łukasz Plutecki

AtomStore to platforma e-commerce dla dużych i średnich sklepów internetowych, która pozwala elastycznie zarządzać ofertą i szybko skalować sprzedaż. System działa w modelu SaaS Enterprise i jest dedykowany każdemu modelowi biznesowemu - B2C, B2B oraz omnichannel. Nasze rozwiązanie oferuje wszystko, czego potrzebujesz w sklepie online w jednym miejscu.

Znajdź nas na:

  • Blog
  • Facebook
  • Youtube
  • Linked in
  • logo iab polska