UXPUB 🇺🇦 Дизайн-спільнота: Hanna Rubashenko

Як покращити процес та продукт завдяки якісній комунікації зі стейкхолдерами

Hanna Rubashenko — Sat, 26 Oct 2024 18:59:56 +0000

Сильна стратегія формує сильний процес, а стратегія в свою чергу ґрунтується на розумінні зацікавлених сторін. Хто такі стейкхолдери, як впливають, маппінг, категорії, зацікавленість - ці питання допоможуть розібратися в комунікації та налаштуванні процесів. Це коротка довідка в яку легко та швидко заглянути, щоб поновити core інфу по комунікації із зацікавленими сторонами.

Навіщо нам категоризувати таку ланку впливу як стейкхолдери
Хто такі стейкхолдери і які вони бувають
Як замапити стейкхолдерів
Як комунікувати відповідно від матриці
Висновок

1. Навіщо нам категоризувати таку ланку впливу як стейкхолдери

Стейкхолдери архіважлива частина проєкту і саме від цієї частини команди здебільшого залежить якість, успіх та настрій будь-якого проєкту. Також, якщо дивитися питання з боку дизайну, не осягаючи картини цілісно, певна що не раз і навіть досі багато хто в робочих процесах стискається з упередженням до своїх рішень з боку зацікавлених сторін через неправильно вибрану стратегію комунікації, її відсутність, не розуміння ролей та позицій на проєкті, рівня зрілості дизайн юніта та просто через відсутність відповідного досвіду - тому хочу коротко структурувати план дій - як можна покращити процес, і запобігти кількості психічних травм.

Навіщо: Сильна стратегія будує сильний процес, а ґрунтується усе на розумінні зацікавлених сторін. Хто за що і як сильно відповідає, питає, планує.

2. Хто такі стейкхолдери і які вони бувають

Почну з того що стейкхолдери це особа або група людей які мають особистий інтерес в проєкті, можуть бути в середині компанії та зовнішні, обіймати різні посади, тобто стейкхолдером може бути ваш менеджер або розробник, CTO, маркетолог, це можуть бути люди які його фінансують або планують використовувати, також важливо зазначити що не усі зацікавлені сторони можна виявити на ранніх етапах процесу, деякі з них можна буде виявити на пізніших етапах, а якщо список стейкхолдерів є неочевидним можна почати відштовхуватися від наступних питань:

хто зацікавлений в проєкті
хто має певну владу над проєктом
хто має вплив на проєкт
хто контролює проєкт
хто залежить від результатів проєкту

Відштовхуючись від отриманого первинного списку треба визначити пріоритетність стейкхолдерів, деякі джерела радять ставити пріоритетність при умові його великого обʼєму, однак раджу робити це без привʼязки до кількості й далі розповім чому.

Хто є стейкхолдером: особи або група людей які незалежно від позиції та ролі мають особисту зацікавленість в проєкті.

3. Як замапити стейкхолдерів

Існує певна кількість методів пріоритезації стейкхолдерів, однак перше що приходить на думку - це зрілість дизайну, якщо культура дизайн юніта тільки росте - є необхідність пояснювати та захищати дизайн рішення перед стейкхолдерами. Відповідно від інтегрованості ux в процеси - ситуація змінюється і в компанії росте спільна позиція. Друге витікає з першого це - спільна позиція або “соммоn ground ” - це поняття, введене психолінгвістами Гербом Кларком і Сьюзен Бреннан. Поняття спільної позиції позначає наявність взаємності в знаннях, термінах та переконаннях які допомагають будувати продуктивну комунікацію.

Також хочеться зазначити що сьогодні є розділення підходів комунікації зі стейкхолдерами на менеджмент та залученість, де менеджмент є більш контрольований підхід до нагляду за зацікавленими сторонами та їхньою участю в проєкті, а залученість - більш гнучкий підхід ефективних та довірливих відносин зі стейкхолдерами де комунікація є частиною повсякденності.

