1. Mobil qurilmalar uchun dasturlar Ishlab chiqish muhiti

Mavzu: Foydalanuvchi interfeysini shakllantirish
Reja:
1. Mobil ilovalar dizaynining xususiyatlari
2 Trafik va ishlash
Mobil ilovalar dizaynining xususiyatlari va uning ish stoli resurslaridan farqlari
Mobil qurilmalar uchun dastur interfeysini loyihalashda siz dizayn xususiyatlaridan xabardor bo'lishingiz kerak va bu faqat ekran o'lchamlari haqida emas. Noutbuk yoki statsionar (statsionar) kompyuterda yaxshi ko'rinadigan narsa mobil qurilmada umuman ishlamasligi mumkin va aksincha. 

Mobil ilova interfeysini ishlab chiqishda nimani yodda tutish kerak? 

Ekran o'lchami. Shubhasiz, telefon ekrani kompyuter yoki noutbukning ekranidan kichikroq. Mobil telefonning displeyiga kamroq elementlar sig'ishi mumkin, shuning uchun dizaynni ishlab chiqishda uning nima bo'lishi haqida o'ylash, shuningdek, foydalanuvchi uchun navigatsiyani soddalashtirish kerak. 
Bosish qobiliyati. Bugungi kunda stilusdan kam odam foydalanadi. Shuning uchun barcha bosiladigan elementlar shunday hajmda bo'lishi kerakki, foydalanuvchi ularning har biriga barmog'i bilan osongina tegishi mumkin. Agar buning uchun u sahifani kattalashtirishi yoki tugmani qayta-qayta bosishga urinib ko'rishi kerak bo'lsa, u ilovadan mamnun bo'lishi dargumon. 
Trafik va ishlash. Telefondan tomosha qilish juda noqulay bo'lgan og'ir saytlarni hamma biladi - sahifalar uzoq vaqt yuklanadi, xatolar yuzaga keladi. Mobil qurilma uchun mo'ljallangan har qanday narsa engil bo'lishi kerak, shu jumladan ilovalar. Birinchidan, og'ir fayllar juda og'ir va auditoriyangiz uchun qimmat bo'lishi mumkin. Ikkinchidan, ishning bir xil tezligi, bu juda muhim. Bundan tashqari, API qo'ng'iroqlari soni serverning umumiy ish faoliyatini yomonlashtirmasligiga ishonch hosil qilish kerak. 
Sahifaning yo'nalishi. Ko'pincha (taxminan 94%) foydalanuvchi qurilmani tik holatda ushlab turadi. Shunga qaramay, telefon gorizontal holatga aylantirilganda interfeys qanday ko'rinishini hisobga olish kerak - bu foydalanish qulayligiga ta'sir qilmasligi kerak.
Imo-ishoralarni boshqarish. Ya'ni, siz "oldinga", "orqaga" va hokazo kabi standart tugmalarni o'chirib qo'yishingiz mumkin va bu buyruqlarning barchasi ma'lum imo-ishoralar yordamida amalga oshiriladi. Bu barcha zamonaviy mobil qurilmalarning o'ziga xos xususiyati bo'lib, mobil ilovani ishlab chiqishda foydalanish kerak. 
Kamera va mikrofon. Barcha gadjetlar ular bilan jihozlangan. Ko'pincha ular qurilmaning xavfsizligini ta'minlash uchun ishlatiladi: standart parolni kiritishdan tashqari, siz yuz yoki ovozni tanib olishingiz mumkin. Muayyan mobil ilova uchun boshqa variantlarni ham ko'rib chiqishga arziydi. 
Mobil dizayn bosqichlari
Dizayn ishining ikkita asosiy bosqichi mavjud:
UX yoki foydalanuvchi tajribasi - bu algoritmni ishlab chiqish, foydalanuvchi dastur bilan qanday munosabatda bo'lishini tushunish. Boshqacha qilib aytganda, bu o'ziga xos ramka, resurs arxitekturasidir.
UI yoki foydalanuvchi interfeysi dizayni. UI dizayni interfeysning ko'rinishi, hissi va estetikasini belgilaydi. 
Oddiy qilib aytganda, UX dizayni tizim qanday ishlashiga va UI qanday ko'rinishiga javobgardir. Ikkala bosqich ham bir-biri bilan chambarchas bog'liq va ko'pincha bir kishi barcha ishlarni bajaradi, ayniqsa kichik dizayn studiyalarida. 
Resursning xususiyatlariga qarab, ba'zi bir alohida aniq bosqichlarni bajarish kerak bo'lishi mumkin, ammo har qanday mobil ilovaning interfeysini ishlab chiqishning asosiy bosqichlari doimo bir xil bo'ladi. Bu vaqt va resurslarni tejaydigan, shuningdek, mijozning kutilmagan izohlarini oldini oladigan bosqichma-bosqich ishdir. 
Kontseptsiyani yaratish
Bu dastur g'oyasi allaqachon mavjud bo'lganidan keyin rivojlanishning birinchi bosqichidir. Interfeys ma'lum bir auditoriya uchun ishlab chiqilayotganligi sababli, siz uni o'rganishingiz va asosiy savolga javob berishingiz kerak - yangi mahsulotdan nima kutilmoqda? Bu tadqiqotni talab qiladi. Ular:
yuqori sifatli (intervyular, fokus-guruhlar, ekspert xulosasi) - “qanday qilib” va “nima uchun” savollariga javob berish;
miqdoriy (so'rovnoma, so'rov, telefon suhbati) - "qanchalik" va "qanchalik tez-tez" savollariga javob bering.
Ushbu tadqiqotlarning barchasi potentsial iste'molchining portretini yaratishga yordam beradi. Va shunga asoslanib, siz dasturning funksionalligini ishlab chiqishni boshlashingiz mumkin. 
Muhim! Mobil ilovani ishlab chiqish noldan boshlangan hollarda dastlab auditoriya ehtiyojlarini aniqlash uchun sifatli, keyin esa miqdoriy tadqiqotlar olib boradi. Agar dastur shunchaki qayta ko'rib chiqilishi kerak bo'lsa, unda buning aksi bo'ladi.
Keyinchalik, siz raqobatchilarni, shuningdek, ularning mahsuloti haqidagi iste'molchilarning sharhlarini o'rganishingiz kerak - bu rivojlanishdagi xatolardan qochishga yordam beradi. Shundan so'ng, siz foydalanuvchining hikoya xaritasini - kelajakdagi prototipning funksionalligini yaratishga o'tishingiz mumkin. Qabul qilingan ma'lumotlarga asoslanib, dizayner foydalanuvchi dasturda qo'yadigan maqsadlarni belgilaydi va keyin ularga erishish uchun harakatlarni ko'rsatadi. Ushbu bosqichda dastur interfeysi qanday ko'rinishga ega bo'lishi haqidagi savol hal qilinadi: asosiy ekranda nima bo'ladi, tugmalar o'lchami va boshqalar. 



