Дизайн

Как дизайн влияет на развитие продукта: 5 главных принципов

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

Но как именно дизайнер может формировать продуктовую стратегию? Отвечаем в пяти пунктах.

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

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

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

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

5. Метрики. Успех дизайна можно и нужно оценивать с помощью метрик: это может быть вовлеченность, Retention Rate и время, затраченное на задачу. Простые опросы здесь тоже могут помочь.

Полная версия статьи с примерами и цифрами — у нас на Хабре.

Программа от арт-директоров из Яндекса — из первых рук узнаете, как управляют дизайном в IT

Яндекс Практикум запустил курс «Арт‑дирекшн» для коммуникационных и графических дизайнеров и начинающих арт‑директоров. Программа не включает в себя обучение основам дизайна, а направлена на развитие навыков, необходимых арт-директору в ежедневной работе.

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

Вы научитесь:

• Понимать цели и задачи бренда;

• Сохранять консистентность бренда и коммуникаций;

• Работать с системой дизайна;

• Оптимизировать работу с помощью нейросетей;

• Понимать цели и задачи бизнеса и маркетинга, брифовать заказчиков;

• Налаживать коммуникацию со стейкхолдерами и смежными отделами;

• Презентовать идеи, аргументировать их с точки зрения стратегии и цифр;

• Выстраивать дизайн-отдел и руководить им, планировать и распределять задачи;

• Давать обратную связь, вести сложные коммуникации.

Главное о курсе:

• 4 месяца учёбы, 6 часов в неделю;

• 3 индивидуальные консультации с ментором + план карьерного развития;

• 7 воркшопов с опытными арт‑директорами;

• Много практики по реальным задачам арт‑директора;

• Вечный доступ к материалам курса;

• Диплом о повышении квалификации или сертификат и справка.

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

→ Пройдите бесплатный тест

10 советов, как собрать UI-кит

UI-кит помогает командам поддерживать консистентность интерфейсов и упрощает процессы дизайна. Лера Ган, дизайнер AGIMA, поделилась советами, которые помогут вам собрать хороший UI-кит:

1. Используйте автолайауты. Они избавят от рутины и помогут избежать ошибок.

2. Комментарии к элементам. Добавляйте пояснения к компонентам. Это упростит понимание функциональности и цель элементов для всей команды.

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

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

5. Сетка и отступы. Убедитесь, что сетка и отступы подходят для разных разрешений. Это упростит адаптацию интерфейса на разных устройствах.

6. Единый стиль изображений. Это важно для поддержания целостного внешнего вида, особенно — для иконок и графики.

7. Состояния элементов. Отрисуйте все состояния элементов, чтобы они были готовы к любым сценариям использования.

8. Общение с командой. Обсуждайте все изменения с коллегами. Это предотвратит непредвиденные ошибки.

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

10. Цветовые темы. Протестируйте темную тему интерфейса. Актуально, т. к. пользователи часто используют оба режима.

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

Из рабочего чата, залипательное — хороша почти каждая строчка, даже мелкий текст по периметру :)

Какие книги читать дизайнеру: мнение экспертов

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

Вот какие книги они упоминают:

• «Дизайн привычных вещей» Дона Нормана;

• «Пиши-сокращай» Максима Ильяхова;

• «Спроси маму» Роба Фитцпатрика;

• «Начни с почему» Саймона Синека;

• «Переломный момент» Малькольма Гладуэлла;

• «Паттерны дизайн-менеджмента» Юрия Ветрова;

• «ВкусВилл. Как совершить революцию в ритейле, делая всё не так» Евгения Щепина;

• «Тайная жизнь цвета» Кассии Сен-Клер;

• «Настольную книгу Project-менеджера» Владимира Завертайлова;

• «То, что мы видим, то, что смотрит на нас» Жоржа Диди-Юбермана;

• «История журнального дизайна» Ольги Рожновой;

• «Об интерфейсе» Алана Купера.

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

Про дизайн HR-сервисов. Часть 3

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

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

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

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

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

Больше о карьерный сайтах рассказываем в отдельном статье, а о дизайне — в нашем телеграм-канале.

Про дизайн HR-сервисов. Часть 2

В первой части рассказали о важности дизайна для HR Tech в целом. Теперь же поговорим о том, на какие тонкости в интерфейсах дизайнеру стоит обращать внимание.

1. Минимализм и простота. Чем больше в макете чистых линий и простых форм, тем лучше.

2. Персонализация. Важно давать пользователю настраивать интерфейс под себя — менять цветовую схему или настраивать опции отображения информации.

3. Мобильная адаптация. Адаптивный дизайн позволяет сотруднику управлять HR-задачами с телефона или планшета.

4. Интерактивные элементы и сервисы. Анимации, интерактивные диаграммы и инфографика упрощают взаимодействие с сервисами.

5. Чат-боты и возможности ИИ. Они берут на себя рутину и механическую работу.

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

7. Использование иконок. Иконки нужны не только в цифровых продуктах, но и в HR-сервисах. Они упрощают навигацию и понимание функционала.