Тож повертаючись до питання “як” пріоритезувати - є багато методів, але один з найпопулярніших це матриця Менделоу. Відповідно ми можемо виділити 4 категорії для пріоритезації.

Категорія найбільшого моніторингу

Стейкхолдери з цього кутка є найвпливовішими для проєкту, ця категорія безпосередньо впливає на ресурси і їх кількість. Цей куток потребує ретельного управління через фактор найвагомішого важеля прийняття рішень.

Підтримувати задоволеність

Стейкхолдери з цього кутка мають непостійну зацікавленість і можуть зʼявлятися як грім серед ясного неба, проте мати доволі високий рівень впливу та розуміння, потребують перманентного оновлення даних про стадії та стан продукту.

Підтримувати розуміння

Тут живуть стейкхолдери які хочуть бути інформованими, вони не мають жодної влади, але є зацікавленими в результаті, проте пропонується заохочувати цю категорію на воркшопи задля неупередженої думки та критики.

“Тримати руку на пульсі”

Тут стейкхолдери які не попали в жодні з попередніх кутків, але в будь-який час можуть переїхати та слід моніторити стан та зацікавленість цього квадрату задля швидкого реагування.

Підхід мавпування несе в собі більш поверхневе розуміння стейкхолдерів без конкретизації та тому цілком продуктивно буде створити особисті картки стейкхолдерів задля найякіснішої комунікації та результатів. Найідеальнішим методом можна вважати інтервʼю або кік-оф воркшоп де усі дають зрозуміти рівень своєї зацікавленості, розуміння та впливу. Але фактично на це не завжди є час та ресурси, тому цілком ймовірно картки будуть збиратися в найкращому випадку вже в процесі проєкту і комунікації на певних етапах, чи базуючись на попередньому досвіді комунікації. Є важливим записати хто відповідальний за створення та комунікації зі стейкхолдерами з команди.

У картки добавляємо такі данні як: мета комунікації, рівень зрілості, ключові упередження та страхи, рівень залучення який ми визначаємо на етапі мапування та метод комунікації - який базується на ставленні. Розуміння ставлення до проєкту є цінним ресурсом, відповідно від розуміння зацікавленості можна побудувати якісну стратегію впливу на конкретні зацікавлені сторони, замість того щоб бити в барабани в загальних каналах звʼязку завжди можна точково залучитися підтримкою людини або групи людей які розуміють важливість рішень та мають достатньо впливу, щоб допомогти вам з процесом прийняття рішень. Також важливо вибудовувати стратегію до стейкхолдерів які негативно чи нейтрально ставляться до ваших рішень, на цю категорію має виділятися найбільше часу, щоб прибрати певні упередження - це допоможе в подальшому вибудовуванні цінності вас як спеціаліста, дизайн юніта та підвищувати рівень зрілості. Також важливо відстежувати прогрес в комунікації тож до таблиці можна додати as is та to be - це буде мотивуючий важіль та ачівка для перфоменсів.

Як замапити: використовуємо матрицю Менделоу, а також можемо комбінувати матрицю з профілюванням, методи цілком можуть будуватися від корпоративних потреб

4. Як комунікувати відповідно від матриці

Стратегію комунікації можна побудувати відповідно від попередніх заходів, це може бути щотижневі мітинги, ван ту вани, дейлі репортинги, або мейлінг. Гарно вбудовані стратегії є запорукою прогресії в комунікації зі стейкхолдерами що надалі тягне за собою прозорість процесів та якість кінцевого продукту.

Як комунікувати: обираємо стратегію відповідно від попереднього аналізу стейкхолдерів

5. Висновок

Вибудовування якісної комунікації неодмінно покращить ваше життя та якість процесу. Такі інструменти як матриця стейкхолдерів базово допоможе посилити розуміння процесів, зменшити потенційні ризики, барʼєр, покращити відносини та збільшити рівень довіри, підняти зрілість ux та скласти довгострокові відносини які будуть запорукою якісного продукту.

Variables в figma - як приміняти?

Hanna Rubashenko — Wed, 31 Jan 2024 15:29:10 +0000

