1---2name: brand-identity-43description: Voice framework, visual identity standards, color palette management, typography specs, brand consistency4---5
6# Brand Identity
7
8Marka kimligini olusturma ve koruma rehberi. Tutarlilik her seydir.
9
10## Voice Framework
11
12### Voice vs Tone
13
14| Kavram | Tanim | Ornek |
15|--------|-------|-------|
16| Voice | Markanin kalici kisilik ozellikleri | "Profesyonel ama samimi" |
17| Tone | Duruma gore degisen ifade bicimi | Hata mesajinda: empatik, basaride: kutlamaci |
18
19### Personality Traits Matrisi
20
21Markanin 4 eksenini tanimla:
22
23| Eksen | Sol Uc | Sag Uc | Senin Pozisyon (1-5) |
24|-------|--------|--------|----------------------|
25| Formalite | Resmi, kurumsal | Samimi, konusma dili | ? |
26| Enerji | Sakin, olculu | Heyecanli, enerjik | ? |
27| Mizah | Ciddi, agirbasli | Eglenceli, espirili | ? |
28| Teknik | Basit, herkes icin | Uzman, teknik dil | ? |
29
30### Voice Checklist
31
32- [ ] 3-5 kelimelik voice tanimi var (orn: "Guvenilir, samimi, net")
33- [ ] Her voice ozelliginin "yapma" karsiligi var
34- [ ] Ornek cumleler var (ana sayfa, hata mesaji, onboarding)
35- [ ] Tone varyasyonlari tanimli (basari, hata, bekleme, bilgi)
36
37## Visual Identity Standards
38
39### Logo Kullanim Kurallari
40
41| Kural | Detay |
42|-------|-------|
43| Clear space | Logo etrafinda min logo yuksekligi kadar bosluk |
44| Min boyut | Dijitalde min 24px yukseklik |
45| Arka plan | Hangi renklerde kullanilabilir, hangilerinde degil |
46| Varyasyonlar | Full color, monochrome, reversed (dark bg) |
47| Yasaklar | Stretch etme, renk degistirme, efekt ekleme |
48
49### Color Palette Management
50
51#### 3-Katman Token Mimarisi
52
53```
54LAYER 1: Primitive (Ham renkler)
55 blue-500: #3b82f6
56 blue-600: #2563eb
57 gray-100: #f3f4f6
58
59LAYER 2: Semantic (Anlam tasiyan)
60 color-primary: {blue-600}
61 color-danger: {red-600}
62 color-surface: {white}
63 color-text: {gray-900}
64
65LAYER 3: Component (Kullanim yeri)
66 button-primary-bg: {color-primary}
67 button-primary-hover: {blue-700}
68 card-bg: {color-surface}
69 input-border: {gray-300}
70```
71
72#### Palette Kurallari
73
74| Kural | Detay |
75|-------|-------|
76| Ana renkler | Max 3 (primary, secondary, accent) |
77| Notral tonlar | 1 gray skalasi (50-950) |
78| Durum renkleri | Success (yesil), Warning (sari), Danger (kirmizi), Info (mavi) |
79| Dark mode | Her semantic token'in dark varyanti |
80| Kontrast | Tum text/bg kombinasyonlari WCAG AA (4.5:1) |
81
82### Typography Specifications
83
84| Kullanim | Font | Agirlik | Boyut | Satir Yuksekligi |
85|----------|------|---------|-------|-----------------|
86| Display | Primary | Bold (700) | 48-72px | 1.1 |
87| H1 | Primary | Semibold (600) | 36-48px | 1.2 |
88| H2 | Primary | Semibold (600) | 24-36px | 1.25 |
89| H3 | Primary | Medium (500) | 20-24px | 1.3 |
90| Body | Primary | Regular (400) | 16px | 1.5 |
91| Small | Primary | Regular (400) | 14px | 1.4 |
92| Caption | Primary | Regular (400) | 12px | 1.3 |
93| Code | Mono | Regular (400) | 14px | 1.5 |
94
95#### Font Pairing Rehberi
96
97| Baslik | Govde | Karakter |
98|--------|-------|----------|
99| Inter | Inter | Notr, profesyonel |
100| Cal Sans | Inter | Modern, teknoloji |
101| Playfair Display | Source Sans | Luks, editoryal |
102| Space Grotesk | DM Sans | Yaratici, modern |
103| Fraunces | Work Sans | Sicak, organik |
104
105### Iconography
106
107| Kural | Detay |
108|-------|-------|
109| Stil tutarliligi | Tek icon seti sec (Lucide, Heroicons, Phosphor) |
110| Boyut skalasi | 16, 20, 24, 32px (text ile orantili) |
111| Cizgi kalinligi | Set icinde tutarli (1.5px veya 2px) |
112| Filled vs Outlined | Birini sec, karistirma |
113
114## Brand Consistency Checklist
115
116### Dijital Urunler
117- [ ] Primary font tanimli ve yuklendi
118- [ ] Color token'lari CSS variable olarak tanimli
119- [ ] Logo tum varyasyonlarda mevcut (SVG)
120- [ ] Favicon ve og:image marka tutarli
121- [ ] Button, input, card stilleri tutarli
122- [ ] Hata mesajlari marka voice'una uygun
123- [ ] Empty state illust/copy marka ile uyumlu
124- [ ] Loading animasyonu marka ile uyumlu
125- [ ] 404 sayfasi marka ile uyumlu
126
127### Iletisim
128- [ ] Email template'leri marka tutarli
129- [ ] Bildirim mesajlari voice rehberine uygun
130- [ ] Onboarding akisi marka tonunda
131- [ ] Dokumantasyon stili tutarli
132
133## Islem Akisi
134
1351. **Kesfet**: Marka degerlerini, hedef kitleyi, rakipleri analiz et
1362. **Tanimla**: Voice, renk, tipografi, ikon standartlarini belirle
1373. **Dokumante et**: Token'lari, kurallari, ornekleri yaz
1384. **Uygula**: Design system'e entegre et
1395. **Denetle**: Tutarlilik kontrolu yap, sapmalari duzelt
majiayu000