Как да експортирате GIF от Figma

Търсите ли начин да изведете вашата игра за разработчик и дизайн на следващото ниво? Figma е невероятен инструмент, който позволява на потребителите да създават богати прототипи, изпълнени с аудио, видео и анимационни ефекти. Въпреки това, за да тествате правилно усещането и функциите на прототипа, трябва да можете да го експортирате като GIF и да го видите в действие.

Как да експортирате GIF от Figma

Това ръководство ще обясни как можете да експортирате своите прототипи на Figma като GIF файлове с помощта на вашия компютър или мобилно устройство.

Как да експортирате в GIF във Figma на компютър

Най-лесният начин за експортиране на анимирани GIF файлове от Figma е с плъгина TinyImage. Преди да можете да стартирате и използвате приставката, ще трябва да влезете във вашия акаунт във Figma и да преминете към секцията „Общност“.

За да изтеглите приставката:

  1. Въведете „TinyImage“ в полето за търсене.
  2. В секцията „Добавки“ намерете иконата „TinyImage Compressor“.
  3. Кликнете върху бутона за инсталиране до иконата.

Когато инсталирате приставката, отворете дизайнерския проект, който искате да запазите като GIF. Щракнете където и да е на екрана, за да отворите падащото меню. Изберете „Plugins“ и докоснете „TinyImage Compressor“, за да го стартирате.

Ето как да създадете GIF с плъгина:

  1. В горната част на прозореца на приставката натиснете бутона „Създаване на GIF“.
  2. Изберете слоевете на вашето платно на Figma. Те ще действат като рамки на вашия GIF.
  3. В долната част на прозореца TinyImage докоснете опцията „Използване на избрани слоеве“. Ще видите слайдшоу на вашите слоеве в центъра на прозореца в реда, в който сте ги избрали.
  4. Под визуализацията щракнете върху иконите на слоевете, след което ги плъзнете наляво или надясно, за да промените реда им.
  5. Докоснете малкия бутон „Пусни“ под слайдшоуто, за да регулирате скоростта на възпроизвеждане.
  6. До контролите за забавяне на времето изберете колко пъти GIF ще се повтаря. Настройката по подразбиране е „Безкрайно“. Кликнете върху опцията „Безкрайно“, за да я деактивирате и въведете желания брой цикли в полето до нея.
  7. Регулирайте размера на GIF в полетата под опциите за забавяне и цикъл.
  8. Ако вашите слоеве имат прозрачни граници, натиснете бутона „Прозрачен фон“ в долната част на прозореца, за да ги направите видими в GIF.
  9. Изберете качеството на изображението на GIF в долния ляв ъгъл. Най-добре е да зададете скоростта на около 80 или 90, за да запазите всички функции на вашите слоеве.
  10. Оставете контролите „Dithering“ зададени на „No Dithering“.
  11. Докоснете бутона „Експортиране на GIF“ в горната част на прозореца TinyImage.
  12. Рамките ще се слеят и ще образуват GIF и той автоматично ще се изтегли и запише във вашите файлове за изтегляне.

Бележка относно наслояването

Падащото меню над миниатюрите на слоевете също ви позволява да възпроизвеждате слоевете отляво надясно или отдясно наляво. Въпреки това, за повече контрол върху окончателния вид на GIF, най-добре е да поръчате рамките ръчно.

Бележка относно възпроизвеждането

Задайте скоростта на възпроизвеждане по подразбиране, като преместите бутона на линията за измерване на времето. Ако обаче искате конкретни кадри да имат различни скорости на възпроизвеждане, можете да го направите, като щракнете върху миниатюра и зададете скоростта в полето под нея.

Как да експортирате в GIF във Figma на мобилно устройство

Прототипите на Figma често идват с разширени анимации като плъзгащи се раздели, опции за плъзгане и падащи менюта. Запазването им като GIF ще ви улесни да покажете дизайна в действие. Мобилното приложение обаче позволява на потребителите само да визуализират своите прототипи. Въпреки че няма вградена поддръжка за експортиране, можете да заобиколите проблема, като запишете екрана на приложението и превърнете видеоклипа в GIF.

Как да експортирате в GIF във Figma на iPhone

За да запазите проекта си като GIF на iPhone, първо ще запишете екрана на приложението Figma и ще направите GIF с приложението Shortcuts.

