System projektowy MedPass
Kanon
Zbiór reguł uznanych za obowiązujące. System projektowy MedPassa: marka, znak, kolor, typografia, komponenty, wzorce i język, w jednym miejscu i z jednego źródła.
- Stan rozdziału:
- gotowe
Czym jest Kanon
Kanon opisuje stan docelowy wyglądu i języka MedPassa. Dokumentem nadrzędnym jest Brandbook MedPass 1.0 z września 2026. Kanon go nie zastępuje: rozwija go tam, gdzie brandbook milczy (komponenty interfejsu, stany, dostępność), i przekłada na coś, czego da się użyć w kodzie.
Nazwa nie jest przypadkowa. Kanon to zbiór reguł uznanych za obowiązujące, czyli dokładnie to, czym jest ten dokument. Jest krótka, czytelna po polsku i po angielsku, i nie koliduje z nazwą żadnego koloru ani komponentu w marce.
Dla kogo
- Dla osoby budującej interfejs aplikacji, także dla agenta AI: tokeny, komponenty, stany, dostępność i to, gdzie aplikacja dziś odbiega od celu.
- Dla osoby piszącej teksty: strona, oferta, mail, komunikat w interfejsie. Ton, tabela „tak piszemy / tego unikamy” i czerwone linie prawne, których nie wolno przekroczyć.
- Dla osoby przygotowującej materiały poza ekranem: etykieta, protokół, pieczątka, prezentacja. Warianty logo, pole ochronne, rozmiary minimalne.
- Dla wspólników: jedno miejsce, w którym widać, jak marka ma wyglądać i brzmieć, oraz co w niej jest cytatem z brandbooka, a co propozycją do zatwierdzenia.
Jak korzystać
- Zacznij od Marki i Języka marki, zanim napiszesz albo narysujesz cokolwiek. Pół strony, a oszczędza tygodnie.
- W Fundamentach są wartości: kolory, skala kroju, odstępy, narożniki. Każda liczba na stronie pochodzi z jednego pliku tokenów
src/tokens/tokeny.ts, a żywe przykłady są zbudowane z tych samych tokenów. Nie ma wartości przepisanej ręcznie. - W Komponentach i Wzorcach każda strona mówi na górze dwie rzeczy: czy rozdział jest gotowy i czy aplikacja jest dziś z nim zgodna.
- Na każdej stronie oznaczenie „propozycja Kanonu” znaczy: brandbook tego nie definiuje, wartość jest naszym wnioskiem i czeka na zatwierdzenie. Bez tego oznaczenia wartość jest z brandbooka albo z aplikacji, i wtedy jest tak podpisana.
Trzy oznaczenia, które warto znać
| Oznaczenie | Znaczenie |
|---|---|
| Cytat | Dosłowne brzmienie z brandbooka albo z dokumentu w HQ, z podanym źródłem. Nie zmieniamy ani słowa. |
| Sformułowanie Kanonu | Nasze zdanie wyprowadzone z tego, co jest zapisane. Do zatwierdzenia przez wspólników, potem staje się kanonem. |
| Rozbieżność | Aplikacja robi coś inaczej niż mówi brandbook. Ramka podaje, co zmienić i w którym pliku. |
Jak zgłaszać zmiany
Kanon żyje w repozytorium medpass-hq/kanon (Astro, build statyczny, Cloudflare Pages). Zmiana w treści to zmiana w pliku w src/data, zmiana wartości to zmiana w src/tokens/tokeny.ts. Każda zmiana idzie gałęzią i PR-em, jak w pozostałych repozytoriach MedPassa. Decyzje, które zmieniają regułę, dostają wpis w DECYZJE.md z datą, powodem i tym, co odrzucono.
Przed publikacją pnpm verify uruchamia sprawdzenie typów, build i strażnika treści. Strażnik szuka zwrotów zakazanych z brandbooka i z czerwonych linii prawnych. Nie wyłączamy go dlatego, że jest uciążliwy.
Wersja
| Co | Wersja |
|---|---|
| Kanon | 0.1, 2026-09-12 |
| Brandbook (dokument nadrzędny) | 1.0 (wrzesień 2026) |
| Zakres tej wersji | Szkielet i nawigacja; wstęp, marka, logo, fundamenty, język marki i dostępność w całości; komponenty i wzorce w części, z uczciwym oznaczeniem tego, czego brakuje. |
Lista rozbieżności między brandbookiem a aplikacją
Zebrane w jednym miejscu, żeby dało się je zamknąć po kolei. Każda ma szerszy opis na stronie, do której prowadzi.
| Temat | Brandbook | Aplikacja dziś | Gdzie w Kanonie |
|---|---|---|---|
| Kolor marki | fiolet #6B3FEC, turkus #26D5D4 | błękit #3758F9 (--color-brand-600), turkusu nie ma wcale | Kolor |
| Krój | Manrope 400 / 600 / 700 | DM Sans z next/font | Typografia |
| Pismo i tło | atrament #191D26, papier #FFFEFC, tło neutralne #F4F5F8 | neutralna skala Untitled UI (neutral-900 na bieli, płótno neutral-50) | Kolor |
| Narożnik przycisku | 10 px | 8 px (rounded-lg) | Przyciski |
| Przycisk drugorzędny | jasna mięta #E4F8F6 | biel z obrysem i cieniem skeuomorficznym | Przyciski |
| Cień karty | brak cieni w brandbooku; karta na tle neutralnym z cienką linią | karta z shadow-sm i obrysem | Karty |
| Znak w aplikacji | symbol MedPass od 24 px | niebieski kwadrat z literą „M” | Logo |
| Motyw ciemny | nie istnieje w brandbooku | istnieje (next-themes, klasa dark) | Kolor |
| Barwy stanów | tylko zasada: zawsze z etykietą tekstową | pięć stanów w oklch, policzone pod WCAG, brandbook ich nie zna | Oznaczenia statusu |