Pull to refresh

Как создать дизайн-систему, в которой комфортно всем

Level of difficulty Medium
Reading time 5 min
Views 400
БФТ-Холдинг corporate blog Web design *Website development *Interfaces *Design
Tutorial

Привет! Меня зовут Константин. Уже второй год мы с командой проектировщиков работаем в БФТ-Холдинге над большим продуктом для государства. В этой статье я поделюсь своим опытом, а также расскажу про ошибки, с которыми пришлось столкнуться на пути к созданию удобной дизайн-системы.

Читать далее
Total votes 3: ↑2 and ↓1 +1
Comments 0

Figma выкатила новый Auto Layout

Reading time 1 min
Views 7.6K
Mobile applications design *Design

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

Читать далее
Total votes 4: ↑3 and ↓1 +2
Comments 2

Figma: Scroll to новая фича

Reading time 1 min
Views 14K
Mobile applications design *Design

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

Локализованный файл лежит тут

Отрезок в статье тут

Читать далее
Total votes 7: ↑4 and ↓3 +1
Comments 15

10 марта — бесплатный онлайн-митап SM Lab analyst day

Reading time 2 min
Views 883
Sportmaster Lab corporate blog System Analysis and Design *Mobile App Analytics *IT career Conferences
Привет! В среду, 10 марта, мы проведем митап, посвященный работе системных аналитиков и не только. В программе 4 доклада от наших спикеров, начинаем в 18.30 МСК. Главное — зарегистрируйтесь заранее, потому что ссылку на митап мы пришлём за час до начала.

Программа митапа


  • Работа в Спортмастере на примере проекта «Новый интернет-магазин»
  • Практический кейс замещения аналитиками роли «Тестировщик»
  • Как мы пришли к Figma или зачем учиться готовить вкусно
  • Ходим с разработчиками налево! Или Как уменьшить потери на пробелах в бизнес-постановках

А теперь подробнее.
Читать дальше →
Total votes 11: ↑11 and ↓0 +11
Comments 0

Design System Community Meetup 3/06: видео и материалы встречи

Reading time 2 min
Views 2.9K
Райффайзен Банк corporate blog System Analysis and Design *Usability *Conferences Design

Об опыте разработки дизайн-системы вместе со спикерами из Райффайзенбанка, Альфа-Банка, Яндекса и IVI: как построена стилизация компонентов, с какими трудностями можно столкнуться в процессе разработки, где ждать баги и как к ним подготовиться.

Смотрите митап в записи

Читать далее
Total votes 6: ↑6 and ↓0 +6
Comments 2

Приглашаем на новый митап от Friends of Figma Moscow

Reading time 1 min
Views 383
Usetech corporate blog Mobile applications design *Design

10 февраля 2022 в 19:00 мск приглашаем вас на новый митап от наших друзей — сообщества Friends of Figma Moscow, на котором выступит Евгений Шевцов, руководитель UX-направления Usetech, и Евгений Бирюков.

О чем поговорим:

— Что такое дизайн-токены?

— Как токены помогают процессу проектирования?

— Поговорим про темизацию, Figma API и много чего интересного.

— Готовьте свои вопросы спикерам.

19:00 Интро.

19:15 Евгений Шевцов, «Дизайн-токены для самых маленьких»

О себе: В дизайне интерфейсов более 10 лет. 3 года возглавляю UX-направление в компании Usetech. Занимаюсь исследованием пользовательского опыта, прототипами, ui-дизайном. Работаю с интерфейсами в госсекторе, телемедициной, банки, транспорт, ЖКХ. Веду телеграм и ютуб канал о дизайне и инструментах «Мамкин Дизайнер».

20:15 Евгений Бирюков, «Темизация через переменные и Figma API»

О себе: В дизайне интерфейсов более 10 лет. Лидировал дизайн ипотеки в ВТБ, Б2Б МегаФон, создавал классифайд на базе Ozon, а также являюсь сооснователем студии Heads.Design.

21:15 Вопросы-ответы

Забивайте время в календарях и приходите на митап.

Трансляция будет на YouTube.

Читать далее
Total votes 2: ↑2 and ↓0 +2
Comments 0

МТС Digital будет участвовать в конференции HighLoad++, которая пройдет 13-14 мая 2022 года в московском «Крокус Экспо»

Reading time 1 min
Views 913
МТС corporate blog Python *Big Data *DevOps *


На HighLoad++ мы будем общаться, играть и раздавать призы. За общение отвечают инженеры МТС Digital, которые подготовили 20 докладов. Рассказывать будут о платформе BigData, DevOps-процессах, JSON:API на Python, синхронизации с Figma, PaaS, MLOps, Server-Driven UI и том, как мы в МТС Digital создавали гильдии инженеров.
Читать дальше →
Total votes 13: ↑8 and ↓5 +3
Comments 0

Сбой в работе сервисов Figma, починили спустя 100 минут, но все равно проблемы продолжаются частично

Reading time 1 min
Views 4.3K
IT Infrastructure *Graphic design *Cloud services *IT-companies


7 июня 2022 года произошел сбой в работе облачных сервисов кросс-платформенной программы для дизайнеров Figma.
Читать дальше →
Total votes 2: ↑2 and ↓0 +2
Comments 1

Adobe покупает Figma за $20 млрд

Reading time 1 min
Views 6.8K
Design Software Finance in IT IT-companies

Adobe заявила о приобретении стартапа Figma, занимающегося разработкой одноимённого инструмента для дизайнеров. Сделку планируется закрыть в 2023 году. До этого момента компании будут работать независимо друг от друга.

