Ta strona używa ciasteczek (cookies), dzięki którym nasz serwis może działać lepiej. Rozumiem

17.09.2026

Olimp Labs – strona probiotyków opartych na badaniach naukowych

Olimp Labs – strona probiotyków opartych na badaniach naukowych

Jako jcd.pl mieliśmy przyjemność zrealizować projekt strony internetowej dla Olimp Labs – działu badawczo-rozwojowego zajmującego się selekcją i badaniem własnych szczepów probiotycznych.

Celem projektu było stworzenie strony, która komunikuje wartość naukową produktu – opatentowanych szczepów OL3621® i OL3246® – w sposób zrozumiały zarówno dla partnerów biznesowych i środowiska medycznego, jak i dla odbiorcy końcowego. Zamiast typowej komunikacji suplementowej postawiliśmy na prezentację danych, metodologii badań i ludzi, którzy za nimi stoją.


Cele biznesowe projektu


Wyzwaniem w kategorii probiotyków jest powszechny sceptycyzm – rynek jest przesycony produktami, których deklaracje nie zawsze znajdują potwierdzenie w badaniach. Olimp Labs dysponuje realnym zapleczem naukowym, ale ta przewaga wymagała odpowiedniego przełożenia na komunikację.

Do kluczowych celów należało:

  • zbudowanie wiarygodności poprzez ekspozycję danych i metodologii badań,
  • wyróżnienie dwóch opatentowanych szczepów jako osobnych, pełnoprawnych produktów,
  • przygotowanie strony na ekspansję zagraniczną poprzez stworzenie wersji anglojęzycznej,
  • stworzenie zaplecza contentowego wspierającego SEO i edukację rynku,
  • oddanie zespołowi pełnej kontroli nad treścią bez konieczności angażowania programisty.


Kierunek wizualny – nauka zamiast estetyki suplementów


Jednym z najważniejszych założeń było odejście od konwencji charakterystycznej dla rynku suplementów – jaskrawych kolorów, stockowych zdjęć i komunikacji opartej przede wszystkim na obietnicach.

Stronę zaprojektowaliśmy tak, aby:

  • budowała skojarzenia z laboratorium i badaniami klinicznymi,
  • prezentowała dane jako główny argument komunikacyjny,
  • wyglądała jak partner naukowy, a nie typowa marka suplementowa.

Minimalistyczna paleta oparta na głębokim granacie i bieli, typografia łącząca krój humanistyczny z monospace w detalach oraz materiały wideo z rzeczywistej produkcji budują odbiór marki jako wyspecjalizowanej i transparentnej.

Każdy szczep otrzymał własną kolorystykę, spójną z animacjami mikrobiologicznymi dostarczonymi przez Klienta. Dzięki temu poszczególne produkty zyskały własną identyfikację, zachowując jednocześnie spójność całego serwisu.

img-34433


Struktura strony i prowadzenie użytkownika


Stronę zaprojektowaliśmy z myślą o odbiorcach o bardzo różnym poziomie wiedzy – od partnera biznesowego po pacjenta szukającego konkretnego rozwiązania.

Najważniejsze sekcje serwisu obejmują:

  • Hero – propozycję wartości opartą na dorobku badawczym,
  • Prezentację szczepów – dwa produkty z osobnymi ścieżkami i identyfikacją,
  • Pipeline selekcji – animowaną wizualizację procesu wyboru szczepu spośród setek kandydatów,
  • Sekcje badawcze – wykresy, dane demograficzne i wyniki testów,
  • Zespół – ekspozycję naukowców stojących za projektem,
  • Bazę wiedzy – artykuły z przypisami i bibliografią,
  • Formularz kontaktowy – bezpośrednie wejście w rozmowę z zespołem.

Całość prowadzi użytkownika od ogólnej propozycji wartości do konkretnych danych i dowodów naukowych, pozwalając stopniowo poznawać zarówno produkt, jak i stojącą za nim metodologię.


Podstrony szczepów – dwa produkty, dwie ścieżki


Zamiast jednej wspólnej podstrony produktowej zaprojektowaliśmy rozbudowaną, trzypoziomową strukturę, w której każdy szczep funkcjonuje jako osobny byt z własnymi podstronami tematycznymi.

Rozwiązanie obejmuje między innymi:

  • indywidualną kolorystykę sekcji głównej, ustawianą z poziomu panelu administracyjnego,
  • automatyczne dopasowanie motywu tekstu do jasnego lub ciemnego tła,
  • przyklejone menu kotwicowe z podświetleniem aktywnej sekcji,
  • oznaczenia statusu patentowego,
  • mobilny pasek nawigacyjny ułatwiający poruszanie się po długiej treści.

Dzięki temu każdy szczep może być komunikowany niezależnie, przy zachowaniu spójności całego serwisu.


Prezentacja danych naukowych


Jednym z najważniejszych elementów projektu jest sposób prezentacji wyników badań. Zamiast statycznych grafik przygotowaliśmy komponenty, które redakcja może samodzielnie wypełniać danymi.

W skład rozwiązania weszły między innymi:

  • animowane wykresy słupkowe z osią wartości, legendą i oznaczeniem istotności statystycznej,
  • sekcje prezentujące dane demograficzne badanych populacji,
  • moduły przedstawiające metodologię i przebieg testów,
  • oś czasu pokazująca kolejne etapy prac badawczych,
  • animowany pipeline selekcji szczepów sterowany przewijaniem strony.