Misol uchun, taksi chaqirish uchun ilovani ishlab chiqish haqida gap ketganda, minimal piktogramma va yaxshi xaritani joylashtirish o'rinli bo'ladi. Foydalanuvchiga dasturni ochishi, bir nechta tugmachalarni bosish va mashinaga buyurtma berish kifoya - qo'shimcha navigatsiya tom ma'noda ortiqcha bo'ladi.



Ammo onlayn-do'kon ilovasining interfeysi butunlay boshqacha. Aksincha, u piktogramma bilan to'la bo'lishi mumkin, ular hajmi kichikroq bo'ladi, lekin ayni paytda bosish nuqtai nazaridan qulay.
Aqliy hujum
Kontseptsiyani ishlab chiqqandan so'ng, miya hujumi texnikasini boshlashga arziydi. Buning uchun jamoaning barcha a’zolari o‘z g‘oyalarini o‘ylab topishlari kerak. Agar bitta dizayner bo'lsa, u buni o'zi qiladi. Asosiy qoida shundaki, takliflar juda ko'p bo'lishi kerak, hatto eng noodatiy va amalga oshirish mumkin bo'lmaganlari ham. Amaliyot shuni ko'rsatadiki, oxir-oqibat ulardan foydali narsa chiqadi. 

Interfeysning o'ziga jon beradigan, fikrni haqiqatga aylantiradigan aqliy hujum yoki aqliy hujum. Siz qog'ozda yoki maxsus dasturlarda ishlashingiz mumkin, masalan, Balsamiq maketlari, Sketch, Photoshop va InVision - ta'm va odat masalasi.
Foydalanuvchilar oqimi diagrammasini yaratish: oqim diagrammasi misoli
Mobil ilovaning interfeysini ishlab chiqish yaxshi, lekin undan qanday foydalanish haqida tasavvurga ega bo'lmasangiz, u bundan keyin ishlamaydi. Bu erda foydalanuvchi oqimi diagrammasini yaratish yordamga keladi.

