Figma
17K subscribers
112 photos
13 videos
178 links
У Figma нет официальных сообществ и каналов на русском, поэтому своими силами рассказываю обо всех новостях подробно и без мусора ❤️

Вопросы задавай в Фигма-чат: @figmachat
Группа ВК: https://vk.com/figmadesign
Download Telegram
Новый способ создавать файлы Figma:

˗ˏˋ figma.new ˎˊ

(Также попробуй figjam.new) #новое
Необходимо пригласить много учеников за раз в Education команду? Больше не нужно приглашать каждого по email, просто создай ссылку и поделись ей с группой! #новое

Можно сразу выбрать уровень доступа ко всей команде: редактирование или только просмотр. Для большинства ситуаций рекомендуем оставить доступ на “can view”, а затем менять его в нужных проектах или файлах на “can edit”.

Однако стоит соблюдать осторожность — любой человек с верифицированным Education/Student аккаунтом сможет зайти по этой ссылке в команду. На всякий случай есть возможность обновить ссылку или убрать её совсем в настройках (1).
This media is not supported in your browser
VIEW IN TELEGRAM
В FigJam появился таймер: замеряй время и управляй рабочими сессиями! #новое

Чтобы начать таймер, в правом верхнем углу нажми на иконку со звёздочками и выбери Timer. Затем введи время (можно использовать стрелочки на клавиатуре чтобы быстро выбрать нужное время; зажимай Shift и вверх-вниз, чтобы переключать по 5 минут или секунд) и включи таймер нажатием кнопки Start Timer или Enter.

Таймер один для всех, любой редактор в файле может остановить или начать его. Закончится он также одновременно для всех пользователей. Полная информация об использовании таймера: https://help.figma.com/hc/en-us/articles/4402269549591

Перезагружай FigJam и пробуй новинку или залетай в общий файл: https://figma.fun/XVMNYE
30 (!) новинок, исправлений и улучшений Figma для улучшения твоей ежедневной работы! Как раз к достижению 20к подписчиков в нашей группе ВК😁 Спасибо всем! #новое

Посмотри эту презентацию в Community и изучи их все → https://figma.fun/pDyRLf 🔥 А на следующей неделе расскажем о некоторых из них подробнее.
Figma → Tilda? Тильда научилась импортировать макеты из Figma в Zero Block! Чтобы все элементы после импорта оказались на своих местах, необходимо соблюдать порядок в файле. Блоки сайта должны располагаться в отдельных фреймах, а ширина основного фрейма должна составлять 1200 пикселей. Подробная инструкция по импорту: https://blog.tilda.cc/import-from-figma-to-zero-block
This media is not supported in your browser
VIEW IN TELEGRAM
Создавай отдельные сценарии (flow по-русски) в прототипе на одной странице для сравнения, тестирования и презентации разных идей в Figma! #новое

Больше не нужно думать куда поставить начало прототипа — их может быть несколько. Выбери фрейм и нажми “+” в разделе Flow starting point в правой панели. Новый “флоу” также будет автоматически создан при добавлении связи между двумя фреймами, которые ни с чем больше не связаны. Сценариям можно давать имена и добавлять к ним описания. У каждого сценария есть уникальная ссылка, которую можно скопировать при наведении на имя сценария на холсте или в режиме просмотре прототипа.

Перезагрузи Figma и пробуй! Документация: https://help.figma.com/hc/en-us/articles/360039823894#Starting_point
This media is not supported in your browser
VIEW IN TELEGRAM
Больше не нужно лезть в панель слоёв, чтобы переименовать фрейм — просто кликни два раза на его имя на рабочем пространстве. #новое Это нововведение пришло вместе с Flows, их тоже можно переименовывать двойным кликом. Пользуясь случаем напоминаем сочетание клавиш для переименования слоёв: Cmd + R на macOS или Ctrl + R на Windows.
This media is not supported in your browser
VIEW IN TELEGRAM
Тень теперь можно ставить на объекты независимо от прозрачности фона! #новое Выключи галочку “Show behind transparent areas” в настройках эффекта, и тень будет показываться только вокруг границ объекта. Это позволит создавать ещё более приближенные к коду макеты без танцев с бубном!

И это не единственное обновление на сегодня, больше тут: https://releases.figma.com/
Представляем три обновления, которые круто изменят твою работу с компонентами и библиотеками! 😍 #новое

1. Перемещай компоненты между файлами — теперь можно создать компонент в одном файле, а потом переместить в другой без потери связей.
2. Заменяй компоненты одной библиотеки на другую, переключайся между целыми библиотеками одним кликом.
3. Нажми Shift + i и используй клавиатуру для поиска, быстрой вставки или замены компонентов. Это просто сказка!

Подробнее о каждом обновлении в следующих постах и на https://releases.figma.com/ 🔥 Перезагружай Figma и пробуй!
This media is not supported in your browser
VIEW IN TELEGRAM
Перемещать компоненты между файлами — разберёмся как это работает! Для начала тебе понадобится исходный компонент в одном файле и желание переместить его в другой файл, не затрагивая инстансы и не теряя связи с ними.

