Platforma kursów online

Zadanie

Celem była sprzedaż kursów bez abonamentu i prowizji platformy kursowej (zostają zwykłe opłaty za płatności), z własną ścieżką zakupu: reklama, quiz, propozycja pełnego pakietu, koszyk z dodatkiem, płatność, faktura i od razu dostęp do kursu.

Większość ruchu przychodzi z reklam na telefonie, w przeglądarce wbudowanej w aplikację Facebooka i Instagrama. Tam strona musi działać jak w zwykłej przeglądarce, a klient nie może stracić postępu quizu ani koszyka.

Co zbudowałem

• Lejek sprzedażowyProdukt na start, propozycja pełnego pakietu, tańsza alternatywa po odmowie, a na końcu koszyk z dodatkiem. System prowadzi klienta sam, nikt nie obsługuje tego ręcznie.
• Quiz z wynikiem od razuSześć pytań i trzy profile. Klient dostaje opis swojego profilu, ćwiczenie dopasowane do wyniku i kurs na start, a wynik liczy się w przeglądarce, więc pojawia się od razu.
• Płatności BLIK i kartąStripe Checkout z BLIK-iem, kartą, Apple Pay i Google Pay. Gdy powiadomienie z bramki nie dotrze, system co 5 minut sam sprawdza opłacone płatności i nadaje dostęp.
• Faktury bez przepisywaniaFaktura albo paragon w Fakturowni po każdym zakupie, PDF mailem do klienta, a przy zwrocie korekta faktury.
• Zwrot jednego kursu z zamówieniaZwrot w Stripe, korekta faktury i odebranie dostępu z jednego miejsca w panelu.
• Strefa kursantaModuły i lekcje wideo z zapisem postępu, materiały przez linki ważne kilka minut, opinie o kursie i ankieta po zakupie.
• Reklamy, które widzą sprzedażZakupy i zapisy trafiają do systemu reklamowego z przeglądarki i z serwera, z jednym identyfikatorem, więc nie giną i nie liczą się podwójnie. Wszystko dopiero po zgodzie.
• Maile, które pilnują sprzedażyPiętnaście szablonów: powitanie z ustawieniem hasła, trzy przypomnienia o porzuconym koszyku, wynik quizu i faktura.
• Panel właścicielaEdytor kursów i ofert, ceny zsynchronizowane ze Stripe, kupony, dostęp klientów, ścieżka odwiedzających przez lejek i rejestr wysłanych maili.
• Kopie i sekretyKopia danych co godzinę na osobne konto, z przywracaniem wybranej kopii z panelu, i klucze usług w Azure Key Vault zamiast w kodzie.

Schemat krok po kroku

Pięć kroków ze schematu: co widzi klient i co w tym czasie robi system.

1. Reklama albo linkStrona sprzedażowa otwiera się od razu, bo jej treść jest wbudowana w witrynę, a aktualną ofertę z cenami system pobiera w tle. Regulamin i polityka prywatności otwierają się w okienku na tej samej stronie, więc w przeglądarce Facebooka i Instagrama klient nie wypada z zakupu, a przycisk „wstecz” tylko zamyka okienko.
2. Quiz i wynikSześć pytań po cztery odpowiedzi, pasek postępu i powrót do poprzedniego pytania. Po podaniu maila system zapisuje odpowiedzi i pokazuje jeden z trzech profili: jego opis oraz ćwiczenie na dziś dopasowane do tego profilu. Wynik z ćwiczeniem przychodzi też mailem, z linkiem, który otwiera wynik także na innym urządzeniu.
3. Oferta i koszykPo kliknięciu pod wynikiem klient widzi najpierw pełny pakiet z ceną i link do porównania trzech pakietów. Przy tańszych pakietach dodatek zaznacza się jednym polem w koszyku. Kto kupi tańszy pakiet, po płatności dostaje propozycję przejścia na pełny za dopłatą samej różnicy, a system pokazuje ją tylko wtedy, gdy kwota zgadza się co do grosza, więc klient nigdy nie zapłaci złej kwoty.
4. PłatnośćKlient akceptuje regulamin, a zgoda zapisuje się przy zamówieniu z datą, godziną i wersją regulaminu. Płaci BLIK-iem, kartą, Apple Pay albo Google Pay na bezpiecznej stronie Stripe, która prosi o adres i opcjonalny NIP. System sam przelicza kwotę i nigdy nie pobiera więcej, niż klient widział: gdy cena w międzyczasie wzrosła, wstrzymuje płatność i prosi o ponowne potwierdzenie.
5. Dostęp od razuPo potwierdzeniu płatności klient od razu ma dostęp do każdego kursu z zamówienia i dostaje mail powitalny. Nowy klient znajdzie w nim link do ustawienia hasła. Wideo startuje tam, gdzie klient skończył oglądać, a lekcja zalicza się, gdy odtwarzanie dojdzie do 90% nagrania, albo jednym przyciskiem. Materiały klient pobiera przez link ważny 10 minut.

