Jeśli jesteś technologicznym geekiem lub wiesz już na czym polegał projekt i chcesz teraz dowiedzieć się jak wygląda budowa aplikacji od strony technologii, jesteś w odpowiednim miejscu.

Jeśli nie czytałeś posta opisującego projekt kliknij tutaj,
aby nadrobić zaległości ;)

Przejdźmy do konkretów, zaraz zrobi się poważnie, ale najpierw przypomnijmy sobie założenia projektu.

1. Założenia projektu:

Na początek, słów kilka o naszym kliencie. Warzelnia Piwa Bydgoszcz jest restauracją, która wpisała się na stałe w krajobraz Bydgoskiej starówki.

Działający od 2011 roku lokal to suma pasji piwowarskich, kulinarnych oraz historycznych jej twórców.

Właściciele Warzelni postanowili stworzyć interaktywne muzeum, aby podkreślić historyczne dziedzictwo browarnictwa w tym wyjątkowym miejscu.

Po co?
Oczywiście po to, aby przyciągnąć klientów!

Muzeum Browarnictwa, będzie znajdować się w czynnej i popularnej restauracji, nie ma więc możliwości stworzenia konwencjonalnej wystawy muzealnej.

W związku z tym, właściciele restauracji zwrócili się do nas z prośbą
o znalezienie rozwiązania, które pozwoli przenieść znaczną część
ekspozycji na ekrany telefonów zwiedzających.

Po warsztacie zerowym i konsultacjach z zespołem Warzelni Piwa, wypunktowaliśmy najistotniejsze dla klienta założenia dotyczące projektu:

• Aplikacja, ma być rozszerzeniem doświadczenia zwiedzania muzeum w Warzelni Piwa.

• Aplikacja ma stanowić przeniesienie dużej części ekspozycji na ekrany telefonów zwiedzających.

• Muzeum podzielono na “stacje”, po których przemieszcza się zwiedzający.
Po dotarciu do każdej stacji, użytkownik skanując kod QR, aktywuje w aplikacji materiały muzealne dotyczące danej stacji.

• Do każdej stacji w muzeum musi być przypisany artykuł opisujący daną stację w aplikacji. W artykułach mają znaleźć się zdjęcia, możliwość odtwarzania historycznych filmów itp.

• Aplikacja musi działać pod systemem iOS oraz Android,

• Aplikacja musi być tania w budowie i utrzymaniu.

• Dodawanie treści, czyli artykułów, zdjęć i filmów ma być możliwie proste i intuicyjne.

Wszystko po to, aby pracownicy lokalu mogli samodzielnie wprowadzić zmiany w treściach, ograniczając naszą rolę w utrzymaniu aplikacji i jednocześnie redukując koszty jej utrzymania.

Dla naszego klienta bardzo ważne było też zwiększenie zaangażowania zwiedzających.

Po rozważeniu wielu opcji, zaproponowaliśmy stworzenie gry w formie quizu w aplikacji. Po którego rozwiązaniu, odwiedzający będzie mogł otrzymać nagrodę pod koniec zwiedzania.

Mając to wszystko na uwadze, nasz zespół projektowy naszkicował pierwszy zarys aplikacji.

2. Technologia

Mając przed oczyma powyższe, pierwsze szkice aplikacji i wypunktowane założenia projektu, przystąpiliśmy do doboru technologii.

Jak już wspomnieliśmy, aplikacja ma być przede wszystkim tania w budowie i utrzymaniu, oczywistym staje się więc, że klient nie może pozwolić sobie na trzy osobne zespoły pracujące nad wdrożeniem przez lata.

W takim przypadku potrzebowaliśmy wybrać coś, co nam pozwoli ograniczyć ilość zaangażowanych developerów do jednego zespołu, pracującego nad aplikacją mobilną, API i wdrożeniem.

Wręcz oczywistym tutaj rozwiązaniem było dla nas użycie Expo działającego na podstawie React Native.

Ktoś mógłby zapytać dlaczego nie Flutter?
W naszym odczuciu React Native bardziej nadawał się do tej pracy, nie wspominając o tym, że jest dojrzalszą w naszym odczuciu technologią, która pozwala na więcej elastyczności.

Aby to wszystko uprościć, sprowadziliśmy decyzje do paru punktów:

• Expo (React Native) pozwala nam na utrzymanie tego samego kodu dla
iOS i Android,

• Pozwala na łatwą implementację tej samej aplikacji do przeglądarek internetowych (React Native Web),

• Ułatwia współpracę zespołów deweloperskich, ponieważ zarówno frontend i backend utrzymywany jest w tym samym języku, którym jest TypeScript.

• Wdrożenie aplikacji jest łatwe, ponieważ expo za nas zajmuje się procesem budowania i pushowania do storów. Mamy też pełne wsparcie dla OTA updates, co znacząco zmniejsza ilość czasu potrzebną do szybkiego iterowania produktu

A czy Expo (React Native) ma jakieś wady?

Ba! oczywiście że tak! React Native raczej nie nadaje się do budowania aplikacji, które wymagają wysokiego performance’u, jak np. gry.

Jednak w tym przypadku zalety przeważyły wady, i wybraliśmy Expo jako nasze główne narzędzie.

A co z backendem?

Tutaj odpowiedź była prosta. Potrzebowaliśmy CMS z możliwością modyfikowania kodu, implementacji customowych endpointów.