За запис на екрана на Figma на iPhone:

  1. Стартирайте мобилното приложение Figma и отворете проекта, който искате да превърнете в GIF.
  2. Влезте в „Настройки“ и изберете „Център за управление“.
  3. Изберете „Персонализиране на контролите“ и докоснете зеления бутон до „Запис на екрана“, за да активирате функцията.
  4. Върнете се в „Център за управление“.
  5. Натиснете бутона „Запис на екрана“.
  6. Щракнете върху червения бутон, за да завършите записа.

Записът обикновено се съхранява във вашето приложение Снимки.

Проверете дали вашият iPhone има предварително инсталиран инструмент за преки пътища, за да превърнете видеоклипа си в GIF. Можете също да изтеглите инструмента от App Store.

Ето как да промените видеоклипа в GIF файл на iPhone:

  1. Отворете приложението, отидете в долната част на интерфейса и изберете картата „Галерия“.
  2. Докоснете раздела „Начални команди за бърз достъп“ под менюто за търсене.
  3. Превъртете до долната част на екрана и щракнете върху секцията „Създаване на GIF“.
  4. Натиснете бутона „Добавяне на пряк път“, за да активирате GIF прекия път.
  5. Когато прекият път бъде инсталиран, върнете се към „Моите преки пътища“.
  6. Докоснете „Създаване на GIF“ и изберете „OK“, за да свържете приложението и вашата фотогалерия.
  7. Прегледайте вашите видеоклипове и изберете видеоклипа, който ще превърнете в GIF.
  8. Използвайте плъзгачите, за да изберете кои рамки да бъдат включени в GIF.
  9. Докоснете „Запазване“, за да запишете промените. Вашият нов GIF файл ще бъде записан в приложението за снимки на таблета.
  10. Щракнете върху „Готово“, за да излезете от приложението Shortcuts.

Как да експортирате в GIF във Figma на устройство с Android

Тъй като приложението Figma позволява на потребителите да визуализират прототипи, но не и да ги експортират, вие ще запишете визуализацията на устройството си с Android, трансформирайки видеото в GIF по-късно.

Ето как да екранирате запис на Figma на Android:

  1. Стартирайте приложението и отворете визуализация на вашия проект.
  2. Плъзнете два пъти от горната част на екрана и изберете „Запис на екрана“. Ако не е там, опитайте да плъзнете надясно. Понякога ще трябва да докоснете иконата „Редактиране“ в горната част на екрана, за да разкриете скрито меню. Функцията „Запис на екрана“ също може да е там.
  3. Докоснете визуализацията на прототипа, за да посочите, че искате да го запишете.
  4. Щракнете върху бутона “Старт”. След като обратното броене приключи, екранът ще бъде записан.
  5. Плъзнете надолу и докоснете картата „Рекордер на екрана“, за да спрете записа.

Видеото от визуализацията на Figma ще бъде запазено във вашето приложение за снимки на Android. Можете да го превърнете в GIF с Приложение GIPHY.

За да конвертирате видеоклип в GIF на устройство с Android:

  1. Инсталирайте и стартирайте Приложение GIPHY на вашето устройство.
  2. Регистрирайте се и създайте GIPHY акаунт.
  3. Натиснете бутона „Създаване“ в горния десен ъгъл на интерфейса.
  4. Разрешете приложението за достъп до вашата камера.
  5. Изберете видеоклип от вашата Android галерия.
  6. Регулирайте дължината на видеоклипа. Приложението GIPHY позволява на потребителите да вмъкват елементи като текст и стикери в своите файлове.
  7. Щракнете върху иконата „стрелка“ в долната част на приложението.
  8. Изберете „Споделяне на GIF“ и изберете „Запазване на GIF“.

Експортирайте GIF файлове без ограничения

Независимо дали сте опитен разработчик или любител дизайнер, вие заслужавате да имате удобен начин да покажете работата си на другите под формата на GIF. Можете да прегледате вашите творения в приложението Figma, но достъпът до вашите проекти може да се превърне в предизвикателна задача, след като интернет връзката прекъсне. Докато Figma излезе с удобно за потребителя решение за експортиране, можете да разчитате на методите, които изложихме в статията.

Надяваме се, че това ръководство ви е помогнало да разберете по-добре как да получите висококачествен GIF от вашите Figma творения, без значение кое устройство използвате.

Използвате ли уеб или мобилна версия на Figma? Какъв е вашият предпочитан начин за експортиране на GIF файлове? Уведомете ни в секцията за коментари по-долу.

Подобни статии

Вашият коментар

Вашият имейл адрес няма да бъде публикуван. Задължителните полета са отбелязани с *