Копилка UX-задач

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

Условие — задачу можно решить в течение часа, чтобы не затягивать выпуски. Это может быть уже существующий интерфейс в Фигме или текстовое описание.

Этой рубрикой я ставлю цель поделиться логикой мышления при проектировании опыта.

PS: исправил уровень звука в пилотном выпуске, но из-за перезалива потерял лайки и комментарии. Спасибо за лучи поддержки, приятно, что такой контент зашёл.

@slashdesigner #техническое

#UX_задача №2. Подключение двух устройств к одним наушникам

Клиент: Sony

Приложение: Headphones

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

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

Файл в Figma содержит два сценария: включение режима нескольких устройств и подключение второго устройства.

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

Опубликую разбор в конце недели. Напомню, что можно предлагать свои задачи в копилку.

@slashdesigner #для_профи #UX

#стать_лидом №8. Дизайнер завышает сроки

Вопрос: ставлю дизайнеру задачи, которые займут понятное время. Делать их нужно срочно, заказчик давит. Дизайнер отвечает, что не уложится за день, хотя я бы раскидал их за пару часов. Как действовать?

slashd.ru/lead/slow-designer →

Варианты:
1. Дизайнер не понимает, каков реальный объём работы
2. Он демотивирован и уклоняется от работы

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

Понять, чем заняты дизайнеры на удалёнке легко можно через ежедневные утренние встречи — синки (= дейлики). Регулярно проходящие синки в комфортной для всех атмосфере сплачивают команду и позволяют лиду понять, что происходит.

Опытный лид, выскажи своё мнение! Как ты договариваешься со своими дизайнерами, сколько им можно уделить времени на задачу?

@slashdesigner #для_профи

#дайджест за январь 2023

Январь получился плодотворным на контент. Чтобы ты ничего не пропустил, я собрал посты прошлого месяца:

Как накатывать обновления на компоненты, чтобы оверрайды не слетали — пошаговая инструкция

Ковыряем ChatGPT и про отличие гайдов Apple и Google и удивляемся, что он сечёт

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

Классный канал про веб-дизайн — наши друзья

Видео: UX-задача №1 про выдачу ИИН, решение — первое видео после долгого перерыва в эфире, за полчаса набросал решения по улучшению опыта

UI: фэнси переключатель тёмной темы на SwiftUI с разбором реализации от автора

Копилка UX-задач для новой рубрики, здесь собираем новые задачи для будущих видео.

Далее: Февраль 2023 →

@slashdesigner

#снек Люди везде ищут смысл

Вот прекрасная иллюстрация этому из реальной жизни. Дизайнер не отфильтровал контент, набрал случайных фото «какие прислали» и не учёл, какое в итоге сообщение передал его дизайн.

Почему так происходит?
Каждая фотография специалиста на лендинге встаёт в один смысловой ряд с другими.

Наш мозг воспринимает их как элементы с едиными типовыми свойствами и статусами. Мы как дизайнеры можем проявлять эти свойства через дизайн-приёмы, например, через десатурацию.

У человека сработал визуальный паттерн, который он видел в других местах. Его предыдущий опыт таков, что эффект обесцвечивания фото у него ассоциируется со статусом «умер». Эффект усилился, когда остальные фото в подборке случайно оказались цветными.

@slashdesigner #первые_шаги

#UX_задача 2. Подключение двух устройств к одним наушникам. Решение

В часовом видео разобрал текущий дизайн из приложения Sony Headphones Connect. Составил схематичные флоу и предложил 4 варианта, как улучшить существующий опыт.

Видео: https://youtu.be/ObtcYOFuHgU →

Исходная задача

Эта задача посложнее, чем первая, поскольку требует погружения в нюансы взаимодействия между двумя устройствами. В этот раз я не ограничивался одной лишь логикой, а набросал lo-fi прототип самого выгодного решения.

Именно такие задачи могут попадаться продуктовым дизайнерам в повседневной работе в крупных компаниях. Здесь мы видим сильный акцент на проектирование, которого не хватает в большинстве дизайнерских портфолио. Часто видел ребят, которые хотят устроиться на позицию продуктового дизайнера, а в портфолио показывают лендинги и пару красивых мобильных мокапов с главным экраном какого-нибудь финансового приложения. Без признаков логического проектирования.

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

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

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

@slashdesigner #UX #для_профи

Справочник /f внезапно сломался и выдаёт 404, разбираемся.

Пока можно пользоваться notion-версией.

Обновлено: Починили.

@slashdesigner #техническое

#статья Про типографику в дизайн-системах

Типографика — один из самых базовых и важных аспектов любой хорошей дизайн-системы, её ядро, второй шаг создания после палитры. При её проектировании исходим из следующих ключевых вопросов для размышления:

