PDP UI/UX qo‘llanma · v0.7
Rasmiy brendPDP Bosma
Qog‘oz uchun hamma narsa: A4 hujjatlar va shablonlar, vizitka, poster, beydj, ID karta, sertifikat va muhit dizayni. Sahifa maydonlari, pt shkala, CMYK ranglar va bosma oldidan tekshiruv.
Bosma hujjatlar
Qog‘ozda ham bitta tizim
SOP, ish kartochkalari, ilova-formalar, jurnallar, kelishuvlar, HR hujjatlari va qo‘llanmalar A4 qog‘ozda chiqadi. Tasdiqlangan hujjat .docx da yuritiladi, tarqatish uchun PDF chiqariladi. Tuzilma va o‘lchamlar hamma brend uchun bir xil; brenddan faqat to‘rt narsa keladi: shrift, belgi, brend chizig‘i va 1-bet maydoni. Bosmaning o‘z shkalasi bor — pt: ekran o‘lchamlari bu yerga ko‘chirilmaydi.
Blank, SOP, blankalar va shartnoma shablonlari — A4 shablonlar; bosma ranglari — CMYK ranglar. EcoSystem vizitkasi, posteri va roll-up’i — Vizitka va roll-up, sertifikat — Sertifikat.
Sahifa va maydonlar
| Nima | Qoida |
|---|---|
| Format | A4, 210 × 297 mm, kitob holati. Har bir bosma hujjat — shu varaq. |
| Maydonlar | yuqori 30 · pastki 17 · yon 17 mm; matn maydoni 176 × 250 mm |
| Kolontitul | yuqorisi varaq chetidan 5.3 mm, pastkisi 5 mm; ikkalasi ham maydon ichida |
| Birlik | shrift — pt, masofa — mm. 1pt = 1,33px, 12px = 9pt |
| Rang | faqat tokenlar: hujjat shablonida hex-kod yo‘q. Kichik matn to‘liq rangda — och tusni printer nuqtalarga bo‘lib yuboradi |
Sxema tokenlardan quriladi: --eco-print-margin-*, --eco-print-header-top, --eco-print-footer-bottom.
Brenddan keladigan to‘rt narsa — PDP EcoSystemPDP AcademyPDP SchoolPDP UniversityPDP OnlinePDP Junior
Qolgan hamma narsa — sahifa, kolontitul tartibi, matn shkalasi, jadval — brenddan qat’i nazar bir xil. Brendni almashtiring: namunalar faol brend bilan qayta chiziladi.
Shrift
Inter — butun hujjat, sarlavha ham; 800 vazn o‘rniga 700. Bosma shrifti bosma bosqichigacha o‘zgarmaydi — vebdagi yangi shriftlar keyin o‘tadi.
Belgi
Kolontitulda 12px, logotip fayli ranglarida. 1-bet maydonida — to‘liq logotip, maydon matni rangida.
Brend chizig‘i
4px, --eco-print-rule-fill. Kolontitul ostida, sahifada bir marta — boshqa joyda takrorlanmaydi.
1-bet maydoni
SOP va kelishuvning birinchi betida: --eco-bg-brand-solid, matn --eco-text-primary_on-brand. Maydonda — faqat logotip va sarlavha; kicker (SOP-NNN) — maydon ustida, qog‘ozda.
Brend chizig‘i va 1-bet maydoni — slot. Odatda ikkalasi ham brend maydoni rangida; brendning o‘z imzo chizig‘i bo‘lsa, u brend tokeniga (--eco-print-rule-fill) yoziladi va boshqa brendlarga ko‘chirilmaydi. ☐ belgisi — DejaVu Sans: hujjat shriftlarida bu belgi yo‘q.
Kolontitul — har sahifada
Yuqori kolontitul hujjatni aniqlaydi, pastkisi holat va sahifani ko‘rsatadi. .docx da ikkalasi ham Header / Footer’ga qo‘yiladi. Namuna — haqiqiy o‘lcham ×1.4.
Ichki foydalanish uchun. Ushbu hujjat PDP mulki hisoblanadi. PDP EcoSystem’ning tegishli ruxsatisiz uni uchinchi shaxslarga taqdim etish yoki ochiq manbalarda e’lon qilish taqiqlanadi!
- Belgi — 12px, logotip fayli ranglarida; yonida brend nomi va hujjat nomi: 7pt / 700 / +0.12em, katta harflar,
--eco-text-primary. Hujjat nomi oldidan «·». - Versiya va holat («V0.3 · QORALAMA») — o‘ngda,
--eco-text-brand-secondary. - Brend chizig‘i — 4px,
--eco-print-rule-fill; sahifada bir marta, faqat shu yerda. - «Ichki foydalanish» belgisi — 6.5pt, to‘liq
--eco-text-primary, majburiy. Matni o‘zgarmaydi va tarjima qilinmaydi: ruscha yoki inglizcha hujjatda ham shu o‘zbekcha matn turadi, faqat brend nomi o‘zgaradi. - Pastki kolontitul — ustida
--eco-border-secondarychiziq; chapda holat (500), o‘ngda «n / N» (700).
Matn: 10pt, kursivsiz
Bosmada o‘lchov — pt. Asosiy matn ekrandagidan kichikroq ko‘rinadi, lekin qog‘ozda 10pt — odatiy kitob kegli. Namuna — haqiqiy o‘lchamda.
Kiradi: ish kunlari 08:00 dan 08:30 gacha barcha kirishlar va qabul xonasi. 08:30 da navbatchi ro‘yxatni tekshiradi; kechikkanlar jurnalga yoziladi, sababi eshikda so‘ralmaydi. Mehmonlar — alohida SOP’da.
| Rol | O‘lcham | Vazn | Token |
|---|---|---|---|
| Asosiy matn | 10pt / 1.5 | 400 | --eco-print-body-* |
| Qalin kirish so‘zi | 10pt | 700 | --eco-print-strong-weight |
| Ish kartochkasi | 9.5pt / 1.42 | 400 | --eco-print-card-* |
| Jadval matni | 9pt / 1.42 | 400 · 1-ustun 600 | --eco-print-table-* |
| Meta qator | 9pt | 500 | --eco-print-meta-* |
| Label, kicker | 7.5pt | 700 · +0.12em | --eco-print-label-size |
| Jadval sarlavhasi (th) | 7pt | 700 · +0.12em | --eco-print-th-size |
| Kolontitul | 7pt | 700 · +0.12em | --eco-print-head-size |
| «Ichki foydalanish» belgisi | 6.5pt | 400 | --eco-print-notice-size |
| SOP sarlavhasi | 25pt | 800 · −0.035em | --eco-print-title-sop |
| Kartochka sarlavhasi | 22pt | 800 | --eco-print-title-card |
| Bo‘lim sarlavhasi | 15pt | 700 · −0.03em | --eco-print-section-title |
- Kursiv ishlatilmaydi. Brend shriftlarida kursiv yo‘q yoki bosmaga tayyorlanmagan — Word va brauzer uni soxta qiyshaytiradi. Urg‘u — qalin 700 yoki
--eco-text-secondaryrangi. - Xatboshi ko‘pincha qalin kirish so‘zidan boshlanadi: «Kiradi:», «08:30 da». Ish kartochkasida bu majburiy — vaqt yoki holat.
- Vaznlar: matn 400 · meta 500 · jadvalning birinchi ustuni 600 · qalin, bo‘lim sarlavhasi, label, th, kolontitul 700 · SOP va kartochka sarlavhasi 800. Bosmada 500 yarim qalin ko‘rinadi, shuning uchun oddiy matn — 400.
- Ekran shkalasi ko‘chirilmaydi. Interfeys o‘lchamlari — Tipografiya bo‘limida; bosma o‘zining pt shkalasidan foydalanadi.
Besh hujjat turi
Eskizlar faol brendda, masshtab bir xil. To‘rt tur — xodimlar uchun, kelishuv — tomonlar imzolaydigan hujjat.
HR hujjatlari va qo‘llanmalar alohida tur emas: ular SOP kabi tuziladi — sahifa, kolontitul, matn, sarlavha va jadval qoidalari bir xil. Hujjat turi 1-bet maydoni ustidagi kickerda yoziladi.
Sarlavha va jadval
Namuna — haqiqiy o‘lcham ×1.3.
Kutib olish — 08:00–08:30
| № | Vaqt | Amal | Mas’ul |
|---|---|---|---|
| 1 | 08:00 | Xonani ochish va jihozni tekshirish. | Navbatchi ma’mur |
| 2 | 08:15 | Kelganlarni ismi bilan kutib olish. | mentor |
| 2-a | 08:30 dan keyin | Kechikkanlarni jurnalga yozish. | Navbatchi ma’mur |
| A1 | Istalgan vaqt | Begona shaxsni qabul xonasiga kuzatish. | Qo‘riqchi |
- Bo‘lim raqami — plitkada: 9 mm, radius 2.2 mm,
--eco-bg-primary-solid, raqam--eco-text-white12pt (brend maydoni rangida emas — yashil ustida mayda matn yo‘q). Sarlavha 15pt / 700, plitka bilan o‘rtada tekislanadi. - Qadam raqami (1, 2-a, A1) — plitkasiz, jadval kegelida, 600. «2-a» — qadam davomi, «A» — alohida holat.
- Jadval guruhi nomi — label 7.5pt / 700 / +0.12em,
--eco-text-brand-secondary, jadvalning o‘zi ustida. - Ikonkalar — Phosphor Regular (sayt bilan bir to‘plam),
currentColor. Hujjatga SVG symbol bo‘lib joylanadi; ikonka matn o‘rnini bosmaydi.
- th — 7pt / 700 / +0.12em, katta harflar,
--eco-text-tertiary; sarlavha qatori — yumaloq kulrang lenta--eco-bg-secondary, chiziqsiz. - Birinchi ustun 600 — rol, qadam raqami, №. Qolgan ustunlar — 400.
- Tashqi ramka va zebra yo‘q. Qatorlar orasida biliniar-bilinmas
--eco-border-tertiary, oxirgi qatordan keyin chiziq yo‘q. - Qator sahifalar orasida bo‘linmaydi; keyingi betda sarlavha qatori takrorlanadi.
12px dan kichik matn: bosmadagi istisnolar
Ekrandagi «12px dan kichik matn yo‘q» qoidasi bosmaga o‘tmaydi: qog‘oz 30–40 sm dan o‘qiladi va 300 dpi dan yuqori sifatda chiqadi. O‘qiladigan matn 9pt (= 12px) dan kichik emas. Ro‘yxat yopiq — boshqa elementni kichraytirib bo‘lmaydi.
| Element | O‘lcham | Teng | Asos |
|---|---|---|---|
| «Ichki foydalanish» belgisi | 6.5pt | ≈ 8.7px | Huquqiy belgi, o‘qish oqimiga kirmaydi; har betda takrorlanadi. 6.5pt va to‘liq rang — pastki chegara: kichikroq yoki och rangda printer harfni nuqtalarga bo‘lib yuboradi. |
| Kolontitul: brend, hujjat nomi, versiya | 7pt | ≈ 9.3px | Faqat hujjatni aniqlash uchun, har betda bir xil. Katta harf, 700 vazn va +0.12em oraliq kichik o‘lchamda ham aniq o‘qitadi. |
| Pastki kolontitul: holat, «n / N» | 7pt | ≈ 9.3px | Xizmat ma’lumoti, to‘liq rangda; sahifa raqami 700 vazn bilan ajralib turadi. |
| Jadval sarlavhasi (th) | 7pt | ≈ 9.3px | Ustun nomi qisqa va katta harflarda; kulrang lenta ichida 9pt jadval matnidan ajralib turadi. |
| Label, kicker | 7.5pt | ≈ 10px | Katta harf va 700 vazn: harf balandligi 9pt kichik harfli matnnikidan kam emas. Navigatsiya belgisi, uzun matn emas. |
Istisno emas: jadval va meta — 9pt = 12px · ish kartochkasi — 9.5pt ≈ 12.7px · asosiy matn — 10pt ≈ 13.3px. Sertifikatdagi mikromatn — brendbukdagi maket qoidasi.
.docx dan PDF gacha
Shriftni faylga joylang
FaylParametrlarSaqlashShriftlarni faylga joylash
Hujjat shrifti muallif kompyuterida o‘rnatilgan bo‘lishi shart, aks holda Word uni boshqa shrift bilan almashtiradi.
☐ belgisini DejaVu Sans bilan yozing — shunda u har kompyuterda bir xil chiqadi.
PDF — «Saqlash → PDF» yoki brauzerdan «Chop etish → PDF», masshtab 100 %.
Yangi hujjat — 5 qadam
- Turini tanlang: SOP, ish kartochkasi, ilova-forma, jurnal yoki kelishuv.
- Kolontitulni to‘ldiring: hujjat nomi (SOP-NNN · NOMI), versiya va holat. «Ichki foydalanish» matni va brend chizig‘i o‘zgarmaydi.
- Kicker va sarlavhani yozing; SOP’da — meta qator (Ega, Versiya, Sana, Qamrov) va bitta «Maqsad».
- Matnni faqat shu bo‘lim elementlari bilan tering: bo‘lim sarlavhasi, label, jadval, katakcha. Yangi rang va kegl qo‘shilmaydi.
- Pastki kolontitulga holatni yozing va sahifalarni raqamlang: n / N.
Chop etishdan oldin
- Qog‘oz A4, masshtab 100 %, maydonlar 30 / 17 / 17 mm.
- Shrift faylga joylangan: PDF xususiyatlarida (Shriftlar) hujjat shrifti «joylangan» deb ko‘rinadi.
- Ish kartochkasi bitta betda; hech bir varaqda matn maydondan chiqmagan.
- «Ichki foydalanish» belgisi har betda turibdi, matni o‘zgarmagan.
- Kolontitul versiyasi va pastki holat matni hujjatning hozirgi holatiga mos.
- Rang faqat tokenlardan: shablonda hex-kod yo‘q.
Bosma tokenlari
Bosma tokenlari hamma brend uchun bir xil — --eco-print-*. Rollar mavjud semantik tokenlardan olinadi, yangi rang yo‘q. Ekran tokenlari — Design tokenlar bo‘limida.
Sahifa
--eco-print-page-width- 210mm
--eco-print-page-height- 297mm
--eco-print-margin-top- 30mm
--eco-print-margin-bottom- 17mm
--eco-print-margin-x- 17mm
--eco-print-header-top- 5.3mm
--eco-print-footer-bottom- 5mm
Matn
--eco-print-body-size- 10pt
--eco-print-body-leading- 1.5
--eco-print-body-weight- 400
--eco-print-strong-weight- 700
--eco-print-card-size- 9.5pt
--eco-print-card-leading- 1.42
--eco-print-table-size- 9pt
--eco-print-table-leading- 1.42
--eco-print-meta-size- 9pt
--eco-print-meta-weight- 500
--eco-print-first-col-weight- 600
Label, kolontitul, belgi
--eco-print-label-size- 7.5pt
--eco-print-th-size- 7pt
--eco-print-head-size- 7pt
--eco-print-head-mark- 12px
--eco-print-notice-size- 6.5pt
--eco-print-caps-weight- 700
--eco-print-caps-tracking- .12em
Sarlavha va raqamlar
--eco-print-title-sop- 25pt
--eco-print-title-sop-tracking- -.035em
--eco-print-title-card- 22pt
--eco-print-section-title- 15pt
--eco-print-section-weight- 700
--eco-print-section-tracking- -.03em
--eco-print-num-size- 12pt
--eco-print-num-tile- 9mm
--eco-print-num-radius- 2.2mm
Chiziq va qatorlar
--eco-print-rule-height- 4px
--eco-print-th-rule- 1.5px
--eco-print-row-height- 18pt
Kelishuv bo‘laklari
--eco-print-panel-title- 13pt
--eco-print-step-title- 11pt
--eco-print-icon-tile- 7.4mm
--eco-print-icon- 4.4mm
--eco-print-step-base- 52mm
--eco-print-step-rise- 10mm
--eco-print-sign-row- 13mm
Brend qismi — PDP EcoSystemPDP AcademyPDP SchoolPDP UniversityPDP OnlinePDP Junior
--eco-print-font- —
--eco-print-title-weight- —
--eco-print-rule-fill
Brenddan olinadi; boshqa hamma bosma tokeni — umumiy.
| Rol | Token |
|---|---|
| Matn, urg‘u, xizmat matni | --eco-text-primary --eco-text-secondary --eco-text-tertiary |
| Brend nomi, sahifa raqami, th chizig‘i | --eco-text-primary |
| Versiya, kicker, label | --eco-text-brand-secondary |
| Katakcha ☐, ikonka | --eco-fg-brand-primary |
| 1-bet maydoni (logotip va sarlavha) | --eco-bg-brand-solid + --eco-text-primary_on-brand |
| Bo‘lim raqami | --eco-bg-primary-solid + --eco-text-white |
| «Maqsad» paneli, kelishuvdagi tashkilot paneli | --eco-bg-primary-solid + --eco-text-white |
| Ikonka plitkasi | --eco-bg-brand-primary |
| Sarlavha lentasi, qator chizig‘i | --eco-bg-secondary --eco-border-tertiary |
| Shrift, sarlavha vazni, brend chizig‘i | --eco-print-font --eco-print-title-weight --eco-print-rule-fill (brend qismi) |
Sahifa qoidasida (@page) var() ishlamaydi: maydonlar qiymat bilan yoziladi (--eco-print-margin-* ga teng). Qolgan hamma joyda — tokenlar.
@page { size: A4; margin: 30mm 17mm 17mm; }
.doc {
font-family: var(--eco-print-font);
font-size: var(--eco-print-body-size);
line-height: var(--eco-print-body-leading);
color: var(--eco-text-primary);
print-color-adjust: exact;
}
.doc th {
font-size: var(--eco-print-th-size);
letter-spacing: var(--eco-print-caps-tracking);
}
.doc thead { display: table-header-group; }
.doc tr { break-inside: avoid; }
A4 shablonlar
Blank, SOP, blankalar va shartnoma
To‘rtta majburiy A4 shablon — haqiqiy o‘lchamda, mm va pt bilan. Ofis printeri va bosmaxona varianti alohida. Faqat EcoSystem, matnlar — namuna.
Yillik hisobot
Yillik hisobot — A4, 12 bet
Hamkor, investor va jamoa uchun yil yakuni: muqova, mundarija, rahbar maktubi, raqamlar yoyilmasi, grafik betlari, keys, moliya jadvali va orqa muqova. Skrepka uchun 12 bet — o‘quvchi va bosmaxona tartibida, setka bilan. Faqat EcoSystem, raqamlar — namuna.
Ma’lumot varag‘i
Ma’lumot varag‘i — bitta bet A4
Hamkor yoki investor bilan birinchi uchrashuv uchun: kim ekanmiz, to‘rtta raqam, loyihalar, nima taklif qilamiz va kim bilan bog‘lanish kerak. Ofis printerida chop etiladi va PDF bilan yuboriladi. Faqat EcoSystem, raqamlar — namuna.
Oylik KPI hisobot
Oylik KPI hisobot — A4 yotiq
Rahbariyat yig‘ilishi uchun ikki bet: oltita KPI plitka, ikki grafik, xulosa, yo‘nalishlar jadvali va xavflar. Tartib har oy bir xil — oylarni yonma-yon solishtirish oson. Grafiklar faqat --eco-chart-* tokenlarida. Faqat EcoSystem, raqamlar — namuna.
Dashboard → PDF
Dashboard’ni PDF qilish — bosma uslubi
Ilova dashboard’i «Chop etish / PDF» tugmasi bilan A4 yotiq hujjatga aylanadi: boshqaruv yo‘qoladi, tepada filtr va eksport vaqti, pastda bet raqami, kartalar betlar orasida bo‘linmaydi, Dark — Light’ga o‘tadi. Belgilash bitta — faqat bosma CSS qo‘shiladi. Faqat EcoSystem, raqamlar — namuna.
Hujjatdagi grafiklar
Hujjatdagi grafiklar — savoldan shaklga
Hisobot va taqdimotdagi grafik uchun tanlov: Financial Times «Visual Vocabulary» ning to‘qqiz oilasi — bizning shakllarimizga. Qog‘oz uchun ranglar, o‘lchamlar va grafik anatomiyasi. Ranglar — faqat --eco-chart-1…6 (EcoSystem: yashil, qora, limon, kulranglar). Ekran grafiklari — Grafiklar va Ma’lumot vizualizatsiyasi.
Bosma jadvallar
Bosma jadvallar — moliya, KPI va uzun ro‘yxat
Hisobot va PDF uchun jadval: raqamlar o‘ngga va bir xil enli, birlik sarlavhada, guruh va jami aniq ko‘rinadi, zebra va rang bezagi yo‘q. Bitta sinf — .eco-ptable — ekranda (Light / Dark) va qog‘ozda. Interaktiv jadval — Ma’lumotlar jadvali. Faqat EcoSystem, raqamlar — namuna.
Vizitka va roll-up
Aydentika qog‘ozda: vizitka, poster va roll-up
EcoSystem’ning chiziqli orbitalari bosmada: vizitka 90 × 50 mm, A3 poster, roll-up 850 × 2000 mm va mobil banner. Maketlar — Figma kadrlaridan, matnlar — namuna. Faqat EcoSystem.
Poster, beydj va ID
Poster, beydj, ID karta va dars jadvali
Masofadan o‘qiladigan formatlar: A3 poster, A6 tadbir beydji, CR80 karta va jadval — haqiqiy nisbatda, pt va mm bilan. Faqat EcoSystem, matnlar — namuna.
Sertifikat
Sertifikat va diplom: oltita konsepsiya
O‘quv dasturini tamomlaganlik sertifikati — bosma (A4 yotiq) va raqamli nusxa. Har variant brendning o‘z grafikasidan: orbitalar, belgi qurilishi, nurli belgi, mesh, nuqtali to‘r va parametrik guilloche. Ism — eng yirik element, har nusxada unikal ID va tekshirish QR kodi. Faqat EcoSystem, matnlar — namuna.
Muhit dizayni
Muhit dizayni — panjara, oyna, devor va belgilar
Binodagi brend: metall panjara (University, School), shisha devorlardagi matli plyonka (EcoSystem, University, School) va A4 yo‘naltiruvchi belgilar (University). Maketlar — dizayner kadrlaridan (Figma), vektor xonada; o‘lchamlar millimetrda, ranglar va materiallar — taklif.
CMYK ranglar
Ekranda RGB, qog‘ozda CMYK
Bosma ranglarining yagona jadvali: har brend rangi uchun ekran HEX va RGB, qoplamali va qoplamasiz qog‘oz uchun CMYK hamda chetlanish ΔE.
Fayl va preflight
Fayl nomi, hujjat kodi va bosma oldidan tekshiruv
Shablon va tayyor fayl bir xil nomlanadi, har hujjatda kod va reviziya bor, bosmaga ketishdan oldin bitta ro‘yxat bo‘yicha tekshiriladi.