Bu foydalanuvchining mobil ilova bilan o'zaro aloqada bo'lgan harakatlarining vizual tasviridir. Blok-sxema shaklida bajariladi. Foydalanuvchi oqimi diagrammasi barcha mantiqiy va mumkin bo'lgan foydalanish holatlarini ko'rsatadi. 
Interfeys tuzilishi va o'tishlarini muvofiqlashtirish



Interfeys tuzilishi va o'tish diagrammasini yaratgandan so'ng, siz mijoz bilan bu haqda kelishib olishingiz kerak. Siz ishlashni davom ettirgan holda tartibni tasdiqlash uchun yubormasligingiz kerak: agar mijozga biror narsa yoqmasa, eng oson yo'li hozir tuzatishlar kiritishdir. 
Agar siz interfeysni loyihalashda davom etsangiz va keyin tuzilmadagi biror narsani o'zgartirsangiz, ishning yarmi yana bajarilishi kerak bo'ladi.
Interfeys ko'rinishini aniqlash va uslubni tasdiqlash
Agar oldingi bosqich muvaffaqiyatli yakunlangan bo'lsa, siz vizual qismga o'tishingiz mumkin - uslubni tanlash. Eng yaxshi variant - mijozdan interfeysi unga mos keladigan manbalar misollarini so'rash va ular asosida qurish.

Yaxshi veb-dizayner hozirgi dizayn tendentsiyalarini tushunishi, shuningdek, ushbu mijozga aynan nima mos kelishini tushunishi kerak. Mijozning ushbu bilimlari, istaklari va talablariga asoslanib, siz dizaynni ishlab chiqishingiz kerak. Xuddi shu bosqichda masshtablash va tegishli dizaynni bajarish uchun ketadigan umumiy vaqt aniqlanadi.

Shundan so'ng, siz mijozga o'zingizning tasavvuringiz haqida aytib berishingiz kerak, shuningdek, nima uchun bunday qarorlar rivojlanish uchun qabul qilinganligini tushuntirishingiz kerak. Ushbu bosqichning maqsadi ikkala tomon uchun mos keladigan interfeysni qabul qilishdir.
Loyihaning namoyishi: maketlar, prototiplar va boshqa variantlar
Mobil ilovaning umumiy uslubini tasdiqlaganingizdan so'ng, mijozga dizaynning to'liq versiyasini ko'rsatishingiz kerak. Mahsulotni namoyish qilishning turli usullari mavjud, shuning uchun siz o'zingiz uchun eng qulay prototiplash variantini xavfsiz tanlashingiz mumkin.


Tel ramka. Bu eng oddiy interfeys prototiplash vositasi. Tayyor resursning juda past darajadagi namoyishi foydalanuvchining dastur bilan qanday munosabatda bo'lishini, shuningdek uning tuzilishini vizual ravishda ko'rsatishga imkon beradi. Ishlayotganingizda kerakli sharhlarni qo'shishingiz mumkin. 

Tartib. Bu tugallangan dasturning yanada real namoyishi. Bu yerdagi rasmlar statik, ammo mijoz qanday va qanday ko'rinishini darhol biladi. Siz taqdimot yaratishingiz mumkin. Ilgari maketlar ko'pincha Adobe Photoshop yordamida chizilgan, endi u Sketch ilovasi bilan almashtirildi.