Торік фігма анонсувала супер функціонал який здатен
(при бажанні) облегшити життя і процес створення інтерфейсів. Новий функціонал локалізується в правій панелі та точково імплементується по всій робочій області.

При відкритті панелі local variables ми бачимо можливість створювати окремі колекції = variables. Функціонально вони поділяються на кольоро-значення/ числові-значення/ текстові-значення/ булеан (true/false)значення. Які можливості це дає= ми можемо створювати варіабли кольорів і використовувати їх по всьому проекту. Можемо створювати відступи, розміри, скруглення для елементів та відстані між ними завдяки числовим значенням. Можемо створювати текстові варіабли, якщо нам треба різна локалізація продукту та булеан для значень які актуальні при певних умовах - це якщо розглянути варіабли швиденько та поверхнево.

Детальніше про варіабли кольору = вони дають можливість використовувати кольори на різних етапах та станах, для різних елементів, якщо казати про комфорт та налагодженість в бібліотеці ми можемо редагувати рівні доступу кольорів.

Числові варіабли надали можливість точково контролювати усе що впорядковується числовим значенням та надають можливість швидко змінювати розміри вже в процесі проєктування.

Текстові варіабли найбільш розповсюдженні для локалізації продуктів, але я особисто використовую їх також як текстові заготовки відповідно до типу тексту (заголовок/текст) і розміру (за кількістю символів) це потенційно збільшує якість та швидкість виконання роботи.

Булеан значення, як на мене, найбільш персоналізовані тобто ми складаємо перемінні під проєкт безпосередньо.

Багато питань виникає щодо різниці між стилями та варіаблами, другі мають більш гнучку природу та використовуватися відносно контексту.

Як імплементувати variables в процес проєктування інтерфейсу? Для повного занурення в можливості variables треба почати з покупки підписки (якщо ще не мали) це надасть нам можливість займатися магією за межами хогвартса. Надалі продовжу розповідь для введення в проєкт color variables на особистому прикладі.

Перше що треба розуміти це: як? де? коли? задля збереження організації та відсутності спокуси використовувати функціонал де треба і де не треба, для розуміння подальших рухів щодо імплементування variables треба задати собі питання = “це буде впливати на певний елемент або на весь проєкт?” якщо ви хочете побудувати сталу що буде мати вплив на весь проєкт тоді гоу ту зе варіаблес. p.s., але звісно можна використовувати variables для компонентів тощо.

Починаємо процес з відкриття меню variables і вибираємо з якого типу значення хочемо почати. В прикладі роблю на значеннях кольорів. Тут прописуємо кольори які плануємо використовувати в проєкт, важливо зрозуміти що це робиться без прив'язки до функцій які ми плануємо надати кольору, проста і зрозуміла для вас нумерація.

Після того як ми додали кольори можемо підписати нашу папку, також як вам комфортно це сприймати. Важливо розуміти що напряму ми не будемо використовувати кольори з цієї папки в дизайні, вони мають базове значення. А зараз саме час додати другу папку, завдяки якій ми зможемо творити магію variables. Саме токени будуть використовуватися в проєкт і саме вони набувають цінності функціонала.

Тож нову папку підписуємо як tokens для легшого орієнтування між папками та починаємо додавати кольорам функціонал :) приклад наводжу на фото. Тут одразу треба додати новий mode в моєму випадку це light / dark theme. Для того, щоб додати колір з папки яку ми зробили попередньо треба перемикнути вид з custom в libraries і вибрати колір відповідно для light та dark варіантів.

Після того як ми заасанили базові кольори на токени ми можемо перейти на додавання їх в макети. Важливо пам'ятати що в макети ми використовуємо токени, а не примітивні кольори, на початках треба ретельно стежити, щоб не місклікнути, та/або виключати показ певних токенів відповідно до значення (дивись друге фото)

Коли ми додали усі токени на дизайн і тепер хочеться побачити магію саме час зробити другий фрейм (який буде відповідати за дарк тему і заосанити на шар (фрейм) наш тип токена) для цього треба нажати ромбік та вибрати відповідно.

