#снек 32. Когда нужно разделять киты, а когда держать компоненты в рамках одного?

Решение о слиянии китов или их разделении очень важное, оно определяет дальнейший вектор развития дизайн-системы на месяцы.

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

Даже если дизайн для мобильных платформ приведён к единому виду, может возникнуть потребность распространить дизайн-систему и на десктопный веб, и тогда может прийти идея выделить десктопные варианты в том же мастер-файле, в котором объявлены мобильные. Этого делать не стоит.

Важно учесть удобство дизайнеров: после вставки каждого компонента дизайнеры не должны переключать свойство платформы с мобилки на веб через варианты. Они не всегда будут это делать, что приведёт к смешению компонентов с разных платформ в одном макете. Если у нас несколько платформ (Web, iOS, Android) и дизайн для них не приведён к единому виду, мы обязаны выделить 3 отдельных UI-кита. Бывает также, что дизайн для мобильных один и за основу берём iOS, но есть некоторые редкие компоненты для Android, и тогда варианты для платформы удобны.

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

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

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

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

#шаблон для Notion
Из чего состоит UI

Здесь собраны 7 блоков вопросов, которые я считаю важными при глубокой оценке интерфейсов: Опыт, типографика, вёрстка, цвет, материалы, анимация, образы.

Я записал их на основе менторских сессий, когда хотел дать своим менти инструменты для анализа UI-решений.

Читать на slashdesigner.ru

Дублировать в Notion

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

Ранее по теме: Почему UI-дизайнеру для прокачки важно делать ревью каждый день

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

Всем привет! А у нас первый спикер в рубрике Think UX Talks!

Уже в этот четверг, 25 апреля в 18.00 (UTC+5) Илона Методиева расскажет об использовании ИИ и телеграм бота для UX исследований и рекрутинга респондентов.

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

Ссылка на регистрацию: https://wearecommunity.io/events/lKG43oHShr

#анонс #стрим

Сегодня регулярную открытую сессию пропустим, но завтра вечером будет любопытный стрим про исследования и AI от @thinkux_kz.

@slashdesigner #первые_шаги #исследования #AI

Про наш чат «Что за шрифт?»

Лучшая реклама нашего чата @whatthefontt — это график его органического роста. Так уверенно не рос даже @figmachat. Готов спорить, что этот чат его обгонит.

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

Мы с командой запустили его в августе 2022 и с тех пор он набрал уже 7000+ участников. Более 5000 раз в разных формах участники благодарили друг друга, когда им кто-то помог.

Как и всегда, у нас довольно строгая модерация, разговариваем только про типографику. Сквозь все наши чаты работает единый бот @slashdbot, который лишает голоса, если нарушаешь правила. Можно до трёх раз возвращать себе голос самостоятельно.

Вступить: @whatthefontt

@slashdesigner #типографика #чаты

#снек 34. Об ошибках в логике, чудовищный пример из Notion

Апдейт: поведение исправлено, оперативно закрыли этот баг.

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

Хочу поделиться редким примером серьёзной логической ошибки в интерфейсе, который я встретил впервые. Её не смогли отследить тестировщики Notion и она привела к порче трёх моих канбан-досок, а также стоила мне многих часов исправления. Я не понимал, что является тригером.

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

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

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

Итог: Хотя функция Parenting в Notion очень удобна при работе с гантами в Timeline View, для канбан-досок ей пользоваться я бы пока не стал.

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

#снек 35. Продукт важнее инструмента

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

Это очень важная идея. Она пронизывает всю творческую деятельность, которой я занимался в жизни. Я вижу множество примеров как в дизайне, в разработке, так и в музыке. И мне потребовалось довольно много лет, чтобы по-настоящему понять её.

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

Любое обучение должно встраиваться в твой текущий проект. В противном случае открывается портал прокрастинации: «Ого! это любопытно, я изучу/скачаю это сейчас, а использую на каких-нибудь будущих проектах». Этого может никогда не случиться. Никакие инструменты и обучающий контент без действия не сделают из тебя творческую единицу.

Самостоятельно решить любую одну дизайн-задачу и сделать один макет гораздо важнее, чем лично посетить WWDC, прочитать 10 книг о дизайне, поставить 100 плагинов для Figma и запиратить 10 000 шрифтов. Даже если они будут с поддержкой кириллицы.

Чтобы сделать дизайн-решение, не нужно знать, кто такой Массимо Виньелли и какова философия дизайна Германа Цапфа. Это можно узнать и позже, а затем улучшить твоё решение, сделать новую версию.

Самостоятельно забилдить первое iOS-приложение и увидеть слово «Привет» на твоей тестовой сборке Single Page Application гораздо важнее, чем посмотреть сотни видео в библиотеке Apple Developer, не забилдив ни одного.

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

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

Когда есть продукт, всё обучение можно встроить в пайплайн где-то между командами New Project и Export. Главное, чтобы ты всё-таки когда-нибудь нажал Export/Build/Render, выложил кейс в портфолио или отдал свои макеты в разработку.

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