# Księga znaku i identyfikacji wizualnej ZSZ5

Wersja: 2026-08-06  
Zakres: znak, kolory, typografia, tabliczki na sale, tablice kierunkowe, plakaty informacyjne, komunikaty szkolne, grafiki WWW/social.

To praktyczny guideline operacyjny: ma pozwolić robić spójne materiały szkoły od razu, na bazie dostępnych plików znaku i prostych reguł projektowych.

## 1. Co powinna zawierać księga znaku

Analiza oficjalnych ksiąg i brand manuali pokazuje stały schemat:

1. Geneza i rola znaku.
2. Wersje znaku: podstawowa, uproszczona, pozioma, pionowa, mono, jasna, ciemna.
3. Pole ochronne i minimalny rozmiar.
4. Kolorystyka podstawowa i uzupełniająca.
5. Typografia.
6. Zasady umieszczania znaku na tłach, zdjęciach i obok innych logo.
7. Niedozwolone modyfikacje.
8. Przykłady zastosowań: dokument, plakat, prezentacja, szyld, social media.
9. Pliki produkcyjne i nazewnictwo assetów.

Wersja ZSZ5 powinna być prosta, bo główne użycia są codzienne: gabloty, drzwi, korytarze, sekretariat, wydarzenia, rekrutacja i komunikaty dla uczniów oraz rodziców.

## 2. Rdzeń identyfikacji

**Hasło systemu:** Sektorowo. Konkretnie. Po mistrzowsku.

Identyfikacja ma łączyć:

- **fachowość** - szkoła sektorowa, warsztat, konkret, praktyka;
- **czytelność** - informacja ma być widoczna z kilku metrów;
- **ambicję** - orzeł i „Szkoła Mistrzów” pracują jako sygnał poziomu, nie jako dekoracja.

Materiały ZSZ5 powinny wyglądać jak element jednego systemu, a nie jak osobne projekty robione od nowa w Canvie.

## 3. Znak ZSZ5

Bazowy znak: orzeł z napisem `ZSZ5 WE WROCŁAWIU`.  
Lockup szeroki: orzeł + `Zespół Szkół Zawodowych nr 5` + `Szkoła Mistrzów`.

### 3.1. Wersje znaku

| Wersja | Kiedy używać | Plik startowy |
|---|---|---|
| Znak kompaktowy ciemny | jasne tło, dokumenty, tabliczki, stopki | `assets/zsz5-logo-dark.png` |
| Znak kompaktowy jasny | ciemna belka, ciemna fotografia, tablica kierunkowa | `assets/zsz5-logo-white.png` |
| Znak kompaktowy zielony | akcent specjalny, gdy tło jest neutralne | `assets/zsz5-logo-green.png` |
| Lockup szeroki ciemny | nagłówek dokumentu, belka jasna, prezentacja | `assets/zsz5-lockup-wide-dark.png` |
| Lockup szeroki jasny | plakat, ciemna belka, tablica główna | `assets/zsz5-lockup-wide-white.png` |

### 3.2. Pole ochronne

Pole ochronne to obszar wokół znaku, w którym nie wolno umieszczać tekstu, krawędzi, ramek, ikon ani zdjęć.

Reguła ZSZ5:

- dla znaku kompaktowego: minimum `1/3 wysokości znaku` z każdej strony;
- dla lockupu szerokiego: minimum `wysokość liter ZSZ5` z każdej strony;
- w praktyce druku A4/A3: zostawić co najmniej 10-12 mm od innych elementów.

Jeżeli projekt jest ciasny, zmniejszamy tekst albo upraszczamy układ. Nie ściskamy logo.

### 3.3. Minimalny rozmiar

| Użycie | Minimum | Rekomendacja |
|---|---:|---:|
| Dokument A4 | 25 mm szerokości znaku kompaktowego | 32-40 mm |
| Plakat A4/A3 | 35 mm | 45-65 mm |
| Tabliczka na salę | 20 mm | 24-30 mm |
| WWW/social | 140 px | 180-260 px |
| Tablica kierunkowa | zależnie od odległości | tak duże, aby znak był czytelny z wejścia |

### 3.4. Tła

Logo ciemne:

- białe tło;
- `#F5F7FA`;
- `#E8F5E8`;
- bardzo jasne zdjęcie tylko wtedy, gdy tło jest spokojne.