Для отримання дарк теми мені знадобився лише другий фрейм та variables - нуль мануального додавання чи створення булеана для компонентів. На прикладі меню можна побачити як variables потенційно облегшує життя та процес проєктування.

Якщо є питання або бажання дискусій велком в коменти, також є варіант зробити відео процесу якщо це актуально, то теж дайте знати в коменти :) усім наснаги та терпіння в непростому виборі бути дизайнером!

Прелоадер в інтерфейсах: чому підвищують ймовірність позитивного досвіду з вашим продуктом, з погляду на біологію поведінки

Hanna Rubashenko — Tue, 18 Jul 2023 07:54:20 +0000

В останні 5 років прелоадери повноцінно увійшли в перелік функціоналу гарного інтерфейсу і активно використовуються як маркер якісного продукту, де дизайнери замислилися про користувачів і їх відчуття спокою від розуміння стану, але сьогодні хочу розповісти не про ці переваги прелоадера. Зараз ми бачимо прелоадери навідь на лендингах, які функціонально не вимагають наявності прелоадера через маленьке навантаження, ця наявність може пояснюватися як бажання забезпечити продукт позитивним фідбеком від користувачів.

З таким вступом може здатися, що прелоадер в цілому все більше схожий на декоративний елемент і відноситься під іерархію UI більш ніж до UX. Я пропоную розглянути питання прелоадера не як технічний процес, а як біологію поведінки під цікавим кутом. У ході розбіру цього питання я помітила цікаву закономірність, про яку хотіла б розповісти та підкріпити функціональну важливість навантаження прелоадера.

У той час як основний контент компілюється, задля утримання уваги користувача під час цього процесу ми використовуємо на старті взаємодії саме сторінку прелоадера. З точки зору законів UX більшою мірою це можна віднести до ефекту естетичності та практичності, а також закону Якоба, також задля зменьшення когнитивного навантаження на мозок та очі. Але мене більше цікавило питання «як саме прелоадер допомагає користувачам при взаємодії з інтерфейсом, на рівні біології» тож я занурилася в питання сприйняття і дійшла до цікавого висновку і зараз розповім трохи докладніше.

Біологія поведінки вистроєна таким чином, що людині властиво позитивне ставлення до короткострокового стресу в рамках комфортного середовища - звучить трохи дивно і наче неяк не відноситься до теми, але постараюся пояснити прикладом. Можливо вам доводилося бути свідком такої моделі: ви стоїте біля автомата з іграшками і тиснете на червону кнопку яка в свою чергу безповоротно запускає процес упіймання іграшки залізною щупальцею і в секунди розділяючі подію від натискання (кнопки) і до моменту коли ми спостерігаємо результат (затримання чи ні іграшки щупальцею ) ми відчуваємо короткостроковий стрес, або навідь еффект метеликів в животі, який біологічно виглядає наступним чином : рівень глюкокортикоїдів посилюють викид допаміну і в результаті його викиду в подібних моделях в секунди що предметно описані в попередньому реченні, діє той самий кроткостроковий стрес що покращює роботу мозку в багатьох аспектах, виходячи з цього - збільшує інтерес і ймовірність бажання повторити цю подію що дав нам короткий викид допаміну, і що важливо позничити, який вівільнюється в процесі передчуття винагороди, а не після. Ця біологічна поведінка дуже активно використовується в світі азартних ігор, екстримальних розвагах, комп’ютерних іграх. І саме ця хімічна реакція навела мене на гепотизу що прелоадер з прокруткою відсотка завантаження сайта може сприйматися певною категорією людей як маленький викид допаміну і відповідно може покращювати користувацькій досвід, саме позитивним сприйняттям інтерфейсу. Звісно це не 100% робоча модель і більшість користувачів ассоціюють відображення відсотка завантаження як захисний желет що надає певну безопасність та розуміння, але якщо розглядати відображення відсотка завантаження як кроткостроковий стрес тоді ми можемо сприяти на поведінку користувача вибросами допаміну.

