Przejdź do treści
Spis treści

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ć

  1. Zacznij od Marki i Języka marki, zanim napiszesz albo narysujesz cokolwiek. Pół strony, a oszczędza tygodnie.
  2. 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.
  3. 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.
  4. 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ć

OznaczenieZnaczenie
CytatDosłowne brzmienie z brandbooka albo z dokumentu w HQ, z podanym źródłem. Nie zmieniamy ani słowa.
Sformułowanie KanonuNasze 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

CoWersja
Kanon0.1, 2026-09-12
Brandbook (dokument nadrzędny)1.0 (wrzesień 2026)
Zakres tej wersjiSzkielet 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.

TematBrandbookAplikacja dziśGdzie w Kanonie
Kolor markifiolet #6B3FEC, turkus #26D5D4błękit #3758F9 (--color-brand-600), turkusu nie ma wcaleKolor
KrójManrope 400 / 600 / 700DM Sans z next/fontTypografia
Pismo i tłoatrament #191D26, papier #FFFEFC, tło neutralne #F4F5F8neutralna skala Untitled UI (neutral-900 na bieli, płótno neutral-50)Kolor
Narożnik przycisku10 px8 px (rounded-lg)Przyciski
Przycisk drugorzędnyjasna mięta #E4F8F6biel z obrysem i cieniem skeuomorficznymPrzyciski
Cień kartybrak cieni w brandbooku; karta na tle neutralnym z cienką liniąkarta z shadow-sm i obrysemKarty
Znak w aplikacjisymbol MedPass od 24 pxniebieski kwadrat z literą „M”Logo
Motyw ciemnynie istnieje w brandbookuistnieje (next-themes, klasa dark)Kolor
Barwy stanówtylko zasada: zawsze z etykietą tekstowąpięć stanów w oklch, policzone pod WCAG, brandbook ich nie znaOznaczenia statusu