Jak z pomocą AI tworzę ładne projekty dla mojej firmy

O czym jest ten film

1. Dostępne dziś podejścia do projektowania z AI są według autora słabe: klasyczne edytory wymagają ręcznej roboty, a narzędzia zbudowane wokół generowania utrudniają samodzielne poprawki.
2. Jego rozwiązanie to Paper — edytor wizualny przypominający Figmę, pod spodem oparty na HTML i CSS, dostępny dla agentów przez MCP; człowiek i AI pracują na tym samym projekcie.
3. Konkretne zastosowania: poradniki PDF do filmów, miniatury YouTube, strony docelowe, karuzele, social media i projekty interfejsów.
4. Przykład z praktyki: ok. 15-stronicowy poradnik do „watch skilla” — AI samo przejrzało nagrania, wyciągnęło zrzuty ekranu, wstawiło je do dokumentu razem z instrukcjami i wygenerowało okładkę.
5. Miniatury: Claude komponuje w Paperze, grafiki i ikony tworzy model obrazu (GPT Image 2.5 na Sunburst) przez Higgsfield, a napisy zostają osobnym, edytowalnym elementem.
6. Dlaczego nie cała miniatura z jednego obrazu: kolejne edycje w modelu obrazu odsuwają efekt od oryginału; składanie z elementów pozwala zmieniać fragmenty bez ruszania reszty.
7. Konfiguracja: Paper Desktop plus rozszerzenie do Claude; Higgsfield jako własny łącznik w Claude albo plugin w ChatGPT. Warunek: wersje desktopowe — przeglądarka nie połączy się lokalnie.
8. Praca na istniejącym projekcie sprowadza się do przesłania agentowi linku do planszy Paper i opisania zmian.
9. Architektura systemu składa się z trzech warstw: wiki z kontekstem firmy, skill „brand guidelines” (plik skill.md plus HTML z odniesieniami wizualnymi) oraz warstwa narzędzi wykonawczych.
10. Całość jest zaprojektowana pod przenośność — kontekst i wytyczne działają z każdym kolejnym narzędziem projektowym; na końcu autor promuje Founder OS Bootcamp i swój przewodnik w opisie.

10 najważniejszych takeaways — z kontekstem zastosowania

1.Jedno płótno dla człowieka i agenta kończy wojnę o drobne poprawki

Na czym polega: Klasyczne edytory zostawiają całą robotę tobie, a generatory utrudniają wejście do środka i przesunięcie jednego elementu. Paper łączy oba światy: agent buduje układ z osobnych elementów, ty poprawiasz ręcznie, a agent podchwytuje twoje zmiany i pracuje dalej.

Jak stosować: Połącz Claude z Paperem przez MCP i działaj wspólnie na tym samym projekcie. Przy istniejącym materiale wystarczy podać agentowi link do planszy i opisać, co zmienić.

Na co uważać: Połączenie działa tylko lokalnie — potrzebny jest Claude w wersji desktopowej (albo ChatGPT czy Codex na komputerze) oraz otwarta aplikacja Paper Desktop. Wersje przeglądarkowe się nie połączą.

2.HTML i CSS pod spodem oznaczają start bez nauki

Na czym polega: Paper trzyma projekty w HTML i CSS, więc modele językowe już znają „język” tego narzędzia — nie trzeba ich do niego szkolić.

Jak stosować: Po instalacji rozszerzenia poproś najpierw o prosty nagłówek, żeby sprawdzić połączenie, a potem powierzaj coraz większe układy.

Na co uważać: Pilnuj, żeby tekst i grafika powstawały jako osobne elementy, a nie jeden wklejony obrazek — inaczej stracisz edytowalność, o którą chodziło.

3.Generuj elementy, nie całość

Na czym polega: Miniatura złożona w edytorze z osobnych kawałków — grafika z modelu obrazu, napisy jako tekst, twarz osobno — pozwala zmienić nagłówek albo przesunąć element bez ruszania reszty projektu.

Jak stosować: Przekaż agentowi ogólny pomysł lub wklej miniaturę jako punkt odniesienia; ikony generuj modelem obrazu na podstawie podanego wzorca, a kompozycję składaj w Paperze.

Na co uważać: Każda kolejna edycja całości w modelu obrazu odsuwa efekt od oryginału. Jeśli coś nie pasuje, podmień tylko ten jeden fragment zamiast przerabiać całość.

4.Jedna bramka do wielu modeli obrazu

Na czym polega: Higgsfield zbiera czołowe modele obrazu i wideo pod jednym loginem i jednym połączeniem MCP; agent sam wysyła zapytanie, generuje grafikę i wstawia ją do kompozycji.

