Dibe ku tu berê li wir bûyî. Em çawa di navbera nîşandana modalekê de ji bikarhêneran re hilbijêrin, û kengê em wan berbi rûpelek cihêreng, nû vegerînin? Û ew qet girîng e? Bi rastî, ew dike. Biryar bandorê li herikîna bikarhêneran, çarçoweya wan, kapasîteya wan a lêgerîna hûrguliyan, û bi wê re pirbûna xeletî û qedandina peywirê dike. Her du vebijark dikarin tevlihev û xemgîn bibin - di wextê xelet, û li cîhê xelet de. Ji ber vê yekê çêtir e ku em wê rast bikin. Werin, em bibînin ka meriv wiya çawa dike. Modals vs Dialogs vs Overlays vs Lightboxes Dema ku em bi gelemperî li ser yek pêkhateyek UI-ya modal diaxivin, em pir caran hûrgelên xweş, tevlihev ên di navbera hemî celebên modal de paşguh dikin. Bi rastî, her modal ne yek e. Modal, diyalog, sergirtî, û qutiyên sivik - hemî dişibin hev, lê bi rastî ew pir cûda ne:
Dialog Peyvek gelemperî ji bo "axaftin" (pergala bikarhêner ↔). Overlay Panelek naverokek piçûk li ser rûpelê tê xuyang kirin. Pêdivî ye ku ModalUser bi overlay + paşnavê neçalak re têkilî daynin. NonmodalUser divê bi overlay + paşperdeya çalak re têkilî daynin. Paşîn LightboxDimmed ku balê bikişîne ser modalê.
Wekî ku Anna Kaley ronî dike, piranîya sergirtî di wextê xelet de xuya dibin, bikarhêneran di dema karên krîtîk de ditewînin, zimanek belengaz bikar tînin, û herikîna bikarhêneran dişkînin. Ew ji hêla xwezayê ve astengdar in, û bi gelemperî bi astek bilind a tundûtûjiyê bêyî hewcedariya wê ya xurt.
Ger ku encamên çalakiya wan bandorek mezin hebe, bê guman pêdivî ye ku bikarhêner hêdî bibin û werin qut kirin, lê ji bo pir senaryoyan ne-modal pir naziktir û vebijarkek hevaltir in ku tiştek bînin ber çavê bikarhêner. Ger tiştek hebe, ez her gav pêşniyar dikim ku ew pêşnumayek be. Modal → Ji bo Karên Yekane, Xweser Wekî sêwiraner, em bi gelemperî modalan wekî negirêdayî û acizker red dikin - û pir caran ew in! - lê qîmeta wan jî heye. Ew dikarin pir arîkar bin ku bikarhêneran li ser xeletiyên potansiyel hişyar bikin an jî ji wan re bibin alîkar ku ji windabûna daneyê dûr bisekinin. Ew her weha dikarin bibin alîkar ku kiryarên têkildar pêk bînin an jî hûrguliyan bişopînin bêyî ku rewşa heyî ya rûpelê qut bikin. Lê avantaja herî mezin a modalan ev e ku ew ji bikarhêneran re dibin alîkar ku çarçoweya ekrana heyî biparêzin. Wateya wê ne tenê UI ye, lê di heman demê de têketina guhertî, pozîsyona gerok, rewşa akordeyonan, hilbijartina parzûnan, rêzkirin, û hwd.
Car carinan, bikarhêner hewce ne ku hilbijarkek zû piştrast bikin (mînak, fîlterên wekî ku li jor hatî destnîşan kirin) û dûv re tavilê ji wir bimeşin. Xweserî dikare heman tiştî bi dest bixe, bê guman, lê ew her gav ne hewce an jî xwestî ye. Û astengkirina UI bi gelemperî ne ramanek baş e. Lêbelê, modal ji bo karan nayên bikar anîn. Bi gelemperî, em wan ji bo karên yekane, xweser bikar tînin ku divê bikarhêner bikevin hundurê, peywirek temam bikin, û dûv re vegerin cihê ku lê bûn. Ne ecêb e, ew ji bo pêşanî, danûstendinên kurt (mînak, hişyarî, kiryarên wêranker, pejirandinên bilez) baş dixebitin. Dema ku modal alîkarî dikin: 🚫 Modal gelek caran têkbir, dagîrker û tevlihev in.🚫 Ew berawirdkirin û kopî-pastekirinê dijwar dikin.✅ Lêbelê modal rê dide bikarhêneran ku gelek kontekstan biparêzin.✅ Ji bo pêşîgirtina li xeletiyên neveger û windakirina daneyan bikêr e.✅ Bikêr e ger şandina bikarhêneran ji bo rûpelek nû bibe asteng. ✅ Tenê heke bikarhêner qîmetê bidin astengkirinê, modalekê nîşan bidin.✅ Bi xwerû, diyalogên ne-astengker ("nemodal") tercîh bikin.✅ Bihêle bikarhêneran ku paşê diyalogê kêm bikin, veşêrin, an vegerînin.✅ Ji bo hêdîkirina bikarhêneran modalek bikar bînin, mînakî, verastkirina têketina tevlihev.✅ Bi "Girtî", bişkojka ESC, an li derveyî qutikê bitikînin. Rûpel → Ji bo Karûbarên Tevlihev, Pir-gav Sêrbaz an navîgasyon tabloyî di nav modalan de pir baş naxebitin, tewra di hilberên pargîdaniya tevlihev de jî - li wir, panelên alî an xêzkirin bi gelemperî çêtir dixebitin. Pirsgirêk dema ku pêdivî ye ku bikarhêner pêdivî ye ku xalên daneyê berhev bikin an referans bikin dest pê dikin - di heman demê de modal vê tevgerê asteng dikin, ji ber vê yekê ew heman rûpelê di gelek tabloyan de ji nû ve vedikin.
Ji bo herikandinên tevlihev û pêvajoyên pir-gav, rûpelên serbixwe çêtirîn dixebitin. Rûpel di heman demê de gava ku ew bala tevahî bikarhêner daxwaz dikin çêtir dixebitin, û referansa li ser ekrana berê ne pir arîkar e. Û drav ji bo jêr-peywiran dixebitin ku ji bo modalek hêsan pir tevlihev in, lê ne hewceyê navîgasyonek rûpelek tevahî ne. Dema ku meriv ji modalan dûr bikeve: 🚫 Xwe ji modalên peyamên çewtiyê dûr bixin.🚫 Ji modalan ji bo agahdariya taybetmendiyê dûr bixin.🚫 Ji modalan ji bo ezmûna lihevkirinê dûr bisekinin. Ji herduyan dûr bixinJi bo Karên Dubarekirî Di gelek hilberên tevlihev, peywir-giran de, bikarhêner dê xwe bibînin ku heman karan dubare, dîsa û dîsa dubare dikin. Li wir, hem modal û hem jî navîgasyonên rûpela nû tevliheviyê zêde dikin ji ber ku ew herikînê qut dikin an jî bikarhêneran neçar dikin ku daneyên winda di navbera hemî tablo an dîtinên cihêreng de kom bikin. Pir caran, bikarhêner bi ezmûnek şikestî, tijî pejirandinên bêdawî, hişyariyên zêde, rêwerzên devkî, an tenê xalên referansê winda dibin, diqedin. Wekî ku Saulius Stebulis behs kir, di van senaryoyan de, beşên berbelavkirî an guherandina cîhê pir caran çêtir dixebitin - ew peywirê li ser ekrana heyî dihêlin. Di pratîkê de, di gelek senaryoyan de, bikarhêner peywirên xwe bi yekcarî temam nakin. Pêdivî ye ku ew daneyan bigerin, nirxên kopî-paste bikin, navnîşên li cîhên cihêreng safî bikin, an jî tenê tomarên wekhev binirxînin dema ku ew bi karên xwe dixebitin. Zêdebûn û dakêşan ji bo domandina gihîştina daneyên paşîn di dema peywirê de bêtir arîkar in. Wekî encamek, çarçove her dem di cîhê xwe de dimîne, ji bo referansê an kopî-paste peyda dibe. Modal û navîgasyona rûpelê ji bo demên ku qutbûn bi rastî nirxê zêde dike hilînin - nemaze ji bo pêşîgirtina xeletiyên krîtîk. Modals vs. Pages: Dara biryarê Demek şûnda, Ryan Neufeld rêbernameyek pir arîkar berhev kir da ku alîkariya sêwiranan bike ku di navbera modal û rûpelan de hilbijêrin. Ew bi cheatsheetek PNG-ya bikêr û şablonek Google Doc bi pirsên ku di 7 beşan de têne dabeş kirin tê. Ew dirêj e, pir bikêrhatî ye, lê şopandina wê pir hêsan e:
Dibe ku ew tirsnak xuya bike, lê ew pêvajoyek 4-gavek pir hêsan e:
Çarçoveya ekranê. Pêşîn, em kontrol dikin ka bikarhêner hewce ne ku çarçoweya ekrana bingehîn biparêzin. Tevlihevî û demdirêjiya peywirê. Karên hêsan, baldar, ne-balkêşker dikarin bi herikîna modal, lê dirêj û tevlihev lapereyek bikar bînin. Referans ji rûpela bingehîn re. Dûv re, em kontrol dikin ka bikarhêner pir caran hewce ne ku li paşnavê daneyan binihêrin an jî peywir piştrastkirin an hilbijartinek hêsan e. Hilbijartina serpêhatiya rast. Di dawiyê de, heke pêvek bi rastî vebijarkek baş be, ew rêberiya me dike ku em di navbera modal an nemodal de hilbijêrin (meyla ber bi nemodalek ve).
Wrapping Up Kengê ku gengaz be, ji astengkirina tevahiya UI-yê dûr bixin. Diyalogek diherike, bi qismî UI-yê vedigire, lê rê dide navîgasyon, gerok, û kopî-paste. An jî naveroka modalê wekî berkêşkek alî nîşan bide. An jî li şûna wê akordeyonek vertîkal bikar bînin. An jî heke hûn hewce ne ku gelek hûrguliyan nîşan bidin bikarhêneran bînin rûpelek cihê. Lê heke hûn dixwazin karîgerî û leza bikarhêneran zêde bikin, bi her lêçûyî dev ji modalan berdin. Wan bikar bînin da ku bikarhêneran hêdî bikin, bala wan bikşînin, pêşî li xeletiyan bigirin. Wekî ku Therese Fessenden destnîşan kir, kes hez nake ku were qut kirin, lê heke hûn hewce ne, pê ewle bin ku ew bi tevahî hêjayî lêçûnê ye. Bi "Nimûneyên Sêwirana Navbera Aqilmend" re hevdîtin bikin Hûn dikarin di Nimûneyên Sêwirana Navbera Smart de, qursa meya vîdyoya 15h ya bi 100 mînakên pratîkî yên ji projeyên jiyana rast re beşeke tevahî di derbarê modal û alternatîfan de bibînin - bi perwerdehiyek UX-a zindî ya paşîn vê salê. Her tişt ji mega-dropdown bigire heya tabloyên pargîdaniya tevlihev - her sal 5 beşên nû lê zêde dibin. Biçe pêşdîtinek belaş. Koda BIRDIE bikar bînin da ku 15% erzan xilas bikin. Bi Nimûneyên Sêwirana Navbera Smart, qursa vîdyoya me ya li ser sêwirana navbeynkar û UX-ê re hevdîtin bikin.
Vîdyo + UX TrainingVideo TenêVîdyo + Perwerdehiya UX$ 495.00 $ 699.00 $
Vîdyo + Perwerdehiya UX25 dersên vîdyoyê bistînin (15h) + Perwerdehiya UX-ya Zindî.100 roj garantiya vegerandina drav. Tenê vîdyoyê 300,00$ 395,00$
Kursa vîdyoyê 40 dersên vîdyoyê (15h) bistînin. Her sal tê nûve kirin. Her weha wekî UX Bundle bi 2 qursên vîdyoyê re peyda dibe.
Çavkaniyên Kêrhatî
Cûreyên Cûda yên Pêşkêşan, ji hêla Anna Kaley ve Pratîkên çêtirîn ji bo sêwirana modalên UI, ji hêla Uxcel ve Em Pir Pir Modalên Damn bikar tînin: Rêbernameyên UX, ji hêla Adrian Egger ve Modal & Nonmodal Dialogs, ji hêla Therese Fessenden ve Design UI Enterprise Modern: Dialogên Modal, ji hêla James Jacobs ve Modalên di Sîstemên Sêwiranê de
