Promocja majowa: Użyj kodu JUNE15
Kończy się za:--d:--h:--m:--s
Uzyskaj 15% zniżki
Published on

brand-guidelines.md: Jeden plik, który każde narzędzie AI musi znać o Twojej marce

brand-guidelines.md: Jeden plik, który każde narzędzie AI musi
znać

Zapłaciłeś sporo za wytyczne marki. Leżą w 47-stronicowym PDF gdzieś w Google Drive — tym, które Twoja agencja projektowa dostarczyła 18 miesięcy temu. Twoi programiści nigdy go nie otworzyli. Twoje narzędzia AI nie mogą go otworzyć. I za każdym razem, gdy ktoś tworzy landing page w Cursor, pisze e-mail marketingowy z Claude lub buduje komponent w v0, zaczyna od zera: „Jaki był nasz główny kolor? Inter czy Plus Jakarta Sans? Zaokrąglone czy ostre narożniki?"

Ta pętla — tłumaczenie marki, nadzieja że zostanie zapamiętana, poprawianie tego co nie gra — kosztuje godziny każdego tygodnia. W całym zespole, tylko w przeróbkach, kosztuje tysiące miesięcznie.

Format Stitch design-md Google eliminuje tę pętlę. A Branding5 generuje Twój kompletny brand-guidelines.md automatycznie — pobierz jednym kliknięciem, wrzuć do repozytorium, i każde narzędzie AI, którego używa Twój zespół, natychmiast zna Twoją markę.

Czym jest design-md? (I dlaczego nazywają go DESIGN.md?)

Design-md to oparty na Markdown format specyfikacji w zwykłym tekście dla wytycznych marki i designu. Zamiast PDF-a, który tylko ludzie mogą (teoretycznie) czytać, jest to ustrukturyzowany plik .md, który zarówno ludzie jak i systemy AI mogą parsować, rozumieć i budować na jego podstawie.

Google stworzył format jako część Stitch — ich platformy do generowania UI opartej na AI — z prostym założeniem: jeśli dasz AI dobrze ustrukturyzowany opis systemu Twojej marki, może generować UI, pisać treści i podejmować decyzje projektowe, które już są zgodne z marką. Koniec z powtarzaniem się w każdej sesji.

Dwie nazwy, jedna idea

Pliki napisane w tym formacie mają dwie nazwy:

  • DESIGN.md — skrót w społecznościach programistów. Leży obok README.md i CONTRIBUTING.md w katalogu głównym projektu, a Cursor, Windsurf i inne narzędzia do kodowania AI szukają go automatycznie.
  • brand-guidelines.md — nazwa używana przez Branding5, bo plik zawiera znacznie więcej niż wizualne specyfikacje. Zawiera Twoje pozycjonowanie, archetypy, ICPs, głos i strategię — pełny system marki, nie tylko kolory i czcionki.

Obie nazwy działają. Format i moc są takie same.

Co wchodzi do brand-guidelines.md

Kompletny plik obejmuje każdą warstwę Twojej marki, od strategii po specyfikacje pikselowe. Oto jak wygląda w praktyce brand-guidelines.md wygenerowany przez Branding5:

# Acme Analytics

## Fundamenty marki

- **Pozycjonowanie:** Jedyna platforma analityczna stworzona dla
  nietech­nicznych zespołów marketingowych, które potrzebują wglądów
  klasy enterprise bez krzywej uczenia.
- **Archetyp:** Mędrzec — mądry, godny zaufania, oparty na danych
- **Misja:** Uczynić umiejętności danych dostępnymi dla każdego marketera.
- **Wartości:** Jasność przed złożonością. Dokładność przed szybkością.
  Empowerment przed zależnością.

## Idealne profile klientów

### ICP 1: Growth Marketing Manager

- 28–38 lat, mid-market SaaS (50–500 pracowników)
- Sfrustrowany złożonymi narzędziami BI; potrzebuje dashboardów, które
  może budować sam
- Wzorce językowe: „actionable insights", „self-serve", „time-to-value"
- Główny zarzut: „Czy to zastąpi nasz istniejący stack BI?"

### ICP 2: VP Marketingu

