Позавчера на одном канале на 32.000 подписчиков был пост о том, что «ребята, у кого маленькие каналы, кидайте в личку, я выберу 4 лучших и закину рекомендацию о вас на канал».

Ну я и закинул. Ну и меня порекомендовали среди 100+ заявок)

Не знаю, случайность ли это или мой канал действительно интересный, но всем, кто подписался с канала Маркетварь, привет!

Давайте знакомиться :) У меня тут посты каждый день, иногда холиварные)) Стараюсь дать пользу дизайнерам и помогаю новичкам со входом в профессию с помощью бесплатных консультаций.

Пишите, чем занимаетесь, зачем меня читаете и откуда вы :)

Кто с Екатеринбурга, рад встретиться лично за кофе и пообщаться ❤️

@jun_hi

Как СберМаркет использует Яндекс.Толоку для тестирования идей в дизайне.

Внутри:
– Какие проблемы решают с помощью Толоки
– Что нужно знать дизайнеру про Толоку
– Совместимость Толоки с сервисами юзабилити-тестов
– Четыре вида тестов
– Как понять, что пользователи вас понимают
– Как убрать нерелевантных исполнителей

Интересный и малозатратный подход)

👉 Читать статью

———

@jun_hi

Статья от Ромы Шамина про доступность в интерфейсе. Рекомендую прочитать всем)

Внутри:
– Доступность текста и цвета
– Инструменты
– Цветовое кодирование
– Шрифт и зум
– Тёмная тема

👉 Читать статью

@jun_hi

Дизайн-задачи

Поработав во многих продуктах, как дизайнер, далеко не везде умеют приходить с нормальной формулировкой задачи. Никто не будет вам описывать супер подробно, что надо сделать, куда поставить кнопку и чуть ли не готовый прототип давать.

Зачастую задачи звучат в духе «надо сделать кабинет». Или «надо вот сюда добавить вот этот функционал». Далее оунер задачи пропадает и вы остаётесь с этим 1на1. И это нормально.

Моя задача, как дизайнера, уже детально в этом разобраться и выдать результат. Чтобы детально разобраться с задачей «сделай кабинет», нужно понять бизнес-процессы и потребности конечного пользователя. Нужно задавать вопросы и много) Для кого это делается, какую проблему это должно решить, а нужен ли вообще кабинет (условный) или можно обойтись одной кнопкой на другой странице.

Я никогда не приступаю к отрисовке макетов, пока не получу ответы на все свои вопросы. Иначе зачем нужны продакты, которые не могут ничего рассказать по задаче?)) Мне тем более не ясна её суть, если её даже не понимает бизнес)

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

Поэтому, когда к вам приходят с абстрактной задачей, не бегите открывать Фигму и сразу что-то рисовать. В 100 случаях из 100 время будет потрачено впустую и потом придётся всё переделывать) Зачастую это касается начинающих дизайнеров, которые сразу пытаются придумать решение, ещё ничего не выяснив. Так нинада.

Для начала аналитика, ответы на ваши вопросы и понимание того, зачем всё это надо) А уж потом садитесь и рисуйте, когда станет всё понятно.

———

Как вы подходите к решению абстрактных задач в духе «надо сделать полноценный раздел профиля». И потом продакт пропадает)) Пишите)

@jun_hi

UX тексты в интерфейсе.

Ребята из InDriver написали статью о том, как с помощью текстов можно сделать продукт лучше и показали пару примеров, как они переписали тексты внутри приложения.

Внутри:
– Какая основа нужна для хорошего UX
– Что такое UX тексты
– За что отвечают UX писатели
– UX тексты для бизнеса

И примеры переписанных текстов с пояснением.

Статья не большая и легко читается)

Считаю, что продуктовый дизайнер должен уметь писать тексты в интерфейсе, чтобы понимать смысл каждого экрана и функции, которую он делает. Не использовать рыбу. После текста от дизайнера его можно отдать ux копирайтеру, если такой имеется в команде)

👉 Читать статью

———

@jun_hi

Как думаете, почему многие компании уходят в простые лого, которые выглядят как обычный набранный текст?

Старые лого были с какой-то уникальностью. Новые все как один.

Я не знаю ответ, если что 😂 может кто знает) или есть статьи на эту тему.

@jun_hi

Начало недели начну с очень важного совета:

Делайте дизайн хорошо, а плохо не делайте 👍

Всем продуктивного понедельника.

Figma и дарк паттерны.

