Оптимальный дизайн для компонентов выбора чисел 

Статьи 2 мин на чтение 14 Выбор значений ввода В формах для ввода не всегда просто выбрать числовое значение. Люди часто испытывают сложности при использовании традиционного компонента выбора чисел. Например, им трудно нажимать на кнопки, которые расположены сбоку от текстового поля. На кнопках указаны не совсем понятные подсказки в виде стрелок вверх и вниз. Дизайнеры…

Краткий обзор энциклопедии компонентов

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

Как я программно создал в Figma 256 новых компонентов дизайн-системы

Дизайна-cистема Uber Base предлагает набор компонентов маркеров карты, которые широко используются в наших продуктах и ​​отображаются всякий раз, когда мы показываем карту пользователю. Недавно мы столкнулись с необходимостью показать дополнительный контекст и решили добавить для этого бейджи – существующий базовый компонент. Проблема заключалась в том, что и маркеры карты, и бейджи имели несколько вариантов. Маркеры можно настроить по…

Создание сложных вариативных компонентов в Figma

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

Material Design на русском. Часть 9 — Поведение компонентов | by Ruslan Sharipov | Jan, 2021

Наложение Когда UI меняется, тогда компонент может быть перекрыт другими элементами, которые будут его закрывать. В этой ситуации его позиция и размеры остаются неизменными. Обрати внимание: контентная область перекрывается боковой панелью навигации (сайдбаром), но сама область не сдвигается, а элементы остаются в исходных размерах. Компоненты могут адаптироваться в зависимости от размера экрана и типа устройства,…

Как повысить мощность ваших компонентов с помощью вариантов Figma

Более 1200 курсов и электронных книг Дизайн, код, редактирование видео, бизнес и многое другое. Adobe Photoshop, Illustrator и InDesign Графика, логотип и полиграфический дизайн Sketch, Adobe XD и Figma WordPress Javascript, PHP и Python Adobe After Effects & Premiere Pro Многое другое Миллионы творческих ресурсов Шаблоны дизайна, стоковые видео, фото и аудио и многое другое.…

Использование Auto Layout компонентов в Figma | by Irina Bushueva | Jul, 2020

Самым сложным было организовать секцию деталей: она должна поддерживать многострочные параметры. Это означает, что все блоки должны вести себя в соответствии с объемом контента, который имеют блоки выше. Блок может иметь от одной до трех строк параметров, поэтому нам необходимо поддерживать любые конфигурации в этих пределах: От 1 до 3 строк Строки могут иметь 4…

9 основных компонентов бренд-сообщений

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

Создание многократно используемых компонентов с использованием React

             Что такое компоненты многократного использования? Создание многократно используемого компонента React Интеграция компонентов React с ButterCMS Заключение React — одна из самых популярных библиотек JavaScript для создания пользовательских интерфейсов. Чтобы создать приложение с использованием React, вам просто нужно создать инкапсулированные компоненты, которые могут содержать свое собственное состояние. Ваше приложение должно быть набором компонентов React, которые…