Każdy z tych elementów jest w pełni edytowalny z poziomu panelu administracyjnego, bez ingerencji w kod. Dzięki temu zespół Olimp Labs może samodzielnie aktualizować dane i rozwijać prezentację wyników badań.

imffg-1


Baza wiedzy z aparatem naukowym


Moduł artykułów został zaprojektowany z myślą o treściach merytorycznych, a nie klasycznych wpisach blogowych.

System obejmuje:

  • przypisy i numerowaną bibliografię przy każdym artykule,
  • sekcję pytań i odpowiedzi rozwijaną przy tekście,
  • spis treści śledzący pozycję czytelnika,
  • filtrowanie po kategoriach z kolorami ustawianymi w panelu,
  • dane strukturalne pozwalające wyszukiwarkom lepiej rozpoznać charakter publikowanych treści.

Dzięki temu Olimp Labs może rozwijać bazę specjalistycznych treści, wspierać ruch organiczny i jednocześnie zachować sposób prezentacji informacji dopasowany do charakteru naukowego projektu.


Wersja anglojęzyczna na osobnej domenie


Projekt od początku zakładał możliwość ekspansji zagranicznej. Wersja angielska została uruchomiona pod odrębną domeną olimpbiotic.com, obsługiwaną przez tę samą aplikację i tę samą bazę treści.

Rozwiązanie zapewnia:

  • adresy bez przedrostka językowego w obu wersjach,
  • poprawne oznaczenia kanoniczne i powiązania między wersjami językowymi,
  • rozpoznawanie języka na podstawie domeny, a nie ścieżki URL,
  • jedno miejsce zarządzania treścią dla obu rynków.

Dzięki takiej strukturze wersja angielska może budować własną obecność w wyszukiwarce, przy jednoczesnym zachowaniu wspólnego systemu zarządzania treścią.


Technologia i system modułowy


Strona została zrealizowana w oparciu o Next.js oraz Payload CMS z bazą PostgreSQL – w całości jako rozwiązanie dedykowane, bez wykorzystania gotowych szablonów.

Wdrożyliśmy między innymi:

  • system ponad trzydziestu modułów do swobodnego budowania podstron,
  • dwanaście typów treści i sześć zestawów ustawień globalnych,
  • pełną edytowalność wszystkich tekstów, obrazów i materiałów wideo w dwóch językach,
  • podgląd zmian przed publikacją,
  • płynne przewijanie i animacje sterowane pozycją strony,
  • zabezpieczenia formularzy i zgodny z RODO mechanizm zgód.

System został zaprojektowany tak, aby zespół Olimp Labs mógł samodzielnie rozwijać serwis – dodawać kolejne szczepy, artykuły i całe podstrony – bez ryzyka utraty spójności wizualnej.

img-3-1


Efekt końcowy


W efekcie powstał rozbudowany serwis, który:

  • komunikuje przewagę naukową w sposób zrozumiały dla różnych grup odbiorców,
  • prezentuje dane badawcze jako jeden z głównych elementów komunikacji produktu,
  • obsługuje dwa rynki językowe z wykorzystaniem osobnych domen,
  • daje zespołowi pełną kontrolę nad treścią,
  • jest przygotowany na dalszy rozwój o kolejne szczepy i podstrony.


Projekt był realizowany w ścisłej współpracy z zespołem Olimp Labs, równolegle z powstawaniem materiałów badawczych i wizualnych. Pozwoliło to na bieżąco dopasowywać rozwiązania projektowe i technologiczne do rozwijającej się zawartości serwisu.

Powstała w ten sposób strona, która łączy komunikację naukową, rozbudowaną prezentację danych i dedykowaną technologię w jeden spójny system – przygotowany zarówno na rozwój treści, jak i dalszą ekspansję marki.

Autor: JCD

Od przeszło dekady konsekwentnie przekształcamy zaawansowane idee w funkcjonalne aplikacje oraz internetowe platformy usługowe. Nasza działalność koncentruje się na głębokim zrozumieniu natury przedsiębiorstwa oraz kluczowych wymagań, które są fundamentem dla każdego przedsięwzięcia.

Stale łączymy metody kreatywne z systematycznym, badawczym podejściem, przekonani, że jedynie przez dogłębną analizę i zrozumienie specyfiki wyzwań, jesteśmy w stanie w pełni współpracować z naszymi klientami w celu kreowania innowacyjnych rozwiązań. Te rozwiązania nie tylko ulepszają doświadczenie użytkowników, ale również zapewniają naszym klientom strategiczną przewagę na rynku. Nasze procesy projektowe są zatem oparte na aktywnym słuchaniu, szczegółowej analizie i ciągłym dialogu z klientami. W ten sposób nieustannie pracujemy na rzecz tworzenia nie tylko technologii, ale także wartości, które wyznaczają nowe standardy w cyfrowym krajobrazie biznesu.

Blog

Zobacz także

Porozmawiajmy o Twoim projekcie

Bezpłatna konsultacja — opowiemy jak możemy pomóc i ile to będzie kosztować.

Wyceń projekt Wyceń projekt