🥇Як із «звичайного дизайнера» стати продуктовим

Привіт!

Мене звуть Олексій Свиридо, я дизайнер цифрових продуктів Альфа-Банку. Сьогодні я хочу розповісти про те, як із «звичайного дизайнера» стати продуктовим. Під катом ви знайдете відповіді на такі запитання:

Хто такий продуктовий дизайнер і що він займається?
Чи підходить вам ця спеціальність?
Що робити, щоб стати продуктовим дизайнером?
Як створити перше портфоліо?

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

Приклад карти компетенцій

Бонусом стане рекомендація книг та статей на тему, які допоможуть вам прокачатися.

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

Хто такий продуктовий дизайнер, і що він робить?

Продуктовий дизайнер – хто це? Хто займається дизайном молока, хліба, печива? Або той, хто створює меблі та предмети інтер'єру? Чи Джоні Айв, який залишив Apple і створив улюблені багатьма гаджети та пристрої?

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

Сучасний продуктовий дизайн - це історія про діджитал, про сайти та додаток, про цифровий продукт.

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

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

Продуктовий дизайнер впливає на:

Візуальна мова. Саме продуктовий дизайнер вирішує, спілкуватися з клієнтом спокійно, суворо, чи, можливо, навіть трохи агресивно? Продуктовий дизайнер визначається з кольорами, шрифтами, формами та просторами в інтерфейсі.
Досвід користувача UX. Продуктовий дизайнер вирішує, що станеться при натисканні на кнопку, посилання або просто під час введення тексту. Що буде бачити клієнт під час очікування завантаження, або коли щось у додатку зламається.
Бренд. Так, малюючи інтерфейси, дизайнер впливає на бренд і те, як користувачі ставляться до цього бренду. Створивши складний та незручний сценарій взаємодії, ми можемо змусити користувачів бути менш лояльними до бренду або взагалі відмовитися від нього. Тож це дуже важливо!
Метрики. Якщо бізнес хоче збільшити прибуток, за рахунок збільшення кількості цільових дій це до продуктового дизайнера (як до одного з фахівців, тому що не тільки продуктовий дизайнер може на це впливати). Якщо потрібно затримати користувача на сторінці або спонукати його до дії, все це можна зробити за допомогою дизайну.
Бізнес-стратегії. Коли бізнес рухається в якомусь напрямку і певний у чомусь, продуктовий дизайн може допомогти змінити стратегію, довівши, що попередні кроки були помилковими та невірними. Наприклад, якщо розглянути лендинг із умовною пропозицією кредиту, клієнт йде туди не просто за грошима, а йде за грошима з конкретною метою: покупкою машини, квартири, з думками про відпустку тощо. І якщо ви як продуктовий дизайнер можете виявити справжню потребу клієнта та довести це бізнесу — ви здатні вплинути на стратегію загалом.

Отже, закріпимо, що продуктовий дизайн - це не просто про прекрасні інтерфейси. Це гарні інтерфейси, які працюють та вирішують завдання користувачів.

Чи мені це потрібно? І кому точно не підійде?

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

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

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

Коли все-таки варто задуматися про перехід у продуктовий дизайн:

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

А ось кому продуктовий дизайн не дуже підійде.

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

Які поточні навички особливо важливі та що прокачати?

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

Приклади карт компетенцій:

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

Типографіка
Робота з кольором
композиція
Книжково-журнальна верстка
Ілюстрація
...

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

емпатія
Логічне мислення
Анімація
Іконографія
Копірайтинг
UX-патерни
Робота з аналітикою
...

Кожну з навичок можна оцінювати за 10-бальною шкалою. Існують різні варіанти оцінювання, ми спробуємо оцінити навички самостійно. Щоб зробити ці дані більш релевантними, ви можете попросити оцінити ваші скіли інших дизайнерів, з якими спілкуєтеся, або керівника, який з вами працює.

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

Отже, дуже важливо розбиратися в:

