Как поделиться ссылкой в фигме
Просмотр в фигме: режим презентации в Figma и ссылка на проект
В этом видео поговорим о том как делать предварительный просмотр в фигме. Разберемся с режимом презентации и как поделиться ссылкой на ваш проект с заказчиком или любым другим человеком.
Как отправить ссылку на проект в фигма
Чтобы поделиться ссылкой на ваш проект в фигме и отправить его вашему заказчику, коллеге или любому другому человеку нажмите на кнопку «Share» в верхнем правом углу. Затем на надпись «Copy link».
Если эту ссылку открыть в браузере, то можно будет увидеть, ваш курсор и что вы делаете в реальном времени.
Вы будете видеть аватарки тех, кто просматривает ваш проект сверху и справа. Если нажмёте на какую-то аватарку, то будете видеть курсор и действия этого человека.
Как это можно использовать? Например таким можно обсуждать с заказчиком проект и в реальном времени вносить правки.
Как изменить роль приглашенного человека в проекте в фигме?
Если вы пригласили какого-то человека или поделились с ним ссылкой на проект, то можно изменить его роль. Нажмите на синию кнопку «Share», сверху и справа. Затем напротив нужного человека из списка справа выберите одну из следующих ролей:
Режим предварительного просмотра в фигме
Чтобы включить режим предварительного просмотра в фигме, нажмите на иконку «Present» сверху справа (она похожа на Play). У вас откроется новая вкладка, где вы сможете просматривать фреймы, которые есть в вашем проекте.
Если до этого в режиме прототипирования (Prototype) вы настроили связи между фреймами и элементами интерфейса, то можно просматривать проект, как интерактивный, кликабельный прототип.
Например при нажатии на кнопку можно сделать всплывающие окна (popup формы), перенаправлять человека к другому фрейму, сделать поля в контактных формах активными и т.д.
Другими словами можно создать ощущение реального просмотра сайта или мобильного приложения с возможностью кликать и взаимодействовать с разными элементами интерфейса.
Как поделиться ссылкой на прототип в фигме?
Если вы находитесь в режиме «Present», то можете поделиться ссылкой на ваш прототип. Для этого нажмите на правую верхнюю кнопку «Share prototype» и в появившемся окне нажмите на надпись «Copy link».
При открытии скопированной ссылки в браузере, можно просматривать прототип в режиме презентации.
Внизу по центру можно переключаться между фреймами, с помощью стрелок слево и вправо.
Как в фигме (в режиме просмотра) изменить отображаемое устройство?
Если вы хотите изменить отображаемое устройство в режиме предварительного просмотра «Present», то выберите фрейм. Перейдите во вкладку «Prototype» и нажмите на кнопку «Show prototype settings».
Затем внизу надписи «Device» выберите подходящее устройство из списка. Для примера я выберу фрейм с мобильным приложением и из списка выберу «Iphone 11 pro max».
Если открою предварительный просмотр в фигме и перейду в режим презентации, то фрейм будет отображаться в мобильном устройстве.
Заключение
Итак, в этом видео вы узнали как делать предварительный просмотр проекта в фигме. Также, как демонстрировать вашу работу заказчику или любому человеку скопировав ссылку на проект.
Как передать файл Figma для редактирования, если в меню нет Can Edit
Прохожу я значит большой курс по UX дизайну. Работаем естественно в Figma. И все выполненные задания мы должны отправлять на проверку куратору. Одно из требований школы это то, что файл Figma должен быть сразу доступен проверяющему для редактирования.
Я вроде как работаю в Фигме не первый год, знаю эту программу отлично, файлами тоже делиться умею, делала это неоднократно. Но каково же было мое удивление, что я не смогла найти этот переключатель сразу. И первое выполненное задание пришлось отправить на проверку только в режиме просмотра (can view).
Естественно в ответе от куратора я получила видеоинструкцию для чайников, как включается опция Сan Edit.
Но черт побери, я же не чайник и не тупица 🥴 Там где у куратора есть, у меня почему-то нет. Смотрите на анимации ⇓
По приглашению выбрать можно, а для всех нельзя
Так же быть не может. Пришлось разбираться.
Кстати, когда куратор уже зашел в файл и появился в списке пользователей с ограниченным доступом, тогда я смогла сменить ему статус на Can Edit. Но для моей учебы такой вариант не подходил, потому что возможность редактирования нужна сразу, а не когда я одобрю 😎
Как поделиться файлом Figma с возможностью редактирования
Оказывается проблема заключалась в том, что я слишком организованная 😄
Вообще в Фигме у меня полный порядок. Все файлы разделены на разделы и категории. Зная, что мне предстоит большой тренинг не на один месяц, я сразу создала отдельный раздел для школы. Естественно все домашние задания я собиралась сохранять в категории Спринты. А категория Work Files предназначалась для рабочих файлов, которые выдавали нам на обучении.
Теперь решения
Оказалось, чтобы поделиться файлом Фигма с возможностью редактирования для всех, а не только для индивидуально приглашенных, проект должен находиться в разделе Drafts. То есть в черновиках. Да, я тоже в шоке, попробуй догадайся.
Решение 1
Просто перенесите ваш проект в черновик и тогда сможете выбрать Can Edit.
Так должно получиться
Похоже придется все файлы с домашними заданиями хранить в черновиках в перемешку с реальными моими черновиками ☹️
Предполагаю что генерировать ссылку редактора, которая будет доступна всем, нельзя, потому что за дополнительных редакторов Фигма берет оплату. На бесплатном тарифе в команде может быть не более 2-х человек с правами редактирования. Поэтому генерировать такую общую ссылку не разумно, ведь она может попасть в свободный доступ.
Вот уж точно, век живи, век учись.
Дополнение…
Оказалось, что способ помогает не всем, стали копать дальше…
Если не сработал первый вариант, создайте новый пустой файл в разделе Drafts и проверьте, как у него обстоят дела с Share, можно ли им поделиться с возможностью редактирования. Попробуйте попереносить этот пустой файл по разным разделам вашей учетной записи и посмотрите, измениться ли что-нибудь.
Если нет, то скорее всего у вас самый сложный случай, с которым вы могли столкнуться. Какой-то косяк, связанный с учетной записью и регистрацией. Это когда вообще на аккаунте шеринг и правки получается дать только членам команды и приглашенным. Кому угодно по ссылке – дать такой доступ не получается.
Я стала свидетелем двух таких случаев за последний месяц. Поддержка фигмы ответила, что не знают, в чем может быть проблема. Опытным путем мы выяснили, что срабатывает только один вариант. Такой:
Решение 2
Выйдите из своей учетной записи и зайдите под другой. Например, если регистрировались через почту, зайдите с помощью Google и наоборот.
Протестируйте новый аккаунт. Там все расшаривается как надо? Ну тогда перенесите ваш проект из одного аккаунта в другой. Других вариантов нет. Успокаивает то, что эта болезнь новых, недавно созданных аккаунтов (на старых пока не встречалась). А значит сменить учетную запись не большая проблема, пока проектов мало.
UX/UI Веб-дизайнер. Занимаюсь дизайном и разработкой сайтов для бизнеса более 6 лет. Связаться со мной можно через страницу Контакты
Как открыть ссылку Figma в приложении?
Как поделиться ссылкой на Фигму?
В режиме предпросмотра нажать кнопку Поделиться прототипом/Share Prototype. Выбрать настройки шаринга: Anyone with the link – can view. Нажать на кнопку Copy link – появится снизу сообщение что ссылка скопирована. Эту ссылку отправляете клиенту.
Как отправить файл Фигма?
Чтобы поделиться файлом, нужно нажать на синюю кнопку Share сверху справа, откроется окно настроек Share, где вы сможете:
Как открыть файл Figma в браузере?
Как вставить ссылку в текст Фигма?
Как сделать ссылку в Figma в тексте
Чтобы добавить кликабельную ссылку в текст в Figma, выделите нужный фрагмент текста и нажмите на пиктограмму ссылки сверху. После этого вставьте ссылку на нужный сайт. Если нажать на созданную ссылку, то появится возможность перейти по ней.
Как сделать ссылку на страницу в Фигме?
Как поставить ссылку
Как открыть ссылку в Фигме?
Как открыть любую ссылку Фигмы через десктопный клиент
Как скопировать проект в Фигме?
Копирование фрейма Figma из одного проекта в другой осуществляется элементарным ctrl+c / ctrl + v (command + c / command +v). 1. Скопируйте фрейм во вкладке исходного проекта, выделив его и нажав ctrl+c / ctrl + v (command + c / command +v).
Что можно создавать в Фигме?
В Фигме можно отрисовать элементы интерфейса, создать интерактивный прототип сайта и приложения, иллюстрации, векторную графику. Многие дизайнеры делают в ней макеты сайтов для Тильды. Если вы хотите более гибко работать с интерфейсной графикой, можно отрисовать макет в Фигме и перенести в Тильду.
Как открыть файл в Фигма?
Выделяем нужное изображение, открываем вкладку «Design», далее панель «Export». Тут можно выбрать размер, формат файла (PNG, JPG, SVG, PDF) и сохранить файл или несколько файлов в разных форматах, что удобно для вёрстки под ретину. Если выбрать несколько объектов, то они все сохранятся по отдельности, в одном архиве.
Как открыть файл формата FIG?
fig представляет собой файл изображения Xfig. Просмотр и обработка векторного изображения в формате FIG возможна с помощью следующих программ: WinFIG, jfig, Xfig, Transfig. Также перечисленные программы могут конвертировать изображения, картинки и рисунки данного формата.
Как сделать кнопку в Фигме?
Вот как это работает: Чтобы сделать такую кнопку, наберите текст кнопки и нажмите Shift + A, чтобы превратить его в автолейаут. Также текст можно обернуть во фрейм и в панели свойств нажать на иконку «+» в блоке Auto Layout. Фигма обернёт текст в автолейаут и задаст внутри него отступы по умолчанию.
Можно ли вставить Гифку в Фигму?
Плагин GIF экспортирует гифку из фрейма. Плагин Gifs позволяет вставить в Фигму смешную гифку.
Как вставить ссылку в pdf файл?
Ссылка на вложенный файл
Ссылки в фигме: как сделать кликабельные гиперссылки.
Если вам потребовалось вставить кликабельные ссылки в фигме, то вот простая и пошаговая инструкция на 1 минуту. Вы узнаете как быстро и легко сделать гиперсссылку.
Ниже инструкция, по добавлению ссылок в текст, кнопку или любой другой элемент.
Как сделать ссылку в Figma в тексте
Чтобы добавить кликабельную ссылку в текст в Figma, выделите нужный фрагмент текста и нажмите на пиктограмму ссылки сверху. После этого вставьте ссылку на нужный сайт.
Если нажать на созданную ссылку, то появится возможность перейти по ней. Для этого нажмите на надпись «Open link». Если захотите отредактировать ссылку, то нажмите на надпись «Edit».
Как вставить ссылку в кнопку, изображение или любой элемент?
Чтобы добавить ссылку на кнопку, изображение или любой другой элемент в Figma, сначала нужно преобразовать его во фрейм. Для этого выберите элемент и нажмите на правую клавишу мыши. Выберите пункт «Frame selection» или зажмите 3 горячие клавиши «Ctrl + Alt + G».
После того, как фрейм создан, выберите его, перейдите в правой панели в раздел «Prototype» и нажмите напротив надписи «Interaction» на плюс.
Нажмите на надпись «Click». В появившемся окне вместо значения «None» выберите «Open link».
Появится возможность вставить вашу ссылку в поле, как показано на скриншоте выше.
Если перейдете в режим презентации (иконка Play сверху и справа), то при нажатии на эту кнопку будет открываться та ссылка, которую вы вставили.
Заключение
Итак, вы узнали как делать ссылки в фигме. Это довольно простая инструкция по гиперссылкам. Если есть вопросы по теме ссылок или по работе или в программе Figma, то пишите их в форме комментариев ниже. Если тема будет интересной, то напишем отдельную статью по этой теме или запишем видео.
Ссылки в Figma
Ссылки в Фигма могут вести на:
При этом фрейм или страница может находиться в любой работе.
Ссылки работают только в режиме редактирования, в прототипе ссылки не работают. Если вы наведете курсор на ссылку в редакторе, Figma покажет всплывающее окно, в котором отображается путь (в виде Страница/Фрейм, если элемент находится в этом же файле, и в виде ссылки — если в другом или если это ссылка на страницу в интернете).
Фрейм на другой странице
Страница в этой же работе
Ссылка на фрейм (на этой же странице)
Ссылка на фрейм в другой работе
Как поставить ссылку
Чтобы поставить ссылку, выделите часть текста или весь слой с текстом и нажмите на иконку со скрепкой сверху в панели.
Сделать ссылкой
Работа с какими-то элементами, отличными от текста, пока что не обнаружена.
Ссылка на фреймы и страницы вставляются так же как и ссылки на страницы — это линки на страницы в figma.com/. Подбора по названию нет, вам надо сначала скопировать адрес интересующего вас элемента.
Как получить ссылку на фрейм или страницу в Figma
Ссылка на страницу: в списке страниц откройте контекстное меню и найдите Copy Link.
Копировать ссылку на страницу
Ссылка на фрейм: откройте контекстное меню, перейдите в Copy/Paste — Copy Link.
Скопировать ссылку на фрейм
Горячей клавиши для копирования ссылки пока что нет.