Jak napisać prompt do aplikacji webowej w Kreatorze Stron i Aplikacji AI?

Aplikację webową w Kreatorze budujesz tak samo jak stronę: opisujesz ją w prompcie. Taki opis wymaga jednak innych informacji, bo aplikacja nie tylko pokazuje treści, ale też wykonuje jakieś działanie. Poniżej znajdziesz, z czego składa się dobry prompt do aplikacji, gotowy szablon i trzy przykłady.

SPIS TREŚCI

Jeśli nie wiesz jeszcze, czym aplikacja webowa różni się od strony i od aplikacji z telefonu, zacznij od artykułu Aplikacja webowa: co to jest i czym różni się od strony.

Ogólne zasady planowania aplikacji opisujemy w poradniku Jak stworzyć aplikację bez programowania.

Czym prompt do aplikacji różni się od promptu do strony?

W prompcie do strony opisujesz przede wszystkim, jak strona ma wyglądać i jakie treści ma pokazywać. W prompcie do aplikacji najważniejsze jest to, jak aplikacja ma działać.

Dobry opis odpowiada na pięć pytań o aplikację:

  • Do czego służy i dla kogo jest? Napisz, jaki problem rozwiązuje i kto będzie z niej korzystał, np. klienci szkoły, którzy wybierają kurs.
  • Co użytkownik wpisuje lub wybiera? Wypisz pytania, pola formularza albo opcje do wyboru, najlepiej razem z możliwymi odpowiedziami.
  • Według jakich reguł działa? Opisz, co aplikacja ma zrobić z danymi: jak policzyć cenę, jaki kurs polecić, kiedy zablokować zapis.
  • Co pokazuje na końcu? Napisz, co użytkownik ma zobaczyć: wynik, wycenę, potwierdzenie rezerwacji.
  • Co dzieje się z danymi? Napisz, gdzie mają trafiać zgłoszenia i kto ma je widzieć, np. „zapisuj zgłoszenia w panelu dostępnym po zalogowaniu”.

Ostatni punkt łatwo pominąć, a Kreator Stron i Aplikacji AI nie zawsze sam o niego zapyta. Jeśli aplikacja zbiera zgłoszenia, napisz od razu, że mają trafiać do panelu. Oszczędzisz sobie poprawek i kredytów.

Jak pisać, żeby Kreator dobrze Cię zrozumiał?

Podstawowe zasady są takie same jak przy stronie: pisz konkretnie, poprawiaj po jednej rzeczy i rozwijaj gotową wersję zamiast zaczynać od nowa. Opisujemy je w artykule Jak napisać prompt do strony internetowej.

Przy aplikacjach warto dodać do nich kilka kolejnych:

  • Opisuj reguły w formie „gdy…, to…”. Na przykład: „Gdy celem jest egzamin, poleć kurs przygotowujący do egzaminu”. Taki zapis Kreator odczyta jednoznacznie.
  • Ustal, która reguła jest ważniejsza. Jeśli odpowiedzi użytkownika pasują do kilku reguł naraz, napisz, która z nich wygrywa.
  • Podawaj prawdziwe liczby i nazwy. Ceny, limity miejsc czy nazwy kursów pozwalają od razu sprawdzić, czy aplikacja liczy i dobiera poprawnie.
  • Zacznij od najprostszej wersji. W pierwszym prompcie opisz to, bez czego aplikacja nie zadziała. Filtry, wyszukiwarkę czy notatki w panelu dodasz w kolejnych poleceniach.
Zbierasz dane osobowe? Jeśli aplikacja ma formularz, w którym użytkownicy podają np. imię, e-mail czy telefon, dodaj pod nim informację o tym, jak będziesz przetwarzać te dane, oraz pole zgody. Treść tej informacji przygotuj samodzielnie, bo musi pasować do Twojej firmy. O tym, na co jeszcze uważać przy danych osobowych, przeczytasz w poradniku Jak stworzyć aplikację bez programowania.

Szablon do skopiowania

Skopiuj szablon, uzupełnij pola w nawiasach kwadratowych i wklej go do czatu w Kreatorze. Części, które Cię nie dotyczą, usuń.

Jeśli aplikacja nie zbiera żadnych danych, np. jest prostym kalkulatorem, pomiń ostatnią sekcję.

Zbuduj aplikację webową „[nazwa aplikacji]” dla [nazwa firmy] z [miasto]. Aplikacja ma [do czego służy, jaki problem rozwiązuje] dla [kto będzie z niej korzystał].