- 35–50 lat, raportuje do CMO lub CEO
- Interesuje się atrybucją cross-channel i raportowaniem dla zarządu
- Kupuje na podstawie dowodu ROI i szerokości integracji

## Identyfikacja wizualna

### Kolory

| Rola        | Hex       | Użycie                                   |
| ----------- | --------- | ---------------------------------------- |
| Główny      | `#2563eb` | CTA, aktywne stany, kluczowe elementy UI |
| Drugorzędny | `#f8fafc` | Tła, karty, kontenery                    |
| Akcent      | `#16a34a` | Stany sukcesu, pozytywne metryki         |
| Neutral 900 | `#0f172a` | Tekst główny, nagłówki                   |
| Neutral 400 | `#94a3b8` | Tekst zastępczy, wyłączone stany         |
| Błąd        | `#dc2626` | Stany błędów, destrukcyjne akcje         |
| Ostrzeżenie | `#f59e0b` | Stany ostrzeżeń, alerty uwagi            |

### Typografia

| Rola    | Rodzina           | Waga | Rozmiar | Interlinia | Śledzenie |
| ------- | ----------------- | ---- | ------- | ---------- | --------- |
| H1      | Plus Jakarta Sans | 800  | 48px    | 1.1        | -0.02em   |
| H2      | Plus Jakarta Sans | 700  | 36px    | 1.2        | -0.01em   |
| H3      | Plus Jakarta Sans | 700  | 24px    | 1.3        | 0         |
| Tekst   | Inter             | 400  | 16px    | 1.6        | 0         |
| Caption | Inter             | 500  | 13px    | 1.4        | 0.01em    |
| Kod     | JetBrains Mono    | 400  | 14px    | 1.5        | 0         |

## Głos i ton marki

- **Głos:** Bezpośredni, pewny, bez żargonu. Wyjaśniamy, nie wykładamy.
- **Zmiany tonu:** Cieplejszy w onboardingu, bardziej asertywny w copy
  sprzedażowym, precyzyjny i neutralny w dokumentacji.
- **Styl zdań:** Krótkie zdania. Strona czynna. Zacznij od korzyści.
- **Unikaj:** Zdań w stronie biernej, „wykorzystywać", „synergia",
  wypełniaczy, wykrzykników w UI produktu.

### Przykłady

- ✅ „Zobacz, które kampanie generują przychód — jednym kliknięciem."
- ❌ „Nasza innowacyjna platforma wykorzystuje najnowocześniejsze technologie,
  aby wyposażyć Twój zespół marketingowy w najlepsze rozwiązania analityczne."

## Wskazówki dotyczące komponentów

### Przyciski

- Główny: wypełniony, `#2563eb`, biały tekst, rounded-full, min wysokość 44px
- Drugorzędny: outlined, obramowanie 1px `#2563eb`, przezroczyste tło
- Ghost: bez obramowania, tylko tekst, używany w nav i akcjach trzeciorzędnych
- Wszystkie przyciski: padding poziomy 16px, font-weight 600, bez wielkich liter

## Dos and Don'ts

- ✅ Zawsze jeden jasny CTA na sekcję
- ✅ Używaj prawdziwych danych w przykładach i zrzutach ekranu, nigdy „Lorem ipsum"
- ✅ Testuj współczynniki kontrastu — minimum WCAG AA (4,5:1 dla tekstu)
- ❌ Nigdy nie używaj więcej niż 3 kolorów w jednym komponencie
- ❌ Nie używaj zdjęć stockowych ludzi wskazujących na ekrany
- ❌ Unikaj wyrównania do środka tekstu dłuższego niż 2 linie

To jest anatomia. Oto jak wygląda prawdziwy output — wygenerowany przez Branding5 dla Oscar Stories, platformy historyjek na dobranoc dla dzieci zasilanej przez AI z archetypem Jester (Błazen).

Front matter YAML — warstwa odczytywalna maszynowo

---
name: 'Oscar Stories'
website: 'https://www.oscarstories.com'
archetype: 'The Jester'
positioning_statement: >
  Dla rodziców, którzy chcą przemienić czas przed snem w radosną
  przygodę, Oscar Stories używa inteligentnej AI do tworzenia
  spersonalizowanych opowiadań, w których Twoje dziecko jest gwiazdą.