1. Вырежи этот компонент из исходного файла (Ctrl/Cmd + X) и вставь в нужный файл (Ctrl/Cmd + V).
2. Опубликуй компонент в библиотеку. В окне публикации убедись, что у компонента выбран пункт “Move to this file”.
3. В каждом файле, где используется этот компонент, нужно принять изменения из библиотеки. Вот и всё!

⚠️ Важно! Во-первых, перенос нельзя отменить. Чтобы переместить компонент обратно, нужно повторить действия в том же порядке. Во-вторых, обращай внимание на вложенные компоненты — они должны быть опубликованы в библиотеку или тоже перенесены. В-третьих, сейчас многие жалуются на сброс оверрайдов, так что осторожней с использованием этой функции в важных файлах. Возможно пока надёжнее пользоваться проверенными плагинами типа Master и DSO.

Подробная статья | Видео#новое #обучение
This media is not supported in your browser
VIEW IN TELEGRAM
В чём сила? А вот в чём — в горячих клавишах! 😉 Вставляй и заменяй компоненты не отрывая рук от клавиатуры. Нажми Shift + i, чтобы открыть новое меню компонентов. Сразу можно начать писать название нужного компонента в поиске. Дальше всё просто как в игре:

- Стрелочками на клавиатуре выбери нужный компонент. 🎮
- Нажми Enter (или кликни), чтобы вставить инстанс компонента в центр экрана или выделенного фрейма.
- Нажми Alt + Enter (или Alt + клик), чтобы заменить выделенные на рабочем пространстве инстансы на выбранный в меню компонент.

#новое #обучение https://help.figma.com/hc/en-us/articles/360039150173-Create-and-insert-component-instances#quick-insert
This media is not supported in your browser
VIEW IN TELEGRAM
Новая функция замены библиотек компонентов и стилей пригодится во многих ситуациях: обновись с более старой версии библиотеки на новую, меняй темы и переключаться между тёмным и светлым режимом, управляй инстансами из потерянных и снятых с публикации библиотек. 👑

Чтобы заменить библиотеку в файле, открой меню Libraries (Alt + 3), выбери библиотеку, которую хочешь заменить и нажми кнопку Swap Library. В выпадающем списке найди библиотеку, на которую хочешь заменить. Figma найдёт соответствия по именам компонентов и стилей для замены, тебе лишь остаётся выбрать какие из них заменить.

Полная статья со всеми подробностями: https://help.figma.com/hc/en-us/articles/4404856784663 #новое #обучение
Если ты публикуешь файлы или плагины в Figma Community, тебе понравится это обновление: в комментариях теперь можно отмечать людей! #новое

В комментариях введи @ и набирай имя пользователя, например @g. Отмеченный человек получит оповещение о комментарии по почте. Всё ради того, чтобы вопросы пользователей твоего плагина или файла не оставались без ответов!

К слову о плагинах, разработчикам доступны две новых беты: параметры плагинов и FigJam плагины. Обычные пользователи пока не могут использовать эти функции, но ты уже можешь разрабатывать плагины с ними!
This media is not supported in your browser
VIEW IN TELEGRAM
Текстовый и голосовой чат — два новых способа общаться с командой прямо в Figma, не отрываясь от работы! 📢 Их можно использовать всем людям с доступом к файлу Figma или FigJam, не только редакторам. #новое

“Курсор-чат” из FigJam теперь есть и в Figma! 💬 Это текстовый чат для мгновенного общения, сообщения в котором ты набираешь во всплывающем поле рядом со своим курсором. Нажми / и начинай писать. Пока ты пишешь и в течение пяти секунд после этого, текст возле твоего курсора будет виден всем участникам файла. Чтобы моментально закрыть ввод и удалить весь текст, кликни куда-нибудь или нажми Esc.

Спонтанные голосовые звонки прямо в Figma и FigJam файлах доступны пользователям на тарифах Professional, Education и Organization. Чтобы начать звонок или подключиться к нему, нажми иконку наушников 🎧 в верхней панели. В появившейся панели звонка можно включать и выключать свой микрофон. При необходимости уже сейчас можно использовать автоматические субтитры в Google Chrome, а скоро они появятся нативно.
В FigJam появился импорт и экспорт данных и изображений! 👀 #новое

Импортируй CSV таблицы в листки заметок. Заходи в File → Import from CSV... и выбирай файл .csv на компьютере. Каждая ячейка таблицы вставится как отдельная заметка. А из Google Sheets можно просто копировать и вставлять ячейки напрямую, без сохранения CSV. За раз можно вставить до 1500 ячеек.

Экспортируй изображения из FigJam через правый клик по выделенным объектам → Export selection... Поддерживается экспорт в JPG, PNG и PDF. В окне экспорта можно выбрать формат, цвет фона, а также экспортировать весь файл целиком. Запоминай горячие клавиши: Shift + Cmd/Ctrl + E.