Aplikacja ma być po [język]. Styl: [2-3 słowa]. Kolory: [kolory].

Jak ma działać:
Użytkownik [co wpisuje lub wybiera, krok po kroku]:
1. [pytanie, pole lub opcja] ([możliwe odpowiedzi])
2. [pytanie, pole lub opcja] ([możliwe odpowiedzi])
3. [pytanie, pole lub opcja] ([możliwe odpowiedzi])

Reguły:
– Gdy [warunek], to [co ma zrobić aplikacja] – Gdy [warunek], to [co ma zrobić aplikacja] – We wszystkich pozostałych przypadkach [co ma zrobić aplikacja]

Na końcu pokaż [wynik, wycenę, potwierdzenie]. Dodaj przycisk „[treść przycisku]”, który [co robi, np. otwiera formularz z polami: …]. Pod formularzem zostaw miejsce na informację o przetwarzaniu danych osobowych i dodaj pole zgody, bez którego nie da się wysłać zgłoszenia.

Co dzieje się ze zgłoszeniami:
Każde zgłoszenie zapisuj w panelu dostępnym po zalogowaniu. W panelu pokaż [jakie informacje: data, dane kontaktowe, odpowiedzi, wynik].

Dane do wykorzystania: [ceny, nazwy, limity i inne informacje].

Przykłady wypełnionych szablonów

Zobacz, jak szablon może wyglądać dla trzech różnych aplikacji: quizu, który pomaga wybrać ofertę, systemu zapisów i kalkulatora wyceny.

Quiz: dobór kursu w szkole językowej

Zbuduj aplikację webową „Dobierz kurs” dla szkoły językowej „Mosty” z Wrocławia. Aplikacja ma pomóc osobom, które chcą zacząć naukę, wybrać odpowiedni kurs.

Aplikacja ma być po polsku. Styl: przyjazny, nowoczesny, czytelny. Kolory: granat i pomarańczowy akcent.

Jak ma działać:
Użytkownik odpowiada na 6 pytań, każde na osobnym ekranie, z paskiem postępu i możliwością powrotu do poprzedniego pytania.
1. Jakiego języka chcesz się uczyć? (angielski, niemiecki, hiszpański)
2. Po co chcesz się uczyć? (praca, egzamin, podróże, dla siebie)
3. Jaki masz poziom? (zaczynam od zera, podstawy, średni, zaawansowany)
4. Ile czasu możesz poświęcić tygodniowo? (1-2 godziny, 3-4 godziny, więcej)
5. Wolisz zajęcia grupowe czy indywidualne?
6. Online czy stacjonarnie we Wrocławiu?

Na podstawie odpowiedzi aplikacja poleca jeden z czterech kursów:
– Przygotowanie do egzaminu: gdy celem jest egzamin
– Kurs biznesowy: gdy celem jest praca, a poziom to średni lub zaawansowany
– Kurs indywidualny: gdy ktoś wybrał zajęcia indywidualne
– Kurs ogólny w grupie: we wszystkich pozostałych przypadkach
Gdy odpowiedzi pasują do kilku reguł, obowiązuje ta, która jest wyżej na liście.

Na ekranie wyniku pokaż nazwę kursu, krótki opis, cenę za miesiąc i podsumowanie odpowiedzi. Dodaj przycisk „Zapisz się”, który otwiera formularz (imię, e-mail, telefon), oraz przycisk „Zacznij od nowa”. Pod formularzem zostaw miejsce na informację o przetwarzaniu danych osobowych i dodaj pole zgody, bez którego nie da się wysłać zgłoszenia.

Co dzieje się ze zgłoszeniami:
Każde zgłoszenie zapisuj w panelu dostępnym po zalogowaniu. W panelu pokaż listę zgłoszeń z datą, imieniem, danymi kontaktowymi, poleconym kursem i odpowiedziami z quizu.

Ceny: egzamin 520 zł, biznesowy 480 zł, indywidualny 600 zł, ogólny 360 zł.

Zapisy: zajęcia w studiu jogi

Zbuduj aplikację webową do zapisów na zajęcia dla studia jogi „Oddech” z Krakowa. Klientki mają same zapisywać się na zajęcia i je odwoływać, a ja chcę mieć zawsze aktualną listę zapisanych osób.

Aplikacja ma być po polsku. Styl: spokojny, jasny, minimalistyczny. Kolory: biel i szałwiowa zieleń.