usp: >
  Natychmiast tworzy unikalne, zasilane AI opowiadania, w których
  Twoje dziecko jest zabawnym bohaterem, czyniąc czas przed snem
  magicznym, łatwiejszym dla rodziców i inspirując każdej nocy
  wyobraźnię i wartości.
voice:
  tone: 'Przyjazny, wyobraźniowy i zachęcający...'
  personality: 'Zabawny, wyobraźniowy, opiekuńczy, innowacyjny i godny zaufania.'
  promise: 'Sprawić, by czas przed snem był magicznym, więziotwórczym momentem...'
values:
  - 'Joyful Connection'
  - 'Trustworthy Innovation'
  - 'Nurturing Education'
typography:
  primary_font: 'Nunito Sans'
  secondary_font: 'Lora'
colors:
  primary: '#5e219c' # Midnight Plum
  darker: '#332145'
---

Co zawiera reszta pliku

Poniżej front matter YAML pełny plik — ponad 14 000 słów — kontynuuje ze wszystkim, czego AI potrzebuje do podejmowania decyzji zgodnych z marką:

  • Narracja marki: deklaracja pozycjonowania, misja, wizja, USP i historia „dlaczego to robimy"
  • Głębsze spojrzenie na archetyp: kluczowe cechy Błazna, podstawowe strategie, potencjalne pułapki i przykładowe marki (Ben & Jerry's, M&M's, Old Spice)
  • Identyfikacja wizualna: pełny system kolorów z hex, CMYK, HSL i stanami hover; hierarchia typografii z wagami i zasadami użycia
  • Idealny profil klienta: kompletna persona — „Uważny Nowoczesny Rodzic" — z demografią, psychografią, punktami bólu, celami i preferowanymi kanałami
  • Analiza SWOT: mocne strony, słabości, szanse, zagrożenia i ogólna ocena strategiczna
  • Copy marketingowy: 8 nagłówków napisanych głosem Błazna, 5 CTA z taktykami pilności i pełna copy landing page w formacie PAS
  • Strategia treści: plan treści Hero/Hub/Higiena z konkretnymi tytułami, kanałami i celami
  • Kampanie marketingowe: kampanie świadomości, zainteresowania i pożądania zmapowane na framework AIDA

Programista, który nigdy nie spotkał zespołu Oscar Stories, może wrzucić ten plik do Cursor, poprosić o landing page i otrzymać copy brzmiącą jak marka — zabawna, wyobraźniowa, nigdy mentorska — z właściwą fioletową paletą i nagłówkami Nunito Sans. Żadnego briefingu. Żadnych dyskusji.

Tak wyglądają wytyczne marki odczytywalne maszynowo w praktyce. Nie PDF. Jeden plik, który każde narzędzie AI Twojego zespołu może czytać, rozumieć i budować na jego podstawie.

Dlaczego to ważne teraz

Trzy siły zbiegły się, aby uczynić wytyczne marki odczytywalne maszynowo pilnymi, a nie opcjonalnymi:

1. Narzędzia AI piszą teraz większość kodu i copy

Cursor, GitHub Copilot, Claude, v0, Bolt, Lovable — programiści i marketerzy dostarczają szybciej niż kiedykolwiek z pomocą AI. Ale te narzędzia nie mają żadnej wiedzy o Twojej marce, chyba że im o niej powiesz. Przy każdej sesji, przy każdym prompcie, ponownie tłumaczysz swoją paletę kolorów. To nie jest workflow — to podatek od szybkości.

Jeden brand-guidelines.md w Twoim repo eliminuje ten podatek na zawsze.

2. Google promuje design-md jako standard

Gdy Google dostarcza specyfikację formatu przez produkt taki jak Stitch, ekosystem zwraca uwagę. Wtyczki Figma, rozszerzenia VS Code i generatory komponentów AI już zaczynają szukać DESIGN.md w katalogu głównym projektu. Prawidłowe skonfigurowanie pliku dziś oznacza, że jutrzejsze narzędzia będą po prostu działać — bez migracji ani przeróbek.