Композиції. Теорія близькості, простір та взаємодія елементів у просторі, поєднання малого та великого. Без знання правил композиції можна робити дурні помилки, які зменшать якість взаємодії користувачів з продуктом, і часто можуть вплинути на якісь важливіші метрики, наприклад, на прибуток.
Друкарні. Сучасні інтерфейси — це візуал, а й текст. І робота з текстом має бути грамотною, щоб користувачі могли вирішувати свої завдання, могли прочитати текст на різних екранах. Важливо правильно вибирати та поєднувати шрифти для інтерфейсу.
Роботі з кольором. Розуміти те, як працювати з кольором теж важливо, адже, наприклад, при порушенні принципів контрастності на деяких екранах текст може бути нечитаним, або елементи можуть бути непомітними.

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

А тепер до того, що потрібно прокачати для того, щоб працювати з продуктом:

емпатія. Це, мабуть, один із головних скілів. Не варто плутати емпатію та симпатію. Емпатія - це здатність подивитися на продукт очима користувача. Емпатія це те, наскільки ви можете відсторонитися від свого продукту, дивитися на нього холодно і те, як з ним працюють користувачі. Розвиток у собі емпатії допомагає дизайнеру тверезо оцінити продукт і рішення, щоб розуміти, що можна покращити, а не проштовхувати «улюблене рішення».
Логічне мислення. Ця навичка також потрібно прокачувати і постійно вдосконалювати, тому що завдяки ньому ви зможете створювати дійсно продумані інтерфейси з гарним досвідом користувача.
UX-патерни. Сучасні продукти - це набір певних патернів, до яких користувачі вже звикли. Наприклад, ми вже знаємо, що при відкритті фотографії в соцмережі її можна зняти вниз, щоб закрити. Або при свайпі вліво у нас з'являться додаткові опції або видалення. Ми розуміємо, що, топнувши двічі по картинці, її можна збільшити, і так далі. Таких патернів стає все більше, і важливо розуміти, як вони працюють, і не ламати. Наприклад, уявіть, що на вашому телефоні раптом інвертувався скролл, і замість звичного свайпа знизу вгору тепер скролл працює знизу вгору. Вам як користувачам певний час доведеться звикати до нового патерну, що викличе певне роздратування та обурення.
Копірайтинг. Як я вже казав, тексти є важливими. І важливим є не тільки те, як це виглядає, але й те, як це написано. Ідеальна історія, коли у команді працює копірайтер, який у парі з дизайнером опрацьовує всі тексти. Але часто це не так, і самому дизайнеру потрібно писати тексти. І це складно. Саме тому ця навичка варто прокачувати постійно, покращуючи свої тексти та роблячи їх релевантними до продукту.
Робота з аналітикою. Розуміння того, що таке аналітика і навіщо вона потрібна, важлива, тому що всі рішення мають бути якось підтверджені та перевірені. Відбувається це за допомогою метриків. Дизайнеру необов'язково розуміти, як саме відбувається навішування метрик, але вміти генерувати правильні метрики та розуміти, що перевіряється за їх допомогою – це дійсно важливо.

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

Як можна прокачуватися?

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

Давайте поговоримо про те, як прокачувати навички, що просідають, і що для цього робити:

