Фикрҳои воқеӣ дар интерфейс
1) "Фикрҳои воқеӣ" чист
Фикрҳои воқеӣ фикру мулоҳизаҳои саривақтӣ, мушаххас ва марбут ба амал мебошанд, ки ба корбар дар фаҳмидани ҳодиса, ҳоло чӣ рӯй дода истодааст ва дар оянда чӣ мешавад. Он сарбории маърифатиро коҳиш медиҳад, хатогиҳоро коҳиш медиҳад ва ҳисси назоратро зиёд мекунад.
Вазифаҳо:- Паст кардани номуайянӣ ва интизорӣ.
- Хатогиҳоро пешгирӣ кунед ва онҳоро зуд ислоҳ кунед.
- Муваффақиятро тасдиқ кунед ва қадами навбатиро нишон диҳед.
2) Намудҳои фикру мулоҳизаҳо
Фаврӣ (≤ 100 -200 мс): hover/focus/pressed-state, равшансозии унсурҳои фаъол.
Кӯтоҳ (≤ 1 с): спиннерҳо/скелетҳо, микро-тасдиқҳо, "Захирашуда".
Пешрафт (сонияҳо-дақиқаҳо): нишондиҳандаҳои муайян/номуайян, ETA/қадамҳо.
Тасдиқҳо: тоза кардани "Тайёр" + истинод/бекор кардани натиҷа.
Огоҳӣ: бо нармӣ зарарро пешгирӣ кунед (пеш аз фиристодан).
Хатогиҳо: Фаҳмонед, ки "чӣ хато рафт" ва "чӣ гуна онро ислоҳ кардан мумкин аст".
Вазъи система: онлайн/офлайн, ҳамоҳангсозӣ, низоъҳо.
Фикрҳои мундариҷа: инъикоси тағирот, муқоисаи версияҳо, нишони нав.
3) Принсипҳои фикру мулоҳизаҳои баландсифат
1. Саривақтӣ:
фавран microsignal; амалиёти дарозмуддат - бо пешрафт.
2. Пайвастшавӣ ба матн:
дар паҳлӯи фаъолият/майдон дар парчами умумӣ пинҳон намешавад.
3. Хусусият ва амал:
"Гузарвожа хеле кӯтоҳ аст (мин. 8). Онро ислоҳ кунед?" ба ҷои "Хатогии 400".
4. Бозсозӣ:
Бекор/Redo дар огоҳиномаи тағирот.
5. Пешгӯӣ:
намунаҳои якхела барои муваффақият/хатогӣ дар тамоми маҳсулот.
6. Мавҷудият:
контраст, на танҳо ранг, ARIA зинда, назорати фокус.
7. Нигоҳ доштани диққат:
сигнали ҳадди ақали кофӣ; бе моделҳои нолозим ва "фарёд".
4) Намунаҳои фикру мулоҳизаҳои "зинда"
4. 1 Ҳолати визуалии элементҳо
Hover/focus/pressed/маъюбон - иерархияи намоён.
Тугмаи → "боркунӣ" ҳангоми пахш кардан (дигар пахш карда намешавад).
4. 2 Санҷиши хаттӣ (рост дар майдонҳо)
Санҷиши синтаксис ҳангоми гум шудани фокус ё таваққуфи вуруд (debounce 300-500 ms).
Паём дар зери майдон, тасвири вазъ, мисол/ниқоб ("+ 38 (0XX) XXX-XX-XX").
Фармоиш: аввал пешгирӣ кунед, баъд дуруст кунед.
4. 3 Скелети и давлатҳои холӣ
Скелетҳо ба ҷои мундариҷаи "ҷаҳида".
Ҳолати холӣ бо маълумотҳои дастурӣ/намоишӣ ва CTA.
4. 4 UI оптимистӣ (бо бозгашт)
Мо дарҳол натиҷаи тағирёфтаро нишон дода, онро ба сервер ба таври мувозӣ мефиристем.
Дар ҳолати нокомӣ - бозгашти мулоим + сабаби равшан + "Такрор".
Гузоришҳо ва ченакҳои бозгашт талаб карда мешаванд.
4. 5 Автозавр ва нишондиҳандаҳо
"Наҷот 18: 42 "/" Ҳамоҳангсозӣ... "/" Офлайн: нусхаи маҳаллӣ. "
Ихтилофҳо: нишон додани diff ва интихоби тағиротҳои версия/якҷояшавӣ.
4. 6 Огоҳиҳо ва паёмдони паём
Рӯйдодҳои муҳим як вудкои бебозгашт дар тӯли 3-5 сония бо тугмаи амал мебошанд.
Барои вазифаҳои пасзамина - маркази огоҳӣ/таърих.
5) Хатогиҳо: тасниф ва ҷавобҳо
Санҷиш (истифодакунанда): дар паҳлӯи майдон; чӣ гуна ислоҳ кардан; намуна.
Қоидаҳои тиҷорат: шарҳ додани қоида/ҳадди ниҳоӣ; алтернатива пешниҳод кунед.
Техникӣ: шабака/сервер - "Масъалаи алоқа. Такрор кунед?" + ҳолати офлайнӣ.
Муҳим: ҳама чизро бо модалӣ вайрон накунед - контекстро захира кунед, ба барқароршавӣ роҳ диҳед.
Хатогиҳои microcopyright: мухтасар, ба таври дастаҷамъӣ, бидуни рамз ва гуноҳи корбар.
6) Амалиёти тӯлонӣ ва навбатҳо
Пешрафтро муайян кунед: ҳаҷми маълум - нишон додани фоизҳо/қадамҳо.
Номуайян: номаълум - риппл + рейтинги "Одатан 5-10 с".
Вазифаҳои пасзамина: вазъ дар рӯйхати вазифаҳо + push/toast омода.
Бекоркунӣ/таваққуф: дар ҳолати зарурӣ - ҳатмӣ.
Таркиби пешрафт: қадамҳои бисёр → қадамҳои хурд ("Қадами 2/4: санҷиш"...).
7) Офлайн, холигоҳҳо ва низоъҳо
Маълумот: нишони "Офлайн", "Пайваст шавед"....
Кэши маҳаллӣ: бидуни шабака кор кардан; навбат фиристед.
Ихтилофи версия: пешнамоиши фарқиятҳо, интихоб ё якҷоя кардани стратегия.
Вақтсанҷҳо: "Дар 30 сония ноком шуд - оё мо бори дигар кӯшиш мекунем?" + "Баъдтар гузориш диҳед".
8) Дастрасӣ ва фарогирӣ
ARIA минтақаҳои зинда: 'aria-live = "хушмуомила/эътимодбахш"' барои вудкои/хатогиҳо.
Идоракунии фокус: бо иштибоҳ - тамаркуз ба майдон; бо муваффақият - ба натиҷа.
На танҳо ранг: нишона/матн/намуна.
Афзалиятҳои ҳаракат: эҳтиром 'ҳаракатро коҳиш медиҳад'.
Садо/тактикӣ (мобилӣ): хаптикҳои мулоим, имконоти ғайрифаъол.
9) Нишондиҳандаҳои сифати бозгашт
TTF (Вақт-ба-бозгашт) - вақт пеш аз сигнали аввал пас аз амал.
Меъёри хатогӣ/Меъёри ислоҳ - Фоизи хатогиҳое, ки дар ≤ N сония бомуваффақият ислоҳ карда шудаанд.
Rage-Clicks/Dead-End: Кликҳои сершумор дар минтақаҳои ғайрифаъол.
Меъёри бозгашт (оптимистӣ): фоизи гардишҳо ва сабабҳои онҳо.
Муваффақияти эътирофшуда: Фоизи тасдиқи возеҳи "Омодагӣ".
Сигналҳои дастгирӣ: шикоятҳо дар бораи хатогиҳои нофаҳмо/ҳолати гумшуда.
Анҷоми вазифа/TTFV: таъсири бозгашт ба анҷом додани вазифа ва арзиши аввал.
10) Воситаҳо ва чорабиниҳо
Нақшаи сабти ҳадди аққал:
ui_action {type, target_id, context}
ui_feedback_shown {type: success warning error progress, target_id, latency_ms}
ui_error {category: validation business network system, field, code, retriable}
sync_state {online offline syncing, queued_ops, conflicts}
optimistic_tx {entity, op, committed rolled_back, reason}
Атрибутҳо: сегмент, дастгоҳ, канал, барнома/версияи сохтан.
11) Рӯйхати санҷишҳо
11. 1 Тарроҳӣ
- Ҳар як амал вокуниши фаврии визуалӣ дорад.
- Хатогиҳо - дар наздикии мушкилот, бо мисоли ислоҳ.
- Муваффақият - тасдиқи возеҳ + қадами оянда/пайванд.
- Амалиёти тӯлонӣ - пешрафт/ETA/бекоркунӣ.
- Ҳолатҳои офлайнӣ ва ҳамоҳангсозӣ тавсиф карда мешаванд.
- UI оптимистӣ бо бозгашт ва гузоришҳои бехатар.
- Мавҷудият: контраст, ARIA, фокус, на танҳо "ранг".
11. 2 Мундариҷа/Микрокопия
- Мухтасар, дар бораи парванда, бидуни jargon техникӣ.
- Корбарро айбдор накунед; роҳи барқароркуниро пешниҳод кунед.
- Намунаҳои пайваста (Захирашуда, Ноком - Retry).
11. 3 Техника
- Idempotency/Такрори такрорӣ дар CTA.
- Бекор кардан/Такрори ирсол, вақт ва бозгашт бо бозгашт.
- Гузоришҳои TTF, хатогиҳо, хатогиҳо ва навбати офлайнӣ.
- Санҷишҳо бо шабакаи заиф/вокуниш/муноқишаҳои дароз.
12) Намунаҳои ҳуқуқи муаллифии хурд
Муваффақият:- "Захира 7:05 p.m. Шумо мехоҳед кортро кушоед →
- "Парол хеле кӯтоҳ аст - ҳадди аққал 8 аломат".
- "Алоқа гум шуд. Тағиротҳои шумо ба таври маҳаллӣ захира шудаанд. Шумо мехоҳед дубора барқарор кунед?"
- "Коркарди файл (қадами 2/3)... Одатан то 30 сонияро мегирад. Бекор кардан"
- "Нусхаи нави ин ҳуҷҷат вуҷуд дорад. Муқоиса кунед ва тағиротро интихоб кунед"
- "Натавонистам тағиротро татбиқ кунам. Собиқро баргардонд. Такрор кунед?"
13) Пеш аз/пас аз парвандаҳо
Шакл бе дархости → тасдиқи хаттӣ
Пеш: хатогиҳо танҳо пас аз фиристодан; нокомии баланд.
Баъд аз: дархостҳо ҳангоми чоп кардан, намунаҳои формат, равшансозии майдон - Суръати анҷом ва паст шудани сатҳи хатогӣ.
Боркунии тӯлонӣ → скелет + пешрафт
Пеш: экрани холӣ бо spinner; кликҳои ғазаб.
Баъд аз: скелетҳо, пешрафти детерминистӣ, хуруҷи онҳо - Rage-Clicks коҳиш меёбад.
Мондан "ором" → муваффақияти равшан + қадами оянда
Пеш: корбар боварӣ надорад, боз клик мекунад.
Баъд аз: Захира + Пайванди кушода - нусхаҳои камтар ва хатогиҳо.
Шабакаи ноустувор → навбати офлайнӣ
Пеш: аз даст додани маълумот.
Баъд аз: захираи маҳаллӣ, фиристодани такрорӣ, нишони вазъ - эътимоди афзоянда.
14) Раванди татбиқ
1. Харитаи қадам ва хатогӣ: дар куҷо фикру мулоҳиза ва кадом намуд лозим аст.
2. Қолабҳои бозгашт: муваффақият/хатогӣ/пешрафт/офлайн - маҷмӯи ягона.
3. Прототип ва озмоишҳо: таъхирҳо ба таври сунъӣ афзоиш меёбанд; тафтиши мавҷудият.
4. Асбоб: рӯйдодҳо, TTF, роликҳо, кликҳои ғазаб.
5. Таҷрибаҳо: A/B оид ба формулаҳо ва намунаҳо (inline vs post-пешниҳод).
6. Иҷрои парчам ва ретроспективаи ҳодиса.
15) Хулоса
Фикрҳои воқеӣ сигнали дуруст дар лаҳзаи зарурӣ мебошанд: вокуниши фаврӣ, хатогиҳои фаҳмо, пешрафти софдилона ва нуқтаи ниҳоии намоён. Фикрҳои маҳаллиро самаранок ва самаранок созед, офлайнӣ ва нуқсонҳоро нигоҳ доред, дастрасиро мушоҳида кунед ва вақти фикру мулоҳизаро бо дараҷаи хатогӣ ва ғазаб-кликҳо чен кунед. Ин интерфейсро пешгӯишаванда месозад ва корбар ба ҳар амал боварӣ дорад.