3. Spójność marki z prędkością AI wymaga reguł odczytywalnych maszynowo

Jeśli Twój zespół generuje 50 artykułów blogowych miesięcznie, 20 wariantów reklam tygodniowo i nową landing page każdy sprint, PDF w Google Drive jest bezużyteczny. Reguły marki muszą żyć tam, gdzie odbywa się generowanie — w repozytorium, w kontekście promptu, w pamięci narzędzia.

PDF vs. brand-guidelines.md: bezpośrednie porównanie

WymiarPDF markibrand-guidelines.md
Odczytywalny przez AI❌ Wymaga OCR; traci strukturę✅ Parsowany natywnie przez każdy LLM
Żyje w repo❌ W Drive/Notion/Dropbox✅ Wersjonowany obok kodu
Zawsze aktualny❌ Ręczne aktualizacje, zamieszanie wersjigit diff pokazuje dokładnie co się zmieniło
Szybkość onboardingu⏱ 30+ min na przeczytanie i przyswojenie⏱ 5 min na przejrzenie; AI używa go natychmiast
Stosowany automatycznie❌ Polega na ludzkiej recenzji✅ AI stosuje reguły przy każdym generowaniu
Czytelny dla człowieka✅ Ładny, ale gęsty✅ Czytelny Markdown, łatwy do przejrzenia
Koszt aktualizacji💸 Retainer agencji lub godziny designu✍️ Edytuj plik tekstowy w dowolnym edytorze

PDF nie umarł dla prezentacji interesariuszom. Ale w codziennym wykonaniu — gdzie narzędzia AI wykonują generowanie — zwykły tekst wygrywa zdecydowanie.

Jak używać brand-guidelines.md z Google Stitch

Google Stitch czyta Twój brand-guidelines.md i używa go do ograniczania generowania UI. Zamiast produkować generyczne komponenty Material, generuje UI pasujące do Twojego systemu kolorów, typografii, odstępów i konwencji komponentów.

Workflow w trzech krokach:

  1. Prześlij lub umieść plik. Umieść brand-guidelines.md w katalogu głównym projektu lub prześlij go bezpośrednio w interfejsie Stitch.
  2. Promptuj naturalnie. Zapytaj o to, czego potrzebujesz: „Wygeneruj sekcję cennika z trzema poziomami i wyróżnionym popularnym planem."
  3. Otrzymaj output zgodny z marką. Stitch automatycznie stosuje Twoje kolory, hierarchię typografii, style przycisków i odstępy. Żadnego przeglądu designu dla podstaw.

Wynik jest nie tylko bliższy Twojej marce — jest szybszy do dostarczenia, bo pomijasz passę korekt, która normalnie zjada całe popołudnie.

Użycie z Cursor, Copilot i innymi narzędziami do kodowania AI

Wrzuć DESIGN.md (lub brand-guidelines.md) do katalogu głównego repo i odwołuj się w promptach:

Cursor:

@DESIGN.md Wygeneruj sekcję hero dla strony głównej.
Użyj głównego stylu CTA, typografii nagłówków i systemu kolorów
zdefiniowanych w pliku.

GitHub Copilot (tryb workspace):

#file:DESIGN.md Zbuduj komponent siatki kart testimonials
używając wytycznych kart i systemu odstępów zdefiniowanych tutaj.

Claude / ChatGPT (wklej lub dołącz plik):

Oto moje wytyczne marki [dołączone: brand-guidelines.md].
Napisz trzy opcje nagłówków strony głównej pasujące do głosu marki
i adresujące ICP 1 (Growth Marketing Manager).

v0 / Bolt / Lovable: Prześlij brand-guidelines.md jako plik projektu lub wklej odpowiednie sekcje do promptu. Te narzędzia zastosują Twoje kolory, typografię i specyfikacje komponentów do każdego generowania.

Zysk: programiści, którzy nigdy nie czytali wytycznych marki, produkują kod zgodny z marką od pierwszego promptu. Ograniczenie jest wbudowane w workflow — nie egzekwowane przez cykle recenzji i wiadomości na Slacku.

Poza wizuałami: dlaczego strategia w pliku zmienia wszystko

