UX зөвлөгөө
Монпэй апликейшн дээр та Мини апп хэлбэрээр үйлчилгээгээ байршуулах бол дараах UX дизайны зөвлөмж, TIPS-тэй танилцаарай.
1. User-friendly энгийн, ойлгоход хялбар байх
Хэрэглэгч таны веб дотор байхдаа бодох шаардлагагүйгээр хүссэн үйлчилгээгээ хурдан авч чадаж байвал таны вебийн UX/UI дизайн сайн хийгдсэн байна гэсэн үг юм.
2. Зөвхөн чухал мэдээллийг тодруулж харуулах
Гар утасны дэлгэцийн хэмжээ харьцангуй жижиг учраас хэрэглэгчийг төөрөгдүүлэх, толгойг нь ажиллуулах олон элемент, олон өнгө ашиглах хэрэггүй. Онц шаардлагагүй элементүүдийг хасах нь хэрэглэгч ойлгоход илүү хялбар болгоно.
3. Текстээ уншигдахуйц байлгах
Tips:
- Үсгийн фонтын хэмжээ 16 pixels (11 points) – с бага байвал уншихад хүндрэлтэй байдаг.
- Ялгарал – Цагаан суурь дээр:
- Гол текстийг 87% нэвтрэлттэй хар өнгөөр (#000000)
- Дэд текстийг 60%
- Идэвхигүй, чухал бус тесктийг 38% нэвтрэлттэй байлгах нь тохиромжтой.
- 1 мөрөнд 30 – 40 characters байх нь тохиромжтой.
- Хурууны өндөг утасны дэлгэц дээр дарагддаг хэмжээ дунджаар 10-14мм, хурууны үзүүр 8-10мм байдаг тул button-аа багадаа 10x10мм хэмжээтэй хийх нь тохиромжтой.:
- Хэрэглэгчид утсаа нэг гартаа барьж, эрхий хуруугаараа ихэвчлэн ашигладаг учраас The Rule of Thumb-г баримтлах хэрэгтэй.
4. Хэрэглэгчийг хөтлөх, чиглүүлэх
Хэрэглэгч гол зүйлээ тайлбар шаардахгүйгээр олох боломжтой байх. Өөрөөр хэлбэл зөнгөөрөө дагаж, мэдрэмжээрээ дараа дараагийн үйлдлүүдээ хийж байх нь хэрэглэгчид бүрэн удирдлага байгаа мэдрэмж төрүүлдэг.
Tips:
- Утасны дугаар, РД зэрэг тогтсон форматтай байдаг зүйлсийг уг форматынх нь дагуу field бэлдэж өгөх. Input-дээ тохирсон keyboard гаргаж харуулах хэрэгтэй.
- Хэрэглэгчийн хийх үйлдлийг аль болох багасгах. Хэрэглэгчийн өмнө нь оруулсан мэдээллийг нь хадгалж авах, дараагийн удаа авто бөглөгдсөн байхаар шийдэж өгөх нь зүйтэй.:
- Хэрэглэгчээр олон талбар бөглүүлэх шаардлага гарвал 1 хуудсанд бүгдийг нь бус, хуудаст хуваан бөглүүлэх нь тохиромжтой.:
- Хэрэглэгчийн оруулсан мэдээллийг боломжтой бол тухай бүрт нь динамикаар шалгаж зөв эсэхийг нь харуулж байх нь бөглөж бөглөж дуусаад алдаатай мэдээлэл оруулсан гэдгээ мэдэхээс илүү дээр байдаг.:
5. Форматаа барих
Текст, хэмжээ, өнгөний код зэргээ үргэлж нэг форматын дагуу байлгах хэрэгтэй.
6. Үйлдлийн системийн онцлогт тааруулж хийх
Хэрэглэгчийн гар утасны үйлдлийн системийн онцлогт таарсан байх. Өөрөөр хэлбэл, хэрэглэгч таны веб дотор байхдаа аль хэдийн танил, дотно мэдрэмж авч байвал сайн. Тэгэхээр, үйлдлийн системийнх нь native components (input fields, checkboxes, switches)-г ашиглаж хийгээрэй.
Tips:
- Android OS design guidelines: https://developer.android.com/design
- iOS design guidelines: https://developer.apple.com/design/human-interface-guidelines/ios/overview/themes/
7. Navigation tabs
Хэрэглэгчийг төөрүүлэхгүй байж, хаана байгаагаа төвөггүй харах боломжийг олгох нь маш чухал.
8. Алдааны мэдээллээ шийдэлтэй нь харуулах
Мэдээж алдаа гарахгүй байна гэж байхгүй. Харин алдаа гарах үед хэрэглэгчид “Алдаа яагаад гарсан”, “Яаж засаж болох”-ыг харуулах хэрэгтэй.
9. Шилжилтүүдийг animation-тай хийх нь тохиромжтой
Хэрэглэгч хаана дарахад хаашаа үсэрч байгаагаа илүү ойлгох, дараагийн удаа дахиж ашиглахдаа хаанаас эхлүүлэхээ мэдсэн байх болно.
10. Loading хэсгийг 2 секундээс бага байлгахыг хичээ
Loading screen-г хөдөлгөөнтэй байлгах. Хоосон эсвэл статик текст харуулахаас зайлсхийх хэрэгтэй.