8. Дизайн-системы. Обеспечивают консистентность дизайна. Человек должен чувствовать, что о нем заботятся.

9. Динамичные и адаптивные формы. Динамичные формы, которые адаптируются к вводу данных, минимизируют необходимость вручную настраивать интерфейс.

10. Голосовой интерфейс. Голосовые команды и функции распознавания речи делают сервис инклюзивным, улучшают доступность и увеличивают производительность.

В следующей части расскажем о важности инклюзивности для дизайна HR Tech сервисов. А больше про дизайн — в нашем телеграм-канале.

Про дизайн HR-сервисов. Часть 1

HR Tech сервисы принято рассматривать просто как точки входа в компанию или как агрегаторы корпоративных новостей. Однако они могут рассказать о бизнесе куда больше, чем кажется. Сам подход к созданию подобных площадок уже на уровне дизайна показывает, что представляет собой компания как работодатель.

Вот какие задачи HR-сервисы должны закрывать:

1. Привлечение талантов. HR Tech сервис, построенный на больших данных, анализирует карьерные предпочтения и ценности подходящих кандидатов, а затем транслирует им, что эти ценности у них совпадают. И напротив, если эти ценности отличаются, дизайн становится дополнительным фильтром.
   
   Как понять, нужен ли компании карьерный сайт.

2. Персонализированный подход. ИИ и аналитика помогают строить персонализированные программы обучения и адаптироваться к уникальным запросам каждого сотрудника. Когда люди чувствуют поддержку со стороны компании, они более лояльны. И это заметно извне. Рекомендации, отзывы, посты в соцсетях — всё это создает привлекательный HR-бренд.
   
   О персонализации и автоматизации найма — в интервью с российскими HRD.

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

Во второй части расскажем о принципах построения интерфейса в HR-сервисах.

We will IT+Rock you: как мы делаем конференцию про ИТ в рок-стиле

31 октября мы в Orion soft проводим конференцию Orion Digital Day про ИТ-инфраструктуру, DevSecOps, кибербезопасность, управление данными и технологические коллаборации. 

Мы поняли, что устали от похожих мероприятий и решили создать антураж, которого еще не было ни у кого — провести нашу конфу в стиле рок-фестиваля! Раздавать стиль будут музыкальные инструменты, сетка-рабица, мотоцикл, цепи, постеры, в которых мы объединили эстетику технологий и рока. Пока что намеренно не публикуем мокапы, но хотим показать немного тизеров. Полные версии ищите в залах конференции.

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

При этом центром притяжения останется деловая программа:

• Пленарные сессии с топ-спикерами из Самолета, Альфа-Банка, Газпром нефти, Positive technologies, Яндекс Go и другими;

• Технотреки про практики DevSecOps, кибербезопасности, управления данными;

• Кейсы от Ингосстраха, Газпром нефть, аэропорта Шереметьево, Smartavia;

• Митапы в лаундж зоне с лучшими кальянами Москвы.

А вечером — концерт с официальным трибьютом AC/DC!

Мероприятие пройдет в Москве в арт-пространстве LOFT #8. Будем рады видеть вас! Участие бесплатное, регистрация и подробная программа доступны по ссылке. И да, можно приходить без галстуков в вашем любимом рок-мерче :)

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

📅 Дата: 10.10.2024

⏰ Время: 17:00-18:00 (Мск)

На вебинаре:

✔️ Вопросы из опросного листа. Что и зачем спрашивать

✔️ Пользовательские сценарии. Что такое, из чего состоят и зачем нужны

✔️ Информационная структура продукта. Почему без неё никуда

👨‍🎓 Спикер: Игнашов Евгений — cпециалист в области UI/UX проектирования.

👉 Записаться 👈

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

📅 Дата: 13.09.2024

⏰ Время: 16:00-17:00 (Мск)

На вебинаре:

✔️ Вопросы из опросного листа. Что и зачем спрашивать

✔️ Пользовательские сценарии. Что такое, из чего состоят и зачем нужны

✔️ Информационная структура продукта. Почему без неё никуда

👨‍🎓 Спикер: Игнашов Евгений — cпециалист в области UI/UX проектирования.

👉 Записаться 👈

Как сделать так, чтобы тебя читали: 3 простых правила при создании текста

По данным NN/g, люди не вчитываются в каждое слово на странице с текстом, а воспринимают только 20% контента. Они сканируют и вычленяют отдельные слова и фрагменты.

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

1. Создавайте сканируемый контент.

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

2. Помогайте людям сканировать ваш контент.

Расставьте по тексту крючки, за которые зацепится глаз читателя.

3. Сделайте так, чтобы человек перешел к чтению после сканирования.

Если человек сканирует интересный и полезный текст, он начнет его читать подробнее. А это и есть ваша цель — донести сообщение до клиента.

>> Больше интересных примеров и кейсов из мира диджитал найдете в Telegram-канале нашей дизайн-команды.

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

«Сбер» объявил о старте продаж нового фигурного платёжного стикера в форме кошачьей лапки для детей, молодёжи и для всех котолюбителей.

