Перевод «Я люблю ИП»
Недавно я работала над созданием системы отступов и размеров для одного продукта в сфере здравоохранения, чтобы улучшить читабельность текста и добиться последовательности на всех страницах. Я вывела три правила для отступов (Правило трёх «К») и четыре размера (16px, 8px, 4px, 2px), которые работали гармонично с новой системой типографики.
Из этой статьи вы узнаете, как использовать расстояния осознанно для последовательности в дизайне и более быстрой разработки.
Представьте себе: вы разработчик ПО. Вас включили в команду, работающую над редизайном одной из центральных функций приложения, созданного компанией. Вы несколько месяцев собирали информацию о пользователях, делали прототипы, тестировали их на контрольной группе (всем понравилось!) и переделывали приложение. И вот сегодня обновленная версия вышла в публичный доступ.
Теперь представьте, что тысячи людей выступили против обновления. Они стали создавать веб-страницы для противников новой функции. Они решили объявить массовый бойкот продукту. В «Тайм» появилась статья с подробным разбором вашего провала.
В такой ситуации вы бы, вероятно, подумали, что пора освежить свой профиль на LinkedIn (разумеется, умолчав там об этом фиаско): как только директор разгребет то, что вы натворили, он немедленно вас уволит.
А теперь представьте, что все эти люди были неправы. Вы провели исследование. Вы протестировали приложение на контрольной группе (всем понравилось!). Представьте, что пока сотни или даже тысячи пользователей протестовали, все остальные продолжали пользоваться продуктом и прибыль возросла в разы. Представьте, что на самом деле ваш редизайн изменил мир и то, как люди общаются друг с другом.
Читать полностью »
6 лет наша компания занимается дизайном и разработкой мобильных приложений. Мы много экспериментировали с оптимизацией процессов как внутри компании, так и при работе с клиентами. В итоге у нас сформировался свой, во многом уникальный, стиль работы.
Я руковожу отделом дизайна и хочу поделиться нашим подходом к работе. В этой статье расскажу, как построить работу с клиентом так, чтобы она была эффективной и комфортной для обеих сторон.
Читать полностью »
Приветствую Вас коллеги! В этой статье я бы хотел поделиться опытом создания дизайн-систем. Начитавшись разных умных книжек и насмотревшись полезных видео по этому вопросу, я решил применить знания на практике. После нескольких попыток я выделил для себя важные моменты. Которые опишу в данной статье. Мне очень интересно узнать, как решается вопрос дизайн систем у других практиков, поэтому жду море комментариев.Читать полностью »
Как создать чистый интерфейс, используя всего лишь один цвет? Вы узнаете из этой статьи. Перевод «Я люблю ИП».
Будучи по большому счёту дизайнером-самоучкой, мне всегда было интересно, почему так много статей и сайтов говорят о теории цвета и цветовых палитрах. По моему опыту, использую «сплит-комплиментарную палитру» вероятность сделать красивый дизайн стремится к нулю.
У меня есть другое мнение на этот счёт: теория цвета бесполезна.
Но если теория цвета не является прочной основой для выбора цвета в дизайне интерфейсов, то что тогда является?
Вот вам мой ответ: модификация цвета. Всё дело в небольших изменениях цвета, а не в их выборе из цветового круга.
Другими словами: основным навыком в придании цвета дизайну интерфейсов является умение модифицировать один основной цвет во множество различных вариаций.
Я знаю, что это звучит немного странно. Но послушайте меня, я дам вам практическую инструкцию для адаптации цвета в вашем дизайне.
Вы готовы? Тогда поехали.
В новом дайджесте мы разбираем Android на части, спорим с Apple по поводу PWA, смотрим, как делается новостной агрегатор, исследуем Firebase, учимся на дизайнеров интерфейсов, возвращаем и вознаграждаем пользователей.
В апреле совместно с МФТИ и компанией Contented мы запустили вводный курс по дизайну интерфейсов на образовательной онлайн-платформе Coursera. На нее зарегистрировалось более 8000 студентов. И это вдохновило нас на создание полноценной специализации «Дизайнер интерфейсов», состоящей из пяти курсов и защиты дипломного проекта. Программа подойдет как новичкам, так и квалифицированным UI- и UX-специалистам. За время обучения студент может практически с нуля достигнуть middle-уровня в области дизайна интерфейсов.
Привет, меня зовут Иван Греков, я работаю во фронтенд-команде Badoo, занимаюсь вёрсткой пользовательских интерфейсов на проектах компании.
В работе с макетами интерфейсов я использую графические редакторы, такие как Adobe Photoshop и Sketch. В них все слои по умолчанию представляют собой прямоугольные контейнеры. Когда мы выравниванием один слой по центру относительно другого, то для выравнивания используются центры прямоугольных контейнеров. Такой подход крайне неудобен при работе с иконками, поскольку выравниваемые фигуры могут сильно отличаться от прямоугольных контейнеров. И чем больше несимметричная фигура отличается по площади и по точкам координат от прямоугольника, в границы которого она вписана, тем заметнее разница между центрами фигуры и её контейнера. Это приводит к дисбалансу композиции в интерфейсных иконках.
Такая ситуация хорошо знакома специалистам в области дизайна, обычно она решается вручную, что требует определённых знаний и навыков. Именно поэтому она может создавать трудности для верстальщиков и разработчиков, которые решают эту задачу подручными инструментами.
Взаимодействие человека с компьютером во многом опирается на графические элементы интерфейса, и цвет играет в этом процессе не последнюю роль. Как однажды сказал Pierre Bonnard: «Цвет не просто делает дизайн приятным для глаз, но и подкрепляет его».
Проектируя новый продукт, дизайнеры часто затрудняются с составлением цветовой гаммы, так как существует неограниченное число возможных сочетаний. В этой статье мы рассмотрим восемь основных правил, которые могут помочь вам с выбором.
Во взаимодействии между человеком и компьютером и в дизайне пользовательского опыта всегда использовались метафоры и аналогии, чтобы привлечь внимание к тем функциям и возможностям, которые предлагают технологии. Аналогия и метафора — понятия тесно связанные, однако важно осознавать, в чем заключается различие между ними. Помимо прочего, понимание сути этих приемов поможет определить, в каких ситуациях лучше применять метафоры, а в каких — аналогии.