Większość plików design system zatrzymuje się na kolorach i czcionkach. Brand-guidelines.md z Branding5 idzie głębiej — i ta głębokość jest tym, co transformuje output AI z „wygląda dobrze" na „brzmi dobrze".

Fundamenty marki mówią AI dlaczego marka podejmuje decyzje, które podejmuje. Gdy AI wie, że jesteś archetypem Mędrca skierowanym do nietech­nicznych marketerów, nie wybiera tylko właściwego koloru przycisku — pisze copy, które jest jasne i pewne, zamiast napędzonego hype'em.

Idealne profile klientów dają AI kontekst odbiorcy do generowania odpowiednich wiadomości. Nagłówek dla VP Marketingu czyta się bardzo inaczej niż dla Growth Marketing Managera. Bez ICP w pliku AI zgaduje. Z nimi celuje precyzyjnie.

Wytyczne głosu i tonu z konkretnymi przykładami (dobrymi i złymi) są sekcją o najwyższej dźwigni dla jakości copy. Jeden dobrze napisany przykład „zrób/unikaj" uczy AI więcej niż sto słów abstrakcyjnego opisu głosu.

Dos i Don'ts działają jako twarde ograniczenia. „Nigdy nie używaj więcej niż 3 kolorów w komponencie" i „zawsze dołączaj CTA w każdej sekcji" to reguły, które AI może dosłownie przestrzegać, za każdym razem. Żadnej niejednoznaczności, żadnego dryfu.

Jak Branding5 generuje Twój

Po ukończeniu analizy marki w Branding5, Twój brand-guidelines.md jest gotowy do pobrania z dashboardu. Oto co dzieje się za kulisami:

  1. Twoja strategia marki zasila plik. Pozycjonowanie, archetyp, ICPs, analiza konkurencji, ton głosu — wszystko, co zbudowałeś w Branding5, przepływa bezpośrednio do ustrukturyzowanego outputu Markdown.
  2. Specyfikacje wizualne są wyvedzone z Twojego pozycjonowania. Kolory, typografia i konwencje komponentów są generowane, aby pasowały do osobowości Twojej marki — nie pobierane z ogólnego szablonu.
  3. Output podąża za specyfikacją design-md. Stitch i kompatybilne narzędzia parsują go natywnie. Żadnej konwersji, żadnego przeformatowania.
  4. Jest gotowy do użycia natychmiast. Wrzuć do repo, dołącz do narzędzia AI lub udostępnij swojemu zespołowi. Jeden plik, każde narzędzie, od pierwszego dnia.

30 minut spędzonych w Branding5 produkuje:

  • PDF strategii dla Twoich interesariuszy i inwestorów
  • Frameworki wiadomości dla Twojego zespołu marketingowego
  • brand-guidelines.md dla każdego narzędzia AI, którego Twój zespół inżynierski i projektowy będzie kiedykolwiek używał

Żadnego copywritingu. Żadnego ręcznego formatowania. Żadnej wiedzy o Markdown potrzebnej.

Pierwsze kroki: pięciominutowa lista kontrolna

Masz już strategię marki? Oto jak przejść od zera do systemu marki gotowego na AI w pięć minut:

  1. Wygeneruj swój plik. Uruchom analizę marki w Branding5 i pobierz brand-guidelines.md z dashboardu.
  2. Wrzuć do katalogu głównego repo. Nazwij go DESIGN.md, jeśli Twój zespół preferuje konwencję programistów, lub zachowaj brand-guidelines.md dla jasności.
  3. Poinformuj swój zespół. Udostępnij jednowierszową wiadomość: „Nasze wytyczne marki są teraz w DESIGN.md w katalogu głównym projektu. Odwołuj się do nich w każdym prompcie AI."
  4. Odwołuj się w każdej sesji AI. Używaj @DESIGN.md w Cursor, dołączaj w Claude lub ChatGPT, przesyłaj w v0 lub Bolt.
  5. Aktualizuj na bieżąco. Gdy Twoja marka się zmienia, zaktualizuj plik i commituj. Git śledzi zmianę. Każde narzędzie natychmiast ją pobiera.

