Дайджест новых стилей и сайтов digital-компаний за май: Discord, Pinterest, Calendly, Sketch, Google и другие
Новый стиль Pinterest — очень сложный прикол. Discord стал плейфул, другого слова и не подберешь. Sketch делает наброски нового стиля.
Читать новости
#Design #UI
Новый стиль Pinterest — очень сложный прикол. Discord стал плейфул, другого слова и не подберешь. Sketch делает наброски нового стиля.
Читать новости
#Design #UI
Gridcalculator - прекрасный ресурс для расчета сетки.
Будет полезен как веб, так и графическим дизайнерам.
Выставляем общую ширину макета, количество колонок, отступы по краям, и между колонками, и получаем ширину колонки. С его помощью можно рассчитать не только сетку, но и размеры любых элементов, с одинаковой шириной.
Допустим нам известно количество столбцов в таблице, и общая ширина. Нужно только задать отступы по краям и между столбцами равными нулю, и мы получим ширину столбцов. Результаты можно скачать в AI, PSD и PNG.
#Design #UI
Будет полезен как веб, так и графическим дизайнерам.
Выставляем общую ширину макета, количество колонок, отступы по краям, и между колонками, и получаем ширину колонки. С его помощью можно рассчитать не только сетку, но и размеры любых элементов, с одинаковой шириной.
Допустим нам известно количество столбцов в таблице, и общая ширина. Нужно только задать отступы по краям и между столбцами равными нулю, и мы получим ширину столбцов. Результаты можно скачать в AI, PSD и PNG.
#Design #UI
Сквирклморфизм (Squirclemorphism) в дизайне интерфейсов
Вы заметили рост популярности этого тренда?
Последние годы богаты на новые стили UI дизайна. Начиная с простого плоского дизайна, Material дизайна и заканчивая неоморфизмом, и глассморфизмом.
... Давайте погрузимся в мир сквирклов (суперэллипсов)!
Читать об этом
#Design #UI #Creative
Вы заметили рост популярности этого тренда?
Последние годы богаты на новые стили UI дизайна. Начиная с простого плоского дизайна, Material дизайна и заканчивая неоморфизмом, и глассморфизмом.
... Давайте погрузимся в мир сквирклов (суперэллипсов)!
Читать об этом
#Design #UI #Creative
Избегайте рандомности
Подобная рекомендация верна и для многих других типов диаграмм.
Не используйте стандартную сортировку по алфавиту.
Поместите самые большие значения вверху (для горизонтальных столбчатых диаграмм) или слева (для вертикальных столбчатых диаграмм), чтобы наиболее важные значения занимали наиболее заметное пространство, уменьшая движения глаз и время, необходимое для чтения диаграммы.
Автор
#Design #UX #UI
Подобная рекомендация верна и для многих других типов диаграмм.
Не используйте стандартную сортировку по алфавиту.
Поместите самые большие значения вверху (для горизонтальных столбчатых диаграмм) или слева (для вертикальных столбчатых диаграмм), чтобы наиболее важные значения занимали наиболее заметное пространство, уменьшая движения глаз и время, необходимое для чтения диаграммы.
Автор
#Design #UX #UI
Когда наступит смерть UX-дизайнеров?
Дизайн – это процесс выяснения проблемы и выбора подходящего решения. А когда решение не работает, дизайнер должен понять недостаток и выбрать следующее подходящее решение.
В последние годы появление инструментов прототипирования на основе искусственного интеллекта обозначило мрачное будущее для UI / UX дизайнеров.
Читать подробнее
#UX #UI
Дизайн – это процесс выяснения проблемы и выбора подходящего решения. А когда решение не работает, дизайнер должен понять недостаток и выбрать следующее подходящее решение.
В последние годы появление инструментов прототипирования на основе искусственного интеллекта обозначило мрачное будущее для UI / UX дизайнеров.
Читать подробнее
#UX #UI
Как сделать иллюстрации в дизайне маркетинговым инструментом
Многие люди страдают от устаревших стереотипов, полагая, что иллюстрация относится исключительно к сфере искусства и не имеет ничего общего с бизнесом. (Расскажите об этом Warner Brothers или Walt Disney Studios!) Этот архаичный взгляд сдерживает вашу компанию и делает ее менее прибыльной, потому что сегодня цифровая иллюстрация – это бизнес.
Итак, давайте развеем эти вредные заблуждения. Иллюстрация – это маркетинговый инструмент, каким бы красивым и милым он ни выглядел. Его цель – продвигать бизнес, предоставлять информацию и привлекать людей.
Читать подробнее
#Design #UI
Многие люди страдают от устаревших стереотипов, полагая, что иллюстрация относится исключительно к сфере искусства и не имеет ничего общего с бизнесом. (Расскажите об этом Warner Brothers или Walt Disney Studios!) Этот архаичный взгляд сдерживает вашу компанию и делает ее менее прибыльной, потому что сегодня цифровая иллюстрация – это бизнес.
Итак, давайте развеем эти вредные заблуждения. Иллюстрация – это маркетинговый инструмент, каким бы красивым и милым он ни выглядел. Его цель – продвигать бизнес, предоставлять информацию и привлекать людей.
Читать подробнее
#Design #UI
Используете насыщенные цвета? Попробуйте смягчить ситуацию с помощью оттенков и теней (Tints и Shades)
Сильно насыщенные цвета (ярко-синий, красный, зеленый и т. д.) могут отлично смотреться на сайте, но при чрезмерном использовании будут утомлять глаза пользователя, особенно при больших объемах текста.
По возможности используйте их в умеренных количествах и старайтесь сочетать с приглушенными оттенками (tint или shade) насыщенного цвета, чтобы избежать усталости глаз.
Использование этого метода также привлечет внимание к насыщенному цвету, поэтому наиболее важный контент окажется в центре внимания. При этом более приглушенные цвета будут играть менее заметную роль и дадут глазам пользователя немного отдохнуть.
Автор
#Design #UI
Сильно насыщенные цвета (ярко-синий, красный, зеленый и т. д.) могут отлично смотреться на сайте, но при чрезмерном использовании будут утомлять глаза пользователя, особенно при больших объемах текста.
По возможности используйте их в умеренных количествах и старайтесь сочетать с приглушенными оттенками (tint или shade) насыщенного цвета, чтобы избежать усталости глаз.
Использование этого метода также привлечет внимание к насыщенному цвету, поэтому наиболее важный контент окажется в центре внимания. При этом более приглушенные цвета будут играть менее заметную роль и дадут глазам пользователя немного отдохнуть.
Автор
#Design #UI
Руководство по созданию эффективного эмоционального дизайна
Эмоциональный дизайн – это искусство создавать опыт, привлекающий ваших пользователей. Для этого вам необходимо понять, как они думают, чего они хотят и как они будут использовать ваш продукт.
Внешний вид, ощущение, тон – все должно сочетаться, чтобы создать целостный продукт, учитывая эмоциональную реакцию людей на него.
Здесь мы говорим о проектировании опыта, который создает эмоциональную связь с пользователями или заставляет их чувствовать себя особенными, доставляя удовольствие.
Читать подробнее
#Design #UI
Эмоциональный дизайн – это искусство создавать опыт, привлекающий ваших пользователей. Для этого вам необходимо понять, как они думают, чего они хотят и как они будут использовать ваш продукт.
Внешний вид, ощущение, тон – все должно сочетаться, чтобы создать целостный продукт, учитывая эмоциональную реакцию людей на него.
Здесь мы говорим о проектировании опыта, который создает эмоциональную связь с пользователями или заставляет их чувствовать себя особенными, доставляя удовольствие.
Читать подробнее
#Design #UI
Светлый текст на темном фоне? Увеличьте толщину шрифта для лучшей читабельности
При установке темного текста на светлом фоне вы можете иногда выбрать более легкий вес шрифта.
Но! Когда дело доходит до обратного: светлый текст > темный фон. Следует немного увеличить вес шрифта, особенно для больших блоков текста.
Стремитесь к лучшей читабельности и не утомляйте глаза пользователя.
#UI
При установке темного текста на светлом фоне вы можете иногда выбрать более легкий вес шрифта.
Но! Когда дело доходит до обратного: светлый текст > темный фон. Следует немного увеличить вес шрифта, особенно для больших блоков текста.
Стремитесь к лучшей читабельности и не утомляйте глаза пользователя.
#UI
Тренд UI на 2022 год. Глассморфизм и элементы, вдохновленные стеклом.
Глассморфизм повсюду – это факт. Он представлен размытием фона, полупрозрачными объектами, например, карточками, «акварелью», стеклянными сферами и т.д. Эффект стекла никуда не денется, и мы будем встречать его повсюду от встроенных элементов Mac OS Big Sur и Windows 11 до самых разных приложений.
#UI #Trend | Автор
Глассморфизм повсюду – это факт. Он представлен размытием фона, полупрозрачными объектами, например, карточками, «акварелью», стеклянными сферами и т.д. Эффект стекла никуда не денется, и мы будем встречать его повсюду от встроенных элементов Mac OS Big Sur и Windows 11 до самых разных приложений.
#UI #Trend | Автор
Тренд UI на 2022 год. Минимализм и упрощение
Взгляните на ведущие технологические компании, и вы увидите предпочтение простых, информативных, минималистичных интерфейсов (Revolut, Meta, Oculus и т. д.). С каждым годом этот тренд становится все популярнее, и все больше брендов начинают его использовать.
#Ui #Trend
Взгляните на ведущие технологические компании, и вы увидите предпочтение простых, информативных, минималистичных интерфейсов (Revolut, Meta, Oculus и т. д.). С каждым годом этот тренд становится все популярнее, и все больше брендов начинают его использовать.
#Ui #Trend
Как выглядит недостаточная мотивация в UI / UX дизайне?
- триггеры не выделяются (непривлекательный дизайн);
- триггеры не вызывают эмоционального влечения (нецелевой дизайн);
- слишком мало или вовсе нет дополнительных триггеров (ослабление интереса и внимания);
- слишком много триггеров (раздражает своей навязчивостью);
- мотивация не подкрепляется визуально и эмоционально;
- стимулы отсутствуют или не интересны целевой аудитории;
визуальные эффекты начинаются хорошо, а потом идут на спад.
Пользователи уходят, когда у них нет мотивации остаться и выполнить необходимое действие, что является серьезным упущением со стороны создателей проекта. Привлекательных триггеров недостаточно. Триггер – это просто призыв к действию. Только реальная мотивация может заставить пользователя выполнить это действие.
#UX #UI
- триггеры не выделяются (непривлекательный дизайн);
- триггеры не вызывают эмоционального влечения (нецелевой дизайн);
- слишком мало или вовсе нет дополнительных триггеров (ослабление интереса и внимания);
- слишком много триггеров (раздражает своей навязчивостью);
- мотивация не подкрепляется визуально и эмоционально;
- стимулы отсутствуют или не интересны целевой аудитории;
визуальные эффекты начинаются хорошо, а потом идут на спад.
Пользователи уходят, когда у них нет мотивации остаться и выполнить необходимое действие, что является серьезным упущением со стороны создателей проекта. Привлекательных триггеров недостаточно. Триггер – это просто призыв к действию. Только реальная мотивация может заставить пользователя выполнить это действие.
#UX #UI
Human Interface Guidelines от Apple
Позволяет получить подробную информацию и ресурсы интерфейса для проектирования отличных приложений, которые легко интегрируются в платформы Apple.
Human Interface Guidelines познакомят вас с основными структурными компонентами приложения, такими как архитектура, возможности системы, визуальный дизайн, иконки и многое другое.
#UI
Позволяет получить подробную информацию и ресурсы интерфейса для проектирования отличных приложений, которые легко интегрируются в платформы Apple.
Human Interface Guidelines познакомят вас с основными структурными компонентами приложения, такими как архитектура, возможности системы, визуальный дизайн, иконки и многое другое.
#UI
Лайфхак UI. Смещение теней
Вместо того, чтобы использовать большие значения размытия и растягивания, чтобы сделать тени блока (box shadows) более заметными, добавьте вертикальное смещение.
Это выглядит намного более естественно, потому что так имитируется источник света сверху, что мы привыкли наблюдать в реальном мире.
Это относится к внутренним теням, которые вы можете использовать, например, для форм ввода.
#UI | Автор
Вместо того, чтобы использовать большие значения размытия и растягивания, чтобы сделать тени блока (box shadows) более заметными, добавьте вертикальное смещение.
Это выглядит намного более естественно, потому что так имитируется источник света сверху, что мы привыкли наблюдать в реальном мире.
Это относится к внутренним теням, которые вы можете использовать, например, для форм ввода.
#UI | Автор
Используете насыщенные цвета? Попробуйте смягчить ситуацию с помощью оттенков и теней (Tints и Shades)
Сильно насыщенные цвета (ярко-синий, красный, зеленый и т. д.) могут отлично смотреться на сайте, но при чрезмерном использовании будут утомлять глаза пользователя, особенно при больших объемах текста.
По возможности используйте их в умеренных количествах и старайтесь сочетать с приглушенными оттенками (tint или shade) насыщенного цвета, чтобы избежать усталости глаз.
Использование этого метода также привлечет внимание к насыщенному цвету, поэтому наиболее важный контент окажется в центре внимания. При этом более приглушенные цвета будут играть менее заметную роль и дадут глазам пользователя немного отдохнуть.
#UI
Сильно насыщенные цвета (ярко-синий, красный, зеленый и т. д.) могут отлично смотреться на сайте, но при чрезмерном использовании будут утомлять глаза пользователя, особенно при больших объемах текста.
По возможности используйте их в умеренных количествах и старайтесь сочетать с приглушенными оттенками (tint или shade) насыщенного цвета, чтобы избежать усталости глаз.
Использование этого метода также привлечет внимание к насыщенному цвету, поэтому наиболее важный контент окажется в центре внимания. При этом более приглушенные цвета будут играть менее заметную роль и дадут глазам пользователя немного отдохнуть.
#UI
Используете насыщенные цвета? Попробуйте смягчить ситуацию с помощью оттенков и теней (Tints и Shades)
Сильно насыщенные цвета (ярко-синий, красный, зеленый и т. д.) могут отлично смотреться на сайте, но при чрезмерном использовании будут утомлять глаза пользователя, особенно при больших объемах текста.
По возможности используйте их в умеренных количествах и старайтесь сочетать с приглушенными оттенками (tint или shade) насыщенного цвета, чтобы избежать усталости глаз.
Использование этого метода также привлечет внимание к насыщенному цвету, поэтому наиболее важный контент окажется в центре внимания. При этом более приглушенные цвета будут играть менее заметную роль и дадут глазам пользователя немного отдохнуть.
#UI
Сильно насыщенные цвета (ярко-синий, красный, зеленый и т. д.) могут отлично смотреться на сайте, но при чрезмерном использовании будут утомлять глаза пользователя, особенно при больших объемах текста.
По возможности используйте их в умеренных количествах и старайтесь сочетать с приглушенными оттенками (tint или shade) насыщенного цвета, чтобы избежать усталости глаз.
Использование этого метода также привлечет внимание к насыщенному цвету, поэтому наиболее важный контент окажется в центре внимания. При этом более приглушенные цвета будут играть менее заметную роль и дадут глазам пользователя немного отдохнуть.
#UI