Насамперед можна точно розуміти що рівень допаміну який вивільнюється в моделі «я стрибаю з парашутом» та «я відкриваю сайт та бачу прелоадер з відсотком завантаження» абсолютно різні. Також треба зазначити що є різні категорії людей та щє більша вариативність їх хімічних реакцій, люди схильні в більшій мірі та меньшій до подібних моделей. Але все ж таки можна зазначити що в людський психології дуже важливий контекст, тож враховуючі беззаперечні факти біології поведінки, можна дійти до висновку, що прелоадер з відсотком завантаження все ж таки покращює користувацький досвід в порівнянні з його відсутністю на сторінці.

Виходить так що в момент спостереження користувачем прелоадера, особливо якщо ми показуємо відсоток завантаження сайту на екрані - ми підвищуємо лояльність і відсоток позитивного досвіду користувача, де прелоадер виступає гачком до біологічної реакції і несе в собі не до кінця усвідомлене позитивне відчуття, яке може в подальшому закріпитися в причинно наслідковій асоціації з продуктом. Більш того, після викиду допаміну в середовищі короткострокового стресу у користувача є біологічне бажання повторити приємне почуття вибросу допаміну за наявності належних подальших тригерів відповідно від цілей бізнесу.

Інтерфейси для підлітків. Які поведінкові особливості необхідно враховувати, з прикладами

Hanna Rubashenko — Sat, 24 Jun 2023 18:08:50 +0000

Чи задумувалися ви, що інтерфейси для підлітків мають налічувати в собі певні візуальні та поведінкові відмінності? Класично ми розділяємо дизайн категоріями «для дітей» та «для дорослих» але під яку конституцію має попадати категорія підлітків: до перших чи других чи можливо це все ж таки окрема ланка дизайну інтерфейсів? В цьому питанні пропоную розібратися детальніше.

Підлітковий вік це суспільний конструкт, чи науково обоснований процес дозрівання людини? Підлітковий вік це авантюрність та пошуки нового? Напевно останнє це найбільш приближена квінтесенція поведінки з точки зору біології. Давайте зосередимося на віковій категорізації. За визначенням Організації Об'єднаних Націй підлітковий вік – це віковий період з 10 до 19 років. В наступних абзацах я буду писати про підлітків враховуючи цю інформацію. Також вважаю, треба зазначити, що підлітки в порівнянні з дітьми молодшого віку та з дорослими є більш вразливими та залежними до соціуму, емпатії, агресії та залежностей, це повʼязано з роботою лімбічної та фронтальних структур, які в підлітків не є недорозвинутими і в ціму породжують «підліткову поведінку» та цю статтю.

В статті я наводжу приклади на моделі освітньої платформи, де підлітки складають тести різного ступіню важкості та пріоритетності. Надалі я буду супроводжувати текст прикладами інтерфейсів.

Система винагороди у підлітків

Я почну з патернів вивельнення допаміну у підлітків, а саме задіти тему допамінової системи винагороди. МРТ дослідження показують, що підліткам властиве цікаве допамінове сигналізування, яке є відмінним від дитячого та дорослого. А саме факт того, що велика винагорода за правильно виконану дію підвищує вивельнення допаміну, але якщо була проведена такаж сама дія, а винагорода є скромною це викликає в підлітків відразу та огиду, навідміну від того як працює допамінове сигналізування у дітей та дорослих. З цього хочеться зробити висновок - система винагороди для підлітків це дуже тонка та крихка тема, яка може впливати на підліткове дозрівання і призводити до низки небажаних паттернів поведінки в підлітковому середовищі і яку треба враховувати в моделях комунікацій з ними.

На прикладі наведено екран освітньої платформи де ми взаємодіємо з підлітками та підтримуємо їх систему винагороди, зберігаємо бажаність та стійке емоційне середовищє в процессі складу тесту.

Емпатія та вразливість