Bosiladigan prototip. Bu mobil ilovaning eng real prototipi. Bu erda siz tugmachalarni bosishingiz, menyu bo'limiga o'tishingiz va haqiqiy foydalanuvchi uchun mavjud bo'lgan deyarli hamma narsani qilishingiz mumkin. Ilovani ishlab chiqishni namoyish qilishning eng yorqin variantlaridan biri, uni yaratish juda ko'p vaqt va resurslarni talab qiladi. Ish uchun InVision tez-tez ishlatiladi, ko'pincha u Craft tomonidan to'ldiriladi. 


Animatsiyalangan oqim. Bu dastur jarayonini namoyish qilishning eng vizual va shu bilan birga bajarilishi eng qiyin versiyasidir. Bosiladigan prototipdan farqli o'laroq, bu erda siz hali ham resurs bilan o'zaro ta'sir videosini yozib olishingiz kerak. Murakkab animatsiyalar butun jarayonni sezilarli darajada tortib olishini tushunish muhimdir, bu barcha tomonlar uchun istalmagan. Bundan tashqari, barcha dizaynlar tegishli ko'nikmalarga ega emas.
Ilova dizaynini tasdiqlash


Namoyishdan so'ng siz dizaynni yakuniy tahrirlashingiz kerak. Mijoz allaqachon mobil ilova qanday ko'rinishini tasavvur qiladi. Ko'pincha hamma takliflarga rozi bo'lgan kishi yakuniy natijani boshqacha taqdim etganini e'lon qiladi. Va keyin dizayner ko'p narsalarni qayta ishlashga majbur bo'lish ehtimoli katta. Ammo ko'p hollarda, oldingi bosqichlarda dizayner va mijoz o'rtasidagi yuqori sifatli shovqin bilan, tahrirlar minimaldir. 
IOS va Android - ikkita global mobil operatsion tizimlar
Bugungi kunda bozorning 98% Apple IOS va Google Android o'rtasida bo'lingan, shuning uchun barcha mashhur mobil ilovalar ushbu operatsion tizimlardan biri uchun ishlab chiqilgan. Foydalanuvchi tajribasini yaxshilash uchun IT sanoatining har bir giganti ilovalarni loyihalash, ishlab chiqish va loyihalash bo'yicha ko'rsatmalar berdi:
Android uchun Google Material Design;
IOS uchun inson interfeysi bo'yicha ko'rsatmalar.
Ularni Internetda bepul topish mumkin. Vaqti-vaqti bilan tavsiyalar o'zgartiriladi, to'ldiriladi, shuning uchun ularni vaqti-vaqti bilan qayta o'qib chiqishga arziydi - bu davom etayotgan o'zgarishlar va hozirgi tendentsiyalardan xabardor bo'lishga yordam beradi. 



