Создание убедительных баннеров, которые не разрушат ваш UX

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

Содержание статьи 
Баннеры – экстраверты!
Анатомия баннера
Типы баннеров
Требующие действия:
Информационные:
О чем следует помнить при проектировании баннеров
1. Размещение баннера
2. Они должны выделяться
3. Проектируйте для масштабируемости
4. Баннерная слепота
5. Злоупотребление

Читать:
https://ux.pub/sozdanie-ubeditelnyh-bannerov-kotorye-ne-razrushat-vash-ux/

Дизайнерское исследование или четкие принципы? Когда можно нарушать правила в дизайне

У начинающего дизайнера может возникнуть соблазн пропустить консультационный процесс с клиентом. Но подход, построенный на «основных принципах», совсем не освобождает вас от этого этапа. Принципы дизайна существуют по определенной причине, а знание того, когда и как их можно нарушать, отличает великих дизайнеров от посредственных.
Как бы вы к этому не относились, но сотворчество с клиентом – утопический идеал совместного видения, который имеет свои недостатки. Наверняка вы очень много раз слышали слова «стратегия бренда», прежде чем столкнулись с этим на деле. Никогда еще не было так заманчиво отдать предпочтение исследованиям и консультациям как в эпоху WordPress, Drupal и, осмелюсь сказать, Wix. Вместо создания структуры принципов с нуля, почему бы не состряпать что-то из уже существующих шаблонов за долю секунды?
На самом деле, бывают ситуации, когда простой подход будет как никогда кстати. Хитрость в том, чтобы знать, когда именно.

Что такое «основные принципы»?
Даже если вы летали в облаках на курсах дизайна или вообще на них не ходили, вы, наверное, уже знаете основы. Если вы придерживаетесь основных принципов, вы не ошибетесь. И это правда. Вот некоторые примеры:
Цвет и контрастность: используйте максимум 2-3 цвета, выделяйте важные элементы с помощью контраста;
Чистое пространство: оставляйте большое количество чистого пространства с учетом всех пропорций;
Макет: симметричная сетка. Всегда размещайте элементы для привлечения внимания в верхней части экрана;
Типографика: используйте не более 2-3 шрифтов;
Логотип: длинный логотип, верхний левый край;
Сложность и простота: найдите баланс между сложными и простыми элементами так, чтобы ваша работы была визуально интересной;
Визуальная иерархия: используйте цвет, контраст, размер и комплексность подходов для выделения важных элементов;
Согласованность: со всеми вышеперечисленными принципами, что бы вы ни решили, размешайте элементы согласовано;

Читать статью: https://say-hi.me/design/principles-or-research.html

​​Инновационные технологии для современной медиаиндустрии

Сейчас в России индустрия медиа и развлечений — одна из самых быстро развивающихся в Европе. В этой отрасли составление четкого плана цифровизации компании и определение ею своей модели является ключевой ИТ–задачей.

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

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

27 октября компания Dell Technologies приглашает вас познакомиться с актуальными трендами и современными технологическими решениями для индустрии развлечений в рамках виртуального мероприятия «Инновационные технологии для современной медиаиндустрии».

Зарегистрируйтесь сейчас на платформе Zoom для участия в мероприятии, чтобы быть в курсе технологий, который изменят мир уже завтра!

https://zoom.us/webinar/register/5716330020825/WN_mR5CsexcSiGFa51hoKRADA

Дизайн-системы

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

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

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

В статье:

— Почему стоит использовать дизайн-систему?
— Почему не стоит использовать дизайн-систему?
— Элементы дизайн-системы
— Как подойти к внедрению дизайн-системы

Читать:  https://design-glory.com/?p=8190

5 горьких уроков дизайн-менеджмента, которые хотелось бы усвоить раньше

Содержание статьи 
1. Вы не можете быть милым со всем
2. «Я в порядке», – часто говорят несчастные люди
3. Вы им больше не друг
4. «Рок-звезды» – это не только благо, но и проблемы
5. Люди не скажут вам спасибо за политику

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

Читать статью: https://ux.pub/5-gorkih-urokov-dizayn-menedzhmenta-kotorye-ya-hotel-by-usvoit-ranshe/

Принцип завершения образа (замкнутости) в визуальном дизайне

Люди склонны заполнять пробелы, чтобы воспринимать объект целиком.
В начале 20 века гештальт-психологи разработали набор принципов, направленных на описание того, как люди визуально воспринимают и организуют мир. Эти принципы обычно называют законами гештальта или принципами гештальта. К самым популярным принципам относятся: близость, сходство, общие области, и замкнутость. Дизайнеры могут применять эти принципы для создания удобных интерфейсов.

