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

Що хочуть від джуна на співбесіді на UX/UI дизайнера?

Illia Tsybulka — Sun, 05 Mar 2023 01:54:44 +0000

Achtung! Хочеться відзначити: я не експерт у галузі рекрутингу, я дизайнер, але час від часу проводжу співбесіди та перевіряю тестові завдання інших дизайнерів.

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

Насамперед

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

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

Отже

Адекватність

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

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

Англійська

Болісна доля дизайнера з англійською нижче pre-intermediate, всі в нього пальцем тичуть, руки не подають. Адже він навіть англійський мем з робочого чату зрозуміти не в змозі.

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

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

Бекграунд

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

Відчуваєте дисонанс? Ось і той, хто проводить співбесіду, теж відчуває.

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

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

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

Мотивація

Що керує кандидатом? Чи готовий він удосконалювати свої професійні навички? Чи відступить за перших труднощів?

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

Поведінка у нестандартних ситуаціях

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

Наприклад: Вам передали для завершення проект, розпочатий іншим дизайнером. І тут ви помічаєте помилку у його макетах. Як ви вчините?

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

У нашому випадку найгіршою відповіддю буде: я візьму та виправлю всі помилки! А раптом це й не помилки? А осмислені рішення, продиктовані якимись обмеженнями, про які ви не в курсі?

Увага до деталей

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

Вміння презентувати

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

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

Чесність

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

По-перше ви будете більше нервувати, що вплине на інтерв'ю в цілому, по-друге, ваші співрозмовники будуть не в захваті, коли зрозуміють, що з них роблять дурнів. Неправильно починати стосунки з брехні, чи не так?

А після скількох співбесід вам вдалося влаштуватися дизайнером в свою першу компанію?

Всім дякую і успіхів❤️

Как оживить контент в Figma

Illia Tsybulka — Mon, 20 Feb 2023 04:43:14 +0000

Каждый раз при дизайне всякого рода дашбордов наступает момент когда необходимо наполнить контентом таблицы/карточки/списки и делать это вручную это то еще неблагодарное занятие.

Есть пара очевидных плюсов актуализировать контент, а не оставлять в дизайне таблицу которая состоит из одинаковых строк:

Во-первых это красиво. Для заказчика макет будет выглядеть реалистично, а для тиммейтов это будет сигнал о том, что вы уделяете внимание деталям.
Это своеобразный тест дизайна. Под "нагрузкой" релевантных данных сразу же станут очевидны косяки. Вы сможете понять, что происходит когда в колонке "Имя" вместо компактного John Doe появится Montgomery McLaughlin.

Большинство контента, который приходится актуализировать составляет текст, изображения и варианты. С ними и будем работать.

Рандомизируем Текст

Для имен всегда использовал Random Name Generator, не помню случая, чтобы мне не хватило его функционала.

Для username существует много плагинов-генераторов, но нужно быть внимательным к тому, что они выдают, чтобы не пришлось краснеть за yourmotherfucker_99. Я использую Content Reel, выбирая подходящую подборку из предложенных во вкладке Text.

Этот плагин вобще достоин отдельного внимания, он позволяет создать свой собственный текстовый список, который можно быстро применить в дизайне. К примеру нас интересует список игроков Chicago Bulls (внезапно). Просим всемогущий ChatGPT выдать нам сей список, далее женим его с нашим плагином и вуаля.

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

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

Рандомизируем изображения

Для userpic достаточно гибким является плагин User Profile (можно выбрать пол, эмоцию и даже цвет волос ¯_(ツ)_/¯) а для рандомных изображений неплохо подходит широкоизвестный Unsplash.

Но допустим вам надо автоматизировать загрузку изображений с вашего устройства. Не идеальным, но все же решением, будет все тот же Content Reel. Не идеальным потому что имеет лимит по количеству изображений (20 шт) и их размеру (максимум 300кб), но для подавляющего большинства случаев этого будет достаточно.

Рандомизируем Варианты

Допустим у нас есть компонент лейбла/тега с несколькими вариантами, и чтобы не переключать их вручную можем воспользоваться Variants Randomizer.

Итого

В процессе написания мне стало страшно от разнообразия путей которыми можно решить задачу актуализации контента, поэтому было принято волевое решение ~~забить~~ остановиться на том что есть, и в процессе появления новой для меня информации дополнять эту статью.

Интересно почитать как вы наполняете дизайн контентом, пишите в комментах⬇️

Всем спасибо❤

Первый опыт быстрого юзабилити теста в Maze+Figma