Tavsiyalarni ko'r-ko'rona bajarishingiz shart emas. Veb-dizaynni rivojlantirishning umumiy tamoyillari va xususiyatlarini tushunish kifoya. Bundan tashqari, siz Android uchun tavsiyalardan ba'zi fikrlarni iOS-ga va aksincha qo'llashga harakat qilishingiz mumkin. 
Muhim! Agar dizaynerda Iphone telefoni bo'lsa-yu, lekin hozirda android uchun dastur ustida ish olib borilayotgan bo'lsa, uning interfeysini yaxshiroq tushunish uchun hech bo'lmaganda vaqtinchalik Android qurilmasini olishga arziydi. Va teskari. 
Turli xil operatsion tizimlar uchun ilovalarni qanday yaratish haqida "IOS uchun ilovalarni loyihalash" va "Android uchun ilovalarni loyihalash " maqolalarida yozgan edik .
Mobil ilovalar dizayneri uchun maslahatlar
Agar siz endigina mobil ilovalarni loyihalash ustida ishlashni boshlayotgan bo'lsangiz, rivojlanishning barcha jihatlarini oldindan o'rganib chiqish va tajribali dizaynerlarning maslahatlarini tinglash maqsadga muvofiqdir. 
Xaridor bilan ishlash
Yaxshi dizayner har doim muloqotga ochiq va rivojlanishning barcha bosqichlarida mijozning istaklarini tinglaydi. Agar mijozning g'oyasi eng muvaffaqiyatli bo'lib ko'rinmasa ham, oxirigacha tinglash va mijozning iltimoslarini inobatga olgan holda o'z variantlaringizni taklif qilish arziydi. Mijoz va dizayner mobil dizayn haqida turli fikr va g'oyalarga ega bo'lishi mumkin va ularning takliflarini argumentlar bilan etkazish, shuningdek, mijoz oxirida aniq nimani olishni istayotganini tushunish juda muhimdir. Loyihaning o'ziga bir vaqtning o'zida bir nechta omillar ta'sir qilishini yodda tutish kerak:
buyurtmani bajarish shartlari;
mijozning dizayndagi byudjeti;
dizaynning maqsadi - investorlar uchun taqdimot kerak bo'lganda boshqa narsa, boshqasi - to'liq huquqli mobil ilova;
ijro texnologiyalari .. 
Ishlab chiquvchilar bilan o'zaro aloqa
Chiroyli grafik dizayn qilish va uni tayyor shaklda ishlab chiquvchilarga berish katta xatodir. Ko'p narsalarni qayta tiklashga to'g'ri keladigan katta xavf bor, lekin allaqachon boshqa, qattiq vaqt oralig'ida. Yaxshi dizayner eng boshidanoq mobil ilovani ishlab chiquvchilar bilan faol hamkorlik qiladi, ularning yechimlari va takliflarini muhokama qiladi. 
Ideal holda, dizayner nafaqat o'z ishini, balki rivojlanish masalalarini ham tushunishi, shuningdek, uning dizayn echimlari amalda qanchalik amalga oshirilishini aniq tushunishi kerak. Bu siz jamoada ishlashingiz va tegishli adabiyotlarni o'rganishingiz kerakligini anglatadi. Agar loyihada hali ishlab chiquvchilar bo'lmasa, xuddi shu platformadagi boshqa loyihalarning ishlab chiquvchilari bilan bog'lanishingiz mumkin.
Mobil ilovani loyihalash jarayoni

Vazifani iloji boricha soddalashtirish uchun dizayner tayyor elementlardan foydalanishi mumkin. Ushbu ish usuli bir vaqtning o'zida bir nechta afzalliklarga ega:

interfeys yaratish jarayonini soddalashtiradi;
barcha darajadagi dasturdan foydalanishni soddalashtiradi, chunki elementlar iste'molchiga allaqachon tanish bo'lishi mumkin;
dizayn yanada uyg'un ko'rinadi.
Shu sababli, dizayner tayyor elementlarga ega onlayn kataloglarni o'rganishi va loyihada ulardan maksimal darajada foydalanishi maqsadga muvofiqdir. 
Loyihaning boshidanoq UI to'plamidan foydalanish
UI Kit - bu xuddi shu uslubda yaratilgan mobil ilova interfeysini yaratish uchun tayyor to'plam. Dizayner tomonidan yangi hamkasblarga topshirish yoki sotish uchun yaratilgan. UI to'plamidan foydalanishning ko'plab afzalliklari bor:
murakkab dasturni ishlab chiqish vaqtini optimallashtirishga yordam beradigan barcha ekranlarda yagona izchil interfeys;
ishlayotganingizda kerakli o'zgarishlarni amalga oshirish oson;
dizayner, ish jarayonida, noldan biror narsani chizish uchun kamroq va kamroq;
yuqori sifatli UI to'plami ishlab chiquvchilar uchun xudodir: ular kodlarni bir xil printsiplarga muvofiq yozadilar, shuning uchun ular erkin o'zgartirishlar kiritishlari mumkin;
Dizayner o'zgartirilsa ham interfeysning ko'rinishi saqlanib qoladi. Agar xodim loyihaning o'rtasida o'zgarsa, yangi dizayner o'tmishdoshi uslubining barcha tafsilotlari bilan osongina ishlashni davom ettirishi mumkin.
Interfeysni ishlab chiqish qiziqarli jarayon, ammo tegishli bilimlarsiz buni qilish qiyin. Bizning Yasno jamoasi 2013 yildan beri mobil ilovalar yaratish bilan shug'ullanadi va har qanday bosqichda ishga qo'shilishga tayyor. Rivojlanish, modellashtirish, ekspertiza - bizning xizmatlarimiz haqida ko'proq ma'lumotni yasno.mobi veb-saytida o'qishingiz mumkin .