Jak stosować: W Claude dodaj Higgsfield jako własny łącznik (nazwa plus adres), w ChatGPT podłącz plugin z katalogu. Potem wystarczy wskazać agentowi obrazy referencyjne.

Na co uważać: Twój proces uzależniasz od zewnętrznej platformy — jej dostępności, cennika i aktualnej listy modeli.

5.Steruj przykładami, nie mikropoleceniami

Na czym polega: Autor nie wykonuje pracy projektowej sam — podaje referencje, mówi, co mu się podoba, i sprawdza efekt. Ciężar wykonania spoczywa na agencie.

Jak stosować: Zbieraj miniatury i układy, które lubisz, i wklejaj je jako wzorce. Drobne korekty rób ręcznie w edytorze, zamiast dopisywać kolejne rundy promptów.

Na co uważać: Bez referencji agent zgaduje twój gust, a pozornie drobna zmiana w trybie czysto tekstowym potrafi rozrosnąć się w kilkanaście rund.

6.Zleć AI żmudne zbieranie materiału

Na czym polega: Przy poradniku do filmu AI samo przejrzało nagrania, wyciągnęło zrzuty ekranu, wstawiło je do PDF-a wraz z instrukcjami i wygenerowało okładkę.

Jak stosować: Przy materiałach instruktażowych przekaż agentowi nagranie lub inny materiał źródłowy i poproś o zbudowanie dokumentu — od zrzutów po opisy.

Na co uważać: Automat nie zwalnia z korekty. Sprawdzaj poprawność kroków i jasność objaśnień bezpośrednio na gotowej stronie — tu znowu przydaje się pełna edytowalność.

7.Rozdziel system na trzy warstwy: kontekst, wytyczne, narzędzia

Na czym polega: Wiki z wiedzą o firmie, skill „brand guidelines” z zasadami projektowania i narzędzia wykonawcze (Paper, Higgsfield) to trzy niezależne, wymienne elementy całości.

Jak stosować: Buduj je osobno — dzięki temu wymiana narzędzia nie narusza kontekstu firmy ani wytycznych wizualnych.

Na co uważać: Trzymanie tej wiedzy wyłącznie „w rozmowach” z agentem oznacza poprawianie tych samych błędów przy każdym nowym projekcie.

8.Wiki jako jedno źródło prawdy o ofercie

Na czym polega: To zbiór plików z opisem firmy, klientów, oferty i sposobu mówienia o niej; agent sięga po nie przy każdym projekcie.

Jak stosować: Gdy opis oferty zmienia się w poradniku, na stronie czy w mailu, aktualizujesz jeden plik — i wszędzie wchodzi nowa wersja.

Na co uważać: Wiki działa tylko wtedy, gdy jest aktualne. Zaległe dane będą się wiernie powielać w kolejnych materiałach.

9.Wytyczne marki to więcej niż logo i kolory

Na czym polega: Skill „brand guidelines” (plik skill.md plus plik HTML z przykładami) obejmuje typografię, odstępy wokół nagłówków, sposób prezentacji zrzutów ekranu, styl ilustracji i układy, które chcesz powtarzać.

Jak stosować: Jeśli masz brand book od projektanta, przekaż go agentowi do zamiany w skill; dorzuć stronę internetową i wcześniejsze projekty jako materiał źródłowy.

Na co uważać: Przejrzyj, co agent z tego złożył, i popraw, co odbiega od twojej wizji. Zdecyduj też, co ma być sztywne (u autora: typografia i odstępy), a co elastyczne (u niego: kolory dopasowane do tematu filmu).

10.Projektuj wytyczne tak, by przetrwały zmianę narzędzia

Na czym polega: Kontekst firmy i zasady marki są trzymane poza konkretnym edytorem, więc przy zmianie narzędzia podajesz agentowi te same pliki plus dostęp do nowego programu — bez od nowa tłumaczenia biznesu.

Jak stosować: Trzymaj wytyczne jako zwykłe, przenośne pliki (markdown, HTML), niezależne od Paper, Figmy czy innego edytora.

Na co uważać: Sposób wykonania projektu będzie się różnił między narzędziami — referencje zostają te same, ale proces trzeba za każdym razem dopasować.

Redakcyjne tłumaczenie

Wstęp

Większość ludzi nie wie, że da się projektować z AI lepiej. Piękne PDF-y, miniatury, strony docelowe, karuzele czy projekty interfejsów można tworzyć bez żadnego przygotowania graficznego. Wszystko, co powstaje, pozostaje w pełni edytowalne — warstwy, komponenty, każdy element. A ja mogę nad całością pracować ramię w ramię z moimi agentami.

