Nowy landing page dla Detective Europe Nouvelle page d'accueil pour Detective Europe

Streszczenie propozycjiRésumé de la proposition

Proponujemy redesign landing page'a, który zachowuje dotychczasowy ton marki (premium, dyskretny, ciemny z musztardowym akcentem), ale rozwiązuje problem czytelności, rozbudowuje strukturę treści i wprowadza dopracowany flow konsultacji w miejsce dotychczasowego jednopolowego formularza. Nous proposons une refonte de la page d'accueil qui conserve le ton actuel de la marque (premium, discret, sombre avec un accent moutarde), tout en résolvant le problème de lisibilité, en étoffant la structure du contenu et en introduisant un parcours de consultation soigné à la place du formulaire à un seul champ.

Co naprawiamy w obecnej wersjiCe que nous corrigeons

Lista skupia się wyłącznie na problemach, które rozwiązuje nowy projekt. Pomijamy kwestie contentowe i prawne, które klient adresuje po swojej stronie. Cette liste se concentre uniquement sur les problèmes que la nouvelle conception résout. Nous laissons de côté les questions de contenu et juridiques que le client traite de son côté.

• 01
  Niski kontrast w sekcji heroContraste faible dans la section hero

  Główny nagłówek i lead pod nim zlewają się z tłem, co odbiera całej stronie pierwsze wrażenie premium. Nowy projekt opiera się na minimum 80% jasności ink na tle. Le titre principal et le lead en dessous se fondent dans l'arrière-plan, ce qui prive la page de sa première impression premium. La nouvelle conception repose sur une luminosité de l'encre d'au moins 80% par rapport à l'arrière-plan.
• 02
  Połamany layout sekcji „Usługi" i „Proces"Mise en page cassée des sections « Services » et « Processus »

  Treść zakłada 6 kart usług i 4 kroki procesu — w realnym renderze widoczne są tylko fragmenty (1 karta, 2 kroki). Wymieniamy mechanizm scroll-reveal na stabilny CSS grid. Le contenu prévoit 6 cartes de services et 4 étapes de processus — au rendu réel, seuls des fragments sont visibles (1 carte, 2 étapes). Nous remplaçons le mécanisme scroll-reveal par une grille CSS stable.
• 03
  Jednopolowy formularz kontaktowyFormulaire de contact à un seul champ

  Pojedyncze pole „Opisz krótko sprawę" jest barierą — klient nie wie, ile napisać i co bezpiecznie ujawnić. Zastępujemy go flow 4-krokowym z wizualnymi kartami. Le champ unique « Décrivez brièvement l'affaire » constitue une barrière — le client ne sait pas combien écrire ni ce qu'il peut révéler en toute sécurité. Nous le remplaçons par un parcours en 4 étapes avec des cartes visuelles.
• 04
  Wąska struktura landinguStructure de page trop étroite

  Strona przeskakuje od usług do formularza. Brakuje sekcji budujących zaufanie i odpowiadających na pytania, które klient zadaje sobie sam. La page saute des services au formulaire. Il manque des sections qui construisent la confiance et répondent aux questions que le client se pose.
• 05
  Brak alternatywy świetlnejAbsence d'alternative claire

  Część użytkowników preferuje tryb jasny, zwłaszcza przy dłuższej lekturze FAQ. Dual theme rozwiązuje to bez kompromisu na wizerunku marki. Certains utilisateurs préfèrent le mode clair, surtout pour une lecture prolongée de la FAQ. Le double thème résout ce problème sans compromettre l'image de marque.
• 06
  Sekcja autopromocyjna szablonuSection d'auto-promotion du modèle

  Obecna strona zawiera fragment „Strona, która od pierwszych sekund buduje zaufanie" — to meta-tekst o samej stronie, nie o usłudze. Usuwamy. Le site actuel contient le fragment « Une page qui inspire confiance dès les premières secondes » — c'est un méta-texte sur le site lui-même, pas sur le service. Nous le supprimons.

Kierunek wizualnyDirection visuelle

Zachowujemy serifowy nagłówek, musztardowy akcent i ciemny ton marki — bo to działa i jest zgodne z branżą. Doprecyzowujemy paletę, hierarchię i radius. Nous conservons le titre en serif, l'accent moutarde et le ton sombre de la marque — parce que cela fonctionne et correspond au secteur. Nous précisons la palette, la hiérarchie et les rayons.