Наткнулся тут на статью, как Фигма применяет дарк паттерны в своём интерфейсе. Делают они это довольно просто.

У вас есть файл. В файле вы ставите параметр «Все, у кого есть ссылка» и «can edit», то есть все, кто имеет ссылку смогут редактировать файл. Как только человек заходит по ссылке в ваш проект, он автоматически становится редактором и вы автоматически за него платите +15 долларов, сами того не подозревая.

Нет никакой информации об этом в процессе предоставления доступа или, когда кто-то присоединяется к файлу как редактор. Просто в биллинге Фигма добавляет 15 баксов и кайф)

А дальше ещё круче. Этот человек, кто зашёл к вам в файл, как редактор, не зная того, зовёт еще 20 человек по ссылочке. И оп, они тоже редакторы и это ещё +300 долларов в месяц за каждого.

Я так один раз попался, когда Фигма списала не 15 баксов, а 30. Я удивился, а потом вспомнил, что случайно дал знакомому редактора, чтобы он быстро накидал одну штуку за 5 минут, а убрать забыл. На чем и попался)

Проверяйте внимательно, кто редактирует ваш файл, если работаете не в драфтах, а проектах.

———

Кто-то сталкивался с таким?) Какие ещё дарк паттерны замечали за Фигмой?

@jun_hi

Статья о том, как правильно спроектировать страницу цен на сайте. Кейсов очень много.

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

– Теряют ориентацию, когда большое описание тарифов, так как теряются заголовки столбцов, по которым удобно сравнивать тарифы.

– Если тарифы идут слево направо (частый кейс), то пользователь предполагает, что самый левый тариф – самый дешёвый. Самый правый – дорогой.

– Старайтесь делать максимально простое ценообразование, например как у Stripe или у Fathom Analytics

Статья большая и мне не хватит места тут всё описать, поэтому рекомендую прочитать 1 раз, чтобы сложилось понимание о страницах с тарифами) Разобрано очень много кейсов и показано много примеров.

Она на английском, но проблем с переводом, думаю, не будет)

👉 Читать статью

@jun_hi

Есть Нобелевская премия за учёные открытия, а я бы выдал её Стасу, который пишет просто огромные и полезные статьи за E-commerce.

Очередной шедевр про работу с корзиной на сайтах со 135 примерами ошибок и пояснениями к ним.

Внутри:
– Кнопка корзины (как использовать и что с ней делать)
– Подтверждение добавления в корзину
– Элемент корзины в шапке
– Страница корзины
– Placeholder корзины
– Список товаров в корзине
– Допродажи внутри

👉 Читать статью

———

Кто не читал предыдущие статьи, вот они:
– Карточки товаров в листинге
– Фильтрация листинга товаров
– Сортировка листинга товаров
– Работа с поисковой строкой
– Фото на странице товара
– Характеристики товара
– Цена товара и скидки
– Рейтинг и отзывы о товарах
– Допродажа на странице товара

Всем рекомендую почитать в свободное время) Объёма много, но очень полезно.

———

@jun_hi

Самое приятное, что можно получать, когда помогаешь людям и делаешь что-то от души) Такие сообщения греют душу и я понимаю, что делаю всё не зря.

Спасибо всем, кто меня читает и приходит на разборы ❤️

Список сайтов, где можно черпать референсы и вдохновляться (из моих закладок)

– https://godly.website
– https://www.btw.so/marketing/landing-page-examples
– https://shuffle.dev/components/all/all/team
– https://uigarage.net
– https://interfaceingame.com (игровые интерфейсы)
– https://onepagelove.com/inspiration
– https://uxarchive.com
– https://www.uisources.com/screenshots
– https://www.siteinspire.com
– https://madeontilda.ru/
– https://ecomm.design
– https://www.upshift.supply
– https://pagecollective.com/pages/views/landing-page/
– https://klart.io/pixels
– https://minimal.gallery
– https://saaslandingpage.com
– https://www.ogimage.gallery
– https://scrnshts.club
– https://www.lapa.ninja
– https://uihut.com
– https://www.theappfuel.com/flows/onboarding
– https://www.niceverynice.com/components
– https://screenshotcreator.com/inspire
– https://land-book.com/

Лайк, репост))

———

@jun_hi

Модерация респондентов

Мария Нижегородова из ПСБ написала интересную статью про особые категории респондентов на UX-исследованиях.

