Kontekst projektu
Migros to największa sieć wśród szwajcarskich supermarketów, ale także potężna sieć usługodawców obejmująca takie segmenty rynku jak: handel, edukacja, turystyka, gastronomia czy finanse. Obecnie spółka zrzesza prawie 2 miliony osób, co stanowi ponad ćwierć populacji Szwajcarii.
Wyzwanie
Nadrzędnym celem corocznej kampanii, skierowanej do szwajcarskich użytkowników mobilnych, było stworzenie aplikacji webowej dającej dostęp do wielu przydatnych informacji i narzędzi, które znacznie ułatwiły proces grillowania. Charakterystycznym punktem akcji zostały cotygodniowe zmiany dostępnych treści.
Realizacja
Wraz z naszymi partnerami z JvM/Limmat przygotowaliśmy serwis internetowy dostępny na urządzenia mobilne, a także klasyczne komputery. Innowacyjne podejście technologiczne, to przede wszystkim wykorzystanie frameworku Angular, w celu stworzenia w pełni responsywnej aplikacji PWA. Treści w aplikacji zarządzane są przez system Neos-CMS. Pozwala on łatwo i szybko wprowadzić niezbędne zmiany dla trzech dostępnych wersji językowych, każdego tygodnia kampanii. System CMS wypuszcza pliki konfiguracyjne, z których korzysta potem aplikacja, renderując zawartość stron. Z praktycznego punktu widzenia obsługi kampanii jest to usprawnienie technologiczne usprawniające cały proces prac administracyjnych.
Rezultaty
W trakcie trwania kampanii nowy serwis zaliczył ponad milion sesji - to 81% więcej niż w ubiegłym roku. Spośród 550 tysięcy unikatowych użytkowników, 186 tysięcy brało udział w cotygodniowych quizach, a granicę 100 tysięcy przekroczyła także liczba wystartowanych Grill Timerów, dowodząc popularności przygotowanych narzędzi.
Moduły i funkcjonalności
![](https://180hb.com/_Resources/Persistent/a15128d7e451055c08230af7b03c348ef554b0be/intro-180x180.png)
Przez 16-tygodniowy okres trwania kampanii każda niedziela przynosi ze sobą zmianę treści prezentowanych w aplikacji. Zgodnie z tematyką tygodnia promujemy inne przepisy, inne artykuły, inne produkty oraz sprawdzamy użytkowników w nowej rundzie quizu. Zmianie ulegają też filmy wideo prezentowane na stronie głównej.
Przepisy w aplikacji, wybrano z myślą o różnych preferencjach żywieniowych użytkowników - w tym nie tylko osób jedzących mięso. Importowano blisko 80 przepisów (podzielone na 4 kategorie) łącznie z instrukcjami przygotowania, jak i obliczeniami ilości składników w zależności od wielkości porcji. Podpowiedzią dla szukających inspiracji kulinarnych stał się Inspirator - losujący pojedynczy przepis z bazy.
![](https://180hb.com/_Resources/Persistent/92dd2ec4de92e88d9a508df0df177624638c097d/recipe-180x180.png)
![](https://180hb.com/_Resources/Persistent/3e0d1639aa175183a91b21bf7c5e7fc7f93712cc/planner-180x180.png)
Party planner to moduł, który na podstawie przewidywanej liczby gości i ich preferencji żywieniowych wyświetla polecane produkty oraz sugerowane ilości do przygotowania.
Rozbudowany moduł Grill Timer prowadził użytkownika przez cały proces grillowania, dzieląc się poradami, sugerując optymalną temperaturę i odmierzając czas opiekania produktów na każdej stronie. Wszystkie komunikaty zaprojektowane były indywidualnie pod każdy z produktów, a w szczególnych przypadkach wzięto pod uwagę także grubość mięsa i preferowane stopnie wysmażenia.
![](https://180hb.com/_Resources/Persistent/6652ac89d704a2675667ba1450a3e30219b7aeb3/timer-180x180.png)
![](https://180hb.com/_Resources/Persistent/64bd94294a134b971b8ee8937b0723157b0eeaf8/tips-180x180.png)
Prawdziwa skarbnica wiedzy o tajnikach grillowania dostępna za pomocą kilku kliknięć. Wśród artykułów użytkownik miał dostęp do tematów takich jak: wybór odpowiedniego modelu grilla, polecane gadżety, czy sposoby przygotowania potraw.
Użytkownicy mogli zapisać najciekawsze przepisy i artykuły w zakładce ulubione. Informacje przechowywane są w chmurze, więc wystarczyło się zalogować, by mieć dostęp do swojej listy, niezależnie od używanego aktualnie urządzenia.
![](https://180hb.com/_Resources/Persistent/6dbfa65e986d0beba6daa300e4bc4a374f9a2e89/favs-180x180.png)
![](https://180hb.com/_Resources/Persistent/e425f8dd1eb3d1c44757b19ba3b6a54fe6fa457c/quiz-180x180.png)
W każdym tygodniu akcji na użytkowników czekała nowa runda quizu. Maksymalna liczba poprawnych odpowiedzi pozwałała im zdobyć odznakę oraz szansę na udział w cotygodniowej loterii. Każda następna dobra odpowiedź zwiększała szanse w losowaniu nagrody głównej - na okres kampanii przeznaczono 80 takich produktów.
Aplikacja została połączona z mikrosystemem serwisów Migros i korzystała z tych samych narzędzi. Użytkownicy logując się w aplikacji przez swoje konta na migros.ch i mieli dostęp do przechowywanych tam list zakupów - z możliwością powiększania ich o produkty i składniki wymienione w aplikacji. Ponadto mogli łatwo wyszukać najbliższe sklepy sieci Migros oraz przejrzeć aktualnie promowane produkty.
![](https://180hb.com/_Resources/Persistent/41556cf07ded98ad550c7009160e150cb9c4015f/integration-180x180.png)
Wszystkie przepisy i artykuły dostępne w aplikacji miały także swoją wersję AMP - wygodniejszą dla użytkowników mobilnych. Dzięki temu zastosowaniu, strony znacznie szybciej wczytują treści oraz korzystnie wpływają na pozycjonowanie serwisu.
Zakres projektu
- Fontend CSS/JS
- RWD
- Wdrożenie Neos CMS
- AMP
- Integracja z zewnętrznymi usługami
- Administracja treściami serwowanymi przez aplikację
![](https://180hb.com/_Resources/Persistent/e1023a24a802425290c9a7735d1146663a9b8b91/screencapture-grillitarier-migros-ch-de-startseite-2019-08-29-10_05_22-180x517.jpg)
![](https://180hb.com/_Resources/Persistent/c55be6e79778ace8178a6eb96b85a7c5143e5584/screencapture-grillitarier-migros-ch-de-rezepte-party-planer-2019-08-29-10_13_31-180x360.jpg)
![](https://180hb.com/_Resources/Persistent/a19d5ce8f3f259c9800be714e1c462e29e95eab7/screencapture-grillitarier-migros-ch-de-quiz-2019-08-29-10_07_19-180x257.jpg)