Аналізувати всі інтерфейси, що попадаються вам на очі. Починаючи від повсякденних додаток для транспорту та навігації, якими ви користуєтеся, закінчуючи програмами, які ви відкриваєте досить рідко. Було б непогано ще думати над тим, чому ви відкриваєте ту чи іншу програму рідко, і що можна зробити, щоб це відбувалося частіше. Також варто міркувати на тему того, що зручно у конкретному додатку, а що не дуже. І що ви змінили б?
Постійно прокачувати нагляд. Завдяки цьому ви зможете генерувати більше рішень, у вас в голові буде більше патернів. Наочність варто прокачувати щодня, причому способів прокачування дуже багато: ви можете дивитися пінтерест, створювати дошки з ідеями, що сподобалися. Той самий дріббл хороший для розвитку нагляду. Хоча, варто відзначити, що дріббл - це більше візуальна історія, про те, як виглядає інтерфейс, а не про, як він працює. Але там також можна шукати цікаві UX-рішення.
Щоб прокачувати навички UI, можна розпочати з копіювання інтерфейсів. Наприклад, можна взяти той самий фейсбук і просто перемалювати кілька екранів. Але не перемальовувати їх бездумно, а вникати та аналізувати, чому той чи інший елемент розташований на конкретному місці.
Якщо ви розумієте, що копіювання набридло вам, починайте переробляти інтерфейси, думаєте про те, як можна покращити ту чи іншу фічу, можливо варто поміняти елементи місцями, або написати інший текст, або взагалі все перефарбувати - і втілюйте це. Завжди намагайтеся відповідати питанням: чому? Чому кнопка знаходиться тут, чому такий колір, чому саме так відбувається взаємодія, чому інтерфейс працює так і т.д. Намагайтеся провалюватися зі своїми «чому» якнайглибше.
І остання порада – це постійна практика. Без цього навички згасатимуть, а тим, хто вирішив перейти в продукт, це зовсім не потрібно. Практикуйтесь, спробуйте, створюйте свої інтерфейси. Для тих, хто почувається досить впевнено, можу порекомендувати Челлендж 100 днів UI. www.dailyui.co Почавши цей челендж, ви щодня отримуватимете на пошту тему дня, на яку потрібно намалювати інтерфейс. Наприклад «Надсилання листа, або „Кошик з покупками“, або навіть „Калькулятор“. Завдяки цьому ви зможете прокачатися в UI, а якщо логічно розмірковуватимете при роботі над челенджем, то зможете прокачати і UX.
Багато читати. Читати статті, книги, вивчати юзер-кейси. Тут може допомогти Behance, на якому дизайнери часто описують свої рішення, і чому дійшли того чи іншого висновку. Це допоможе прокачувати логічне мислення та вибудовувати причинно-наслідкові зв'язки у ваших інтерфейсах.

А тепер давайте розберемо найчастіші помилки новачків:

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

Як створити перше продуктове портфоліо

Дизайнер без портфоліо знайти роботу не просто складно, а практично неможливо. Але що робити, якщо у вас є портфоліо графічного дизайну, але немає продуктових проектів?

Що можна робити для того, щоб створити ваше перше продуктове портфоліо:

Як і в будь-якому іншому типі дизайну, ви можете оформляти проекти для вигаданих клієнтів. Або ж пропонувати редизайн вже відомих великих продуктів, наприклад, фейсбук, інстаграм, пошта тощо. Існує дуже багато прикладів, коли хлопці, які оформили таку роботу, отримували пропозицію від компанії, на яку робили редизайн.
У портфоліо можна сміливо вставляти роботи з челленджа, який ви робили раніше. Але лише найкращі роботи! Не варто вставляти 100 картинок із челенджа 100 днів UI лише тому, що ви пройшли його від початку до кінця. Набагато краще вибрати кілька особливих робіт, якими ви могли б пишатися.
Варто пам'ятати про те, що портфоліо, як живий організм, має постійно еволюціонувати та вдосконалюватись. Коли ви розумієте, що створили проект, який легко може затьмарити той, що вже є у вас, сміливо змінюйте його! Важливо не кількість, а якість. 1-2 відмінні роботи можуть легко замінити 5+ середніх.
Якщо ви все-таки йдете у продукт, слід не просто показувати красиві картинки, а й те, як ви до них прийшли. Наприклад, якщо ви вибрали якийсь шрифт, дайте пояснення, чому саме його було обрано. Поясніть вибір кольору та патернів поведінки. Все це важливо і показує те, як ви мислили в процесі роботи, з якими труднощами стикалися і як їх вирішили.

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

Portfolio of Joe Lifrieri
Lisa Sy
Брендон Вокін
Сергій Сурганов, дизайнер

Що робити далі?

Прокачувати UI-навички нескладно. Головне робити це системно та регулярно. Далі варто думати більше про досвід користувача. Завжди аналізувати та ставити питання „чому“.

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

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

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

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