Она рассказала про пять типов клиентов:
– Дворовый парень со смартфоном
– VIP клиент
– Провинциал
– Эксперт
– Продвинутый

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

Довольно интересно, рекомендую)

👉 Читать статью

@jun_hi

Интересная статья о том, как спроектировать регистрацию с точки зрения пользователя через email или соц.сети, чтобы ничего не забыть.

Внутри:
- Регистрация через Email
- Регистрация и логин через соц.сети
- Логин
- Восстановление пароля
- Итоги

Статья немного техническая, но и для дизайнеров будет полезно)

👉 Читать статью: https://vc.ru/dev/156552-instrukciya-kak-napisat-idealnuyu-registraciyu

@jun_hi

Увидел тут на просторах. А зачем тестовое давать?))

Кто сталкивался с таким, сильно расстраивались?) вроде и похвалили, но работать не позвали 😂

@jun_hi

Что для вас UX? Как вы понимаете этот термин?

Я встречал на своём пути десятки понятий и все интерпретируют его по-разному) Для кого-то это чёрно-белые блоки (дада), для кого-то это cjm и userflow, для кого-то опыт пользователя))

А для вас?

@jun_hi

Если вы сталкиваетесь или столкнётесь с тем, что вам придётся оформлять страницу приложения в App Store, то этот цикл из четырёх статей для вас

Внутри:
– Иконка приложения
– Название и подзаголовок
– Баннер приложения
– Информационная панель
– Экраны предпросмотра
– Текстовое описание
– Промо-текст

И ещё 270+ пунктов для проверки, которые желательно бы учитывать. Очень полезно, если работаете с приложениями IOS.

👉 Часть 1
👉 Часть 2
👉 Часть 3
👉 Часть 4

———

@jun_hi

Трекинг времени

Ох, как же у меня пригорает всегда, когда дизайн-отдел в продуктовой компании работает по трекеру (за другие отделы не знаю).

Это мой один из основных вопросов, который я задаю ещё ДО собеседований в компанию. Если компания хочет за мной следить и сколько минут я потратил на задачу – нам не по пути.

Я прихожу в продукт, чтобы приносить ему пользу и выдавать решения в срок, который оговаривается с бизнесом. Если бизнес говорит срок 2 недели и я говорю ок со своей стороны, то какая хрен разница, сколько времени я провожу за компьютером и сколько я трачу на задачу? Я могу 7 дней гулять и вынашивать решение в голове, а потом за 4 часа спроектировать скелет. Зачем меня трекать в таком случае, если решение выдаётся в срок и оно решает задачи, который поставил бизнес?

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

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

Трекайте фрилансера, который работает по часам и нужно за ним следить. Но не в продукте.

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

ИМХО. Я выговорился. Что думаете на счёт трека времени? Как относитесь к этому?

@jun_hi

Понедельник начинаем с классной статьи от ребят из HardClient об оплате картой онлайн.

Внутри:
– Общие требования к странице
– Типы карт
– Placeholder's
– Ввод данных
– Переключение между полями
– Ограничение ввода и валидация
– Обработка ошибок
– Защита данных
– Сканирование карты

и ещё масса интересных моментов, в количестве 117+ гайдлайнов. Рекомендую к прочтению всем. Кажется, что форма оплаты есть почти в любом продукте.

Статья объёмная, лучше смотреть с ПК

👉 Читать статью

@jun_hi

Вчера наткнулся на просто офигеть какой ресурс.

Компоненты, которые вставляются в Фигму за 1 секунду. Вы просто копируете любой компонент из библиотеки, вставляете в Фигму и получаете почти готовый интерфейс той или иной фичи. Вам останется только скорректировать данные, поменять цвета и шрифт)

Всё вставляется с Autolayout и с правильными названиями всех слоёв.

Кажется, это сильно увеличит скорость проектирования некоторых экранов.

👉 Открыть компоненты

———

P.S Исправно копируется у меня только через Chrome. Через Safari не захотело.

@jun_hi

Алина Зыкина написала две статьи на тему юзабилити-тестирования.

1. На каком этапе проходит юзабилити-тест и для чего оно нужно?

Внутри:
– Типы исследований
– Артефакты
– Вопросы в исследовании
– Методология
– Участники
– Скрипт для составления вопросов

👉 Читать статью

———

2. Как найти идеи, полученные после юзабилити-тестирования?

Внутри:
– Сбор обратной связи
– Работа с заметками
– Идеи из полученных данных

👉 Читать статью

@jun_hi