Dodatkową zaletą dla nas była możliwość utrzymania backendu w środowisku serverless’owym.

Mając to na uwadze wybraliśmy nastepujące technologie:
• Strapi CMS - opensourcowy CMS oparty o NodeJS (Koa)
• Postgress - przetestowana w boju, relacyjna baza danych
• Cloudinary - kodowanie i optymalizacja zdjęć

Wszystko to oczywiście sprawnie opakowane w środowisko serverlessowe, co pozwala na ograniczenie kosztów dla klienta.

Wybór tych narzędzi pozwolił nam na ekspresowe dostarczenie produktu dla klienta, minimalizację czasu wdrożenia i wymaganego czasu do iterowania z kolejnymi wersjami produktu.

Z ciekawostek technicznych, do budowania interfejsów aplikacji używaliśmy biblioteki NativeWind, która pozwala nam na bezpośrednie stylowanie komponentów używając TailwindCSS.

Z innych technikaliów używaliśmy:
• TypeScript
• Expo Router
• NativeWind

Proces developmentu backendu był nieco prostszy, tutaj przydało się doświadczenie w implementacji Strapiego, który diametralnie zminimalizował nam czas potrzebny na budowę backendu i CMS.

3. Development

Po zaakceptowaniu przez stronę klienta naszych propozycji, przeszliśmy do fazy developmentu.

Zespół 2 programistów z project managerem na czele ruszyli do jak najszybszego wprowadzenia aplikacji na rynek.

Cały proces udało nam się zamknąć w ciągu 40 dni roboczych. Oczywiście w to wliczamy już czas potrzebny na konsultacje z klientem.

Te miały miejsce przez cały czas trwania projektu. Nasz zespół spędził w restauracji łącznie ponad 10 godzin.

Wszystko po to, aby mieć absolutną pewność, że projekt zostanie perfekcyjnie dopasowany do potrzeb właścicieli, obsługi i co najważniejsze samych klientów ;)

Bardzo dobre pytanie! Kod napisany, klawiatura już stygnie.
Teraz czas na biznes.

Podsumujmy, co zyskał klient w tym projekcie dzięki implementacji najlepszych dostępnych na rynku technologii:

1. Znaczące obniżenie kosztów projektu.

Dzięki umiejętnemu dobraniu technologii, deweloperzy skrócili całkowity czas swojej pracy o około 52%.

Dlaczego? Głownie dlatego, że używając xxx za pomocą jednego kodu stworzyli aplikacje jednocześnie na systemy IOS i Android.

Skrócenie czasu pracy programistów pozwoliło na drastyczne obniżenie kosztów całkowitych projektu.

Gdyby nie takie podejście, mikro biznes, jakim jest restauracja, nigdy nie mógłby pozwolić sobie na wypuszczenie własnej aplikacji mobilnej.

2. Błyskawiczne zakończenie projektu.

Praca poszła szybko i sprawnie, nie tylko dlatego, że nasi deweloperzy szybko piszą na klawiaturze ;)

To właśnie technologia ułatwiła wdrożenie poszczególnych elementów.

Czas pracy zaoszczędzony został również poprzez wspomniane już stworzenie jednego kodu na IOS i Android.

3. Możliwość samodzielnego, prowadzenia aplikacji, dodawania i edycji treści.

Dzięki implementacji systemu CMS (system zarządzania treścią), obsługa restauracji zyskała kontrolę nad wszystkim, co jest widoczne w aplikacji.

Teraz, zespól Warzelni Piwa samodzielnie pisze nowe artykuły, dodaje zdjęcia i filmy oraz edytuje napisane wcześniej treści.

Co najważniejsze, czują się w tym swobodnie, ponieważ system jest intuicyjny, a my zapewniliśmy im filmiki instruktażowe wyjaśniające każdą z czynności, krok po kroku.

4. Stabilność i bezpieczeństwo.

Stworzenie aplikacji w technologii serverless, pozwoliło na maksymalizację efektywności zasobów.

Gdy tylko aplikacja potrzebować więcej "mocy" (czyli serwerów), technologia serverless automatycznie je dostarczy. Kiedy "moc" nie będzie już potrzebna, dodatkowe zasoby znikną. Właśnie takie działanie aplikacji zapewnia jej stabilność.

Jednak to nie wszystko! Dzięki temu, że aplikacja nie jest utrzymywana na jednym serwerze, klient zyskuje gwarancję bezpieczeństwa. Gdy dany serwer "padnie", inne automatycznie przejmą jego funkcję, więc aplikacja będzie dalej dostępna.

Podsumowanie

W NucliNet wiemy jak istotne dla ponadprzeciętnego performance'u naszych produktów cyfrowych są technologie State of the Art.

Dlatego nasz zespół przed rozpoczęciem każdego projektu poświęca kilka godzin na dokładny research i dogłębne zrozumienie potrzeb klienta.

Pozwala to na dobranie technologii, które pozwolą na ograniczenie czasu pracy developerów. To bezpośrednio przekłada się na całkowity koszt projektu.

Z kolei, dzięki implementacji najnowszych i najskuteczniejszych rozwiązań dostępnych na rynku, jesteśmy wstanie zagwarantować naszym klientom szybkość, stabilność i bezpieczeństwo zamawianych przez nich produktów.

Przykład aplikacji dla Warzelni Piwa świetnie pokazuje, jak umiejętne zastosowanie technologii, pozwala na dopasowanie projektu do indywidualnych potrzeb biznesowych klienta.