Навигация - это совокупность элементов и способов взаимодействия в интерфейсе Figma, позволяющих пользователю ориентироваться в структуре файла, быстро перемещаться между фреймами, страницами, компонентами и другими элементами проекта, а также контролировать масштаб и положение холста для эффективной работы.
Instance Finder позволяет находить все экземпляры компонента, используемые в вашем файле Figma. Выберите один экземпляр или компонент, и плагин выполнит поиск по всем страницам и фреймам, создавая список всех используемых экземпляров. Список разделен на страницы для удобной навигации, а клик по любому элементу приблизит его. Используйте клавиши со стрелками для перемещения между экземплярами.
Figma Walker - это новый инструмент запуска для Figma, позволяющий выполнять различные действия из одного поля ввода. С его помощью можно искать и переходить к фреймам, компонентам и страницам, вставлять компоненты из мастер-компонентов, а также создавать компоненты из выбранных узлов. Figma Walker позволяет перемещаться по проекту, не отрывая рук от клавиатуры.
Этот плагин позволяет перемещаться по Figma-документу, используя текст или пользовательские теги. Вы можете индексировать весь документ (автоматически или вручную) и быстро находить нужные элементы по текстовым фрагментам или тегам, назначенным узлам. Плагин обеспечивает мгновенную навигацию к выбранному узлу, экономя время при работе с большими проектами.
Этот кросс-платформенный, мобильный гамбургер-меню, разработанный в рамках iPhone 11 Pro, легко адаптируется под другие размеры экранов. Он включает в себя настраиваемые компоненты и функциональный прототип, позволяя открывать и закрывать меню по клику или перетаскиванием. "Stylish Hamburger Menu" - это стильное и удобное решение для навигации в мобильных приложениях, обеспечивающее компактное отображение меню на небольших экранах.
Интерактивный компонент навигационной панели, созданный с использованием атомарной методологии, обеспечивает полноценную навигацию по сайту или приложению. Компонент включает в себя различные состояния разделов и подразделов (например, "Наведение", "Нажатие", "Выбрано"), интерактивные стеки для разделов с подразделами, а также варианты стилей. Он позволяет пользователям легко перемещаться по контенту, обеспечивая интуитивно понятный и отзывчивый интерфейс.
Button - это бесплатный виджет для Figma и FigJam, позволяющий открывать веб-страницы и перемещаться по файлу одним кликом. Он идеально подходит для создания общей документации дизайна, так как теперь любой, у кого есть права только на просмотр, например, разработчики, менеджеры проектов и тестировщики, могут использовать Button для открытия ссылок и навигации по макету. Настройте ссылку на веб-страницу, выберите слои для быстрой навигации или настройте переход к текущему виду страницы.
Search & Focus - это инструмент для Figma, позволяющий быстро находить и фокусироваться на любом элементе дизайна. Благодаря автозаполнению и поиску по всем типам узлов (текст, компоненты, группы и т.д.), он упрощает навигацию по макету. Выбрав элемент из списка результатов, вы мгновенно переместитесь к нему, а сам элемент будет максимально увеличен и помещен в центр экрана для удобного просмотра. Этот плагин повышает эффективность работы, позволяя быстро находить нужные объекты и сосредотачиваться на них.
Index Page – это стартовый экран для презентаций, обеспечивающий удобную навигацию между вашими дизайнами. С помощью миниатюр и ссылок он позволяет легко перемещаться по различным макетам, которые вы демонстрируете. Просто выберите фреймы на холсте, добавьте их в Index Page и создайте интерактивное оглавление для быстрой и удобной презентации ваших работ.
Butler - плагин для Figma, который позволяет искать и вставлять локальные компоненты в текущую позицию, применять локальные стили к выбранным элементам и быстро переходить к любому узлу в документе. Для переключения между командами используйте клавишу TAB. Обратите внимание, что плагин работает только с локальными компонентами и стилями, а не с библиотечными. Пользователи больших документов могут столкнуться с увеличенным временем загрузки.
Кнопка-меню - это простой элемент интерфейса, предоставляющий пользователю выпадающий список действий или опций. Он позволяет компактно разместить множество команд, которые становятся доступными по клику на кнопку, освобождая место на экране и упрощая навигацию. Все элементы дизайна компонентизированы для удобства повторного использования.
Multi level menu. Prototype-ready! - это готовый к использованию компонент многоуровневого меню для прототипирования. Он включает в себя элементы меню, подменю, обработку событий клика для навигации и наведения мыши для раскрытия/закрытия меню. Предназначен для быстрого добавления функционального меню в ваши проекты, предоставляя базовую структуру, которую можно адаптировать и расширять. Это отличное решение для демонстрации навигации и структуры сайта в прототипах.
Этот набор элементов "Breadcrumb Variations" представляет собой коллекцию готовых решений для навигации по сайту. Он разработан, чтобы упростить добавление и настройку хлебных крошек, обеспечивая удобную и понятную структуру сайта для пользователей. Предлагается бесплатное использование в личных проектах. Этот ресурс создан с целью поддержки дизайнерского сообщества и облегчения работы над созданием пользовательских интерфейсов.
Легкий плагин для быстрой навигации по вашему проекту. Мгновенно находите и переходите к любой Странице, Фрейму, Компоненту или Слою. Благодаря разделу "Последние", вы можете быстро переключаться между 2-5 объектами, к которым переходили ранее. Используйте клавиши со стрелками и Enter для перемещения внутри проекта, не отрывая рук от клавиатуры. Запускайте плагин с помощью горячей клавиши ⌥ ⌘ P. Spotlight Search позволяет быстро находить нужные элементы в проекте, избавляя от необходимости тратить время на поиск в панели слоев.
Меню мобильной навигации, использующее иконку "гамбургер", – это компактный и удобный способ представить навигационные ссылки на веб-сайтах и в приложениях, особенно на небольших экранах мобильных устройств. Вместо отображения всех ссылок сразу, иконка "гамбургер" скрывает их за собой, освобождая место на экране и обеспечивая пользователям чистый и организованный интерфейс. При нажатии на иконку открывается выпадающее меню или боковая панель, содержащая навигационные элементы, что позволяет пользователям легко переходить по сайту или приложению.
RoadWise - это прототип мобильного приложения, созданного для помощи водителям в эффективной навигации и объезде пробок. Он позволяет оптимизировать маршруты, предоставляя актуальную информацию о дорожной ситуации, чтобы сделать поездки более быстрыми и комфортными.
16. FrameSearch
Chris Liu |
23.08.2022 |
Установок: 935 ( +2) |
Лайков: 54 | Комментариев: 10
FrameSearch - это незаменимый инструмент поиска в Figma, позволяющий быстро находить нужные фреймы, группы и экземпляры на всех страницах документа. Благодаря поддержке нечеткого поиска и навигации с помощью клавиатуры, вы можете легко перемещаться между результатами и мгновенно переходить к нужному элементу. Установите сочетание клавиш Command + F для мгновенного запуска плагина и эффективного поиска.
Плагин Navigate Multiple Siblings позволяет удобно перемещаться между однотипными экземплярами компонентов. Выберите несколько одинаковых экземпляров, войдите в один из них (нажав Enter) и используйте плагин для навигации по остальным, как по соседним элементам. Это особенно полезно при работе с множеством одинаковых элементов дизайна, облегчая их редактирование и поддержание единообразия.
Плагин Design System Collection помогает быстро находить подходящие дизайн-системы в Figma Community, фильтруя их по назначению, платформе и поддержке светлой/темной темы. Просто запустите плагин, введите название бренда или цель использования в поисковой строке, или примените фильтры для уточнения результатов. Найдя подходящую систему, вы сразу перейдете к ней в Figma Community. Сейчас это концепт, поэтому приветствуются отзывы и сообщения об ошибках.
Создавайте прямые ссылки на конкретные элементы в ваших файлах Figma без перезагрузки страницы. Просто скопируйте ссылку на элемент из Figma, вставьте её в плагин и мгновенно переходите к нужному слою или фрейму. Это ускоряет навигацию по сложным файлам и упрощает совместную работу, позволяя делиться точными указаниями, где именно нужно внести изменения или посмотреть детали дизайна.
Views - это плагин, позволяющий сохранять и организовывать важные части вашего файла, запоминая положение и масштаб. Он дает возможность быстро переключаться между сохраненными видами, группировать их по категориям или членам команды, а также создавать презентации с плавными переходами и возможностью скрыть ненужные виды. Views упрощает навигацию по большим файлам и позволяет эффектно демонстрировать работу коллегам и клиентам.
Ищите слои по имени прямо из панели быстрых действий, выбрав нужные слои или на всей странице. Просто выделите слои, запустите панель быстрых действий, введите имя слоя и нажмите Enter. fSearch позволяет быстро находить нужные слои, не тратя время на просмотр всей структуры документа. Если ничего не выбрано, поиск будет осуществлен по всей странице.
Этот небольшой плагин позволяет захватывать любое количество фреймов и генерировать удобный список для навигации по вашему проекту или компонентам. Вы можете выбирать отдельные элементы или сразу несколько, настраивать цвет шрифта и фона списка. Плагин позволяет включать префикс страницы в ссылки или нет, а также создавать новую страницу с результатами. "Create Links" создан для быстрой генерации ссылок и организации видов или потоков в специальной области навигации проекта, что особенно полезно в средних и крупных проектах.
NB Tree - это мощный и гибкий компонент для создания древовидных меню с возможностью добавления чекбоксов к каждому узлу. Он идеально подходит для представления иерархических данных, позволяя пользователям выбирать один или несколько элементов из дерева. С его помощью можно легко создавать интерфейсы для навигации, выбора категорий, управления файлами и другими задачами, где требуется древовидная структура с возможностью выбора.
Плагин "Catalog" позволяет создавать удобную навигацию по вашим скриптам и макетам в Figma. Он автоматически формирует каталог разделов, нумерует их и фреймы, упрощая поиск и перемещение между нужными частями проекта. С его помощью легко отслеживать даты, статусы задач и ответственных дизайнеров, а также быстро ориентироваться в структуре проекта благодаря иерархии заголовков H1, H2, H3.
Функция "Nav To" позволяет быстро переходить к нужному компоненту или фрейму в проекте. С её помощью можно мгновенно находить и открывать конкретные элементы дизайна, экономя время и упрощая навигацию по сложным макетам. "Nav To" особенно полезна при работе с большими проектами, где ручной поиск нужного элемента может быть затруднительным.
Navboo! - это бесплатный Figma-плагин, который упрощает создание навигационных панелей. Он предлагает разнообразные готовые шаблоны с автоматической разметкой (Auto Layout), что позволяет легко настраивать внешний вид, выбирать количество элементов меню (от 1 до 10) и обеспечивать адаптивность для различных устройств. С Navboo! создание навигации становится быстрым, удобным и не требует дополнительных затрат.
Виджет "Table of Contents" для Figma позволяет визуализировать страницы файла в виде карточек, что идеально подходит для создания индексной страницы или руководства по файлу для команды. Он отображает статусы страниц, описания и даже иконки на основе эмодзи в названиях страниц. Разделители между списками страниц создаются автоматически на основе названий страниц без буквенных символов. С помощью этого виджета легко создать наглядную и структурированную навигацию по вашему Figma-файлу.
Открывайте ссылки Figma (дизайн, прототипы, сообщество, режим разработчика, слайды, FigJam) прямо в десктопном приложении, минуя браузер. Больше не нужно переключаться между приложениями, чтобы посмотреть дизайн или прототип!
indexly - это плагин для Figma, автоматически создающий интерактивное оглавление для ваших файлов. Он упрощает навигацию по большим и сложным проектам, таким как дизайн-системы, генерируя структурированный список страниц, разделов и фреймов. indexly экономит время, улучшает командную работу и профессионализирует ваши файлы Figma.
Jumpback позволяет быстро возвращаться к ранее сохраненной позиции в файле Figma. Сохраните текущее местоположение одним кликом, помогите коллеге или просмотрите другую часть файла, а затем мгновенно вернитесь к работе над исходным экраном. Больше не нужно тратить время на поиск, где вы остановились – "Jumpback" сохранит и вернет вас туда, где вы были.
Если вы теряетесь в десятках или сотнях экранов, панель "Индекс" поможет вам сориентироваться! Она предоставляет структурированный обзор всех экранов, позволяя быстро находить нужный и переключаться между ними. Бесплатные пользователи могут просматривать до 10 строк, в то время как для платных пользователей количество строк не ограничено.
Bookmarks позволяет сохранять любые слои в список закладок, похожий на список в браузере. Быстро переходите к сохраненным слоям и сохраняйте новые элементы по мере необходимости.
Figma Teleporter добавляет кнопки "Назад" и "Вперед" для навигации по ранее выбранным элементам в Figma и FigJam, как в браузере. "Предыдущий" и "Следующий" позволяют быстро перемещаться между элементами проекта на разных страницах, избавляя от бесконечной прокрутки и помогая сосредоточиться на дизайне.
34. Tree Navigator – Select similar layers
Kai Magnus Müller |
09.07.2024 |
Установок: 118 ( +5) |
Лайков: 21 ( +1) | Комментариев: 2
Tree Navigator значительно упрощает навигацию по повторяющимся элементам, таким как списки или таблицы. Просто выберите несколько элементов, и плагин предложит варианты выбора аналогичных слоев в разных областях – от отдельных столбцов до всей таблицы. Это позволяет быстро выделять нужные элементы, избегая утомительного ручного выбора и упрощая работу со сложными структурами.
Этот плагин позволяет быстро перемещаться к определенным узлам в вашем файле Figma, используя внешние ссылки на дизайн. Просто вставьте ссылку на узел, и плагин проверит, относится ли она к текущему файлу, существует ли узел, и, если да, выберет и сфокусируется на нем. Это устраняет необходимость открывать дополнительные вкладки или окна дизайна для поиска нужных элементов, и отображает понятные сообщения об ошибках, если узел не найден или ссылка неверна.
Video Finder - это удобный инструмент для быстрого поиска всех видео, встроенных в ваши файлы Figma. Он позволяет легко находить и управлять видеоконтентом, не тратя время на ручной поиск по многочисленным страницам и слоям в проекте. Идеально подходит для оптимизации рабочих процессов и поддержания порядка в ваших дизайн-макетах.
Reorder Pages позволяет упорядочивать страницы по алфавиту внутри групп, разделенных символом "★". Это особенно полезно для файлов или библиотек компонентов, где необходимо организовать страницы, сохраняя определенные группы. Для этого необходимо назвать страницу, начинающуюся со значка "★", а затем перечислить страницы, принадлежащие этой группе. Такой подход помогает поддерживать порядок и облегчает навигацию по большому количеству страниц, обеспечивая логичную структуру контента.
Group Counter создает выпадающее меню со списком всех групп в документе Figma. Если в документе есть группы с одинаковыми именами, рядом с именем каждой группы отображается число, указывающее количество групп с таким именем. Это упрощает навигацию и идентификацию групп, особенно в сложных проектах с большим количеством элементов, имеющих одинаковые названия.