- Стандартты пайдаланушы интерфейсінің тәжірибесі туралы мәлімет
- Бағдарламаңыздың қағаз прототипін жасау
- Прототипті пайдаланып пайдаланушы пікірін алу
Бұл сабаққа арналған іс-шаралар:
ПРОТОТИПТЕУ
Енді сізде минималды өміршең өнім туралы идея болған кезде, сіздің жобаңыз қандай болатынын ойластырып, кейбір идеяларды сызу керек.
Прототип - бір нәрсенің ерте үлгісі болып табылады
Қолданба әзірлеушілері әдетте кодтауды бастамас бұрын қолданбасының қағаз прототипін жасайды.
Қағаз прототипі - қолданбаның пайдаланушы интерфейсі қандай болатынын қолмен сызылған бейнелеу. Ол әдетте қолданбадағы әр экранның әртүрлі күйлерін бейнелейтін сызбаларын қамтиды.
НЕЛІКТЕН ПРОТОТИП?
- Идеяларыңызды көрнекі түрде жылдам жеткізуге болады.
- Бұл бірлескен!
- Қағазбен жұмыс істеу әлдеқайда еркін, ал әңгімелер эксперименттен туындайды.
- Бұл қымбат емес!
- Көп уақыт пен ақша жұмсаудың қажеті жоқ
- Компьютерге немесе Интернетке қатынасудың қажеті жоқ.
- Процестің осы бөлігі үшін техникалық сарапшы болудың қажеті жоқ.
- Дизайныңызда не жұмыс істемейтінін немесе жұмыс істемейтінін жылдам білу үшін пайдаланушылардың прототипіңізге қалай әрекет ететінін көре аласыз.
- Қолданбаны әзірлеуге және кодтауға уақыт жұмсамас бұрын дизайн шешімдерін растауға болады.
Басқа Technowation Girls командалары осы бейнеде қағаз және сандық прототиптерді қалай жасағанын біліңіз!
Тәлімгер Кеңесі
Үздік тәжірибелер: Студенттерді қағаз және картон прототиптерімен таныстырғанда, идеяларды тексеру үшін қарапайым, арзан үлгілерден бастау маңыздылығын атап өтіңіз. Мысалы, «Қағаз және картон прототиптері сіздің дизайныңыз үшін өрескел жобалар сияқты. Олар түпкілікті нұсқаны жасамас бұрын идеяңыздың қалай көрінетінін және жұмыс істейтінін көруге көмектеседі. Бұл қарапайым модельдер сізге жылдам өзгертулер енгізуге және қайсысы жақсы жұмыс істейтінін анықтауға мүмкіндік береді.
Қағаз прототипін әлеуетті пайдаланушылардан кері байланыс алу үшін пайдалануға болады (яғни, отбасы мүшелері, басқа тәлімгерлер, достар, қауымдастық мүшелері және т.б.). Бұл кері байланыс соңғы жіберу материалдарына енгізілген кері байланыстың бір бөлігі болуы мүмкін.
Келесі бейнелер ілеспе аппараттық құралдармен (сол жақта) жобаны прототиптеу үлгісін және қағаз прототипімен (оң жақта) тестілеу процесін көрсетеді.
Оқушыларға қойылатын жетекші сұрақтар:
Неліктен соңғы өнімді жасамас бұрын қағаз немесе картон арқылы қарапайым прототипті жасау пайдалы?
Қағаз немесе картон үлгісін жасау дизайнды жақсартуға қалай көмектеседі?
Қағаз прототипін сынаудан қандай нәрселерді білуге болады, басқаша білмейсіз бе?
Тәлімгер кеңестері AmeriCorps қолдауымен ұсынылған.
ПРОТОТИП ЭЛЕМЕНТТЕРІ
Қағаз прототипін бастағанда осы нәрселерді есте сақтаңыз. Қосымша ақпарат алу үшін әр картаның үстіне апару.
Пайдаланушылар
Пайдаланушылар
Құрылғы түрлері
Құрылғы түрлері
Телефон vs планшеті бар ма?
Арнайы мүмкіндіктер
Арнайы мүмкіндіктер
Консистенция
Консистенция
ПАЙДАЛАНУШЫ ИНТЕРФЕЙСІ
Прототипіңізді жасау пайдаланушының қолданбаңызбен қалай әрекеттесетініне байланысты. Бұл термин пайдаланушы интерфейсі немесе пайдаланушы интерфейсі болып табылады. Ол пайдаланушыға қолданбаңызды пайдалануға мүмкіндік беретін түймелер, мәтіндік жәшіктер және жүгірткілер сияқты барлық элементтерді қамтиды.
Сандық өнімдерді жобалаудың тағы бір термині User Reasere немесе UX болып табылады. Әрқайсысы төменде түсіндіріледі.
Пайдаланушы интерфейсі
Пайдаланушылардың бағдарламамен өзара әрекеттесу әдісі. Ол пайдаланушыға бағдарламаны пайдалануға мүмкіндік беретін түймешіктер, мәтін ұялары және жүгірткі сияқты барлық элементтерді қамтиды.
UI дизайны бағдарламаңызды визуалды тартымды, интуитивті және оңай пайдалануға бағытталған.
Пайдаланушы тәжірибесі
Пайдаланушылар сіздің қолданбаңызды қалай көреді. Ол пайдаланушы интерфейсін қамтиды, бірақ пайдаланушылардың эмоциялары, көзқарастары мен мінез-құлқы туралы көбірек.
UX дизайны - бұл пайдаланушының қажеттіліктері мен мақсаттары және олардың жалпы тәжірибесін арттыру.
ПАЙДАЛАНУШЫ ИНТЕРФЕЙСІНІҢ МҮМКІНДІКТЕРІ
Төменде мобильді бағдарламаға арналған пайдаланушы интерфейсінің кейбір негізгі бөліктері берілген
НАВИГАЦИЯ
Навигация – пайдаланушылардың қолданбада іздегенін табу жолы. Мұнда навигация опцияларының бірнеше мысалдары берілген.
КОНТЕЙНЕР
Бұл компоненттер мазмұнды бірге топтастыруға мүмкіндік береді. Экранның бөліктерін төсеп, бөлшектерді жасырып, көрсеткенде көмектеседі.
ЕНГІЗУ
Енгізу компоненттері пайдаланушыға ақпаратты бағдарламаға енгізуге мүмкіндік береді. Төменде бірнеше мысалдар берілген.
АҚПАРАТ
Бұл компоненттер бағдарламаға пайдаланушылармен ақпарат алмасуға мүмкіндік береді.
СТАНДАРТТЫ ЭЛЕМЕНТТЕРДІ ПАЙДАЛАНУ
Қолданбаңыздың бәсекелестеріңізден ерекшеленуін қалауыңыз мүмкін. Дегенмен, стандартты элементтерді пайдалану пайдаланушыларға қолданбаңызды қалай тезірек пайдалану керектігін түсінуге көмектеседі.
Мысалы, пайдаланушылардың көпшілігі ашылмалы мәзірмен таныс. Сіз мәзірдің жаңа түрін жасай аласыз, бірақ ол пайдаланушылар үшін түсініксіз болуы мүмкін. Пайдаланушыларды жеңілдету үшін таныс құрамдастарды қолданыңыз.
STOP & СЫНАП КӨРУ
- Дәл қазір қолданбалар дүкенінен жаңа қолданбаны жүктеп алыңыз.
- Егер шабыт қажет болса, AllTrails (iOS немесе Android) немесе Blinkist (iOS немесе Android) қолданбаларын қолданып көріңіз
- Жоғарыда аталған қандай компоненттерді пайдаланады?
- Бағдарламаны шамамен 5 минут бойы пайдаланып көріңіз.
- Оны қалай пайдалану керектігін анықтау үшін қанша уақыт кетті?
Google-дан Мелисса Пауэл мен Мариям Шайхпен бірге эскиз және қағаз прототипін жасау бойынша осы қысқа бейнені қараңыз.
1-ҚЫЗМЕТ ТҮРІ: ҚАҒАЗ ПРОТОТИПІ
Қолданбаңыздың экрандарын сызыңыз
- Пайдаланушылар экраннан экранға қалай ауысады?
- Олар бағдарламаға қажетті ақпаратты қалай енгізеді?
- Ақпарат қалай көрсетіледі?
- Ол эстетикалық тұрғыдан қалай баяндалады?
- Түс схемасы, шрифт, логотип туралы ойланыңыз
ПІКІР АЛУ
Енді сіздің шешіміңізді көрсететін физикалық нәрсе бар болғандықтан, пайдаланушы пікірін алу уақыты келді!
Әлеуетті пайдаланушылар оны сынап көруі және сізге шынайы пікір білдіруі керек.
Пайдаланушылармен тестілеуден нені үйренгіңіз келеді?
Бір әдіс:
- Пайдаланушыларға қолданбаңызбен орындалатын тапсырмалар жинағын беріңіз және олар мұны сіздің араласуыңызсыз орындай алатынын көріңіз.
- Топтың бір мүшесі «компьютер» ретінде әрекет ете алады
- пайдаланушының өзара әрекеттесуіне негізделген экрандарды немесе экрандардың бөліктерін өзгертеді
- Команданың тағы бір мүшесі - жазба қабылдаушы
- пайдаланушының не істеп жатқанын және олардың түсініктемелері мен реакцияларын жазады.
- Рұқсаттың көмегімен тестілеу сеансын да жазуға болады.
Есіңізде болсын, сіздің тестерлеріңіз сізге көмектесу үшін осында! Олардың өзара әрекеттесуіне (әрекеттерге негізделген прототипке жауап беретін/жаңартатын «компьютерден» басқа) үкім шығармаңыз немесе араласпаңыз.
Тек олардың пікірлерін ризашылықпен қабылдыңыз.
Міне, велосипед жөндеу шеберханасы қолданбасы үшін пайдаланушы сынауының тамаша мысалы.
2-ӘРЕКЕТ: ПІКІР АЛУ
Қағаздың прототипін 2-3 пайдаланушымен тексеру
- Прототипті пайдаланушыларға көрсету.
- Пайдаланушылардан прототипі бар тапсырманы орындауды сұраңыз.
- Олар тапсырманы көмексіз орындауға тырыссын.
- Топ мүшесі «компьютер» ретінде әрекет ете алады және олардың әрекеттеріне жауап береді.
- Басқа топ мүшесі (немесе екі) пайдаланушылардың не істейтінін, олардың пікірлері мен реакцияларын жазып алады.
РЕФЛЕКСИЯ
Қағаз прототипін сақтауды ұсынамыз. Жобаңызды құру арқылы жұмыс істегенде оған қайта сілтеме жасау қажет болады. Сондай-ақ прототипті суретке түсіру керек.
НЕГІЗГІ ТЕРМИНДЕРГЕ ШОЛУ
- Прототип – өнімнің ерте үлгісі
- Paper Prototype — бағдарламаңыздың қандай болатынын қолмен көрсету
- User Interface (UI) — пайдаланушының мобильді бағдарламамен физикалық әрекеттесу әдісі
- User Experience (UX) — пайдаланушының мобильді қолданбаны пайдаланғанға дейін, пайдалану кезінде және оны пайдаланғаннан кейін қалай қарайтыны
ҚОСЫМША РЕСУРСТАР
Қағаз прототиптеу үшін таңдаулы әдіс болғанымен, әсіресе бірінші қадам ретінде, қолданбаның прототипін жасау үшін сандық құралдарды да пайдалануға болады.
Көптеген құралдар бағасы бар, бірақ әдетте шектеулі мүмкіндіктермен немесе жобалармен пайдалануға болатын тегін нұсқасы бар. Міне, бірнеше мүмкіндіктер.
- Google слайдтары (оңай және тегін!)
- InvisionApp
- Figma
- Marvel бойынша POP