To wszystko. Żadnego decku onboardingowego. Żadnych wąskich gardeł przeglądu designu. Nigdy więcej „jaki jest nasz kolor marki?" na Slacku.

Podsumowanie

Narzędzia AI piszą Twój kod, generują Twoje copy i budują Twoje komponenty. Jedyne pytanie brzmi, czy robią to zgodnie z marką — czy improwizują.

Brand-guidelines.md odpowiada na to pytanie raz. Potem odpowiada automatycznie, przy każdym generowaniu, w każdym narzędziu, dla każdej osoby w Twoim zespole.

Format Stitch Google sprawia, że wytyczne marki odczytywalne maszynowo stają się standardem. DESIGN.md staje się plikiem, którego programiści oczekują w katalogu głównym projektu. Marki, które adoptują go teraz, będą dostarczać szybciej, pozostawać bardziej spójne i marnować mniej czasu na korygowanie outputu AI, który chybił celu.

Twoja strategia marki jest już w Branding5. Twój brand-guidelines.md jest o jeden klik.


Często zadawane pytania

Jaka jest różnica między DESIGN.md a brand-guidelines.md?

To ten sam format. DESIGN.md to skrót popularny w społecznościach programistów — odzwierciedla konwencje nazewnictwa README.md. brand-guidelines.md jest bardziej opisowy i sygnalizuje, że plik zawiera strategię marki (pozycjonowanie, głos, ICP), a nie tylko specyfikacje wizualne. Używaj nazwy, którą preferuje Twój zespół; narzędzia AI parsują obie identycznie.

Czy muszę znać Markdown, aby tworzyć lub edytować plik?

Nie. Branding5 generuje plik automatycznie z Twojej analizy marki. Jeśli chcesz dokonać ręcznych zmian później, Markdown to zwykły tekst z prostym formatowaniem (# dla nagłówków, - dla list, ** dla pogrubienia). Każdy może nauczyć się podstaw w dwie minuty.

Które narzędzia AI obsługują design-md / DESIGN.md?

Google Stitch czyta go natywnie. Cursor, GitHub Copilot, Windsurf, Claude, ChatGPT, v0, Bolt i Lovable działają z nim wszystkie, gdy odwołujesz się do pliku lub dołączasz go. Ponieważ jest to zwykły Markdown, każde narzędzie zasilane przez LLM może go parsować i podążać za nim — żadne wtyczki ani integracje nie są wymagane.

Jak szczegółowy powinien być mój brand-guidelines.md?

Wystarczająco szczegółowy, aby usunąć niejednoznaczność. Minimum: Twoja paleta kolorów z zasadami użycia, specyfikacje typografii, konwencje przycisków/kart/formularzy i wytyczne głosu z przykładami. Im bardziej konkretne Twoje dos i don'ts, tym bardziej spójny output AI. Branding5 domyślnie generuje kompleksowy plik — zawsze możesz usunąć sekcje, których nie potrzebujesz.

Jak utrzymać plik zsynchronizowany, gdy moja marka się zmienia?

Traktuj go jak każdy inny plik źródłowy: edytuj, commituj, pushuj. Ponieważ żyje w Git, Twój zespół widzi dokładnie co i kiedy się zmieniło. Jeśli ponownie uruchomisz analizę marki w Branding5, możesz pobrać zaktualizowaną wersję i zastąpić stary plik. Żadnego retainera agencji, żadnego miesięcznego cyklu rewizji.

Czy mogę używać brand-guidelines.md do zadań niekodowych, takich jak pisanie artykułów blogowych lub copy reklamowego?

Absolutnie. Dołącz plik (lub wklej sekcje Brand Voice i ICP) przy promptowaniu Claude, ChatGPT lub dowolnego asystenta pisania. Wytyczne głosu, przykłady tonu i szczegóły odbiorcy są specjalnie zaprojektowane do poprawy copy generowanego przez AI — nie tylko kodu.


Pobierz swój brand-guidelines.md

Uruchom analizę marki w Branding5 i pobierz zgodny z design-md brand-guidelines.md (DESIGN.md) — gotowy dla Google Stitch, Cursor, Copilot i całego Twojego stosu narzędzi AI.

Wygeneruj swój brand-guidelines.md →