Импорт изображений тоже улучшился: для вставки в FigJam теперь поддерживаются форматы изображений TIFF и WEBP, кроме уже ранее доступных PNG, JPG и GIF (пока без анимации).
This media is not supported in your browser
VIEW IN TELEGRAM
7 октября присоединяйся к первой конференции Figma посвящённой дизайн системам: Schema 2021! Здесь, в числе прочих, ты увидишь выступления команд Google, Atlassian, Lyft и Netflix. Конференция бесплатна, пройдёт онлайн, начало в 18:30 МСК. #мероприятия

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

Количество мест ограничено! Для подачи заявки, заполни форму на сайте. Ответ по ней придёт примерно через три рабочих дня. Если тебя не приняли или не получается прийти, не переживай — записи будут доступны всем.

Больше информации и регистрация → schema.figma.com
This media is not supported in your browser
VIEW IN TELEGRAM
Копирование и вставка, copy & paste — что может быть проще? 🤓 А в Figma они улучшены до неузнаваемости и сделаны более предсказуемыми! #новое

Добавлены функции вставки в несколько выбранных фреймов сразу, замены выбранных объектов и вставки в точном месте, а также исправлены множественные странности при вставке, которые бесили тебя раньше... 😆 Но обо всём по порядку! Для начала скопируй что-нибудь (Cmd/Ctrl + C).

• Обычная вставка: ты можешь заметить, что Figma лучше выбирает позицию для вставки объекта и помещает его в нужное место в слоях.

• Множественная вставка: выдели несколько фреймов и нажми Cmd/Ctrl + V чтобы вставить объект в каждый из выделенных фреймов.

• Вставка с заменой: нажми Alt + Shift + Cmd/Ctrl + V, чтобы заменить выбранный объект (или даже несколько!) на скопированный. Работает как магия!

• Вставка в точное место: команда «Paste here» в контекстном меню (правая кнопка мыши) позволяет вставить объект в точности под курсором.
Обновления шоткатов вставки! ❤️ Неделю спустя после выхода новых функций копирования и вставки, команда Figma рассмотрела ваш невероятно ценный фидбек, и основные проблемы с горячими клавишами теперь исправлены! #shortcut

• Команде вставки над выделенным объектом вернулся шоткат Shift+Cmd+V / Shift+Ctrl+V.

• Исправлен баг с вставкой текста с сохранением стиля, теперь работает привычное сочетание клавиш Ctrl/Cmd + Shift + V.

• Вставка с заменой выделенных объектов, кроме контекстного меню, теперь срабатывает по Ctrl/Cmd + Shift + Alt + V.

• Чтобы избежать конфликта горячих клавиш, на Windows распределение объектов по вертикали и горизонтали имеет более простые сочетания: Distribute Horizontal Spacing — Alt+Shift+H, Distribute Vertical Spacing — Alt+Shift+V.
This media is not supported in your browser
VIEW IN TELEGRAM
Большие обновления в бете интерактивных компонентов: Auto Layout, замена шрифтов и багфиксы! 🔥 #новое Ты ещё не в бете? Подай заявку!

Авто-лейаут теперь полностью поддерживается и будет работать в прототипе точно так же, как и при смене одного варианта на другой в редакторе. Это открывает огромные возможности по созданию взаимодействий с объектами с динамичными размерами и компоновкой. Нам не терпится увидеть, что ты создашь! 🤘

Исправлены баги с заменой недоступных шрифтов и в целом улучшена эта механика. Теперь если у зрителя в прототипе не установлен нужный для работы интерактивных компонентов шрифт, он будет автоматически заменён на Inter. Ты, как редактор, получишь напоминание о том, что шрифты с твоего компьютера могут быть недоступны для других. В прототипе при этом будет показываться значок «А?». Напомним, что на тарифе Organization можно поделиться любым шрифтом со всей организацией — он будет работать при просмотре прототипа.
Сегодня последний день, чтобы подать заявку на участие в Schema — конференции Figma посвящённой дизайн системам! ☝️ Мероприятие пройдёт онлайн в этот четверг (7 октября) c 18:30 до 00:30 по Москве. Подай заявку: schema.figma.com #мероприятия

Пользуясь случаем, приглашаем тебя в новый Telegram чат для обсуждения всего, что связано с дизайн системами: @systemschat! Там же можно будет пообщаться во время конференции и обсудить любые возникающие по ходу вопросы. Общение с другими участниками и новые знакомства — одни из самых ценных аспектов участия в конференции. 💞 #сообщество

А чтобы сделать знакомства более весёлыми, создай свою именную карточку-бейджик в этом файле и поделись ей с другими, чтобы рассказать о себе! Твори: https://figma.fun/QFbtQI и заходи в чат — ждём тебя! В соцсетях используй и следи за хештегом #Schema2021.