Logo jasne:

- `#173625`;
- ciemny granat/ciemna zieleń;
- zdjęcie z ciemnym pasem pod logo.

Nie używać ciemnego logo na zielonym, granatowym lub zdjęciu bez kontrastu.

### 3.5. Niedozwolone modyfikacje

- Nie rozciągać znaku.
- Nie zmieniać proporcji orła i napisu.
- Nie dodawać cienia, obrysu, gradientu ani efektu 3D.
- Nie wpisywać logo w przypadkowe koło, herb, tarczę albo ozdobną ramkę.
- Nie zmieniać kroju liter w lockupie.
- Nie używać orła jako tła pod długim tekstem.
- Nie tworzyć osobnych znaków dla klas, pracowni i wydarzeń. Dla nich używać koloru, tytułu i układu, nie nowego logo.

## 4. Kolory

Paleta wychodzi z używanej już zieleni ZSZ5 i porządkuje ją do zastosowań informacyjnych.

| Rola | Nazwa | HEX | Użycie |
|---|---|---:|---|
| Kolor główny | ZSZ Green | `#089700` | pracownie, akcenty, linie, CTA |
| Kolor oficjalny | Deep Forest | `#173625` | nagłówki, belki, tablice główne |
| Tekst | Ink | `#1F2D26` | tekst podstawowy |
| Tło | Warm White | `#F5F7FA` | plakaty, plansze, dokumenty |
| Panel | Mint Panel | `#E8F5E8` | delikatne pola pomocnicze |
| Informacja | Workshop Blue | `#047690` | sprawy organizacyjne, klasy, kierunki |
| Pilne | Craft Amber | `#FF8F00` | terminy, zmiany, komunikaty pilne |
| Linia | Soft Line | `#D8E3DB` | separatory i delikatne ramki |

Proporcja:

- 70% jasne tło;
- 20% tekst i ciemna zieleń;
- 10% akcent.

Pomarańcz jest sygnałem, nie kolorem dekoracyjnym. Jeżeli wszystko jest pomarańczowe, nic nie jest pilne.

## 5. Typografia

### 5.1. Fonty docelowe

1. **Barlow Condensed / Barlow Semi Condensed**  
   Nagłówki, numery sal, tytuły tablic, duże daty, hasła rekrutacyjne.

2. **Atkinson Hyperlegible**  
   Treść informacyjna, opisy, instrukcje, komunikaty dla uczniów i rodziców.

3. **Source Serif 4**  
   Tylko materiały uroczyste: zaproszenia, dyplomy, cytaty, wstępy do publikacji.

### 5.2. Fonty awaryjne

Gdy nie ma fontów docelowych:

- nagłówki: `Arial Narrow Bold`, `Aptos Display`, `Arial`;
- tekst: `Aptos`, `Arial`, `Helvetica`;
- uroczyste: `Georgia`.

### 5.3. Zasady typografii

- Tekst podstawowy wyrównany do lewej.
- Bez justowania.
- Bez kursywy w komunikatach informacyjnych.
- Kapitaliki tylko dla krótkich etykiet: `REKRUTACJA`, `EGZAMINY`, `KOMUNIKAT`.
- Nie pisać całych akapitów wielkimi literami.
- Długi tekst przenosić do WWW/PDF/QR, a nie wciskać na plakat.

## 6. System layoutu

Stałe elementy:

- belka albo stopka z logo;
- jeden mocny nagłówek;
- jeden blok informacji szczegółowych;
- dużo światła;
- akcent kolorystyczny wskazujący kategorię.

Siatka:

- plakat A4/A3: margines 18-24 mm;
- tabliczka A5 poziom: margines 14-18 mm;
- tablica kierunkowa: margines co najmniej 7-10% szerokości;
- separatory cienkie, nie dekoracyjne.

## 7. Tabliczki na klasy i sale

Tabliczki mają być prostsze niż plakaty. Ich zadanie to szybka identyfikacja sali, nie pełna informacja.

### 7.1. Format

Rekomendacja:

- A5 poziom: `210 x 148 mm`;
- alternatywnie listwa: `210 x 99 mm`;
- druk jednostronny, laminowany albo w ramce przy drzwiach.

### 7.2. Struktura tabliczki

Wariant podstawowy:

