14:57.1
15:02.5
Кнопка має виглядати саме так, що її можна натиснути.
15:02.6
15:10.0
Дуже часто, особливо на сайтах ті місця сайту, які малюються
15:10.1
15:14.9
сторінки, вони люблять дуже часто просто написати якийсь там текст
15:15.0
15:19.8
і розпізнати, що це саме кнопка, на яку можна натиснути дуже
15:19.9
15:24.7
рідко буває, так? Відповідно людина тільки потім догадається
15:24.8
15:29.6
підвести курсорчик і можливо тут активується якась там підсвіточка
15:29.7
15:34.5
і тільки тоді аж людина зрозуміє, що це була кнопка і її можна було натискати
15:34.6
15:39.4
всі кнопки мають виглядати як кнопки. Тоді людина швидше їх знаходить.
15:39.5
15:44.3
І швидше їх натискає. Якщо наприклад ви хочете щось відзначити
15:44.4
15:49.2
то відповідно у нас є окремий елемент - checkbox, і тоді людина дійсно
15:49.3
15:54.1
відмічає або галочкою, або там наприклад є ratio button, типу
15:54.2
15:59.0
кружечком відмічає або іншим способом відмічає, або є такі перемикачі
15:59.1
16:03.9
вліво - вправо, повзуночок, що ви можете його посунути вправо - вліво.
16:04.0
16:08.8
Відповідно, оцей от зовнішній вигляд він показує, що саме потім відбудеться, коли
16:08.9
16:13.7
ви на нього натиснете, або його десь потягнете. Ми з вами ще в
16:13.8
16:18.6
лабораторці номер один оцей каталог основних візуальних
16:18.7
16:23.5
певних елементів з вами розбирали і ви їх рахували, їхні статистики
16:23.6
16:28.4
так само знаєте тепер, як в інтерфейсах малювати ці кнопочки.
16:28.5
16:33.3
Тепер, ще один важливий момент. Дуже часто, коли
16:33.4
16:38.2
створюють новий програмний продукт, акцентують увагу якраз на перших первинних
16:38.3
16:43.1
функціях і, як правило, перші версії програмних продуктів вирішують
16:43.2
16:48.0
ті функції, які задумав колись розробник.
16:48.1
16:52.9
Потім, чим дальше продукт розвивається, з новим кроком, нові вікна, нові функції
16:53.0
16:57.8
добавляється, воно все обростає, обростає, обростає, і рано чи пізно кількість
16:57.9
17:02.7
функцій так сильно збільшується, що просто
17:02.8
17:07.6
втрачається первинна задача того програмного продукту, відповідно
17:07.7
17:12.5
відображення інтерфейсу, відповідно вам треба або взагалі
17:12.6
17:17.4
розбити на зони, тобто зробити: основна система, підсистема
17:17.5
17:22.3
і ще одна підсистема. І щоб людина чітко розуміла переход.
17:22.4
17:27.2
Ага, тут вона робила тільки одне, чітко перемикнулась на якусь другу зону
17:27.3
17:32.1
тут робить зовсім інші функції. Тут зовнішню функцію, і ще одну
17:32.2
17:37.0
І просто йде момент інтеграції - розділення видів функції на
17:37.1
17:41.9
окремі мікропродукти і відповідно кожен мікропродукт вже потім далі має
17:42.0
17:46.8
купу скрінів. Оцей от момент дуже важливий, бо інакше
17:46.9
17:51.7
чим більше функцій ви запхаєте в один скрін, в одну програму, тим більше людина
17:51.8
17:56.6
заплутається і рано чи пізно всеодно не перестане користуватись цим функціоналом
17:56.7
18:01.5
ну і відповідно, з відповідними скрінами. Тепер, є таке
18:01.6
18:06.4
поняття, як початкові налаштування, коли ви берете якусь нову програмку
18:06.5
18:11.3
як правило, завжди вона має певні початкові налаштування
18:11.4
18:16.2
і людина потім може пізніше їх підкоректувати під себе. Оці от
18:16.3
18:21.1
початкові налаштування, як правило, виставляються на основі
18:21.2
18:26.0
статистики, що більшість людей для себе вибирало
18:26.1
18:30.9
в цих настройках. І, як правило, дуже рідко люди
18:31.0
18:35.8
потім їх міняють. Тобто, як розробник або група розробників задало
18:35.9
18:40.7
так ,як правило, ці налаштування вважаються найкращими і підходять для більшості
18:40.8
18:45.6
наших користувачів. І
18:45.7
18:50.5
вот якраз це намагаються зробити на основі оптимізації
18:50.6
18:55.4
і оці от методи, які ви вчите на предметах оптимізації
18:55.5
19:00.3
якраз там і застосовуються. Ну і ще такий принцип - "Сів і поїхав"
19:00.4
19:05.2
Тобто зразу ви маєте програму, роздивились основні кнопки, роздивились
19:05.3
19:10.1
основні меню, і , більшість функцій, які вам потрібно
19:10.2
19:15.0
в цій програмі, ви одразу запам'ятали. Тобто не треба плодити велику кількість
19:15.1
19:19.9
екранів, велику кількість скрінів і велику кількість
19:20.0
19:24.8
різних видів налаштувань в різних зонах вашої програми.
19:24.9
19:29.7
Краще зібрати десь в одне місце, людина на початках підкоректує під себе
19:29.8
19:34.6
і дальше вже спокійно собі працює. Якщо вдруг вам
19:34.7
19:39.5
ви заставите людину на початках дуже багато потратити часу ,щоб вона
19:39.6
19:44.4
налаштовувала, погоджувалась з різними
19:44.5
19:49.3
запитами на початках, зразу почуття
19:49.4
19:54.2
якості людина втрачає, бо вона вважає, що розробники мусили за неї все
19:54.3
19:59.1
зробити. А вона мусила просто взяти і користуватись. І отут відчуття
19:59.2
20:04.0
довершеності вашого програмного продукту
20:04.1
20:08.9
відповідно - інтерфейсу, зразу втрачається. І ось ці ось зусилля
20:09.0
20:13.8
які людина затрачає на початкові налаштування і адаптацію, вона, як правило
20:13.9
20:18.7
не хоче робити, відповідно, не буде
20:18.8
20:23.6
вважати, що ваша програмка є бездоганною і, відповідно, інтерфейс теж є бездоганним.
20:23.7
20:28.5
Тепер, які ще є елементи, на які ми
20:28.6
20:33.4
маємо звернути увагу? Тобто, беремо кожен скрін, беремо
20:33.5
20:38.3
кожну зону нашого екрану і починаємо роздивлятись, чи
20:38.4
20:43.2
будуть у нас якісь психологічні обмеження. Є так звані психологічні
20:43.3
20:48.1
обмеження для людити, тому що
20:48.2
20:53.0
люди не люблять читати
20:53.1
20:57.9
відповідно, чим більше ви понаписуєте всяких підписів
20:58.0
21:02.8
і будете загромаджувати підписами весь екран
21:02.9
21:07.7
це ніяк не буде корисне для користувача
21:07.8
21:12.6
Він не хоче нічого бачити зайвого на екрані, тобто є акцент, так звана верхня
21:12.7
21:17.5
зона і центральна зона. Як правило, боковим зором людина мало роздивляється
21:17.6
21:22.4
відповідно, ми маємо взяти кожен скрін і почати
21:22.5
21:27.3
тупо рахувати, скільки елементів є на екрані. Центральну зону
21:27.4
21:32.2
людина розглядає, всьо що є по боках, як правило, не розглядає, відповідно, треба зменшити
21:32.3
21:37.1
оті от всі елементи, які ми розміщуємо по боках, хіба от лишити
21:37.2
21:42.0
додатковий режим, режим адміністратора. І там вже людина, якщо захоче, то буде роздивлятись
21:42.1
21:46.9
оці панельки, стрічки стану, додаткові налаштування по боках і так далі.
21:47.0
21:51.8
Далі, текст обов'язково мусить легко зчитуватись.
21:51.9
21:56.7
Люди є дуже з різним зором, ви знаєте, чим
21:56.8
22:01.6
старша людина стає тим зір погіршується, фокусування погіршується
22:01.7
22:06.5
і відповідно всі підписи і текст, які ви робите, мають бути чіткі і контрастні
22:06.6
22:11.4
шрифтом і має бути великим розміром, меншим розміром
22:11.5
22:16.3
бути обов'язково чіткі края шрифтів
22:16.4
22:21.2
Тому, що є шрифти такі рукописні, правописні, з такими різними
22:21.3
22:26.1
завиточечками, при частій
22:26.2
22:31.0
роботі, воно не стимулює акцент уваги, якщо не потрібно для
22:31.1
22:35.9
художнього оформлення, так, там можна використати дєякі випадки. Але як правило, в технічних
22:36.0
22:40.8
воно тільки заважає. Форматування.
22:40.9
22:45.7
Форматування, всякі різні заголовки, нумерації
22:45.8
22:50.6
Якщо є дуже велика програма, її потрібно ділити на зони. Людина всеодно
22:50.7
22:55.5
не буде все проглядати. Зона одна, зона друга, третя. Як правило
22:55.6
23:00.4
роблять такі панельки, які мають заголовки,і потім
23:00.5
23:05.3
панелька пішла, отут йде якийсь текст. Отже, це пішла група
23:05.4
23:10.2
різних кнопок. Потім, є ще одна панелька, знову вона отут зверху
23:10.3
23:15.1
як правило, має заголовок. Що ще люди
23:15.2
23:20.0
не люблять? Багатозадачності. Так, вони одну - дві функції виконують
23:20.1
23:24.9
але тримати в голові штук десять різних дій
23:25.0
23:29.8
як правило, є дуже проблемно. Якщо ви скоротите дії
23:29.9
23:34.7
які можна зробити на екрані до трьох-чотирьох. Це буде нормально. Як правило
23:34.8
23:39.6
паралельно дуже рідко коли хтось виконує. Ну ви напевно по смартфонах
23:39.7
23:44.5
це бачите. В смартфоні, як правило дві-три програми одночасно
23:44.6
23:49.4
запустити і дивитись на них майже неможливо. Є звичайно можливість
23:49.5
23:54.3
поділу на два вікна, на три вікна, перемикання
23:54.4
23:59.2
одну дію ви поробите в одному програмному продукті, в другому програмному продукті. Так само по
23:59.3
24:04.1
екранах. В смартфонах це особливо видно. В цьому є деякий
24:04.2
24:09.0
зміст, всеодно ви концентруєте увагу більше на одному
24:09.1
24:13.9
якомусь вікні, ніж паралельно на всіх.
24:14.0
24:18.8
Ще є таке поняття, як відносна довжина рядка. Якщо ви напишете довгий текст
24:18.9
24:23.7
якусь інструкцію, то довго ніхто читати не буде.
24:23.8
24:28.6
І , враховуючи, що останні повідомлення
24:28.7
24:33.5
різна переписка, вона зводиться до рядка з десяти
24:33.6
24:38.4
п'ятнадцяти слів, іноді навіть коротше, в середньому десь сім слів
24:38.5
24:43.3
в кожній переписці. Відповідно, з кожним роком, люди все менше і менше
24:43.4
24:48.2
словами спілкуються і рядки тексту стають все коротшими і коротшими
24:48.3
24:53.1
відповідно, і підписи в інтерфейсах, мають бути два варіанти:
24:53.2
24:58.0
короткий, і при потребі, людина підведе курсорчик, з'явиться
24:58.1
25:02.9
випадаюче віконечко, і деталі людина прочитає вже при потребі. Потім, є
25:03.0
25:07.8
в тому віконечку спливаючому загальна велика інструкція
25:07.9
25:12.7
і загальна допомога, відкриється окрема велика сторінка ,і вже там ви
25:12.8
25:17.6
розпишете всі можливі пояснення до вашого інтерфейсу
25:17.7
25:22.5
Тобто, знову ж таки, вибираємо перший принцип
25:22.6
25:27.4
"Нічого зайвого і послідовність кроків". Тепер, ще
25:27.5
25:32.3
один важливий елемент, який необхідний при створенні, це
25:32.4
25:37.2
є так звані "Зорові обмеження". 70% всієї
25:37.3
25:42.1
інформації, що сприйме або зрозуміє людина, пройде через зір
25:42.2
25:47.0
відповідно, все, що треба - треба відображати на екранах.
25:47.1
25:51.9
Які при цьому виникають обмеження? Що людина бачить, а що людина
25:52.0
25:56.8
не бачить. Дуже важливим є фокусування
25:56.9
26:01.7
Хоч екран є великий, чим менша є площа
26:01.8
26:06.6
тим більше фокусування. Вот чому наприклад, чому вам зараз зі смартфонами зараз є
26:06.7
26:11.5
ну якби зручніше і легше? В них достатньо зручний і легкий фокус.
26:11.6
26:16.4
Вам на екрані не треба роздивлятись ліві крайні,
26:16.5
26:21.3
праві, верхні, нижні зони. У вас є чіткий фокус на
26:21.4
26:26.2
невеличку зону на екрані. І нормально ви все там чітко роздивляєтесь все, що
26:26.3
26:31.1
вам потрібно. Дві-три функції на екранчику і вам цього достатньо.
26:31.2
26:36.0
І навіть якщо великий екран, якщо ви працювали з величезним
26:36.1
26:40.9
планшетами, з великими моніторами. Ви би потім всеодно почали групувати
26:41.0
26:45.8
зображення, групувати зони. І оці групування, вони би потім всеодно
26:45.9
26:50.7
зробились до таких маленьких підекранчиків.
26:50.8
26:55.6
І, коли є великий екран, якщо ви
26:55.7
27:00.5
почнете зображення розкидати по всьому екрані, буде
27:00.6
27:05.4
багато пустих зон, відповідно фокус уваги постійно стрибає
27:05.5
27:10.3
і це теж частково ускладнює сприйняття, хоча при цьому людина
27:10.4
27:15.2
чітко бачить зону. Але ускладнює процес пошуку зон, де сфокусувати
27:15.3
27:20.1
свою зорову увагу. І, відповідно, туди клікнути мишкою.
27:20.2
27:25.0
Чи перенести курсор. Тепер, зв'язність об'єктів.
27:25.1
27:29.9
Тут теж є важливий елемент, людина мусить розуміти
27:30.0
27:34.8
куди далі їй рухатись. Яким чином ці об'єкти між собою
27:34.9
27:39.7
пов'язані? Якщо ви поставили їх близько один до одного, відповідно
27:39.8
27:44.6
скорше всьо ті кнопочки будуть прцювати або в парі
27:44.7
27:49.7
або вони якимось чином впливають на той об'єкт. Ну, наприклад
27:49.8
27:54.6
як правило, робота з буфером, так? Вирізати
27:54.7
27:59.5
буфер, скопіювати буфер, вставити буфер. Як првило, ці кнопочки ставлять
27:59.6
28:04.4
поряд, бо це є група дій з буфером обміну. Якщо ви наприклад
28:04.5
28:09.3
редагуєте шрифти в текстовому редакторі, нахилений шрифт
28:09.4
28:14.2
жирний шрифт, підкреслений шрифт, там верхній індекс
28:14.3
28:19.1
нижній індекс, відповідно, це все - робота з елементами
28:19.2
28:24.0
шрифта на екрані. Як правило, всі ці панельки на екрані роботи групують
28:24.1
28:28.9
Відповідно, людина коли вже виконала якусь одну дію
28:29.0
28:33.8
клікнула, то вона потім вище клікнула на ще одну
28:33.9
28:38.7
продовжувальну дію, наступних там дій. Відповідно, час руху по екрану
28:38.8
28:43.6
менший, фокус уваги тут і так вже був, тобто можна ті мікросекунди
28:43.7
28:48.5
врахувати і вже клік відбувається ближче.