Статьи 9 мин на чтение 9 В дизайн-системах дизайнеры, разработчики и другие члены команды ориентируются на документацию. Она содержит пошаговые инструкции о том, как внедрять руководства по доступности в дизайн. Более того, качественная документация позволяет учесть и эффективно реализовать все ключевые аспекты доступности. Тем самым она способствует сотрудничеству и последовательности в работе. В этой статье…
Статьи 17 мин на чтение 66 Что такое цветовая палитра? Цветовая палитра, также известная, как цветовая шкала, — неотъемлемая часть любого дизайн-проекта. Она включает набор оттенков и теней, которые определяют его концептуальные цвета. В дальнейшем их используют для создания внешнего вида компонентов интерфейса, состояний, иллюстраций и общего стиля дизайна. Тщательно разработанная цветовая палитра — сбалансированный…
Как возникла необходимость в дизайн системе Немного контекста: моя команда работает над продуктом с рядом отдельных независимых друг от друга сайтов, где клиенты могут ознакомиться с нашими услугами, сделать заказ и потом управлять своими заказами. Дизайн каждого из наших сайтов на 90% уникален (за исключением некоторых важных шагов воронки). На определенном этапе мы столкнулись с…
Сейчас я работаю над системами проектирования. Он избавляет меня от многих моих проблем, в первую очередь от организации и стандартизации вещей, а также обеспечения доступности как на уровне проектирования, так и на уровне разработки. Мой очень крутой начальник работает над обновлением нашей сеточной системы, и с этим идут разговоры о вертикальном ритме. Если вы не…
В Авито колоссальное количество интерфейсов и экранов — около 1000 на десктопе и в мобильных приложениях. Чтобы интерфейсы были консистентными и корректно работали, а создавать их получалось быстрее и проще, у нас есть дизайн-система. На самом базовом уровне дизайн-систему понимают как набор компонентов и стилей. В нашу входят ещё гайдлайны, флоу и паттерны для дизайнеров…
Дизайна-cистема Uber Base предлагает набор компонентов маркеров карты, которые широко используются в наших продуктах и отображаются всякий раз, когда мы показываем карту пользователю. Недавно мы столкнулись с необходимостью показать дополнительный контекст и решили добавить для этого бейджи – существующий базовый компонент. Проблема заключалась в том, что и маркеры карты, и бейджи имели несколько вариантов. Маркеры можно настроить по…
Компоненты — это сложные элементы пользовательского интерфейса, состоящие из нескольких токенов пользовательского интерфейса. Это молекулы атомной конструкции, поскольку они состоят из нескольких атомов. Панель действий Панель действий — это группа инструментов для управления объектами или выполнения действий. https://dribbble.com/shots/11116878-Hiring-Platform-Messages-Chat Лента активности Лента активности представляет собой хронологическую запись системных событий или действия пользователя. https://dribbble.com/shots/7090382-Concept-Design-Activity-History Avatar Group An…
Дизайн-системы можно найти везде и практически во всем. Они находятся в операционной системе вашего смартфона, ноутбука, который вы используете для работы, и даже на посещаемых вами веб-сайтах. Но что такое дизайн-система? Что в нее входит? Зачем их использовать? Мы собираемся ответить на эти вопросы в данной статье, более подробно рассмотрев дизайн-системы, а также их важность.…
Проверка на выживание Даже если шрифт вам очень нравится, сделаете несколько несложных телодвижений. Проверьте, как шрифт отображается в разных браузерах. К сожалению, бывают достаточно сильные различия, которые могут вас не устроить: Как видите, даже на небольшом отрезке текста видно разницу — браузеры рендерят шрифты по-разному. Мой пример далеко не самый худший, потому что это один…
Текст Артема Геллера с vc.ru Основатель дизайн-компании «Смена» и инициатор создания российской дизайн-системы — о том, что такое дизайн-система, чем она будет полезна людям и почему это важнейший элемент становления сервисного государства. В начале апреля в США запустили вторую версию единой дизайн-системы для государственных сайтов — USWDS 2.0. В России уже около трёх лет реализуется схожий проект. Зачем нужна дизайн-система…