```text
SALA 204
Pracownia fryzjerska
```

Wariant dla sal ogólnych:

```text
SALA 115
Sala lekcyjna
```

Wariant dla funkcji:

```text
SEKRETARIAT
sprawy uczniowskie i administracyjne
```

Nie dodawać opiekuna sali. Jeżeli trzeba podać dyżur, zastępstwo albo listę osób, robić osobny komunikat tymczasowy, nie stałą tabliczkę.

### 7.3. Kolory tabliczek

- Sale dydaktyczne: `Workshop Blue`.
- Pracownie branżowe: `ZSZ Green`.
- Administracja: `Deep Forest`.
- Komunikaty tymczasowe na drzwiach: `Craft Amber`.

### 7.4. Układ

- Lewy pionowy pas kategorii.
- Duży numer/funkcja.
- Pod spodem krótki opis.
- Małe logo w górnej lub dolnej belce.
- Bez ramek ozdobnych, bez zdjęć, bez ikon, jeśli nie są potrzebne.

### 7.5. Rozmiary tekstu

Dla A5 poziom:

- numer sali: 48-72 pt;
- opis: 22-32 pt;
- logo: 20-28 mm szerokości;
- minimalny kontrast: ciemny tekst na jasnym tle.

## 8. Tablice kierunkowe i układ wizualny szkoły

Zasada: orientacja przed dekoracją.

### 8.1. Tablica główna przy wejściu

Nagłówek:

```text
UKŁAD SZKOŁY
```

Sekcje:

- `PARTER`;
- `I PIĘTRO`;
- `II PIĘTRO`;
- `STREFA WARSZTATOWA`, jeżeli jest logicznie osobna.

Dla każdego piętra maksymalnie 4-7 punktów. Jeżeli jest więcej, robić osobną mapę albo spis sal.

### 8.2. Strzałki i kierunki

Teksty krótkie:

- `Sekretariat`;
- `Sala 204`;
- `Pracownie fryzjerskie`;
- `Sala gimnastyczna`;
- `Biblioteka`;
- `Pedagog`;
- `Aula`.

Nie pisać pełnych zdań na strzałkach.

### 8.3. Powtarzalność

Ten sam kolor powinien pojawiać się:

- na tablicy przy wejściu;
- na strzałkach;
- na tabliczkach przy salach;
- na komunikatach tymczasowych.

## 9. Plakaty informacyjne

Szczegółowy guideline plakatowy jest w pliku `guideline-plakaty-informacyjne.md`.

Zasada skrócona:

```text
1 plakat = 1 sprawa = 1 decyzja odbiorcy
```

Jeżeli odbiorca po 5 sekundach nie wie, czego dotyczy plakat, projekt wymaga uproszczenia.

## 10. Checklist przed publikacją

Przed drukiem lub publikacją:

- Czy logo ma pole ochronne?
- Czy logo jest na odpowiednim tle?
- Czy nagłówek da się przeczytać z 3-5 metrów?
- Czy tekst nie przekracza 80-100 słów na plakacie?
- Czy jest data, godzina, miejsce, odbiorca i źródło szczegółów?
- Czy kolor pilny jest użyty tylko wtedy, gdy informacja naprawdę jest pilna?
- Czy nie ma kilku stylów fontów naraz?
- Czy materiał nie tworzy nowego, przypadkowego „logo wydarzenia”?
- Czy plik ma sensowną nazwę, np. `2026-09-12_spotkanie-klas-pierwszych_A3.pdf`?

## 11. Pliki startowe

- `assets/zsz5-logo-dark.png`
- `assets/zsz5-logo-white.png`
- `assets/zsz5-logo-green.png`
- `assets/zsz5-lockup-wide-dark.png`
- `assets/zsz5-lockup-wide-white.png`
- `templates/plakat-informacyjny-a3.svg`
- `templates/tabliczka-drzwi-a5.svg`
- `templates/tablica-kierunkowa-a1.svg`
- `previews/poster-preview.png`
- `previews/door-sign-preview.png`
- `previews/wayfinding-preview.png`

## 12. Zasada końcowa

System identyfikacji ma ułatwiać codzienną komunikację szkoły. Jeżeli materiał wymaga wielu wyjątków, dodatkowych znaków albo zbyt długiego tekstu, należy uprościć komunikat przed projektowaniem.