Складним питанням для підлітків є їх емоційний стан, самосприйняття та вразливість, яка, в основному, встає перед індивідами через питання соціуму. Підлітковий вік вважається найбільш вразливим до соціального середовища, а саме до однолітків. Причиною цього є соціальна складність підлітків, яка визвана необхідністю кожного індивіда бути належним до якоїсь группи, фандому,компанії. Важливість належності до групи і відповідно самосприйняття та самоопозіціонування відіграє важливу роль в житті підлітка, через ідею «я думаю про себе так, як думає про мене середовищє» - до таких висновків дійшли дослідження із нейробіології соціальної ізоляції. Також хочу зазначити, що відповідно до досліджень із нейровізуалізації вчені дійшли до висновку, що найбільш вразливими до булінгу з боку однолітків є підлітки які характеризуються як найбільш емпатійні. Це призводить до бажання пропрацьовувати інтерфейси які розраховані на підлітків, щоб справляти як можна меньше тиску безпосередньо на їх самооцінку та відношення соціуму до індивіда.

На прикладі інтерфейсу я показую як можна пропрацьовувати кейс негативних результатів тесту, вважаю що через підліткову зацікавленість та відсутність особистих рамок підлітки можуть принижати особисті якості індивідів через низькі результати, накладати певні образливі соціальні маркери на своїх однолітків та пригничувати їх самооцінку. Особливу увагу приділяю наступній дії, після того як підліток отримав небажаний результат тесту ми не тиснемо необхідністю його перездати, бо в такому вразливому емоційному стані йому наврядчи вдасться виконати тест, навпроти, ми пропонуємо переглянути тест і подивитися на помилки, ми запускаємо процес сприйняття праці над помилками і збільшуємо верогідність відсутності цих помилок в майбутньому

Імпульсивність

Також в взаємодії із підлітками дуже важливо враховувати їх імпульсивність та час, який підлітки можуть приділяти на увагу вирішення питання. Науково доведено, що підлітки спроможні приймати рішення більш імпульсивно ніж діти молодшого віку чи дорослі. Це визвано зменьшенною активацією прифронтової кори в підлітків під час прийняття ризикованих рішень, гадаю що складання тестів цілком попадають під цю категорію.

Тож в наведеному прикладі я демонструю варіант пропрацювання цього питання. Ми показуємо кількість складених тестів, показуємо скільки залишилося та показуємо повзунок відображуючи його зеленим наполягаючи що все іде добре, асоціативно зелений заспокоює та надає наснаги, таким чином ми даємо можливість контролювати ситуацію і знижуємо бажання складати тест імпульсивно і швидко.

Увага як психологічний процес

Хочу фіналізувати статтю питанням захвату та керуванням уваги підлітків, бо як я зазначила раніше, підлітки належать до більш вразливої категорії соціуму з великою кількістю подразників. Увагою в цьому абзаці я буду вважати як психологічний процес який протікає усвідомлено або ні на зовнішні подразники в певній ситуації або в цілому як поведінку індивіда на зовнішню середу. Одною з найбільш відомих теорій є теорія Рібо. Він вважав, що увага завжди пов’язана з почуттями і є реакцією на них. Своєю увагою людина починає керувати як раз в підлітковому віці, і залежіть від нервової системи індивіду. Вважається що на процес уваги певною мірою впливає тип темпераменту підлітка, з чого можна знаходити підхід до керування увагою безпосередньо індивідуально, але в процесі проходження тестів такої можливості поки щє не має, можливо в майбутньому завдяки AI перед проходженням тестування підліткам буде надаватися можливість попереднього визначення темпераменту і складання тестів відповідно до нього. Проте ми все ж таки можемо помʼякшити умови складання тестів методами широкого застосунку які вже було зазначено.

Тож при розробці інтерфейсів необідно враховувати вразливості підлітків та допомагати їм справлятися із завданнями з позиції дорослого щоб його увага ставала стійкою та сконцентрованою, пом’якшуючи «кути» за які підлітки ймовірно можуть чіплятися в процесі тестування і допомагати підліткам в процесі дорослішання.