Amaliy ish №6 Figma-da dizayn tizimi. Asoslar, matnlar, tipografiya

UI Kit step by step

https://www.sketchappsources.com/

https://m2.material.io/
http://designsystemsclub.ru/
https://guides.kontur.ru/
Vazifa №1: UX
Maqsad
Mijozga to'plangan naqd pul uchun shaxsiy kabinetida chegirmalar (reklama kodlari) sotib olishga ruxsat bering.
Nima qilish kerak
Shaxsiy kabinetda sahifa dizaynini loyihalash va chizish kerak, bu erda foydalanuvchi to'plangan naqd puldan foydalangan holda keyingi kreditlar uchun promo-kodni "sotib olishi" mumkin. Dizayn saytning mobil versiyasi uchun amalga oshirilishi kerak, chunki. Mijozlarning 90% saytning mobil versiyasidan foydalanadi, shuning uchun dizayn birinchi navbatda mobil qurilmalarga qaratilgan.
Elementlar ****
• Joriy bonus hisobi (sum)
• Mavjud promo-kodlar ro'yxati (-10%, -20%, -30%...-60%)
• Har bir promo-kod uchun narx (chegirma qiymatiga ekvivalent, -10% = 10000 so'm)
• Xarid qilish va promo-kodni qo'llash uchun CTA (yoki boshqa konversiya elementi).
• Xarid qilingan promo-kodning amal qilish muddati.
Agar kerak bo'lsa, foydalanuvchi tajribasini yaxshilashga yordam beradigan bo'lsa, siz tanlagan elementlarni qo'shishingiz mumkin.
Foydalanuvchining interfeys bilan o'zaro ta'sirini ko'rsatish muhimdir
Baholash mezonlari
• Foydalanuvchi tajribasi: interfeys qanchalik foydalanuvchilar uchun qulay yaratilgani
• Grafik elementlar bilan ishlash
• Tipografiya
• To'r, chekinish tizimi bilan ishlash
• Avtomatik tartib
tartib talabi
Ramka hajmi: 360px
Ishning natijasi - Figma-dagi maketga (prototip) ishlaydigan havola. 3-4 ta ekranni chizish kifoya qiladi.
Vazifa №2: UI
Maqsad
Saytning mobil versiyasi uchun mahsulot kartalari bilan bloklangan dizayn.
Nima qilish kerak
Asosiy sahifa uchun mahsulot kartalari bo'lgan blokni prototipga ko'ra chizish kerak. Ushbu kartalarning maqsadi foydalanuvchi uchun eng foydalisini tanlashga yordam berish uchun kompaniya mahsulotlari bilan yangi foydalanuvchini tanishtirishdir.
Biznes nuqtai nazaridan, kompaniya uchun "Maksimal" deb nomlangan mahsulotni "sotish" foydaliroq. Dizayn kontseptsiyasi "tezlik" bilan parallel bo'lsa, bu ortiqcha bo'ladi. Biz sizdan bo'yalgan prototipni kutmaymiz. Prototipdagi elementlarga asoslanib yechimingizni taklif qilishingiz mumkin.
Baholash mezonlari
• Rang bilan ishlash
• G'oya, ijodiy
• Grafik elementlar bilan ishlash
• Tipografiya
• To'r, chekinish tizimi bilan ishlash
• Avtomatik tartib
tartib talabi
Ramka hajmi: 360px
Ishning natijasi - Figma-dagi maketga (prototip) ishlaydigan havola