У розробці й дизайні патерни — це шаблони, за якими створюють і покращують продукт. Це також наш досвід, звички, модель поведінки. У гонитві за лайками і прибутком, іноді бізнес не гребує рекламними прийомами і за допомогою «темних» патернів впливає на нас.
Коли ми бачимо знайомі елементи дизайну у новому застосунку, мозок автоматично згадує пройдені кроки. Куди ми зазвичай натискаємо — цей маршрут закладений у підсвідомості. Якщо на шляху з'являються миготливі плашки, фокус зміщується. «Темні» патерни заплутують, підштовхують до того, чого ми насправді не хочемо. Я не збираюся купувати кросівки, але вже гортаю каталог магазину. Як це відбулося? «Спасибі» клікабельному банеру у статті про спорт.
Сідаєш дивитися фільм. Нічого не віщує біди, як тут — реклама казино. Рука тягнеться пропустити набридливе повідомлення, але кнопка ледь помітна. Знаходиш, натискаєш і потрапляєш на сайт рекламодавця. Ось тебе і піймали.
Про трюк із мобільних застосунків розповідає Іван Ємельянов, викладач курсу UI/UX Design у Beetroot Academy Zaporizhia:
«Існують зручність та ергономіка. Для нас це прозорий, комфортний сервіс і служба підтримки. Це “білі” методи. А хтось грає у темну, спираючись на неуважність користувача. Наприклад, якщо ти завантажуєш окрему книгу контактів, логічно, що їй потрібен доступ до контактів смартфона. Але якщо встановлюєш плеєр, навіщо ж йому контакти?».
В онлайн-магазинах за допомогою кольору звертають увагу на знижки, нові товари і менш затребувані речі. Немає нічого поганого у бажанні виділитися. Однак будь-який акцент має виглядати гармонійно у поєднанні з іншими елементами сторінки.
«Написати рекламний слоган червоним на жовтому фоні дуже дешевий трюк, але досі ефективний. Його використовують секонд-хенди, — розповідає UI/UX Designer Андрій Гладкий. — Теорія колористики говорить нам, що вдалі кольори — ті, які поєднуються у природі. Нам приємно спостерігати за заходом сонця. Якщо уважно подивишся на небо, помітиш градієнт від темно-синього до блакитного або більш яскравого відтінку. Буває градієнт від синього до яскраво помаранчевого».
Ти не помилишся, обравши сусідні у палітрі відтінки. А що робити з текстом?
Компанія з дослідження комп'ютерних інтерфейсів Nielsen Norman Group 13 років вивчала, як люди читають контент. Аналітики побачили закономірність: незалежно від специфіки сайту, наш погляд рухається подібно літері F. Спочатку читаємо верхню частину сторінки по горизонталі, потім по лівому краю внизу екрану. Натрапивши на виділену цитату, читаємо її по горизонталі. Решту скануємо вниз по вертикалі. Цей прийом використовують на сайтах новин. Важливі заголовки розміщують угорі ліворуч.
Також є Z-патерн читання. Декілька секунд роздивляємося верхній рядок по горизонталі, рухаємось із лівого верхнього кута у правий. Тут гарне місце для панелі навігації сайту. Далі з правого верхнього кутка погляд переміщується у лівий нижній, малюючи діагональ. Потім по горизонталі з лівого нижнього кута — у правий.
«Зчитування інформації по F- і Z-схемі дозволяє правильно розмістити ключову інформацію. Користувачеві це полегшує і прискорює роботу з сайтом, — пояснює Вікторія Вергелес, випускниця курсу UI/UX у Beetroot Academy. — Масивні блоки швидше привертають увагу. Виділення іншим кольором або порожнім простором навколо теж підкреслює вагомість елемента».
Для деяких фахівців ці патерни умовні. Кажуть, багато що залежить від запитів клієнта. Серед них бувають шанувальники асиметрії і несумісних на перший погляд кольорів
«Є різні схеми комбінування елементів. Я користуюся принципом “1-2-2-3”, де цифра — пріоритет. Спочатку розміщуємо велику картинку або текст з акцентом. Потім ставимо два середнього розміру заголовки або слоган і знизу — логотип партнерів. Не варто думати, чим нижче пріоритет, тим менш важливий елемент. Пріоритет №3 часто візуально підтримує всю композицію», — пояснює дизайнер Андрій Гладкий.
Стів Джобс казав: «Дизайн — це не те, як предмет виглядає, а як він працює». Зрозумілий і зручний інтерфейс утримає увагу користувача і збільшить лояльність до продукту. Як би не заманювали печивом (та іншими «плюшками»), не переходь на темний бік дизайну. Бережи репутацію. Людей приваблює чесність. Пам'ятай про це, створюючи черговий лендінг.