Zmuszenie AI do wygenerowania jednego ładnego projektu to jednak dopiero połowa zagadnienia. Chcę, żeby znało moją firmę, trzymało się mojej marki i korzystało z decyzji projektowych, które dawno podjąłem — także wtedy, gdy zmienię narzędzie. Dlatego pokażę dziś cały mój proces projektowy, a następnie sposób uporządkowania kontekstu firmy i wytycznych wizualnych tak, żeby wszystko, co wygenerujesz, trzymało się marki.

Dwa sposoby myślenia o projektowaniu z AI — i dlaczego oba zawodzą

Jeśli projektowałeś kiedyś z AI, pewnie znasz to z autopsji: pozornie drobna poprawka zamienia się w dziesięć, piętnaście dodatkowych rund promptów — choć równie dobrze można było wejść, chwycić dany element i przesunąć go samemu.

Widzę dwa spojrzenia na dzisiejszy problem. Z jednej strony narzędzia projektowe zrobione dla ludzi: możesz edytować absolutnie wszystko, ale całą tę robotę i tak odwala ręcznie. Z drugiej — narzędzia zbudowane wokół generowania przez AI: model robi wszystko sam, ale wejście do środka i wprowadzenie prostej zmiany na własną rękę bywa frustrujące. Obie opcje są po prostu słabe.

Paper: jedno płótno dla człowieka i agenta

Dlatego tak dobrze czułem się, pracując w Paperze — chcę narzędzia, w którym działam ja i moi agenci. Claude buduje układy, przy czym grafika i tekst to osobne elementy; potem wskakuję do środka i przestawiam rzeczy po swojemu. A gdy chcę, by Claude pracował dalej, podchwytuje on moje zmiany i rusza od nich naprzód.

Pod spodem Paper posługuje się HTML i CSS — dokładnie tym samym, czym narzędzia budowane pod generowanie przez AI. A Claude już umie to pisać. Połączenie przez MCP pozwala mu pracować bezpośrednio na płótnie projektu, a ja dostaję edytor wizualny obsługiwany jak Figma. Nie jestem projektantem, ale to, co ostatnio tworzę, wygląda całkiem nieźle — przynajmniej według mnie.

(Informacja dodatkowa: MCP, czyli Model Context Protocol, to otwarty standard łączenia modeli językowych z zewnętrznymi aplikacjami i danymi.)

Przypadek pierwszy: poradniki PDF do filmów

Pierwsze zastosowanie to PDF-y — przewodniki do moich filmów. To praktycznie e-booki z instrukcjami konfiguracji, promptami i przykładami do tematu, o którym mówiłem w danym materiale. Na przykład poradnik do mojego „watch skilla”, czyli umiejętności pozwalającej AI oglądać filmy: około piętnastu stron prowadzących od podłączenia po praktyczne użycie. Kiedy go robiłem, AI przejrzało całe nagrania, automatycznie wyciągnęło z nich zrzuty ekranu i od razu wstawiło do poradnika wraz z instrukcjami. Wygenerowało również grafikę na okładkę.

I właśnie dlatego uwielbiam robić te rzeczy w Paperze: mogę wejść i wszystko sam poprawić. Tekst, zrzuty i grafika to osobne elementy, więc klikam w instrukcję, zmieniam sformułowanie bezpośrednio albo po prostu przeciągam coś na właściwe miejsce. Jeśli AI się pomyliło albo jakiś krok wymaga jasniejszego wyjaśnienia, naprawiam to od ręki, na samej stronie.

Przypadek drugi: miniatury YouTube

Poradniki to jednak tylko część mojej pracy. Ten sam proces stosuję do miniatur YouTube. Zwykle zaczynam od przekazania Claude’owi ogólnej wizji, czasem wklejam inną miniaturę jako punkt odniesienia. Z tego materiału Claude układa kompozycję w Paperze. Gdy potrzebna jest grafika albo ikona, każę mu sięgnąć po model obrazu: podaję istniejący obraz jako wzorzec i proszę o nową wersję — powstaje w GPT Image 2.5 na Sunburst. Ostatnio często używam tego szklanego, „bąbelkowego” stylu ikon, więc agent po prostu wykorzystuje ponownie te same instrukcje.

Higgsfield: jeden dostęp do modeli obrazu

Żeby dać Claude’owi dostęp do modeli obrazu, korzystam z Higgsfield. Platforma zbiera czołowe modele obrazu i wideo pod jednym loginem i jednym połączeniem MCP, co pozwala podpiąć ją wprost do Claude’a i ChatGPT. Mój Claude wysyła zapytanie do Higgsfield, tam obraz powstaje modelem ChatGPT i od razu wraca do Claude’a — a stamtąd trafia prosto do kompozycji w Paperze.