Стикер «Сбера» в форме кошачьей лапки доступен в двух цветах — белом и голубом — и сочетает в себе современные технологии бесконтактных платежей с новым дизайном. Его удобно прикрепить к мобильному телефону и производить платежи «одним мягким прикосновением лапки».

Стикер‑лапка «Сбера» доступен для заказа в приложении «СберБанк Онлайн» и на сайте банка. Количество стикеров ограничено.

Для заказа стикера‑лапки ребёнку в возрасте от 6 до 13 лет в приложении «СберБанк Онлайн» необходимо нажать на «Оформить карту или счёт», далее выбрать — «Детскую», нажать «Другие карты» и выбрать «СберКарта Стикер для детей 6–13 лет».

Остальные желающие в возрасте от 14 лет могут заказать стикер‑лапку на сайте «Сбера», заполнив заявку на странице платёжного стикера, или в приложении «СберБанк Онлайн» нажать «Оформить карту или счёт», далее выбрать «Дебетовую» — «Другие карты» — «СберКарта Стикер».

О чём хотят узнать люди, прежде чем купить обучающий курс?

Сегодня провожу аудит сайта, на котором продают курсы по ретуши.

Это было весело: к интерфейсу всего пара-тройка замечаний. А вот к ответам на потенциальные вопросы посетителей… В общем, смотрите сами.

Объединение «Развитие видеоигровой индустрии» (РВИ) и Институт бизнеса и дизайна B&D до 31 августа 2024 года принимают заявки на конкурс дизайна пиктограмм для маркировки видеоигр. Форма для участия, Техзадание (в Figma) и Положение о конкурсе опубликованы на сайте проекта конкурса.

Призовой фонд конкурса составляет 200 000₽ – 100 000, 70 000 и 30 000₽ за первые три места соответственно.

К участию в конкурсе по созданию макетов пиктограмм для «Зелёной маркировки видеоигр» приглашаются дизайнеры, профильные студенты, художники, дизайн‑студии, творческие объединения, способные создавать символы, понятные покупателям, будь то дети или взрослые.

Проект «Зелёная маркировка видеоигр» по добровольной позитивной маркировке видеоигр призван устранить негативное восприятия широкой аудиторией контента видеоигр; маркировка должна сфокусировать внимание человека и общества в целом на положительных и позитивных сторонах видеоигр.

На первом этапе конкурса вводится несколько основных категорий:

• игра сделана в России;

• игра содержит обучающие материалы;

• игра является киберспортивной дисциплиной.

На сайте «Архив Стива Джобса» опубликовано видео, на котором 28-летний Стив Джобс выступает на Международной конференции по дизайну 1983 года в Колорадо. Его речь была посвящена будущему компьютеров и тому, как они изменят повседневную жизнь.

В комментариях к этому видео даны пояснения экс-главного дизайнера Apple и близкого друга Джобса Джони Айва.

«Стив редко посещал конференции по дизайну. Это был 1983 год, до запуска Mac, относительно ранний период существования Apple. Меня поражает, насколько глубоким было его понимание драматических изменений, которые должны были произойти, когда компьютер стал широко доступным. Конечно, он не только был пророческим, но и сыграл важную роль в определении продуктов, которые навсегда изменят нашу культуру и нашу жизнь.

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

Стив отмечает, что усилия по проектированию в США в то время были сосредоточены на автомобилях, при этом мало внимания и усилий уделялось бытовой электронике. Стив прогнозировал, что к 1986 году продажи ПК превысят продажи автомобилей и что в следующие десять лет люди будут проводить больше времени с ПК, чем в авто».

Дизайнер Бэйли Хикава, наиболее известная своими чехлами для смартфонов ручной работы, представила проект 2G TRASH PHONES Toilet Seat.

Это сделанное на заказ сиденье для унитаза за $1250, в которое встроено множество знаковых мобильных телефонов 2G и 3G, включая оригинальный Motorola Razr, слайдеры Samsung и ассортимент BlackBerry. Электронные отходы для одного человека — это сокровище для другого. Пока что в продаже два экземпляра такого важного приспособления для туалетной комнаты.

«Это по сути семейная реликвия, которую вы можете передать своим детям», — пояснил дизайнер.

О целях интерфейсов

Как можно проводить аудит интерфейса, не зная его целей? Да никак. Даже если цели не озвучены, всё равно они будут как-то сформированы в голове у аудитора. Одному ему понятным образом.

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

Сегодня же у меня на аудите интерфейс мобильного приложения производственного календаря. И цель его создателя (помимо прочего) — заработать на рекламе. А цель пользователей — … ну, их несколько. И чьи же цели учитывать аудитору и как?

Об этом рассказываю в новом ролике.

5 июля 2024 года «Тинькофф банка» больше не стало. Эта компания официально превратилась в «Т‑Банк».

В июне «Тинькофф» обновил бренд, теперь кредитная организация называется «Т‑Банк», все основные сервисы работают под новыми названиями: «Т‑Банк», «Т‑Инвестиции», «Т‑Мобайл» и так далее. Адрес сайта тоже новый — tbank.ru вместо tinkoff.ru.

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