Skip to content

Uyga vazifa ​

Har bir vazifa 20–40 daqiqa. Barcha ishlarni bitta «E-kutubxona» Figma faylida (alohida sahifalarda) saqlang. Topshirish: keyingi dars boshida mentorga Figma havolasini (view huquqi bilan) ko'rsating.

13-dars uchun (UI kit va dizayn tizimi tushunchasi) ​

1-topshiriq: «E-kutubxona UI kit sahifasi»

  1. 13-darsda boshlangan UI Kit sahifasini oching (Colors, Typography, Buttons).
  2. Inputs bo'limini qo'shing: oddiy (default), fokus (focus) va xato (error) holatidagi 3 ta matn maydoni (320 × 48, radius 8).
  3. Barcha elementlarda faqat Color styles va Text styles'dan foydalaning — HEX qiymatni qo'lda yozmang.
  4. Sahifa yon tomoniga token jadvalini matn sifatida yozing: 5 rang, 3 matn uslubi, 4 bo'shliq (8, 16, 24, 32).

Kutiladigan natija: 4 bo'limli (Colors, Typography, Buttons, Inputs) UI kit sahifasi va token jadvali; Primary rang o'zgartirilganda tugma ham yangilanadi.


14-dars uchun (Mashhur UI kitlar) ​

2-topshiriq: «Tayyor kitdan o'rganamiz»

  1. Figma Community'dan bitta UI kitni oching (Material 3 Design Kit, iOS UI Kit, Ant Design yoki Bootstrap).
  2. Undan 5 ta komponentni nusxalang: button, input, checkbox, card, navbar (yoki tabs).
  3. Ularni «E-kutubxona» stillari (13-dars) bilan qayta bo'yang.
  4. 3–4 jumlali izoh yozing: kit nimasi bilan yoqdi / yoqmadi, «E-kutubxona» uchun mosmi va nega.

Kutiladigan natija: Kit tahlili frame'ida 5 ta qayta bo'yalgan komponent va asoslangan izoh.


15-dars uchun (UI kit amaliyoti: header va kategoriya paneli) ​

3-topshiriq: «E-kutubxona sahifasini to'ldirish»

  1. Darsda yaratilgan header va kategoriya paneliga asosiy menyu qo'shing: «Bosh sahifa», «Yangi kitoblar», «Mualliflar», «Aloqa».
  2. «Barcha kitoblar» tugmasini va kontent qismida banner joyini (Rectangle) qo'shing.
  3. Yagona uslub: bir xil ranglar (stillar), Inter shrifti, bir xil radius, 8-point grid oraliqlari; red guides bilan masofalarni tekshiring.
  4. Qidiruv blokini (Search/Default) va tugmani komponentga aylantiring.

Kutiladigan natija: header, menyu, kategoriya paneli, tugma va banner joyidan iborat, yagona uslubdagi sahifa qismi; Assets'da kamida 2 ta komponent.

© 2026 AXVHUB.UZ