1. Какие платформы собираемся поддерживать: iOS, Android, Web, macOS, Windows. Всё это совершенно разные миры, которые трудно синхронизируются.

2. Является ли какая-либо из них доминирующей для нашего продукта? На всех стульях не усидеть. То, что изначально опирается на iOS, может деградировать для веба или Android, и наоборот, не использовать потенциал iOS, например, поддержку Dynamic Type.

3. Собираемся ли делать дизайн на базе единого шрифта или единой шрифтовой пары для всех систем? Готовы ли отказаться от гайдов и классных возможностей определённых систем (вариативные шрифты на Android и в вебе против Dynamic Type на iOS).

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

5. Что будет, если потребуется добавлять новые стили между существующими? Например, между H1 и H2. Не будут ли они ломать шкалу стилей? А что будет, если в шкале появляются разные модификации стилей, вроде normal, medium, bold?

Здесь ответом может быть внедрение нескольких слоёв токенизации, которые между собой не смешиваются, а существуют параллельно, например: body.500-heavy, где body — семантическая группа, 500 — условный средний размер по шкале размеров, а heavy — font-weight по абстрактной шкале.

@slashdesigner #дизайн_системы #для_профи

Oculus Go Fuck Yourself

Отремонтировать VR-очки Oculus Go в Алматы оказалось просто невозможно. Обратился в два сервиса, оказался один и тот же, только с разными сайтами и номерами, и мастера уже нет. Там дали наводку, что этим могут заниматься мастера в ЦУМе, но у них только телефоны-планшеты. Целый этаж сервисов огромного ТЦ, но все мотают головой и шарахаются от меня как от огня.

Здесь особенно очевидно, как провалилась попытка устроить VR-революцию, о которой проповедовал Цукерберг в 2018. Говорил, что это новый iPhone и все скоро будут дружно погружены в метавселенную. На деле VR — до сих пор такая же экзотика для геймеров, как ходули или катамараны. Конечно, можно взять в парке в аренду для прикола, но не более. Это грустно.

По пути домой по запросу «VR-service» я нахожу ещё один сервис. Но оказывается, что это автосервис, где делают ремонт ходовой. Бедный автослесарь долго не может вкурить, о каких очках я ему говорю.

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

#Алматы #VR

#дайджест за февраль 2023

В отличие от января, в феврале тут было затишье и минор. В работе сразу несколько крутых материалов-долгостроев, которые всё никак не дозреют. Чтобы ничего не обещать напрасно, обойдёмся без анонсов.


Что вышло в феврале:

Дизайнер завышает сроки — как лиду договориться со своими дизайнерами о времени на задачи

Люди везде ищут смысл — прикол из реальной жизни про то, как дизайн может быть неправильно понят

Разбор UX-задачи №2, про подключение двух устройств к одним наушникам, большое видео с процессом проектирования. Задачи собираем в копилке, пока там всего один кандидат на новый выпуск.

Замктка про типографику в дизайн-системах — что следует учитывать с самого начала, когда закладываем самое ядро нашей дизайн-системы

Заметка Oculus Go Fuck Yourself про разочарование в VR

Не публиковал, а стоило: лекция Виктора Теплова про рефакторинг дизайн-системы Ozon

@slashdesigner

#снек Ещё один забавный дизайн-ляп про внимание к деталям

В продолжение темы про дизайн-ляпы.

Мне пришло маркетинговое письмо от платформы faderpro.com, на которой обучают музыкальному продакшну.

Заголовок: «Давай, расскажи нам, как мы можем тебе помочь»

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

— Ага, понятно как вы меня готовы слушать, если ставите передо мной не подключенный мик.

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

То, что не важно для дизайнера из отдела маркетинга Fader Pro, может быть очень важно для получателя письма и полностью меняет подтекст коммуникации.

Для этого нужны UX-тесты, на которых такие детали обязательно вылезут.

@slashdesigner #первые_шаги

#статья «Шрифт и иллюстрация»

Александра Королькова записала крутую видео-лекцию для иллюстраторов и дизайнеров, которые хотят научиться гармонично сочетать типографику и иллюстрацию.

Для тех, кто предпочитает читать и смотреть примеры в своём темпе, мы с редактором Полиной Соколовой записали текстовую версию этой замечательной лекции, которую публикуем с разрешения автора.

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

1. О неочевидном

2. Способ 1. Буква как объект изображения

3. Способ 2. Когда шрифт и изображение — субъекты одной композиции

4. Способ 3. Иллюстрация + текстовый блок

@slashdesigner #первые_шаги #типографика