Сез, мөгаен, анда булгансыз. Кулланучыларга модаль күрсәтү арасыннан ничек сайларга, һәм аларны кайчан аерым, яңа биткә күчерергә? Бу бөтенләй мөһимме? Чынлыкта. Карар кулланучылар агымына, контекстына, детальләрне эзләү сәләтенә тәэсир итә, һәм аның белән хаталар ешлыгы һәм эшне тәмамлау. Ике вариант та бозылырга һәм күңелсезләндерергә мөмкин - дөрес булмаган вакытта һәм дөрес булмаган урында. Шуңа күрә без аны дөрес кабул итү яхшырак. Әйдә, моны ничек эшләргә икәнлеген карыйк. Модальләр vs. Диалоглар vs. Каплаулар vs. Ламбоклар Без еш кына бер модаль UI компоненты турында сөйләсәк тә, без төрле модальләр арасындагы нечкә, катлаулы нюансларны еш санга сукмыйбыз. Чынлыкта, һәр модаль бер үк түгел. Модальләр, диалоглар, каплагычлар, яктырткычлар - барысы да охшаш, ләкин алар бөтенләй башка:

"Сөйләшү" өчен диалогның гомуми термины (кулланучы ↔ системасы). Өстәл Битнең өстендә күрсәтелгән кечкенә эчтәлек панели. ModalUser каплау + фон инвалид белән үзара бәйләнештә булырга тиеш. NonmodalUser каплау + фон кушылган булырга тиеш. Модальгә игътибарны юнәлтү өчен LightboxDimmed фон.

Анна Кали ассызыклаганча, күпчелек каплаулар дөрес булмаган вакытта барлыкка килә, критик биремнәр вакытында кулланучыларны өзә, начар тел куллана һәм кулланучылар агымын өзә. Алар табигать белән өзелә, һәм гадәттә моның өчен бик кирәксез югары дәрәҗәдәге авырлык белән.

Actionичшиксез, кулланучылар акрынрак һәм өзелергә тиеш, әгәр аларның эш нәтиҗәләре зур йогынты ясаса, ләкин күпчелек сценарийлар өчен модаль булмаганнар күпкә нечкә һәм кулланучының игътибарын җәлеп итү өчен дусрак вариант. Берәр нәрсә булса, мин аны гел дефолт булырга тәкъдим итәм. Модальләр le Ялгыз, үз-үзеңне тоту өчен Дизайнерлар буларак, без еш кына модальләрне әһәмиятсез һәм рәнҗетүче дип саныйбыз - һәм алар еш була! - ләкин аларның кыйммәтләре дә бар. Алар кулланучыларны потенциаль хаталар турында кисәтергә яки аларга мәгълүмат югалудан сакланырга ярдәм итә ала. Алар шулай ук ​​бәйләнешле эшләрне башкарырга булыша ала яки битнең хәзерге торышын бозмыйча детальләргә бора ала. Ләкин модальләрнең иң зур өстенлеге - алар кулланучыларга хәзерге экран контекстын сакларга булышалар. Бу UI гына түгел, редакцияләнгән кертү, әйләндерү позициясе, аккордеон торышы, фильтрлар сайлау, сортлау һ.б.

