Pamwe wakambovapo. Isu tinosarudza sei pakati pekuratidza modal kune vashandisi, uye isu tinovafambisa riini kuenda kune yakaparadzana, peji nyowani? Uye zvine basa zvachose here? Chaizvoizvo, zvinoita. Sarudzo inopesvedzera kuyerera kwevashandisi, mamiriro avo, kugona kwavo kutarisa kumusoro, uye pamwe nekukanganisa kuwanda uye kupera kwebasa. Iri mbiri sarudzo dzinogona kukanganisa uye kushungurudza - panguva isiriyo, uye panzvimbo isiriyo. Saka zviri nani tiite zvakanaka. Zvakanaka, ngatione kuti tingazviita sei. Modals vs. Dialogs vs. Overlays vs. Lightboxes Nepo isu tichigara tichitaura nezve imwechete modal UI chikamu, isu tinowanzo kufuratira yakanaka, yakaoma nuances pakati pemarudzi ese akasiyana modals. Muchokwadi, haisi yega modal yakafanana. Modals, dialogs, overlays, uye lightboxes - zvese zvinonzwika zvakafanana, asi zvakanyatsosiyana:
DialogA generic izwi rekuti "kukurukurirana" (mushandisi ↔ system). OverlayPanera diki yemukati inoratidzwa pamusoro pepeji. ModalUser inofanirwa kudyidzana neye overlay + yekumashure yakaremara. NonmodalUser inofanirwa kudyidzana neyakavharika + kumashure yakagoneswa. LightboxDimmed kumashure kutarisa kutarisa pane modal.
Sezvinoratidzwa naAnna Kaley, kuwanda kwakawanda kunoonekwa panguva isiriyo, kukanganisa vashandisi panguva yebasa rakaoma, kushandisa mutauro wakashata, uye kutyora kuyerera kwevashandisi. Izvo zvinokanganisa nemasikirwo, uye kazhinji zvine mwero wepamusoro wekuomarara pasina kudiwa kwakasimba kweizvozvo.
Chokwadi vashandisi vanofanirwa kudzikiswa uye kuvhiringwa kana mhedzisiro yechiito chavo iine simba rakawanda, asi kune mazhinji mascenario asiri-modal akanyanya kujeka uye ane hushamwari sarudzo yekuunza chimwe chinhu kumushandisi. Kana paine chinhu, ndinogara ndichikurudzira kuti ive default. Modals → YeImwe, Mabasa Anozvimiririra Sevagadziri, isu tinowanzo ramba modal sezvisina basa uye zvinogumbura - uye kazhinji ndizvo zvazvinoreva! — asi vane ukoshi hwawo zvakare. Vanogona kubatsira zvakanyanya kunyevera vashandisi nezve zvingangokanganisa kana kuvabatsira kudzivirira kurasikirwa nedata. Vanogonawo kubatsira kuita zviito zvine hukama kana kudonhedza pasi muhuwandu pasina kukanganisa mamiriro azvino epeji. Asi mukana mukuru wemodals ndeyekuti vanobatsira vashandisi kuchengetedza mamiriro echiratidziro chazvino. Izvo hazvireve iyo UI chete, asi zvakare yakagadziridzwa yekupinda, nzvimbo yekupuruzira, mamiriro emakodhioni, kusarudzwa kwemafirita, kuronga, zvichingodaro.
Dzimwe nguva, vashandisi vanofanirwa kusimbisa sarudzo nekukurumidza (semuenzaniso, mafirita sezvaratidzwa pamusoro) uye wobva waenderera ipapo ipapo. Kuchengetedza otomatiki kunogona kuita zvakafanana, hongu, asi hazviwanzo kudiwa kana kudiwa. Uye kuvhara iyo UI kazhinji haisi zano rakanaka. Nekudaro, modals haishandiswe kune chero mabasa. Kazhinji, tinoashandisa kumabasa ega, ega ega apo vashandisi vanofanirwa kusvetukira mukati, kupedza basa, uye vodzokera kwavanga vari. Zvisingashamisi, vanoshanda zvakanaka nokuda kwepamusoro-soro, kushamwaridzana kwenguva pfupi (somuenzaniso, chenjedzo, zviito zvinoparadza, zvisimbiso zvinokurumidza). Kana modal dzinobatsira: 🚫 Modals dzinowanzo vhiringa, dzinokanganisa, uye dzinovhiringa.🚫 Dzinoita kuti zviome kuenzanisa uye kukopa-namira.✅ Asi mamodal anobvumira vashandisi kuchengetedza akati wandei.✅ Inobatsira kudzivirira kukanganisa kusinga gadzirise uye kurasikirwa kwedata. ✅ Ratidza modal chete kana vashandisi vachizokoshesa kukanganisa.✅ Nekuda kwekutanga, sarudza ma dialog asingavharise ("nonmodals").✅ Bvumira vashandisi kutapudza, kuviga, kana kudzoreredza nhaurirano gare gare.✅ Shandisa modal kuderedza vashandisi pasi, semuenzaniso, simbisa mapindiro akaomarara.✅ Ipa nzira yekubuda ne "Vhara, bhokisi rekuvhara", ESC kiyi. Mapeji → YeComplex, Multi-Step Workflows Wizards kana tabbed navigation mukati memodals haishande zvakanyanya, kunyangwe mune yakaoma bhizinesi zvigadzirwa - ipapo, mapaneru epadivi kana madhirowa anowanzo shanda zvirinani. Matambudziko anotanga apo vashandisi vanoda kuenzanisa kana kurevera mapoinzi edatha - asi modals inovhara maitiro aya, saka vanovhura zvakare peji rimwe chete mumatabu akawanda pane kudaro.
Kune mamwe kuyerera kwakaoma uye akawanda-nhanho maitiro, mapeji akazvimirira anoshanda zvakanyanya. Mapeji anoshandawo zvirinani kana achida kuti mushandisi atarise zvizere, uye kunongedzera kuchiratidziro chekare hakubatsiri zvakanyanya. Uye madhirowa anoshanda kune madiki-mabasa akaomesesa kune ari nyore modal, asi asingade yakazara peji yekufambisa. Nguva yekudzivisa modal: 🚫 Dzivisa modal dzemameseji ekukanganisa.🚫 Dzivisa modal pazviziviso zvemaficha.🚫 Nzvenga modals ezvekukwira. Dzivisa ZvoseZvemabasa Akadzokororwa Muzvigadzirwa zvakawanda zvakaoma, zvinorema, vashandisi vanozozviwana ivo vachiita mabasa mamwechete kakawanda, kakawanda. Ikoko, modals uye mapeji matsva ekufamba anowedzera kukakavara nekuti anokanganisa kuyerera kana kumanikidza vashandisi kuunganidza dhata risipo pakati pematabo akasiyana kana maonero. Kazhinji, vashandisi vanopedzisira vaine chiitiko chakatyoka, chizere nezvisimbiso zvisingapere, yambiro yakawedzera, verbose mirairo, kana kungoshaya mareferenzi. Sezvakataurwa naSaurous Stebulis, mune izvi zviitiko, zvikamu zvinokwidziridzwa kana kugadzirisa-munzvimbo kunowanzo shanda zvirinani - vanochengeta basa rakabatirira kuchiratidziro chazvino. Mukuita, mune dzakawanda zviitiko, vashandisi havapedzi mabasa avo vari vega. Ivo vanofanirwa kutarisa kumusoro data, kukopa-namira kukosha, kunatsa zvinyorwa munzvimbo dzakasiyana, kana kungoongorora marekodhi akafanana sezvavanoshanda kuburikidza nemabasa avo. Kufukidzira uye madhirowa anonyanya kubatsira mukuchengetedza kuwana kumashure data panguva yebasa. Nekuda kweizvozvo, chirevo chinogara chiri munzvimbo yayo, chiripo chekutarisa kana kukopa-namira. Sevha modals uye kutenderera kwepeji kwenguva apo kukanganisa kunowedzera kukosha - kunyanya kudzivirira kukanganisa kwakanyanya. Modals vs. Mapeji: Muti Wechisarudzo A chinguva shure, Ryan Neufeld akaisa pamwe anobatsira zvikuru gwara kubatsira vagadziri kusarudza pakati modals uye mapeji. Iyo inouya neiyo inobatsira PNG cheatsheet uye Google Doc template ine mibvunzo yakaputsika muzvikamu zvinomwe. Yakareba, yakanyanyisa, asi iri nyore kutevera:
Zvinogona kutaridzika kutyisa, asi zviri nyore 4-nhanho maitiro:
Context of the screen.Chekutanga, tinoongorora kana vashandisi vachifanira kuchengetedza zviri mukati meiyo skrini. Basa rakaoma uye nguva.Masero akareruka, akatarisa, asingakanganisi anogona kushandisa modal, asi yakareba, inoyerera yakaoma inoda peji. Reference kune iri pazasi peji.Tinobva tatarisa kana vashandisi vachiwanzoda kutaura kune data kumashure kana basa riri nyore kusimbisa kana sarudzo. Kusarudza mudhuri wepamusoro.Pakupedzisira, kana chifukidziro chiri chakanaka sarudzo, chinotitungamira kuti tisarudze pakati pemodal kana nonmodal (kutsamira kune isirimodal).
Kupedzisa Pese pazvinogoneka, dzivirira kuvharira UI yese. Iva nedialog inoyangarara, ichivhara zvishoma iyo UI, asi ichibvumira kufamba, kupururudza, uye kukopa-namisa. Kana kuti ratidza zvirimo modal sedhirowa repadivi. Kana kuti shandisa vertical accordion pane kudaro. Kana kuunza vashandisi kune peji rakasiyana kana iwe uchida kuratidza zvakawanda zvakadzama. Asi kana iwe uchida kusimudzira kushanda kwevashandisi uye nekumhanyisa, dzivirira modal chero muripo. Vashandise kudzikisira vashandisi pasi, kuunganidza pfungwa dzavo, kudzivirira kukanganisa. Sezvakataurwa naTherese Fessenden, hapana anofarira kuvhiringwa, asi kana uchifanira, ita shuwa kuti yakakodzera mutengo. Sangana ne "Smart Interface Dhizaini mapatani" Unogona kuwana chikamu chese nezve modals uye dzimwe nzira muSmart Interface Dhizaini Pateni, yedu 15h-vhidhiyo kosi ine zana yemienzaniso inoshanda kubva kumapurojekiti chaiwo ehupenyu - nekudzidziswa kweUX mhenyu gare gare gore rino. Zvese kubva mega-kudonhedza kusvika kumatafura ebhizinesi akaomarara - aine zvikamu zvishanu zvitsva zvinowedzerwa gore rega rega. Svetukira kune yemahara preview. Shandisa kodhi BIRDIE kuchengetedza 15% kubva. Sangana neSmart Interface Dhizaini Mapateni, yedu vhidhiyo kosi pane interface dhizaini & UX.
Vhidhiyo + UX Kudzidzisa Vhidhiyo chete Vhidhiyo + UX Kudzidziswa$ 495.00 $ 699.00
Wana Vhidhiyo + UX Kudzidzira25 zvidzidzo zvevhidhiyo (15h) + Rarama UX Kudzidziswa.100 mazuva ekubhadhara-kudzosa-guarantee.Vhidhiyo chete$ 300.00$ 395.00
Tora vhidhiyo kosi40 vhidhiyo zvidzidzo (15h). Inovandudzwa gore negore.Inowanikwawo seUX Bundle ine makosi maviri evhidhiyo.
Zvishandiso Zvinobatsira
Mhando dzakasiyana dzePopups, naAnna Kaley Maitiro Akanyanya Kugadzira UI Modals, naUxcel Isu Isu Tinoshandisa Akawandisa Damn Modals: UX Mirayiridzo, naAdrian Egger Modal & Nonmodal Dialogs, naTherese Fessenden Yemazuvano Enterprise UI Dhizaini: Modal Dialogs, naJames Jacobs Modals mune Dhizaini Systems