Dwa tryby — dark i lightDeux modes — sombre et clair

Przełącznik znajduje się w nagłówku, obok CTA. Wybór zapisuje się w przeglądarce (localStorage). Pierwsze wejście respektuje ustawienia systemowe, jeśli klient nie wybrał wcześniej. Domyślny tryb to ciemny. Le commutateur se trouve dans l'en-tête, à côté du CTA. Le choix est enregistré dans le navigateur (localStorage). À la première visite, nous respectons les paramètres système si le client n'a pas encore choisi. Mode sombre par défaut.

Nowa struktura landing page'aNouvelle structure de la page

Dziesięć sekcji prowadzących użytkownika od pierwszego wrażenia, przez zrozumienie usługi, budowanie zaufania, aż do konsultacji. Każda sekcja ma jeden cel, jeden komunikat i jeden mikro-call-to-action. Dix sections qui mènent l'utilisateur de la première impression à la consultation, en passant par la compréhension du service et la construction de la confiance. Chaque section a un seul objectif, un seul message et un seul micro-call-to-action.

Flow konsultacji — cztery krokiParcours de consultation — 4 étapes

Zamiast jednego pola tekstowego prowadzimy klienta przez cztery proste decyzje. Każdy krok zmniejsza wahanie, daje poczucie kontroli i sygnalizuje, że relacja jest poukładana od pierwszej minuty. Au lieu d'un seul champ texte, nous guidons le client à travers quatre décisions simples. Chaque étape réduit l'hésitation, donne un sentiment de contrôle et signale que la relation est cadrée dès la première minute.

MikrointerakcjeMicro-interactions

Drobne ruchy, które podnoszą percepcję jakości bez „efekciarstwa". Wszystkie respektują prefers-reduced-motion. De petits mouvements qui rehaussent la perception de qualité sans tape-à-l'œil. Tous respectent prefers-reduced-motion.

Stack i wdrożenieStack et mise en œuvre

Lekki, samodzielny stos. Bez frameworków front-endowych, bez build step'a, gotowy do umieszczenia na dowolnym hostingu (Hostinger, Vercel, klasyczny FTP). Stack léger et autonome. Sans framework front-end, sans étape de build, prêt à être déployé sur n'importe quel hébergement (Hostinger, Vercel, FTP classique).

Następne krokiProchaines étapes

Jeśli kierunek jest akceptowalny — dalsze etapy. Każdy z numerów ma sens samodzielny, więc można zatrzymać projekt po dowolnym kroku. Si la direction est acceptée — voici les étapes suivantes. Chaque point a un sens autonome, on peut donc arrêter le projet à n'importe quel moment.

1. Akceptacja propozycjiAcceptation de la proposition Klient potwierdza kierunek wizualny, paletę i strukturę sekcji. Ewentualne korekty w copy i SLA. Le client valide la direction visuelle, la palette et la structure des sections. Ajustements éventuels du copy et des SLA.
2. Treści ostateczneContenus définitifs Klient dostarcza realne liczby (lata, sprawy, kraje), numer licencji MSWiA, dane kontaktowe, politykę prywatności. Le client fournit les chiffres réels (années, affaires, pays), le numéro de licence, les coordonnées, la politique de confidentialité.
3. Projekt w FigmieMaquette Figma Pełny mock dwóch trybów, mobile i desktop, z prototypem flow konsultacji. Mock complet des deux modes, mobile et desktop, avec prototype du parcours de consultation.
4. Wdrożenie front-endIntégration front-end Statyczny HTML/CSS/JS, integracja formularza z backendem klienta lub usługą typu Formspree. HTML/CSS/JS statique, intégration du formulaire au backend du client ou un service type Formspree.
5. SEO i analyticsSEO et analytics Meta, Schema.org, sitemap, Plausible / GA4 zgodnie z preferencją klienta. Meta, Schema.org, sitemap, Plausible / GA4 selon la préférence du client.
6. Deploy i przekazanieDéploiement et remise Hostinger / domena docelowa, certyfikat SSL, instrukcja edycji najczęściej zmienianych treści. Hostinger / domaine final, certificat SSL, guide d'édition des contenus modifiés le plus souvent.