Определение: принцип завершения образа (замкнутости или закрытия) гласит, что люди будут заполнять пробелы, чтобы воспринимать целостный объект, всякий раз, когда внешний стимул частично совпадает с этим объектом.

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

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

Содержание статьи 
Логотипы компании
Иконки интерфейса
Применение принципа завершенности к сигналу о наличии дополнительного контента
Проверьте сегментированные элементы

Читать: https://ux.pub/printsip-zaversheniya-obraza-zamknutosti-v-vizualnom-dizayne/

4 типичные ошибки дизайнера и как их избежать

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

1. Лишняя работа

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

2. В погоне за совершенством
«Одна из ошибок, которые я чаще всего вижу, это дизайнеры зацикленные на пиксельном перфекционизме и правильности дизайна», –
говорит Фрисби. Такой подход к делу опасен тем, что слишком много внимания уходит на ненужные процессы, в то время как на создание привлекательной общей картины не остается сил.
Например, в выборе кандидатов на должность дизайнера Фрисби отдает предпочтение не только людям с отшлифованным портфолио. «Я ищу человека, который может балансировать между несколькими основными принципами хорошего дизайна. Того, кому удается оставаться последовательным соблюдая баланс между эстетикой и новаторством. Чрезмерное сосредоточение усилий на чем-то одном делает вас слепым к более глобальным и важным моментам в дизайне».

3. Создание старомодных портфолио
Бормальм и Фрисби ставят под сомнение актуальность старомодных портфолио, суть которых сводится к демонстрации большого количества графических работ. Бормальм называет такие портфолио пережитками рекламных агентств. По ее мнению, дизайнеры уделяют слишком много внимания для создания «красивых плакатов».
«Я думаю, что в них просто нет смысла», – сказала она. «Как менеджер, мне совершенно неинтересно видеть то, что вы когда-то создали. Я хочу увидеть, о чем вы думали, когда столкнулись с проблемой, как вы взаимодействовали с заинтересованными сторонами. Также важно то, как вы расставили приоритеты в зависимости от объема работы, бюджета и так далее».
Хотя Фрисби все еще считает портфолио важной частью оценки кандидата, он согласился с тем, что гораздо важнее понимать контекст работы. «Я соглашусь, что старомодное портфолио – это не то, что стоит демонстрировать работодателю. Мне не нужно большое количество графики, я хочу видеть тематические исследования, аргументацию решений, существовавшие ограничения, процесс формирования дизайна».

4. Неясное определение карьерных целей
По словам Фрисби, дизайнеры часто имеют слишком поверхностное представление о том, как они будут продвигаться по карьерной лестнице. «Не рассчитывайте в кратчайшие сроки стать главным дизайнеров», – говорит он. «Сосредоточьтесь на своей собственной карьеры, а не на знакомом, который стал директором всего лишь за два года. Такие случаи встречаются крайне редко. Четко сформулируйте собственные цели развития и выясните, что такое для вас успех».
“Как вы распорядитесь своей жизнью?” – спрашивает Боремальм. «Если вы считаете успехом пост генерального директора, это круто. Но есть и другие варианты карьерного роста. Подумайте о том, чем вы хотите заниматься. Чтобы достичь успеха нужно идти по пути своих интересов и желаемого карьерного роста».

Источник

42 совета по Figma, которые ускорят вашу работу

Экономия времени в процессе проектирования побуждает сохранять творческий подход. Когда мы увязаем в дизайне, креативность уменьшается. Поэтому мне всегда нравятся использовать при проектировании сочетания клавиш и ловкие приемы.
Ранее я уже публиковал статью из этой серии. В ней вы можете найти еще несколько простых методов. Однако с обновлениями Figma постоянно добавляет новые сочетания клавиш. Так что я постараюсь поддерживать эти статьи в актуальном состоянии. А теперь перейдем к комбинациям клавиш:
Примечание: клавиша Cmd соответствует клавише Ctrl в Windows, а Option – клавише Alt.

