Celem stworzenia tej strony było zapewnienie klientom Kancelarii łatwego dostępu do informacji o usługach, aktualności z branży i efektywnego komunikowania się z klientami oraz potencjalnymi partnerami biznesowymi. Strona ma służyć jako platforma, która ułatwi interakcję klientów z kancelarią oraz umożliwi szybkie i efektywne korzystanie z jej usług. Poprzez wykorzystanie nowoczesnych technologii i funkcji, naszym celem było stworzenie strony i dołączenia aplikacji do jej obsługi, która nie tylko spełnia oczekiwania klientów, ale także wspiera rozwój Kancelarii MLO w dynamicznym środowisku biznesowym.

 

Research

W przypadku tego projektu bardzo istotny był research stron bezpośredniej polskiej konkurencji i analiza pozycjonowania stron o tej samej tematyce. Analizowaliśmy konkurencję pod kątem SEO jak również pod kątem struktury ich stron, robiąc mapy i rozpisując z jakich sekcji składając się poszczególne podstrony i zastanawiając się, jakie rozwiązania są korzystne, a jakie nie. Wiedzieliśmy też, że większość użytkowników przegląda stronę kancelarii na urządzeniach mobilnych, dlatego od razu równolegle zaczęliśmy projektować widoki mobilne, tabletowe i desktopowe.

Case Study Kancelaria Mikulewicz Ostaszewski

Case Study Kancelaria Mikulewicz OstaszewskiCase Study Kancelaria Mikulewicz Ostaszewski

Design

Klient był przywiązany do designu istniejącej strony, który powstał całkiem niedawno, dlatego zdecydowaliśmy się go utrzymać, poszerzając stronę o projekty brakujących podstron, o które chcieliśmy uzupełnić architekturę strony, które utrzymywane były w spójnej stylistyce i nawiązywały do strony głównej. Najważniejsze decyzje jakie podjęliśmy przeprojektowując stronę to m.in stworzenie strony z ofertą i podstron dla poszczególnych usług ze szczegółowym ich opisem i sekcją FAQ (było to ważne też z punktu widzenia SEO), dodanie w wielu miejscach sekcji CTA z przekierowaniem do formularza z zostawieniem swoich danych do kontaktu, przeprojektowanie sposobu prezentowania rekomendacji, strona zespołu i rozbudowany blog, który również służy do utrzymywania wysokiej pozycji strony podczas wyszukiwania fraz związanych z działalnością kancelarii. Zaprojektowaliśmy też narzędzie dostępne na stronie - kalkulator restrukturyzacji, który służy do obliczenia całkowitej możliwej oszczędności dla danego klienta.

Case Study Kancelaria Mikulewicz OstaszewskiCase Study Kancelaria Mikulewicz Ostaszewski

Decyzje Technologiczne

W przypadku projektowania systemu obsługi strony dla Kancelarii MLO, podjęliśmy szereg kluczowych decyzji technologicznych, które miały istotny wpływ na finalny rezultat. Przy wyborze technologii skupiliśmy się na zapewnieniu wydajności oraz łatwości zarządzania treścią.

 

React + Next.js (App Route)

Decyzja o wyborze Reacta w połączeniu z Next.js była kluczowa dla efektywności i wydajności projektu. Wykorzystanie tych technologii pozwoliło nam nie tylko na budowę dynamicznych i responsywnych interfejsów użytkownika, ale także na optymalizację pod kątem SEO.

Zdecydowaliśmy się wykorzystać App Router, który został wprowadzony wraz z aktualizacją Nexta 13.4 ze względu na kilka kluczowych korzyści, które zapewnia to narzędzie. Po pierwsze, dzięki App Router możemy korzystać z React Server Components, które działają po stronie serwera. Jest to kluczowe dla poprawy wydajności aplikacji oraz doświadczenia użytkownika, ponieważ eliminuje zbędne obciążenie klienta i pozwala na szybsze ładowanie się aplikacji.

Dodatkowo, App Router umożliwia obsługę złożonych ścieżek i układów (layout), co jest istotne w kontekście naszej strony, gdzie mamy wiele zagnieżdżonych ścieżek, takich jak /zespół/[slug]. To pozwala nam łatwo zorganizować strukturę aplikacji i uporządkować jej interfejs.

Dzięki App Router w połączeniu z innymi technologiami, jak Strapi jako Headless CMS, osiągamy elastyczność i efektywność w rewalidacji danych. W praktyce oznacza to, że jeśli dokonamy zmian w danych w CMS, te zmiany będą od razu widoczne na stronie. Dzięki temu dynamicznemu podejściu, każda aktualizacja treści w systemie CMS automatycznie przenosi się na naszą stronę internetową. Jest to kluczowe, ponieważ zapewnia to aktualność i spójność informacji dla użytkowników, eliminując potrzebę ręcznego synchronizowania danych między różnymi platformami. Dzięki temu procesowi, nasza strona internetowa zawsze odzwierciedla najnowsze informacje i zmiany, co zwiększa jej wartość dla użytkowników i ułatwia utrzymanie aktualności treści.

Ponadto, dzięki funkcji Suspense, która jest częścią App Router, możemy skrócić czas pobierania danych z serwera oraz poprawić wrażenia użytkownika poprzez wyświetlanie tymczasowego interfejsu podczas oczekiwania na dane. To wszystko sprawia, że App Router jest niezwykle wartościowym narzędziem dla naszej strony, pomagając nam w efektywnym i wydajnym updateowaniu jej.

 

Strapi + PostgreSQL

Do zarządzania treścią wykorzystaliśmy Strapiego, otwartoźródłowy Headless CMS, który umożliwia łatwe tworzenie, edycję i publikację treści. Wraz z wyborem Strapi, postawiliśmy na PostgreSQl jako bazę danych, zapewniającą skalowalność, niezawodność i bezpieczeństwo danych. Dzięki temu zestawieniu technologii udało się nam osiągnąć efektywną komunikację między front-endem, a back-endem.

 

Case Study Kancelaria Mikulewicz Ostaszewski

Case Study Kancelaria Mikulewicz Ostaszewski

Podsumowanie

Stworzona strona dla Kancelarii MLO umożliwia łatwy dostęp do informacji o usługach, aktualnościach i efektywne komunikowanie się z klientami. Wykorzystanie nowoczesnych technologii, takich jak React, Next.js i Strapi, pozwoliło na budowę dynamicznego interfejsu użytkownika oraz optymalizację pod kątem SEO. Dzięki App Router w połączeniu z Strapi i PostgreSQL, uzyskaliśmy elastyczność w rewalidacji danych, co umożliwia szybką aktualizację treści aplikacji. W efekcie, aplikacja spełnia oczekiwania klientów i stanowi solidną podstawę dla dalszego rozwoju Kancelarii MLO.

Zobacz projekt LIVE