Illia Tsybulka — Sat, 11 Feb 2023 18:53:52 +0000

Недавно открыл для себя шыыыкарный инструмент для быстрого тестирования ~~дизайна~~ всего что угодно. В Maze можно валидировать как идеи, так и кликабельные прототипа интерфейса, которые он отлично кушает просто по ссылке прямо из фигмы без всяких танцев с бубном (хотя и есть корявости о которых будет далее).

Так как по сути Maze это навороченный Google Forms то и логика проведения тестирования такая же:

выбираете различные типы вопросов/заданий, ответы на которые хотите получить
рекрутите респондентов (через свои каналы бесплатно и/или прямо из пула Maze за денежку)
получаете красивенький репорт со статистикой по каждому пункту

Итак

Дано: Нужно улучшить опыт взаимодействия пользователей с бонусами на гемблинг сайте (ставки на спорт и казино короче).

Изначально все этапы, начиная от навигации по списку доступных бонусов до мониторинга прогресса (бонус ты получаешь не моментально, а после выполнения некоторых условий) были просто сущим адом. Я сделал редизайн всей этой непотребщины, пару раз провалидировал прототип с нашей командой и было решено запустить тест на независимых людях, так как профдеформация и confirmation bias не давали взглянуть на картину объективно.

Вопросы, на которые я хотел получить ответ:

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

Cтруктура Тестирования

Даем выполнить задание в прототипе
⬇️
Просим оценить опыт взаимодействия
⬇️
Просим оставить коммент

Забегая наперед скажу, что комментарии респондентов оказались бесполезными.

Стоит учитывать, что подготовить тест, который реально принесет результат, а не уведет тебя в сторону, это не так просто как может показаться. Вопросы и задания должны быть такими, что бы респодент понял, что от него хотят и в то же время мы не направляли его в нужном нам направлении формулировкой задания.

Поэтому вместо: нажали ли бы вы кнопку такую-то, что бы попасть в соответствующий раздел N?
Лучше сформулировать: перейдите в раздел N.

Конечно пример рафинированый, зато наглядный.

Неприятность

С настройками пунктов где нужно оценить и оставить комментарий естественно сложностей никаких не возникло, но вот там где пользователи должны были тыкать прототип пришлось побороться. А все потому что Maze расценивает как действие только переходы с одного скрина на другой.

Это значит что если вы хотите запустить тест в рамках одного экрана, например что бы респонденты клацнули свитчер (который реализован компонентом с меняющимися по клику вариантами), то Maze вам это сделать не даст. Вам прийдется создавать 2 отдельных скрина (с отключенным и включенным свитчером) и вот уже переключение между ними будет понятным для Maze.

Немного поколдовав тест был запущен на безумно репрезентативную выборку из 10 человек. Как ни странно, с меня не взяли дополнительные ~~микро~~кредиты за настройку аудитории. Что белые цисгендерные мужчины от 18 до 35, что все подряд стоят 1 кредит/чел.

Анализ результатов

Спустя ночь все результаты были получены. И, честно говоря, анализируя шаги респондентов очень интересно наблюдать за тем, как они пользуются твоим продуктом. Конечно когда тест масштабный, ты больше опираешься на количественные данные, но в данном случае я просмотрел каждый флоу каждого участника.

Не стоит сразу смотреть на статистику, которую так старательно собирает тебе Maze, так как некоторые респонденты, особенно в начале, просто исследуют прототип, тыкая где попало, независимо от поставленного задания, увеличивая missclick % до безобразия.

Поковырявшись стало ясно что:

Почти никто из участников не использует фильтрацию для поиска конкретного бонуса (возможно не видят необходимости из за небольшого количества карточек)
Для перехода к другому разделу участники использовали разные пути, но тут, по какой-то неведомой причине, все таки преобладает использование фильтров (возможно остальные пути менее очевидны и требуют дополнительной когнитивной нагрузки)
Респонденты не учитывали прогресс из прошлых шагов переходя к следующему. Поэтому когда я попросил их проверить статус полученного бонуса, вместо того что бы перейти в соответствующий раздел респонденты снова стали добавлять себе бонус, хотя уже сделали это в прошлом задании. Я буду учитывать это при дальнейшей подготовке тестов.

Вывод

Инструмент довольно интересный, интуитивно понятный и качественно сделанный. Есть пара неприятных моментов с конфликтами при добавлении нескольких флоу и вариантами (то о чем писал выше), но ничего критичного.

Всем спасибо ❤️