Jak ma działać:
1. Klientka zakłada konto (imię, e-mail, telefon) i loguje się.
2. Widzi grafik zajęć na bieżący i następny tydzień: nazwę zajęć, dzień, godzinę, prowadzącą i liczbę wolnych miejsc.
3. Zapisuje się jednym kliknięciem.
4. W zakładce „Moje rezerwacje” widzi swoje zapisy i może je odwołać.

Reguły:
– Gdy na zajęciach nie ma wolnych miejsc, przycisk zapisu jest nieaktywny
– Gdy do zajęć zostało mniej niż 12 godzin, nie można ich odwołać
– Gdy klientka odwoła zajęcia, jej miejsce od razu wraca do puli wolnych miejsc

Przy zakładaniu konta zostaw miejsce na informację o przetwarzaniu danych osobowych i dodaj pole zgody.

Panel administratora:
Po zalogowaniu jako administrator dodaję, edytuję i usuwam zajęcia (nazwa, dzień, godzina, prowadząca, limit miejsc). Przy każdych zajęciach widzę listę zapisanych osób z numerem telefonu.

Dane do wykorzystania: zajęcia Joga dla początkujących, Vinyasa i Joga regeneracyjna, limit 12 osób na zajęciach.

Kalkulator: wycena sprzątania

Zbuduj aplikację webową „Wycena sprzątania” dla firmy sprzątającej „Lśni” z Łodzi. Aplikacja ma pozwolić klientom w minutę sprawdzić orientacyjną cenę i wysłać zapytanie.

Aplikacja ma być po polsku. Styl: świeży, prosty, przejrzysty. Kolory: biel i turkus.

Jak ma działać:
Użytkownik wybiera:
1. Rodzaj sprzątania (standardowe, generalne, po remoncie)
2. Metraż w m²
3. Dodatki (mycie okien, pranie kanapy, sprzątanie balkonu)
4. Częstotliwość (jednorazowo, co tydzień, co dwa tygodnie)
Cena przelicza się na bieżąco po każdej zmianie.

Reguły:
– Cena podstawowa to metraż razy stawka: standardowe 5 zł/m², generalne 8 zł/m², po remoncie 12 zł/m²
– Dodatki: mycie okien +80 zł, pranie kanapy +120 zł, sprzątanie balkonu +40 zł
– Gdy klient wybierze sprzątanie co tydzień, odejmij 15 proc., a gdy co dwa tygodnie, odejmij 10 proc.
– Gdy cena wyjdzie niższa niż 150 zł, pokaż 150 zł z dopiskiem „minimalna kwota zlecenia”

Pod wyceną dodaj przycisk „Wyślij zapytanie”, który otwiera formularz (imię, telefon, adres, preferowany termin). Pod formularzem zostaw miejsce na informację o przetwarzaniu danych osobowych i dodaj pole zgody, bez którego nie da się wysłać zgłoszenia.

Co dzieje się ze zgłoszeniami:
Każde zgłoszenie zapisuj w panelu dostępnym po zalogowaniu. W panelu pokaż datę, dane kontaktowe, wybrane opcje i wyliczoną cenę.

Nazwy firm, ceny i dane w przykładach są zmyślone. W swoim prompcie wpisz prawdziwe informacje o swojej działalności.

Przykłady poleceń do poprawek

Pierwsza wersja aplikacji to dopiero początek. Najwygodniej rozbudowywać ją krok po kroku, jedną zmianą na polecenie.

Oto przykłady poleceń na bazie quizu dla szkoły językowej:

  • Sortowanie: „W panelu sortuj zgłoszenia według daty, od najnowszych”.
  • Filtrowanie: „W panelu dodaj filtr zgłoszeń według poleconego kursu”.
  • Wyszukiwanie: „W panelu dodaj wyszukiwarkę zgłoszeń po imieniu, nazwisku, e-mailu lub telefonie”.
  • Notatki: „Przy każdym zgłoszeniu w panelu dodaj pole na notatki”.
  • Status: „Dodaj możliwość oznaczenia zgłoszenia jako obsłużonego”.
  • Treść quizu: „Pod pytaniem o poziom dodaj krótki opis każdego poziomu”.

Więcej o poprawianiu projektu, także ręcznie, przeczytasz w artykule Jak wprowadzać poprawki w projekcie.

Czytaj więcej
<!--// -->baner