Дизайн

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

Почему логотип Coca-Cola — не шрифт, зачем одной гарнитуре сотни знаков, почему хороший веб-шрифт надо проверять на плохом мониторе и что именно нейросети уже могут забрать у шрифтового дизайнера?

Я, Александр, автор телеграм-канала «Shulepov Code», поговорил с Александрой Корольковой — арт-директором Paratype, автором книги «Живая типографика» и YouTube-канала «Шрифтовой видеоблог», соавтором PT Sans, PT Serif и других известных шрифтовых систем. Обсудили историю профессии от металлических литер до веб-шрифтов, устройство работы шрифтовой студии, лицензии и цены, роль кириллицы, инструменты, заказные проекты, ИИ и довольно практичный ответ на вопрос, сколько шрифтов действительно нужно одному сайту. 

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

Три уровня проектирования, на которых мы строим фундамент UX для финтех сервисов: 1) Регуляторный уровень; 2) Операционная прозрачность; 3) Уровень доверия пользователей.

Без них любой дизайн в финтехе — это UX поверх пустоты. Менять местами не рекомендую.

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

Чтобы сделать дизайн интерьера нейросетью, не обязательно сначала строить 3D-модель квартиры. Для быстрой визуальной примерки достаточно сфотографировать комнату, загрузить снимок в AI-сервис и объяснить, что нужно изменить: стиль, отделку, мебель, свет или отдельные предметы.

Короткий ответ: Nano Banana 2 лучше всего подошёл для свободного редизайна с сохранением исходного ракурса, Homestyler — для быстрого варианта по готовому стилю, а Planner 5D — для перехода от картинки к редактируемому плану. GPT Image 2 уверенно передал настроение, но заметно изменил геометрию комнаты. 

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

О том, как презентовать дизайн людям, которые не говорят на языке UX и интерфейсов, как реагировать на критику и превращать обсуждение в конструктивный диалог, рассказал Никита Полубояров, тимлид отдела UX/UI студии AkademiaDev.

В моём тренажёре памяти и фокуса некоторые пользователи не понимали даже, как запустить тренировку. Я решил, что нужно больше объяснений, и сделал целую «Академию». Теперь люди пролистывали теорию и уходили, не добравшись до практики.

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

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

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

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

Давайте сегодня разберемся, как UX/UI встречается с маркетинговой сферой, почему за комфорт в продуктах отвечают именно дизайнеры и как они избавляют от ощущения контроля и слежки.

Производители вышивальных ниток не публикуют Lab и спектры, поэтому посчитать ближайшую нить к фирменному цвету нечем. Разбор: что мерить, сколько это стоит в часах и как проверить результат.

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

Большинство энтерпрайз‑интерфейсов выглядят так, будто их верстали в 2003 году под дулом пистолета. Хотя кто знает, может это не так уж далеко от правды… Знакомая картина: вы открываете панель управления инфраструктурой, где нас встречает таблица на 40 колонок с горизонтальной прокруткой, пачка модальных окон, перекрывающих друг друга, и кнопка «Сохранить», клик по которой может случайно положить сетку целого филиала.

В продуктовом B2B‑дизайне, когда речь идет про IaaS, СХД или управление флотом ПК, мы боимся не за условный ретеншен, а за то что сотня серверов одномоментно ляжет. Исходя из этого важно серьезнее отнестись к Error Prevention. Наш юзер не просто меняет картриджи, это инженер инфраструктуры. А значит мы не можем ограничиться удобством для пользователя с условными Call to Action. Инфраструктура должна быть превентивной, а не просто комфортной.

Недавно передо мной как раз встала задача: спроектировать веб‑панель мониторинга и планировщик задач для парка из 10 000+ устройств. Я еще не начала, но уже устала. Так как до того, как открывать фигму, пришлось перелопатить добрый десяток Best Practice и паттернов, расщепив их на атомы, молекулы и сценарии. Аналоги вроде Microsoft Endpoint Manager и VMmanager были декомпозированы. В общем, все по классике.

Что происходит с фирменным цветом по дороге из брендбука на изделие: охват печати, белая подложка и полотно, квантование в палитру ниток, метамерия. С числами и с разделом о том, чего в открытых данных нет.

Заказчик почти никогда не приходит с запросом «нарисуйте мне user flow». Он приходит с прототипом, в котором отдельные решения могут противоречить друг другу или с идеей без единого зафиксированного сценария. И в таких случаях я не двигаюсь дальше, пока не соберу из этих вводных понятную схему.

Привет! Мы Катя Халитова и Саша Иванов, UX-исследователь и продакт из Контур.Фокуса.Про skills сейчас пишут много, но почти всегда со стороны разработки. Материалов о том, как встроить их в исследовательский процесс, мы не нашли — разбирались сами. Поэтому в статье рассказываем, что у нас получилось: показываем skills, которые мы собрали под задачи discovery, и разбираем, как собрать свой — под свою задачу и свою методологию. Наши лежат в открытом репозитории на Github.

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

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

Разобрал больше 200 кейсов и посмотрел, из чего они состоят, какие фишки помогают показать свой уровень и что можно еще улучшить

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

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