15994
У Figma нет официальных сообществ и каналов на русском, поэтому своими силами рассказываю обо всех новостях подробно и без мусора ❤️ Вопросы задавай в Фигма-чат: @figmachat Группа ВК: https://vk.com/figmadesign
🆕 Свойства компонентов: не только ещё одна возможность приблизить макеты к реализации в коде, но и упрощение одновременно и для стандартизации, и для кастомизации компонентов! 🤯 #новое
Текст, видимость слоёв и готовые оверрайды в компонентах можно выносить в правую панель для быстрого доступа в инстансах. Лучший способ примерить обновку — попрактиковаться и поиграться в обучающем файле-песочнице: https://www.figma.com/community/file/1100581138025393004
🆕 Отдельная обводка с разных сторон — больше не нужны хаки с линиями или тенями, можно добавлять разную обводку только на отдельные стороны объекта. #новое https://help.figma.com/hc/en-us/articles/360049283914-Apply-and-adjust-stroke-properties#individual
Читать полностью…
🆕 Auto Layout V4 уже тут! Новинки: абсолютное позиционирование (нулевые фреймы больше не нужны 🔥), выбор стандартного и обратного порядка слоёв, выравнивание текстов по базовой линии, отрицательные отступы между элементами, настройка для включения обводки в размер фрейма (аналогично box-sizing в CSS) и управление спейсингом прямо на холсте. #новое Видео про обновление: https://youtu.be/floQKLsWAy4
😍 Личная рекомендация: используй плагин Pro Layout Panel (уже обновлён для поддержки всех новых фич) — в отличие от нативного интерфейса, он позволяет управлять всеми настройками авто лейаута за один клик! Быстрее не бывает! 🏃♀️ https://figma.fun/alpro
Config 24 часа: 10-11 мая пройдёт ежегодная конференция Figma! Целые сутки выступлений от 100+ (!!) интересных спикеров и команды Figma! Начало в 18:00 МСК.
Традиционно Дилан Филд откроет конференцию презентацией новых ооочень долгожданных фич! Регистрируйся и не пропусти: https://config.figma.com/. Записи всех выступлений будут доступны через неделю после конференции. #config
🆕 Figma наконец-то поддерживает письмо справа налево нативно! #новое Письмо справа налево используется в арабском, иврите, персидском, урду и синдхи и многих других языках. Направление письма Figma определяет автоматически, но при необходимости можно его переключить в панели Type Details. В одном текстовом блоке может использоваться текст и слева направо и справа налево. (Обновление вышло на прошлой неделе.)
Читать полностью…
FigJam вышел из beta и стал платным: давай разберёмся, что это значит! #новое 🤑 Если коротко, то несмотря на то, что FigJam и Figma существуют в одном пространстве, оплачиваются они независимо друг от друга. При этом все платные и бесплатные особенности Figma работают точно также и в FigJam. И если твоя команда не пользуется FigJam совместно, для тебя ничего не поменяется.
Использование FigJam в Starter командах с бесконечным числом редакторов и в личных Drafts бесплатно с теми же ограничениями, как и для Figma. В Professional, Organization и (новом) Enterprise тарифах оплата подобно Figma происходит за каждого редактора FigJam.
Редакторы FigJam не зависят от редакторов Figma, то есть если один участник команды имеет доступ к редактированию только Figma файлов, то оплата за FigJam за него списываться не будет, и наоборот. А если член команды имеет доступ к редактированию в обоих инструментах, будет необходимо платить и за Figma, и за FigJam. Всем этим можно управлять в настройках команды.
Подробнее про тарифы на FigJam: https://www.figma.com/pricing/#figjam-for-whiteboarding
Больше маленьких нововведений и оптимизаций, которые сильно улучшат твою работу в Figma и FigJam! #новое Полный список:
1. Поддерживается вставка фото с iPhone в формате HEIC
2. Отзывчивость ввода: больше не будет задержек при наборе текста
3. Поддерживается ввод альтернативных символов на macOS (при долгом нажатии буквы)
4. Стиль списка не будет меняться при изменении отдельных строк
5. Кнопки Home/End (fn + ←→) перемещают каретку в начало/конец текста
6. Больше нет промежуточного экрана «Leaving Figma» при открытии ссылок
7. Векторные сегменты одного объекта поддерживают заливки разных цветов 🎨
8. Переименовывай любые слои через Cmd/Ctrl + R при выключенном UI (Cmd/Ctrl + \)
9. Скоро скриншоты с Retina перестанут вставляться увеличенными в два раза
10. Deep Select (Cmd/Ctrl + клик) помогает быстро выбрать основной фрейм, раньше это было возможно сделать только кликом по его имени
11. Меню быстрой вставки компонентов (Shift + i) позволяет искать компоненты только по одной библиотеке, а не всем сразу
12. Быстро публикуй выбранные компоненты через контекстное меню или правую панель
13. Поиск в меню публикации библиотеки 🔥
14. Чёрные иконки для библиотек в файловом менеджере (синие для обычных файлов)
15. Быстрый переход к наборам вариантов с конфликтующими значениями из меню публикации библиотеки
16. Команда «Remove from library» в контекстном меню в панели Assets переименована в «Hide when publishing»
17. Кнопка «Return to instance» больше не прячется при выделении внутренних слоёв компонента
18. Быстро открывай библиотеки из настроек в Figma Organization
19. Корректный экспорт обводки основного фрейма в SVG. Ты ещё читаешь?
20. Более гибкое изменение размера шейпов в FigJam
21. Копируй ссылку на любой объект в FigJam
22. Красный теперь красный, а не оранжевый
23. Улучшена видимость выделения текста на синем фоне
24. Hide/Show UI и Unlock all objects опции добавлены в меню Quick Actions в FigJam
25. Больше горячих клавиш показываются при наведении на инструменты в FigJam
26. Нажимай Enter для перехода на новую строку в коннекторах
27. Объекты в FigJam выравниваются по сетке во время перемещения и изменения размера 😍
28. Встроенные библиотеки FigJam показываются в списке ниже твоих командных
С картинками: https://figma.fun/0KOIV6
Хочешь пользоваться Figma и FigJam на iPad? Присоединяйся к только что обновлённой бета версии приложения Figma для iPad! #новое 🍎 Пока оно доступно только для ограниченного списка моделей iPad.
Подробности в форме для заявки на бету: https://forms.gle/4ShGopLrYGhFqLDy6
Новое мобильное приложение Figma вышло из Beta и доступно для использования всем! #новое Если у тебя было установлено приложение Figma Mirror, просто запускай обновлённую версию, а если нет, устанавливай:
🍎 iOS → https://apps.apple.com/app/figma-mirror/id1152747299
🤖 Android → https://play.google.com/store/apps/details?id=com.figma.mirror
Кроме функции Figma Mirror, которая осталась в приложении, теперь можно просматривать и делиться любыми файлами и прототипами. Все команды, проекты и файлы в знакомом тебе интерфейсе, как на компьютере. При запуске прототипа доступны привычные настройки, такие как подсвечивание интерактивных элементов (hotspots), flows и другие. Отдельная бета версия приложения для ограниченного числа пользователей пока будет доступна и дальше для тестирования следующих обновлений.
Кроме всего этого, появился совершенно новый вид комментариев: зажми и тяни курсор при создании комментария, чтобы начать обсуждение не отдельной точки или элемента на холсте, а целой области выделения! Особенно удобно для комментирования групп объектов в FigJam. #новое
Comment Tool (клавиша C) по-прежнему открывает обзор всех комментариев в правой панели, но тоже с улучшениями: сортируй комментарии по дате или используй поиск по имени или ключевым словам, чтобы быстро найти нужную беседу! 🔍 Также в этом поможет кластеризация: отдельные находящиеся рядом цепочки будут отображаться объединёнными в один пин при отдалении.
Для людей с доступом только на просмотр комментарии тоже не остались без внимания! В правой панели появилась вкладка Comments, что более доступно и понятно для людей, кто не так хорошо разбирается в Figma, как ты. 😋
Ждём тебя на первом русскоязычном стриме Figma 17 ноября 2021, 14:00 по Москве. На нём ты узнаешь как Ozon объединяли ранее независимые дизайн-системы в одну большую централизованную дизайн-систему — сложнейшая задача, которая потребовала полгода работы сборной команды! 🤯 #мероприятия
Регистрация бесплатная: https://figma.zoom.us/webinar/register/WN_9baPxk_nRjKUDb2Znw6dRg?timezone_id=Europe%2FMoscow — обязательно приходи в среду и рассказывай друзьям, от активности сообщества зависит, будут ли в дальнейшем проходить такие мероприятия от Figma на русском! 🇷🇺
Функция Branching (ветвление на русском) недавно вышла из беты и доступна всем на тарифе Figma Organization! 🧠 #новое Создавай временные ветки (branch) — зависимые дубликаты файла и работай в них, а потом при необходимости переноси изменения (merge) в исходный файл.
В командной работе это может использоваться для упрощения внесения изменений в дизайн систему (теперь любой человек в организации может это делать без особого труда ✨), организации тестирования на пользователях и «заморозке» определённой версии файла для разработчиков. Развивай культуру открытого дизайна в масштабах!
Об о всём этом в подробностях ты можешь узнать на вебинаре, который пройдёт завтра в 20:00 по Москве — записывайся: https://figma.zoom.us/webinar/register/WN_D42tcJ9RQJuWz6xZZNZe4Q?timezone_id=Europe%2FMoscow 👀 #мероприятия
Сегодня последний день, чтобы подать заявку на участие в Schema — конференции Figma посвящённой дизайн системам! ☝️ Мероприятие пройдёт онлайн в этот четверг (7 октября) c 18:30 до 00:30 по Москве. Подай заявку: schema.figma.com #мероприятия
Пользуясь случаем, приглашаем тебя в новый Telegram чат для обсуждения всего, что связано с дизайн системами: @systemschat! Там же можно будет пообщаться во время конференции и обсудить любые возникающие по ходу вопросы. Общение с другими участниками и новые знакомства — одни из самых ценных аспектов участия в конференции. 💞 #сообщество
А чтобы сделать знакомства более весёлыми, создай свою именную карточку-бейджик в этом файле и поделись ей с другими, чтобы рассказать о себе! Твори: https://figma.fun/QFbtQI и заходи в чат — ждём тебя! В соцсетях используй и следи за хештегом #Schema2021.
Обновления шоткатов вставки! ❤️ Неделю спустя после выхода новых функций копирования и вставки, команда 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.
7 октября присоединяйся к первой конференции Figma посвящённой дизайн системам: Schema 2021! Здесь, в числе прочих, ты увидишь выступления команд Google, Atlassian, Lyft и Netflix. Конференция бесплатна, пройдёт онлайн, начало в 18:30 МСК. #мероприятия
На Schema ты получишь практические советы по созданию и внедрению дизайн систем любых размеров, оценке их рентабельности, а также улучшению рабочих процессов с помощью плагинов. Schema для тебя, если ты руководишь дизайн системами или design ops в организации, а также разрабатываешь новые или масштабируешь внедрение существующих дизайн систем.
Количество мест ограничено! Для подачи заявки, заполни форму на сайте. Ответ по ней придёт примерно через три рабочих дня. Если тебя не приняли или не получается прийти, не переживай — записи будут доступны всем.
Больше информации и регистрация → schema.figma.com
🆕 Новый тип анимации перехода: Spring! Для более естественных или просто весёлых движений. 😎 #новое Доступно несколько пресетов или можно настроить совершенно кастомную функцию движения. Вместе с этим немного поменялась сама панель анимации — перезагружай Figma и пробуй!
https://www.figma.com/community/file/1100581821937139565
🆕 Поддержка вариативных шрифтов! #новое Устанавливай любимые шрифты поддерживающие эту функцию, открывай панель Type Details и получи доступ к тонкой настройке шрифта: https://help.figma.com/hc/en-us/articles/5579502031511-Use-variable-fonts
Читать полностью…
Ох, так не терпится рассказать вам сегодня про все обновления! Будет круто, не пропусти трансляцию, регистрируйся: https://config.figma.com/
Начало в 18:00 по Москве сегодня! #config
🆕 Новые более удобные и мультиплатформенные сочетания клавиш для часто используемых команд:
1. Вставить и заменить выделенные объекты: Cmd+Shift+R или Ctrl+Shift+R
2. Режим аутлайнов (Outlines), также известный как «помогите я что-то нажал и всё стало вот так, отмена не помогает»: Shift+O
3. Показать/скрыть сетки: Shift+G
4. Показать/скрыть пиксельную сетку: Shift+’ (Shift+Э)
5. Режим растрового предпросмотра (Pixel Preview): Cmd+Shift+P или Ctrl+Shift+P
6. Подняться на уровень выше: \ (обратный слеш или Ё в русской раскладке), альтернатива Shift + Enter
Старые сочетания клавиш для этих команд продолжают поддерживаться. #новое Также напоминаю, что все горячие клавиши и команды без них можно найти в меню поиска Cmd/Ctrl + /
🆕 Нижний и верхний индекс (subscript и superscript) теперь поддерживается для всех шрифтов и символов, а не только редких шрифтов, у которых есть OpenType фича для этого. Как и раньше, кнопки для включения индексов находятся в панели Type Details. #новое
Figma будет продолжать стараться использовать «типографически правильные» символы при условии, что в тексте используются только поддерживаемые шрифтом символы. Если же введены символы, уменьшенных версий которых нет в шрифте, будет использоваться искусственный верхний или нижний индекс: обычные символы уменьшаются и перемещаются к низу или верху строки. (Обновление вышло пару недель назад.)
Присоединяйся завтра к вебинару «Figma like the Pros» в 20:00 по Москве! 😎 Узнай полезные советы по работе в Figma из первых рук — от людей, которые её создают и знают вдоль и поперёк. Передача макетов разработчикам, малоизвестные сочетания клавиш, создание сложных прототипов и другие интересные темы ждут тебя! #мероприятия
👉 Регистрация обязательна: https://figma.zoom.us/webinar/register/WN_38Zj7sEMRFG3nG2_tcp-xA?timezone_id=Europe%2FMoscow
У Figma открылся свой магазин, где можно купить мерч! Пока покупки доступны только в США, Великобритании и Канаде, но скоро планируется расширение до других стран. Ты обязательно узнаешь, когда список расширится до России! 😍
Вся прибыль с покупок мерча будет пожертвована в фонд TIST, который поддерживает фермеров из Кении, Уганды и Танзании в развитии и выращивании деревьев с целью снижения эффектов изменения климата. 🌱
👉 https://store.figma.com/
Скопировать ссылку на выбранный фрейм или страницу в приложении теперь можно шорткатом: Cmd + L (Mac) или Ctrl + L (Win). Делиться файлами с коллегами стало ещё быстрее! #shortcut
Читать полностью…
Запись выступления Саши Окунева из Ozon на первом русскоязычном стриме Figma уже доступна для просмотра! #мероприятия ⭐️ Спасибо всем, кто пришёл — было больше 500 человек, а это значит, что в дальнейшем будет больше стримов от Figma на русском. 🇷🇺
Интереснейший доклад о том, как проводилось слияние дизайн систем в Figma! И в целом отличное погружение в дизайн системы, которое будет интересно как тем, кто уже активно работает над дизайн системой, так и тем, кто только задумывается об этом.
Смотри видео: youtu.be/SunT0K5ULH4 и забирай файл презентации: https://figma.fun/qxp2NF ❤️
Ждали обновлённые комментарии с реакциями, поиском и возможностью смотреть их не отвлекаясь от рабочего процесса? 💬 В ближайшие недели они станут доступны всем! #новое
Комментарии больше не спрятаны в отдельный инструмент, а по умолчанию видны всегда! Скрыть и показать их можно через сочетание Shift + C, меню настроек в правом углу (где зум) или правый клик на холсте.
Больше контекста: пины показывают аватарки участников беседы, а при наведении превью и дату первого комментария. 🔥 При открытии цепочки для ускоренного общения используй реакции (как стикеры в FigJam). И подсказка для профи: Shift + Enter создаёт новый абзац; Enter отправляет сообщение.
Закрепляй комментарии сбоку окна Figma кнопкой Dock to Side (или просто перетаскивай окно с обсуждением в любое место) — это поможет сосредоточиться на работе, и при этом читать или участвовать в дискуссии. Больше не надо переключаться на мессенджеры для общения с командой и клиентами! ✨ А гуру продуктивности могут использовать комментарии для своих заметок.
Открылось ещё чуть больше мест в бете нового мобильного приложения для iOS! Устанавливай, пока есть возможность, и не стесняйся делиться фидбеком с разработчиками: https://testflight.apple.com/join/CPAWjfzd ❤️
В Android версии новых мест нет пока, но можешь следить за этой страничкой: https://play.google.com/apps/testing/com.figma.figma
Новое мобильное приложение не только заменяет Figma Mirror, но и позволяет просматривать файлы и прототипы в твоём аккаунте на полный экран, без необходимости открывать их на компьютере или по ссылке в браузере. ✨ #новое
Ура! Интерактивные компоненты вышли из беты и доступны для всех! 🎉 Interactive components — это возможность создавать переходы между компонентами (вариантами), что открывает совершенно новые горизонты для создания и упрощения интерактивных прототипов. 💙 Меняй состояния кнопок, создавай анимации наведения на карточки, удаления элементов списка и прорабатывай другие сложные взаимодействия с отдельными элементами внутри экрана! #новое
Чтобы настроить самый простой интерактивный компонент, создай два компонента и объедини их в варианты (Combine as variants). Затем зайди во вкладку Prototype (используя новый шоткат Shift + E) и протяни связь от одного варианта к другому. Готово! Теперь инстансы этого вариативного компонента интерактивны — добавь их на экран и запускай режим просмотра прототипа для теста. #обучение
Изучи интерактивные компоненты в деталях с этим файлом: https://www.figma.com/community/file/1033456279024883078
Большие обновления в бете интерактивных компонентов: Auto Layout, замена шрифтов и багфиксы! 🔥 #новое Ты ещё не в бете? Подай заявку!
Авто-лейаут теперь полностью поддерживается и будет работать в прототипе точно так же, как и при смене одного варианта на другой в редакторе. Это открывает огромные возможности по созданию взаимодействий с объектами с динамичными размерами и компоновкой. Нам не терпится увидеть, что ты создашь! 🤘
Исправлены баги с заменой недоступных шрифтов и в целом улучшена эта механика. Теперь если у зрителя в прототипе не установлен нужный для работы интерактивных компонентов шрифт, он будет автоматически заменён на Inter. Ты, как редактор, получишь напоминание о том, что шрифты с твоего компьютера могут быть недоступны для других. В прототипе при этом будет показываться значок «А?». Напомним, что на тарифе Organization можно поделиться любым шрифтом со всей организацией — он будет работать при просмотре прототипа.
Копирование и вставка, copy & paste — что может быть проще? 🤓 А в Figma они улучшены до неузнаваемости и сделаны более предсказуемыми! #новое
Добавлены функции вставки в несколько выбранных фреймов сразу, замены выбранных объектов и вставки в точном месте, а также исправлены множественные странности при вставке, которые бесили тебя раньше... 😆 Но обо всём по порядку! Для начала скопируй что-нибудь (Cmd/Ctrl + C).
• Обычная вставка: ты можешь заметить, что Figma лучше выбирает позицию для вставки объекта и помещает его в нужное место в слоях.
• Множественная вставка: выдели несколько фреймов и нажми Cmd/Ctrl + V чтобы вставить объект в каждый из выделенных фреймов.
• Вставка с заменой: нажми Alt + Shift + Cmd/Ctrl + V, чтобы заменить выбранный объект (или даже несколько!) на скопированный. Работает как магия!
• Вставка в точное место: команда «Paste here» в контекстном меню (правая кнопка мыши) позволяет вставить объект в точности под курсором.
В 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 (пока без анимации).