Przychodzę do Was dzisiaj z tematem, który przez ostatnie tygodnie totalnie zmienił moje podejście do MVP. Każdy z nas – niezależnie czy jest programistą, czy founderem – stanął kiedyś przed murem pod tytułem: Jak pokazać mój pomysł inwestorowi lub klientowi, żeby nie wyglądał jak szkic na serwetce, ale też nie kosztował miesiąca pracy dewelopera?

Mam dla Was odpowiedź, która dla wielu będzie „game changerem”. Przez ostatnie półtora miesiąca testowałem najnowsze modele Gemini w połączeniu z Claude Code. Wniosek? Tradycyjne narzędzia do makietowania zaczynają zostawać w tyle.

Dlaczego Gemini to nowy król designu?

Wielu z Was korzysta z Bubble czy Bolt. To świetne narzędzia, ale mają swoje „sztywne” ramy – narzucają nam to, jak mamy działać. Gemini (w swojej najnowszej odsłonie) oferuje coś zupełnie innego: nieograniczoną elastyczność wizualną.

Zauważyłem niesamowitą zależność – Gemini potrafi w dwie minuty wygenerować kompletnie inny design dla tej samej struktury strony. Możecie odnieść się do konkretnego stylu w sztuce, architekturze, czy nawet poprosić o estetykę konkretnego artysty.

Protip: Uważajcie na fonty! Jeśli poprosicie o styl Leonarda da Vinci, Gemini może potraktować to zbyt dosłownie i dostaniecie nagłówki pisane pismem lustrzanym. Kluczem jest mądre prowadzenie modelu i korzystanie z wiedzy znajomych od UX/Designu, bo ich prompty potrafią “rozwalić system”.

Framework tworzenia błyskawicznego MVP

Jak przejść od pomysłu do działającej, klikalnej strony, którą możecie wrzucić na serwer? Oto mój sprawdzony proces:

  1. Potężny Input (Twoja praca domowa): Cały sukces zależy od tego, jak opiszesz aplikację. Musisz zdefiniować, co widzi użytkownik końcowy, a co administrator. Im więcej detali o funkcjonalnościach, tym lepiej.
  2. Zmiana perspektywy w prompcie: To zdanie kluczowe. Zamiast prosić o „opis”, powiedz: „Weź ten artykuł/opis i stwórz z niego aplikację widzianą oczami użytkownika końcowego”. W tym momencie Gemini przestaje pisać post na bloga, a zaczyna projektować interfejs.
  3. Czysty Kod (HTML/CSS/JS): Nie prosimy od razu o skomplikowane frameworki typu React, jeśli chcemy tylko makiety. Chcemy czystego kodu, który łatwo przenieść do…
  4. Claude Code & Svelte: To tutaj dzieje się magia. Przenosimy kod do Claude Code (np. przez terminal), mówimy mu: “zrób z tego aplikację w Svelte” i… gotowe.
  5. npm run build: Ostatni krok to wygenerowanie statycznej strony. Dzięki temu dostajecie gotowe pliki, które możecie pokazać całemu światu.

Dlaczego to ma znaczenie dla biznesu?

Pamiętajcie o definicji startupu, którą zawsze powtarzam za Stevem Blankiem: to tymczasowa organizacja, która szuka skalowalnego modelu biznesowego.

Dzięki metodzie, którą opisuję, oszczędzacie minimum tydzień pracy nad samym designem i cięciem HTML-a. Zamiast tracić czas na „przepalanie pieniędzy” na drogie makiety, w jeden wieczór tworzycie produkt, w który inwestor może kliknąć i powiedzieć: „Hej, to jest fajne!” lub „Tu się mylisz”. Każda z tych odpowiedzi jest na wagę złota.

Przykład z życia: Projekt RentWell

Właśnie w ten sposób przygotowałem makietę testowego projektu RentWell (aplikacja do wypożyczania „wszystkiego”). Wrzuciłem założenia biznesowe, narzuciłem styl i pozwoliłem Gemini wygenerować interfejs, który wyglądał jak gotowy produkt SasS. To nie jest tylko obrazek – to narzędzie do weryfikacji Waszych założeń.

Co dalej?

Obiecałem Wam, że podzielę się tym dokładniej. Planuję stworzyć kurs online na YouTube, gdzie krok po kroku, po polsku, pokażę ten proces na żywo. Zobaczycie, jak z surowego tekstu powstaje działająca aplikacja, którą możecie wrzucić na własny serwer.

Chcesz zobaczyć, jak wygląda makieta wygenerowana tą metodą? https://kowalskipro.com/rentwell2

Do przeczytania!

Paweł Kowalski