Читать далее
Total votes 16: ↑16 and ↓0 +16
Comments 18

Понедельник отличных новостей для дизайнеров от ГК Юзтех

Reading time 2 min
Views 371
Usetech corporate blog Mobile applications design *Graphic design *Design

Во-первых, вышел новый выпуск подкаста «Этот ваш дизайн». Евгений Шевцов, руководитель UX-направления ГК Юзтех, основатель телеграм канала «Мамкин дизайнер» с Александром Ефремовым, старшим дизайнером ГК Юзтех, поговорили о том, как продуктовому дизайнеру качать свой UI, если у него творческий застой. Какую роль играет комьюнити и почему dribbble не работает? Обсудили плохой и хороший мерч, поговорили про пиво и попытались понять, существует ли креативность и можно ли ее воспитать в себе.

Оставляем ссылки на несколько платформ:

Читать далее
Total votes 4: ↑3 and ↓1 +2
Comments 0

FigmaScript удобный редактор для скриптов в Figma

Reading time 2 min
Views 1.4K
JavaScript *API *Design

Команда Figma сделала мне хороший подарок на Новый год, опубликовав мой плагин FigmaScript. Это простой javasript редактор для написания скриптов с API Figma. Плагин написан на основе библиотеки Ace. Добавил сюда вкладки, простую файловую систему для сохранения скриптов, автозаполнение и подсветку синтаксиса методов и свойств Figma, а так же удобный хэлп.

Читать далее
Total votes 8: ↑8 and ↓0 +8
Comments 0

Chat GPT помощник для FigmaScript

Reading time 1 min
Views 5.3K
JavaScript *API *

В конце прошлого года я опубликовал плагин FigmaScript, редактор для написания скриптов с API Figma. Были некоторые задумки по развитию плагина. Но планы планами, а тренды никто не отменял. Все последнее время youtube бомбил меня рекомендациями вроде "Программисты больше не нужны? GPT чат. Как ИИ пишет код". В итоге стало интересно и я решил-таки вылезти из танка и изучить вопрос. Штука эта мне понравилась и я, не долго думая, решил добавить ее в плагин. Сразу, конечно, наткнулся на то, что OpenAI заблокирован для пользователей России. Поэтому я нашел первый попавшийся условно бесплатный api и прикрутил его к FigmaScript.

Читать далее
Total votes 3: ↑2 and ↓1 +1
Comments 0

Антимонопольные регуляторы EC проверят покупку Adobe стартапа Figma

Reading time 1 min
Views 829
Legislation in IT Finance in IT IT-companies

Антимонопольные регуляторы Евросоюза проверят покупку стартапа Figma компанией Adobe. Еврокомиссия планирует оценить выкуп и слияние компаний, так как считает, что сделка может значительно повлиять на конкуренцию на рынке программного обеспечения для интерактивного дизайна.

Читать далее
Total votes 2: ↑1 and ↓1 0
Comments 1

«Ъ»: российские компании ищут способы сохранить лицензии на продукты Adobe

Reading time 2 min
Views 3K
Image processing *Software IT-companies

Спустя более чем год после ухода из РФ Adobe крупные компании и региональные органы власти продолжают искать способы продлить лицензии на продукты компании и сходное ПО, пишет «Коммерсантъ». Например, ретейлер «Магнит» в марте объявил запрос предложений на продление лицензий на ПО Adobe до 8 мая 2024 года.

Читать далее
Total votes 9: ↑9 and ↓0 +9
Comments 37

Кровь, пот и слезы дизайнера

Reading time 9 min
Views 14K
Development Management *Project management *Freelance IT career
image

Солнце. Море. Песок. Наконец то первый отпуск за полтора года. Этой зимой я что-то сильно перегорел. Совершенно неожиданно. В поисках долгожданного развития придумал себе сложности: из обычных статичных макетов перешёл в интерактивное прототипирование. Так и проковырялся в этом Axure всю зиму и полвесны, а потом перегорел и закипел! «Есть же новый навык, новый рычаг, а приложить его некуда...». С такими мыслями я понимал — пора в отпуск. Чем скорее тем лучше. Иначе в моем кабинете потребуется новая мебель, новые мониторы и пучок новых манипуляторов «мышь»… Вместо разбитых, очевидно!
Читать дальше →
Total votes 17: ↑13 and ↓4 +9
Comments 18

Мои правила хорошей дизайн-системы. Компоненты и архитектура интерфейса в Figma

Reading time 8 min
Views 54K
Website development *Interfaces *Mobile applications design *Project management *Product Management *


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

Фигма и другие современные инструменты позволяют задавать взаимосвязи между элементами, упрощая редактирование отдельных компонентов или целых экранов; группировать их в библиотеки компонентов и давать желаемые права доступа.

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

По методологии Атомарного дизайна, я начну с атомов и буду двигаться дальше к более сложным компонентам. Буду работать в Фигме и продемонстрирую, что у Скетча появился серьёзный конкурент.

Total votes 12: ↑7 and ↓5 +2
Comments 21

Разработка инструмента веб-дизайнера на основе веб-приложения (Figma). Перевод

Reading time 7 min
Views 12K
Web design *Website development *JavaScript *C++ *
Recovery mode
image

Наше представление о будущем инструментов дизайна таково, что и инструменты, и контент должны быть легко доступны.

Вот почему мы создали Figma, командный инструмент работы над дизайном интерфейсов, как облачный сервис, распространяемый в виде веб-приложения.

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


Читать дальше →
Total votes 11: ↑9 and ↓2 +7
Comments 0