Dlaczego składać z elementów, a nie generować całości

Co istotne, litery nadal są osobnym elementem na wierzchu. I właśnie dlatego generuję pojedyncze kawałki i składam je w Paperze — chcę móc dalej pracować nad projektem, gdy obraz wróci.

Oczywiście można kazać modelowi obrazu stworzyć całą miniaturę od razu, bez Papera. Tylko że wtedy nagłówek, twarz i cała grafika są wypalone w jednym obrazie. Jeśli podoba ci się wszystko oprócz napisu i chcesz go zmienić, musisz edytować obraz tym samym modelem. Powtórz to kilka razy, a skończysz z grafiką, która nie ma nic wspólnego z oryginałem. W moim procesie mogę zmienić nagłówek bezpośrednio, powiększyć grafikę albo ją przesunąć, nie ruszając reszty. A jeśli któryś wygenerowany fragment mi nie odpowiada, każę Claude’owi zrobić nową wersję tylko tego kawałka i podmienić. Wszystko, co już mnie satysfakcjonuje, zostaje na miejscu — i nie muszę martwić się dryfem, który zdarza się przy pracy z modelami obrazu.

Wtrącenie: Founder OS Bootcamp

Przy okazji: jeśli prowadzisz firmę i chcesz zbudować dla niej system operacyjny oparty na AI, a potem zamienić go w wyniki dzięki sprawdzonym playbookom — gotowym scenariuszom działania — to właśnie tym zajmiemy się na najbliższym Founder OS Bootcamp. Przekażę uczestnikom dokładnie ten setup i playbooki, którymi zarządzam firmą, a następnie pokażę, jak dopasować je do własnej działalności. Zapisz się na listę oczekujących pod filmem, żeby mieć pierwszeństwo.

(Informacja dodatkowa: „system operacyjny AI” to autorskie określenie Bonanna na uporządkowany zbiór plików, wytycznych i narzędzi, którym posługują się jego agenci; bootcamp to jego płatne szkolenie.)

Ten sam proces na wszystko

Opisany workflow sprawdzi się przy stronach docelowych, karuzelach, materiałach na social media i projektach interfejsów — wszystkim, co projektujesz. W tym filmie pokazuję poradniki i miniatury, bo ich robię obecnie najwięcej, ale zasada jest wszędzie ta sama.

Sam proces jest przy tym naprawdę łatwy, a ja wykonuję w nim niewielką część pracy. Claude i ChatGPT już bez żadnej konfiguracji rozumieją, jak działa Paper. Gdy połączysz je przez MCP, możesz korzystać ze wszystkich umiejętności i narzędzi, które służą ci do pracy z Paperem. Ja głównie podaję przykłady, mówię, co mi się podoba, a potem sprawdzam efekt. Wystarczy więc samo połączenie i kilka dobrych referencji.

Chcę jednak, by moje strony, poradniki i posty wyglądały jak dzieło jednej firmy. To znaczy: dać agentowi wytyczne marki — logotypy, fonty, kolory i przykłady ich użycia — żeby nie poprawiać tych samych rzeczy przy każdym zleceniu. Najpierw połączymy Paper i Higgsfield, a potem zbudujemy wokół tego strukturę.

Konfiguracja: Paper i Claude

1. Pobierz Paper Desktop i otwórz plik.
2. Wejdź na stronę instalacji Paper i pobierz rozszerzenie do Claude.
3. W Claude przejdź do ustawień, potem do rozszerzeń, w ustawieniach zaawansowanych kliknij instalację rozszerzenia.
4. Wybierz pobrany plik i potwierdź instalację.

To łączy Claude’a z aplikacją Paper Desktop działającą na twoim komputerze — trzymaj ją otwartą podczas pracy nad projektem. Po dodaniu rozszerzenia zacznij nową rozmowę i poproś agenta o utworzenie prostego nagłówka w Paperze, żebyś na własne oczy zobaczył, że wszystko działa.

Konfiguracja: Higgsfield

Teraz podłączamy Higgsfield, żeby agent mógł też generować grafikę. W Claude wejdź w łączniki i dodaj własny. Nazwij go Higgsfield, wklej adres, połącz się, zaloguj kontem Higgsfield i zatwierdź dostęp. Jeśli pracujesz w ChatGPT — Higgsfield wypuściło właśnie plugin, więc otwórz katalog pluginów, wyszukaj Higgsfield i podłącz konto analogicznie.