Co działa w tle

Cztery elementy z dolnego pasa schematu, które pracują obok głównej ścieżki zakupu.

• Faktura albo paragonPo potwierdzeniu płatności dokument wystawia się w tle: faktura VAT, gdy klient poda NIP, w innym wypadku paragon. Dane nabywcy system bierze z płatności, więc nikt niczego nie przepisuje. PDF przychodzi mailem i czeka na koncie klienta.
• Maile automatyczneWynik quizu przychodzi po podaniu maila, powitanie po płatności, a zaproszenie do ankiety około godziny po pierwszym zakupie. Kto nie dokończy zakupu, dostaje trzy przypomnienia: pierwsze po godzinie, kolejne dwa w następne poranki o 8:00. Zakup albo wypisanie się zatrzymuje resztę.
• Reklamy widzą sprzedażPiksel reklamowy rusza dopiero po zgodzie na marketing. Przy tej zgodzie serwer wysyła też sam zakup, z tym samym identyfikatorem. Reklamy widzą sprzedaż nawet wtedy, gdy przeglądarka zablokuje piksel, a gdy dotrą oba sygnały, zakup liczy się raz.
• Panel właścicielaWłaściciel ustawia ceny w Stripe, a system co godzinę przenosi je do kursów. Na liście płatności zamówienia wymagające uwagi są wyróżnione, a przy nich są przyciski: nadaj brakujący dostęp, ponów fakturę albo paragon, zwróć pojedynczy kurs.

Gdy coś pójdzie nie tak

Na każdą z tych sytuacji zbudowałem osobne zabezpieczenie: system rozwiązuje ją sam albo pokazuje właścicielowi w panelu, zamiast gubić zamówienie.

• Powiadomienie z bramki płatności nie dotarłoStrona z podziękowaniem od razu pyta serwer o tę płatność, a zadanie w tle uruchamiane co 5 minut sprawdza w Stripe zamówienia bez potwierdzenia. Gdy płatność przeszła, klient dostaje dostęp, dokument i maile, a płatność, która wygasła, trafia do porzuconych.
• Aplikacja Facebooka przeładowała stronęOdpowiedzi, wybrany pakiet i mail zapisują się w przeglądarce, a krok w adresie strony. Gdy aplikacja wyczyści tę pamięć, system pobiera z serwera odpowiedzi i mail, a na stronie produktu na start także koszyk. Klient wraca do swojego wyniku zamiast do pustego quizu. Przypadkowe „wstecz” po wyniku też nie cofa go do pytań.
• Klient wycofał się z płatnościKlient wraca do koszyka z tą samą zawartością i informacją, że może dokończyć zakup. Na ścieżce z quizem „wstecz” prowadzi wtedy do wyboru pakietu, a nie z powrotem na stronę płatności. Jeśli płatność mimo wszystko przeszła, system sprawdza to w Stripe i kończy zamówienie zamiast je porzucić.
• Nie udało się wystawić fakturySystem próbuje do trzech razy, co dwie godziny. Potem oznacza fakturę albo paragon w panelu jako nieudane, a właściciel ponawia je jednym przyciskiem. Przed każdą próbą sprawdza, czy dokument dla tego zamówienia już istnieje, więc nie powstaje drugi.
• Zwrot albo spór o płatność kartąZwrot z panelu oddaje pieniądze, odbiera dostęp do zwróconych kursów i przy fakturze wystawia korektę. Tak samo działa pełny zwrot zrobiony bezpośrednio w Stripe. Spór o płatność kartą sam zamyka dostęp do zamówienia, a gdy sprzedawca go wygra, dostęp wraca.

W liczbach

• 3rodzaje lejków na jednym silniku: produkt na start, quiz i ankieta do programu premium
• 15automatycznych maili prowadzi klienta od zapisu do faktury
• 5 minco tyle system sam sprawdza, czy żadna płatność nie przepadła
• 6 tyg.od pierwszej linii kodu do wersji produkcyjnej

Technologia

• Angular
• .NET 10
• Azure Functions
• Azure Static Web Apps
• Azure Storage
• Azure Key Vault
• Stripe
• Fakturownia
• SendGrid
• Meta Conversions API
• Vimeo
• Bicep

Nie podaję nazw kursów ani marki, pod którą platforma sprzedaje. Zamiast zrzutów ekranu pokazuję schemat działania, bo ekrany zawierają dane prawdziwych klientów.