Tikriausiai jūs ten buvote anksčiau. Kaip pasirinkti, ar naudotojams rodyti modalą, ir kada nukreipti juos į atskirą naują puslapį? Ir ar tai apskritai svarbu? Tiesą sakant, tai daro. Sprendimas įtakoja vartotojų srautą, kontekstą, gebėjimą ieškoti detalių, o kartu ir klaidų dažnumą bei užduočių atlikimą. Abi galimybės gali būti trikdančios ir varginančios – netinkamu laiku ir netinkamoje vietoje. Taigi geriau tai padarysime teisingai. Na, pažiūrėkime, kaip tai padaryti. Modalai ir dialogo langai, perdangos ir šviesdėžės Nors dažnai kalbame apie vieną modalinės vartotojo sąsajos komponentą, dažnai nepaisome smulkių, sudėtingų niuansų tarp visų skirtingų modalų tipų. Tiesą sakant, ne kiekvienas modalas yra vienodas. Modalai, dialogo langai, perdangos ir šviesdėžės – visi skamba panašiai, tačiau iš tikrųjų yra gana skirtingi:
DialogasBendras pokalbio terminas (vartotojo ↔ sistema). Perdanga Mažas turinio skydelis, rodomas puslapio viršuje. „ModalUser“ turi sąveikauti su išjungta perdanga + fonas. „NonmodalUser“ turi sąveikauti su įjungta perdanga + fonas. „Lightbox“ Pritemdytas fonas, skirtas sutelkti dėmesį į modalą.
Kaip pabrėžia Anna Kaley, dauguma perdangų pasirodo netinkamu laiku, pertraukia vartotojus atliekant svarbias užduotis, vartoja prastą kalbą ir trikdo vartotojų srautą. Jie yra pertraukiantys iš prigimties ir paprastai yra labai sunkūs, be didelio poreikio.
Žinoma, naudotojai turi būti sulėtinti ir pertraukti, jei jų veiksmų pasekmės turi didelį poveikį, tačiau daugeliu atvejų nemodalinės priemonės yra daug subtilesnės ir draugiškesnės, norint ką nors atkreipti vartotojo dėmesį. Jei ką, aš visada siūlau, kad tai būtų numatytasis. Modalai → Pavienėms, savarankiškoms užduotims Būdami dizaineriais, mes dažnai atmetame modalus kaip nereikšmingus ir erzinančius – ir dažnai taip yra! - tačiau jie taip pat turi savo vertę. Jie gali būti labai naudingi įspėjant vartotojus apie galimas klaidas arba padėti išvengti duomenų praradimo. Jie taip pat gali padėti atlikti susijusius veiksmus arba įsigilinti į detales nepertraukiant dabartinės puslapio būsenos. Tačiau didžiausias modalų pranašumas yra tai, kad jie padeda vartotojams išlaikyti esamo ekrano kontekstą. Tai reiškia ne tik vartotojo sąsają, bet ir redaguotą įvestį, slinkimo padėtį, akordeonų būseną, filtrų pasirinkimą, rūšiavimą ir pan.
Kartais vartotojai turi greitai patvirtinti pasirinkimą (pvz., filtrus, kaip parodyta aukščiau), o tada iš karto tęsti. Žinoma, automatinis išsaugojimas gali pasiekti tą patį, tačiau tai ne visada reikalinga ar pageidaujama. Ir blokuoti vartotojo sąsają dažnai nėra gera idėja. Tačiau modalai nenaudojami jokioms užduotims atlikti. Paprastai jas naudojame atskiroms, savarankiškoms užduotims, kai vartotojai turėtų įsijungti, atlikti užduotį ir grįžti ten, kur buvo. Nenuostabu, kad jie puikiai tinka aukšto prioriteto trumpalaikėms sąveikoms (pvz., įspėjimai, destruktyvūs veiksmai, greiti patvirtinimai). Kai modalai padeda: 🚫 Modalai dažnai yra trikdantys, invaziniai ir klaidinantys.🚫 Dėl jų sunku palyginti ir nukopijuoti-įklijuoti.✅ Tačiau modalai leidžia naudotojams išlaikyti kelis kontekstus.✅ Naudinga siekiant išvengti negrįžtamų klaidų ir duomenų praradimo.✅ Naudinga, jei naudotojų siuntimas į naują puslapį trikdytų. ✅ Modalą rodykite tik tuo atveju, jei naudotojai įvertins trikdymą.✅ Pagal numatytuosius nustatymus pirmenybę teikite neblokuojantiems dialogams („nemodaliniams“).✅ Leiskite naudotojams vėliau sumažinti, paslėpti arba atkurti dialogo langą.✅ Naudokite modalą, kad sulėtintumėte naudotojus, pvz., patikrintumėte sudėtingą įvestį.✅ Suteikite išeitį laukelyje „Uždaryti“, arba spustelėkite ESC. Puslapiai → Sudėtingoms, kelių etapų darbo eigoms Vedliai arba navigacija su skirtukais modaluose neveikia per gerai, net ir sudėtinguose įmonės produktuose – ten šoniniai skydeliai arba stalčiai paprastai veikia geriau. Problemos prasideda, kai naudotojams reikia palyginti arba nurodyti duomenų taškus, tačiau modalai blokuoja tokį elgesį, todėl jie iš naujo atidaro tą patį puslapį keliuose skirtukuose.
Sudėtingesniems srautams ir kelių etapų procesams geriausiai tinka atskiri puslapiai. Puslapiai taip pat veikia geriau, kai reikalauja viso vartotojo dėmesio, o nuoroda į ankstesnį ekraną nėra labai naudinga. Stalčiai tinka atlikti papildomas užduotis, kurios yra per sudėtingos paprastam modalui, tačiau nereikia naršyti visame puslapyje. Kada vengti modalų: 🚫 Venkite modalų klaidų pranešimams.🚫 Venkite pranešimų apie funkcijas. 🚫 Venkite modalų, kad galėtumėte naudotis patirtimi.🚫 Venkite sudėtingų, ilgų kelių etapų užduočių. Venkite abiejųPasikartojančioms užduotims Daugelyje sudėtingų, daug užduočių reikalaujančių produktų vartotojai pastebės, kad tas pačias užduotis atlieka pakartotinai, vėl ir vėl. Čia tiek modalai, tiek nauji puslapių naršymai padidina trintį, nes jie nutraukia srautą arba verčia vartotojus rinkti trūkstamus duomenis tarp visų skirtukų ar rodinių. Labai dažnai naudotojai patiria nesėkmingą patirtį, kupiną nesibaigiančių patvirtinimų, perdėtų įspėjimų, išsamių instrukcijų ar tiesiog trūkstamų atskaitos taškų. Kaip minėjo Saulius Stebulis, tokiuose scenarijuose dažnai geriau veikia išplečiamos skiltys arba redagavimas vietoje – jie išlaiko užduotį prie esamo ekrano. Praktiškai daugeliu atvejų vartotojai savo užduočių neatlieka atskirai. Atlikdami užduotis, jie turi ieškoti duomenų, kopijuoti-įklijuoti vertes, patikslinti įrašus skirtingose vietose arba tiesiog peržiūrėti panašius įrašus. Perdangos ir stalčiai yra naudingesni norint išlaikyti prieigą prie foninių duomenų atliekant užduotį. Dėl to kontekstas visada lieka savo vietoje, prieinamas nuorodai arba kopijavimui-įklijavimui. Išsaugokite modalus ir puslapio naršymą akimirkoms, kai pertraukimas tikrai suteikia pridėtinės vertės, ypač kad išvengtumėte kritinių klaidų. Modalai prieš puslapius: sprendimų medis Prieš kurį laiką Ryanas Neufeldas parengė labai naudingą vadovą, kuris padėtų dizaineriams pasirinkti modalą ir puslapius. Jame yra patogus PNG žaidimų lapas ir „Google“ dokumentų šablonas su klausimais, suskirstytais į 7 skyrius. Tai ilga, labai kruopšti, bet labai lengva sekti:
Tai gali atrodyti bauginančiai, bet tai gana paprastas 4 etapų procesas:
Ekrano kontekstas.Pirmiausia patikriname, ar naudotojams reikia išlaikyti pagrindinio ekrano kontekstą. Užduočių sudėtingumas ir trukmė. Paprastesnėms, koncentruotoms, neblaškančioms užduotims gali būti naudojamas modalinis, tačiau ilgiems, sudėtingiems srautams reikia puslapio. Nuoroda į pagrindinį puslapį. Tada patikriname, ar naudotojams dažnai reikia remtis duomenimis fone, ar užduotis yra paprastas patvirtinimas ar pasirinkimas. Tinkamos perdangos pasirinkimas. Galiausiai, jei perdanga iš tiesų yra geras pasirinkimas, ji padeda mums pasirinkti modalinę ar nemodalinę (pasilenkia nemodalinės).
Apvyniojimas Kai tik įmanoma, neblokuokite visos vartotojo sąsajos. Turėkite slankųjį dialogo langą, kuris iš dalies uždengia vartotojo sąsają, bet leidžia naršyti, slinkti ir kopijuoti bei įklijuoti. Arba parodykite modalo turinį kaip šoninį stalčių. Arba vietoj to naudokite vertikalųjį akordeoną. Arba nukreipkite vartotojus į atskirą puslapį, jei reikia parodyti daug detalių. Tačiau jei norite padidinti vartotojų efektyvumą ir greitį, bet kokia kaina venkite modalų. Naudokite juos, kad sulėtintumėte naudotojus, sutelktumėte dėmesį ir išvengtumėte klaidų. Kaip pažymėjo Therese Fessenden, niekas nemėgsta būti pertraukiamas, bet jei reikia, įsitikinkite, kad tai tikrai verta išlaidų. Susipažinkite su „Smart Interface Design Patterns“ Visą skyrių apie modalus ir alternatyvas galite rasti išmaniųjų sąsajų projektavimo modeliuose, mūsų 15 valandų trukmės vaizdo kurse su 100 praktinių pavyzdžių iš realaus gyvenimo projektų – su tiesioginiu UX mokymu vėliau šiais metais. Viskas nuo didžiulių išskleidžiamųjų meniu iki sudėtingų įmonės lentelių – kasmet pridedami 5 nauji segmentai. Pereikite į nemokamą peržiūrą. Naudokite kodą BIRDIE, kad sutaupytumėte 15% nuolaidą. Susipažinkite su Smart Interface Design Patterns, mūsų vaizdo įrašų kursu apie sąsajos dizainą ir UX.
Vaizdo įrašas + UX mokymas Tik vaizdo įrašasVaizdo įrašas + UX mokymas 495,00 USD 699,00
Gaukite vaizdo įrašą + UX mokymą 25 vaizdo pamokų (15 val.) + tiesioginį UX mokymą. 100 dienų pinigų grąžinimo garantija. Tik vaizdo įrašas 300,00 395,00 USD
Gaukite vaizdo kursą40 vaizdo pamokų (15 val.). Atnaujinama kasmet. Taip pat galima įsigyti kaip UX paketą su 2 vaizdo įrašų kursais.
Naudingi ištekliai
Įvairūs iššokančiųjų langų tipai, Anna Kaley „Uxcel“ – geriausia vartotojo sąsajos modulių kūrimo praktika Mes naudojame per daug prakeiktų modalų: UX gairės, Adrianas Eggeris Modaliniai ir nemodaliniai dialogai, pateikė Therese Fessenden Šiuolaikinis įmonės vartotojo sąsajos dizainas: Modaliniai dialogai, Jamesas Jacobsas Modalai projektavimo sistemose