Od tej chwili możesz podać agentowi obrazy referencyjne i poprosić, żeby przez Higgsfield tworzył potrzebne ikony i grafiki w ramach projektu.

Jak zacząć projekt i na co uważać

Gdy oba połączenia działają, rozpoczęcie nowego projektu jest proste: powiedz agentowi, żeby użył Papera do zbudowania tego, co chcesz zrobić. Dołącz obrazy referencyjne, potrzebne pliki i kontekst całego przedsięwzięcia — i pozwól mu działać.

Koniecznie musisz używać aplikacji desktopowej: Claude na komputerze, ChatGPT w wersji stacjonarnej albo Codex, z uruchomionym Paperem Desktop. Claude czy ChatGPT w przeglądarce nie połączą się z Paperem przez lokalny adres. A jeśli pracujesz nad istniejącym projektem, po prostu skopiuj link do planszy Paper, podeślij go agentowi i powiedz, co chcesz zmienić.

Trzy warstwy systemu: kontekst, wytyczne, narzędzia

Skoro agent umie już korzystać z narzędzi, dajmy mu kontekst, żeby pracował dla twojej firmy, oraz miejsce, w którym będzie trzymał decyzje projektowe do wykorzystania następnym razem. W moim systemie są trzy części: kontekst o firmie, zasady dotyczące projektów i narzędzia, którymi agent je wykonuje.

Wiki. Tu trzymam informacje o firmie: kim jestem, kto są moi klienci, co sprzedaję i jak o tym mówię. To po prostu zbiór plików, które AI może czytać, gdy potrzebuje kontekstu. Jeśli na przykład w poradniku pojawia się strona o moim bootcampie, chcę, żeby agent sięgnął do tych plików i przeniósł już zapisaną wiedzę o ofercie do nowego projektu. Te same dane trafiają do poradnika, strony i maila, a gdy coś się zmieni, aktualizuję je w jednym miejscu.

Wytyczne projektowe. Trzymam je w umiejętności „brand guidelines”, która mówi agentowi, jak utrzymać spójność z marką. Gdy proszę o projekt, agent czyta te instrukcje i używa fontów, układów oraz referencji obrazowych, które już wybrałem. Skill — bo o nim mowa — to po prostu zestaw instrukcji, których AI może się trzymać. Mój „brand guidelines” ma plik skill.md opisujący, jak stosować te zasady, oraz plik HTML z odniesieniami wizualnymi: mogę go otworzyć i zobaczyć typografię, układy i przykłady, a agent może odczytać wartości, które za nimi stoją.

Narzędzia. U mnie to Paper do składania projektów i Higgsfield do generowania grafiki.

Wytyczne marki: znacznie więcej niż logo i kolory

Cała ta machina wykracza daleko poza zapisanie logotypu i kilku kolorów. Chodzi o to, jak używasz tych elementów razem. Ile miejsca zostawiasz wokół nagłówka? Jak prezentujesz zrzuty ekranu? Jak wyglądają ilustracje w twoich projektach? Które układy chcesz powtarzać? Ja jestem dość elastyczny w kwestii kolorów, bo zwykle wolę, żeby pasowały do tematu filmu, ale typografię, odstępy i sposób prezentacji trzymam konsekwentnie. Twoja firma może być inna — może mieć konkretną paletę, której wszystko musi się trzymać. To wszystkie decyzje, które warto zapisać w wytycznych.

Jeśli masz już brand book od projektanta, po prostu przekaż go agentowi i każ zamienić w taki skill. Możesz wykorzystać także stronę internetową i wcześniejsze projekty — ten cały kontekst może wejść do gry. Potem przejrzyj, co agent z tego złożył, i popraw wszystko, co nie pasuje do twojej wizji. A jeśli tych kwestii jeszcze nie rozstrzygnąłeś, zacznij od projektów, które już masz, i pozwól im pomóc w wyborze nowego kierunku.

Przenośność: wytyczne, które przeżyją zmianę narzędzia

Chcę mieć kontekst firmy i zasady marki zapisane tak, by korzystać z nich także w innych narzędziach. Dzięki temu nie ma znaczenia, w czym wykonam dane zlecenie — agentom podaję te same referencje i wytyczne wraz z dostępem do aktualnie używanego programu. Sposób wykonania projektu będzie inny, ale nie muszę od nowa tłumaczyć swojej firmy ani wypracowywać kierunku wizualnego.

Na koniec: mój przewodnik po konfiguracji Paper i całego systemu projektowego znajdziesz pod linkiem w opisie, tuż obok zapisów na Founder OS Bootcamp. Jeśli materiał był pomocny, zasubskrybuj kanał. Dzięki za obejrzenie.