Змест
Адной з самых уплывовых псіхалагічных тэорый у галіне UX і дызайну ўзаемадзеяння з'яўляецца гештальт-тэорыя. Тэорыя была заснавана нямецкімі псіхолагамі, і слова "гештальт" азначае форму або форму на нямецкай мове. Як вынікае з назвы, ідэя прынцыпаў гештальта заключаецца ў тым, што людзі ўспрымаюць групы аб'ектаў як шаблоны, а не асобныя аб'екты.
Ёсць шмат артыкулаў пра прынцыпы гештальта, але не так шмат з іх дапамагаюць зразумець, як прымяняйце іх у сваёй працы ў якасці дызайнера UX/UI. Гэты артыкул дасць вам некалькі ідэй аб тым, як выкарыстоўваць прынцыпы гештальта для стварэння лепшага UX і UI дызайну, які дапаможа людзям дасягнуць сваіх мэтаў з меншымі намаганнямі.
Закон падабенства
Прынцып падабенства абвяшчае, што калі аб'екты фізічна падобныя, мы імкнемся групаваць іх разам і лічыць, што яны маюць тая ж функцыя . Напрыклад, на малюнку ніжэй даволі лёгка адрозніць лінію, якая змяшчае бардовыя чырвоныя кругі, ад астатняй часткі выявы дзякуючы рознаму колеру.
Прыклад прынцыпу падабенства. Фота аўтара.
Выкарыстанне падабенства ў UX і дызайне інтэрфейсу
Давайце ўявім, што ваша кампанія распрацавала прыкладанне пад назвай “Il Mio Chef'', якое выкарыстоўваецца аматарамі італьянскай кухні ў ЗША і Канадзе (мы будзем выкарыстоўваць яго дляастатняя частка гэтага артыкула). У нядаўняй справаздачы, якую вам перадаў ваш даследчык UX, гаворыцца, што, калі справа даходзіць да замовы італьянскай ежы, карыстальнікаў у асноўным цікавіць, якія рэстараны да іх бліжэйшыя. У рэшце рэшт, мы ўсе хацелі б, каб нашу лазанью або піцу даставілі, пакуль яны яшчэ свежыя і цёплыя, ці не так?
Каб было лёгка дапамагаць карыстальнікам нашага прыкладання бачыць, якія рэстараны бліжэй за ўсё да іх, мы можа выкарыстоўваць прынцып падабенства, вылучаючы гэтыя рэстараны ў карыстацкім інтэрфейсе. На малюнку ніжэй вы бачыце, як вылучэнне гэтых параметраў жоўтым колерам (справа) робіць вялікую розніцу, візуальна падкрэсліваючы розніцу паміж бліжэйшымі рэстаранамі і тымі, што знаходзяцца далей. Вось як вы можаце выкарыстоўваць прынцып падабенства, каб дапамагчы карыстальнікам хутка знайсці тое, што яны шукаюць.
Выкарыстанне гештальт-прынцыпу падабенства. Фота аўтара.
Закон блізкасці
Прынцып блізкасці абвяшчае, што аб'екты, размешчаныя блізка адзін да аднаго, выглядаюць больш звязаны чым аб'екты, якія размешчаны на большай адлегласці адзін ад аднаго. Напрыклад, на першым і другім малюнках аднолькавая колькасць кругоў. Аднак на другім відарысе некаторыя слупкі размешчаны бліжэй адзін да аднаго і ствараюць уражанне трох асобных груп замест адной вялікай групы.
Блізкасць - прыклад 1 - вялікая група. Выява аўтара.
Блізкасць - прыклад 2 - тры розныя групы. Выява аўтара.
Выкарыстанне Proximity ў UX і UI Design
Давайце возьмем прыклад з поля візуалізацыі інфармацыі.
На гэты раз давайце ўявім, што вы кіраўнік і жадаеце паглядзець, як працуе ваша прыкладанне “Il Mio Chef”. Вы хочаце паглядзець на KPI, якія вымяраюць фінансавыя паказчыкі, узаемадзеянне карыстальнікаў і задаволенасць. Спачатку ваш спецыяліст па візуалізацыі інфармацыі стварае прыборную панэль ніжэй, што прымушае вас і ўсіх іншых кіраўнікоў губляцца ў лічбах і задаваць яшчэ больш пытанняў. Праз месяц многія з вас проста перастаюць карыстацца гэтай прыборнай панэллю.
Панэль KPI - Il Mio Chef. Выява аўтара.
У гэты момант вы вяртаецеся да свайго спецыяліста па візуалізацыі інфармацыі і просіце яе палегчыць людзям разуменне агульнай карціны, перапрацаваўшы прыборную панэль. У гэтым выпадку вельмі карысны прынцып блізкасці, і вы можаце ўбачыць новы дызайн ніжэй. Ён утрымлівае тры групы, падзеленыя па тыпу KPI, і дапамагае ўсім зразумець, як працуе праграма з пункту гледжання фінансавых паказчыкаў, узаемадзеяння і задаволенасці. Групоўка аб'ектаў разам і выкарыстанне большай прасторы паміж групамі можа дапамагчы вашым карыстальнікам засвойваць інфармацыю хутчэй.
Выкарыстанне гештальт-прынцыпу блізкасці ў дызайне прыборнай панэлі. Фота аўтара.
The Law OfБесперапыннасць
Прынцып бесперапыннасці сцвярджае, што як толькі вока пачне сачыць за аб'ектам, яно будзе працягваць сачыць за «рухам» у гэтым кірунку, пакуль не сустрэне іншы аб'ект. Гэты рух дапамагае нам успрымаць аб'ект як частку таго ж шляху, які мы павінны прайсці, каб знайсці інфармацыю. На малюнку ніжэй паказана, як мы можам выкарыстоўваць прынцып бесперапыннасці для стварэння такіх візуальных мадэляў, якія накіроўваюць вока ў пэўным кірунку.
Прыклад прынцыпу бесперапыннасці. Фота аўтара.
Выкарыстанне пераемнасці ў UX і дызайне карыстальніцкага інтэрфейсу
Ваш даследчык UX прадставіў новы даклад, які паказвае што галоўнай матывацыяй для карыстальнікаў карыстацца дадаткам «Il Mio Chef» з'яўляецца вывучэнне ежы, паколькі яно дазваляе кожны тыдзень наведваць новыя рэстараны італьянскай кухні. Вы паглядзіце на паказчык, які паказвае, колькі разоў людзі праводзяць пальцам па сваіх опцыях з бягучым дызайнам карыстальніцкага інтэрфейсу на малюнку ніжэй (злева), і бачыце, што яны ніколі не праводзяць пальцам больш за два разы ў сярэднім, каб убачыць, якія варыянты ім даступныя.
Выкарыстоўваючы прынцып бесперапыннасці (справа на малюнку ніжэй), ваш UX-дызайнер дапамог павялічыць гэту колькасць у сярэднім да 10 перамахаў. Як гэта адбылося? Схаваўшы частку выявы і вылучыўшы факт, вам трэба правесці пальцам улева або ўправа, каб убачыць, што там, вочы вашых карыстальнікаў кіраваліся, каб літаральна стварыць рух "перамаху" і большматываваныя даследаваць больш рэстаранаў і тое, што яны прапануюць. Гэта тое, што ранні дызайн зусім не матываваў вас рабіць, нават калі ў вас ужо была матывацыя да гэтага.
Глядзі_таксама: Як намаляваць ёлку
Выкарыстанне гештальт-прынцыпу пераемнасці ў дызайне UX/UI. Выява ад аўтара.
Падводзячы вынікі , выкарыстанне прынцыпаў гештальта, прадстаўленых у гэтым артыкуле, у дызайне UX і інтэрфейсу можа дапамагчы вашым карыстальнікам знаходзіць інфармацыю хутчэй і лепш засвойвацца гэта. Акрамя таго, гэта можа павысіць іх задаволенасць вашым прадуктам, матывуючы іх здзяйсняць дзеянні, якія ім больш за ўсё падабаюцца.
Глядзі_таксама: Што такое гештальт-прынцыпы & Як іх прымяняцьВокладка ўключае твор Міклаша Філіпса, адрэдагаваны ў Vectornator.