Кайвакыт, кулланучыларга тиз сайлау расланырга тиеш (мәсәлән, югарыда күрсәтелгәнчә фильтрлар), аннары шуннан аннан алга барырга кирәк. Әлбәттә, авто-саклау бер үк нәрсәгә ирешә ала, ләкин ул һәрвакыт кирәк түгел, кирәк түгел. UI-ны блоклау еш кына яхшы идея түгел. Ләкин, модальләр бернинди эш өчен дә кулланылмый. Гадәттә, без аларны бер, үз-үзеңне тәэмин итү өчен кулланабыз, анда кулланучылар сикерергә, биремне тәмамларга, аннары булган урыннарына кире кайтырга тиеш. Гаҗәп түгел, алар югары приоритетлы, кыска үзара бәйләнешләр өчен яхшы эшлиләр (мәсәлән, кисәтүләр, җимергеч чаралар, тиз раслау). Модальләр ярдәм иткәндә: Als Модальләр еш кына өзгеч, инвазив һәм буталчык. Алар чагыштыруны һәм күчереп язуны кыенлаштыралар. ✅ Ләкин модальләр кулланучыларга берничә контекстны сакларга мөмкинлек бирә. Кире кайтарылмаган хаталар һәм мәгълүмат югалу өчен файдалы. Users Кулланучыларны яңа биткә җибәрү файдалы булыр. Users Модальне кулланучылар бозуны бәяләгән очракта гына күрсәтегез. Default Килешү буенча, блокланмаган диалогларны өстен күрегез ("модаль булмаганнар". Users Кулланучыларга диалогны минимальләштерергә, яшерергә яки торгызырга рөхсәт итегез. Users Кулланучыларны әкренләтү өчен модаль кулланыгыз, мәсәлән, катлаулы керүне тикшерегез. Битләр complex Катлаулы, күп баскычлы эш процессы өчен Тылсымчы яки модаль эчендә салынган навигация бик яхшы эшләми, хәтта катлаулы предприятия продуктларында - анда, ян панельләр яки тартмалар гадәттә яхшырак эшли. Кулланучылар мәгълүмат нокталарын чагыштырырга яки сылтама ясарга тиеш булганда проблемалар башлана - ләкин модальләр бу тәртипне блоклыйлар, шуңа күрә алар бер үк битне берничә кыстыргычта яңадан ачалар.

Катлаулырак агымнар һәм күп этаплы процесслар өчен үзенчәлекле битләр иң яхшы эшли. Битләр шулай ук ​​кулланучының тулы игътибарын таләп иткәндә яхшырак эшли, һәм алдагы экранга сылтама бик файдалы түгел. Тартмалар гади модаль өчен бик катлаулы, ләкин тулы бит навигациясе кирәк булмаган суб-биремнәр өчен эшлиләр. Кайчан модальләрдән сакланырга: Error Хата хәбәрләре өчен модальләрдән сакланыгыз. Feature Функция хәбәрләре өчен модальләрдән сакланыгыз. Бортта утыру тәҗрибәсе өчен модальләрдән сакланыгыз. Complex Катлаулы, озын күп баскычлы эш өчен модальләрдән сакланыгыз. Икесеннән дә сакланКабат биремнәр өчен Күпчелек катлаулы, авыр продуктларда кулланучылар бер үк эшләрне кат-кат башкаралар. Анда, модальләр дә, яңа бит навигацияләре дә сүрелү өсти, чөнки алар агымны өзәләр яки кулланучыларны төрле таблицалар яки күренешләр арасында югалган мәгълүматны җыярга мәҗбүр итәләр. Бик еш, кулланучылар өзелгән тәҗрибә белән бетәләр, бетми торган раслаулар, артык кисәтүләр, фигыль күрсәтмәләре, яисә белешмә пунктларын югалту. Саулиус Стебулис әйтеп үткәнчә, бу сценарийларда киңәйтелгән бүлекләр яки урынлы редакция еш яхшырак эшли - алар биремне хәзерге экранга саклыйлар. Гамәлдә, күп сценарийларда кулланучылар үз бурычларын аерым башкармыйлар. Аларга мәгълүмат эзләргә, кыйммәтләрне күчереп язарга, төрле урыннардагы язмаларны чистартырга, яисә үз эшләрен башкарганда охшаш язмаларны карарга кирәк. Өстәмәләр һәм тартмалар бирем вакытында фон мәгълүматларына рөхсәтне саклауда ярдәм итә. Нәтиҗәдә, контекст һәрвакыт үз урында тора, белешмә яки күчереп язу өчен. Модальләрне һәм бит навигациясен өзегез, чыннан да кыйммәт өсти торган моментлар өчен - аеруча критик хаталарны булдырмас өчен. Модальләр vs. Битләр: Карар агачы Берникадәр вакыттан соң Райан Нойфельд дизайнерларга модальләр һәм битләр арасыннан сайларга булышу өчен бик файдалы кулланма туплады. Бу уңайлы PNG чит таблицасы һәм Google Doc шаблоны белән 7 бүлектә бүленгән сораулар белән килә. Бу озын, бик җентекле, ләкин бик җиңел:

Бу куркыныч күренергә мөмкин, ләкин бу бик гади 4 адымлы процесс:

Экран контексты. Беренчедән, кулланучыларга төп экран контекстын сакларга кирәкме-юкмы икәнен тикшерәбез. Биремнең катлаулылыгы һәм озынлыгы. Гади, игътибарлы, читкә юнәлтелмәгән биремнәр модаль кулланырга мөмкин, ләкин озын, катлаулы агымнар биткә мохтаҗ. Төп биткә сылтама. Аннары, кулланучылар еш кына фондагы мәгълүматларга мөрәҗәгать итергә тиешме, яисә бирем гади раслау яки сайлау икәнлеген тикшерәбез. Дөрес каплауны сайлау. Ахырда, каплау чыннан да яхшы вариант булса, ул безне модаль яки модаль булмаганны сайларга ярдәм итә (модаль булмаганга таянып).

Урлау Мөмкин булганда, бөтен UIны блоклаудан сакланыгыз. UIны өлешчә каплаган, ләкин навигация, әйләндерү һәм күчереп язу өчен диалог йөзеп торыгыз. Яисә модальнең эчтәлеген як тартма итеп күрсәтегез. Яисә аның урынына вертикаль аккордеон кулланыгыз. Яисә бик күп детальләр күрсәтергә кирәк булса, кулланучыларны аерым биткә китерегез. Ләкин кулланучыларның эффективлыгын һәм тизлеген арттырырга теләсәгез, барлык чыгымнардан модальләрдән сакланыгыз. Кулланучыларны әкренләтү, игътибарын туплау, хаталарны булдырмас өчен кулланыгыз. Терез Фессенден билгеләп үткәнчә, беркем дә өзелергә яратмый, ә сез кирәк булса, аның бәясе тулысынча бәяләнүенә инаныгыз. "Акыллы интерфейс дизайн үрнәкләре" белән танышу Акыллы интерфейс дизайн үрнәкләрендә модальләр һәм альтернативалар турында тулы бүлекне таба аласыз, безнең 15х-видео курс, реаль тормыш проектларыннан 100-нче практик мисаллар - быел ахырында UX тренировкасы белән. Мега-тамчылардан алып катлаулы предприятияләргә кадәр - ел саен 5 яңа сегмент өстәлә. Ирекле алдан карау. 15% ташламаны саклап калу өчен BIRDIE кодын кулланыгыз. Смарт интерфейс дизайн үрнәкләре белән танышыгыз, интерфейс дизайны һәм UX буенча безнең видео курс.

Видео + UX Тренинг Видео Видео + UX Тренинг $ 495.00 $ 699.00

Видео + UX Тренинг 25 видео дәрес алыгыз (15с) + Тере UX Тренинг.100 көн акча-кире-гарантия. Видео бары тик $ 300.00 $ 395.00

Видео курсны 40 видео дәрес алыгыз (15с). Ел саен яңартыла. Шулай ук ​​2 видео курслы UX бунделе бар.

Файдалы ресурслар

Төрле поп-поплар, Анна Калей UI модельләрен проектлау өчен иң яхшы тәҗрибәләр, Uxcel Без бик күп модаль кулланабыз: UX күрсәтмәләре, Адриан Эггер Терез Фессенденның модаль һәм модаль булмаган диалоглары Заманча предприятия UI дизайны: модаль диалоглар, Джеймс Джейкоб Дизайн системаларында модельләр

You May Also Like

Enjoyed This Article?

Get weekly tips on growing your audience and monetizing your content — straight to your inbox.

No spam. Join 138,000+ creators. Unsubscribe anytime.

Create Your Free Bio Page

Join 138,000+ creators on Seemless.

Get Started Free