1 — Cmd при выделенном изображении: вы можете обрезать изображение, нажав кнопку Cmd.
2 — Ссылки на странице / перенаправление: вы можете ссылаться на элементы на странице, например, якорные ссылки на веб-сайтах.
3 — Control (^) + C или клавиша I: выбор цветовой палитры.
4 — Cmd, затем «число» (значение непрозрачности): после выбора элемента и нажатия кнопки Cmd вы можете изменить непрозрачность, нажимая клавишу от 1 до 9 (1 для 10%, 9 для 90%). Вы, наверное, уже знали об этом. Но, если дважды быстро нажать 0, непрозрачность изменится на 0%. Или, если вы быстро нажмете две клавиши, например, 8 и 9 непрозрачность составит 89%).
5 — Control + Option + T: Упорядочить. Выравнивает разбросанные элементы определенным образом.
6 — Реорганизация упорядоченных элементов: после упорядочивания группы выделенных элементов, их можно регулировать курсором. Кроме того, можно заменять элементы друг на друга без нарушения порядка / соотношения.
7 — Перетаскивание + Пробел: если вы хотите изменить расположение выбранной области, вы можете использовать клавишу пробела после ее выбора.
8 — Cmd + «число» (вкладок): вы можете переключаться между вкладками с помощью комбинации Cmd + «число», как в браузерах, если открыто более одного файла / вкладки. Конечно, домашняя страница – это тоже вкладка.
9 — Cmd + точка (.): Закрывает правую и левую панели. Так вы получите измените рабочее пространство. Вы можете использовать ту же комбинацию клавиш, чтобы открывать панели.
10 — Cmd + |: эта комбинация также скрывает только левую панель. Вы можете использовать ту же комбинацию, чтобы открыть ее снова.
11 — Cmd + G: Группировать выбранные элементы.
12 —  Cmd + Option + G: объединить выбранные элементы во фрейм, как при группировке. Иногда при изменении размеров элементов более выгодно использовать фреймы вместо групп.
13 — Control + Shift +?: Отображение всех сочетаний клавиш. Так вы сможете попробовать сочетания, которых нет в этой статье.
14 — Shift + Cmd + K: выбор фотографий из файлов. Таким образом, можно выделить группу фотографий. Вы также можете размещать фотографии, кликая по фреймам, прямоугольникам и т. д. (каждый элемент, который может содержать изображение) один за другим.
15 — Выбор цвета: давайте выберем элемент, который можно заливать цветом. Выбрав параметр заливки элемента, вы можете найти светлые и темные тона цветов с помощью клавиш со стрелками вверх (светлые) и вниз (темные). Для этого необходимо выбрать заливку. Кроме того, если вы нажмете клавишу Shift, вы сможете быстрее уловить тональные различия.
16 — Автоматическая высота и ширина текста: когда мы хотим изменить размер текстового поля, мы делаем это на правой панели. Если мы выбираем текст для копирования и вставки, этот текст копируется со своим стилем по умолчанию. На этом этапе мы можем последовать небольшому совету: изменить текст с автоматической высоты на автоматическую ширину, дважды щелкнув по любому краю текстового поля.
17— Отображение элемента: в больших файлах может быть сложно найти элемент на холсте, но мы можем найти его на левой панели. Следовательно, если вы щелкните по иконке, появившейся рядом с элементом на левой панели, этот элемент выделится на холсте и будет отцентрирован.

Остальные советы и примеры: https://ux.pub/42-soveta-po-figma-kotorye-uskoryat-vashu-rabotu/

Тренды в дизайне мобильных приложений

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

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

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

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

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

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

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

Вот почему следующие тренды будут только усиливаться:

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

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

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

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

Эмодзи
Эмодзи добавляют красок пользовательскому опыту. Они стали незаменимыми в нашем общении, поэтому они останутся актуальными по мере совершенствования.

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

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

Источник

Любовь, роботы и UI: роль искусственного интеллекта в индустрии дизайна

Идея создания машины, имитирующей человеческий интеллект, является основным направлением в области технологий. Мы уже сделали скачок от «ИИ» из фильмов начала 2000-х, к чему-то, что мы считаем само собой разумеющимся. Ведь теперь ИИ устанавливает для нас сигнал будильника на наших iPhone.
Однако, вопреки нашим убеждениям, ИИ все еще находится в зачаточном состоянии, и еще есть время пока роботы полностью не захватили индустрию дизайна.
В то время, как люди тратят много времени на обдумывание дизайн-решений с помощью гибридного творчески-логического мыслительного процесса, ИИ – это гипер-логическая система решений, которые приводят к, в значительной степени, предсказуемым целям.
При этом ИИ предоставляет дизайнерам (все еще остающимся людьми) набор возможностей для принятия более осознанных и уточненных решений.

Содержание статьи
ИИ облегчает жизнь дизайнерам
Какие наиболее интересные инструменты дизайна на основе ИИ могут помочь дизайнерам?
1. Khroma
2. Fontjoy
3. Uizard
4. Copy.ai
Какие выгоды получили компании от ИИ?
1. Персонализация контента Netflix
2. Nutella– Массовое создание уникальных дизайнов
3. Переписка в приложении Airbnb

Читать статью: https://ux.pub/lyubov-roboty-i-ui-rol-iskusstvennogo-intellekta-v-industrii-dizayna/