Быстрый экспорт макета из Figma/XD/Sketch в HTML верстку

Поділитися
Вставка
  • Опубліковано 27 жов 2024

КОМЕНТАРІ • 66

  • @odc539
    @odc539 Рік тому +4

    07.2023 плагин Overlay сломан.. ошибка после авторизации

  • @ДаниилЯчиков-ь1л

    помогите пожалуйста
    я на виндовс. Там в плагине есть окно с комбинацией, я делаю комбинацию и вместо выполнения экспорта кода открывается то же самое окно. Что делать?

  • @detepl7463
    @detepl7463 Рік тому +6

    А что делать, если этот плагин не определяет кнопки?

  • @Nguileon
    @Nguileon Рік тому +6

    Добрый день, у меня экспорт идёт либо по одному компоненту либо никак, фреймы вообще не хочет экспортировать, я что то не так делаю?
    почти на всё выдаёт To start exporting components, select a component, then open Overlay with
    ⌘⌥P (Mac) or Alt+Ctrl+P (Windows)

    • @theonlyonewhowaits
      @theonlyonewhowaits Рік тому

      аналогично

    • @YeAD1501
      @YeAD1501 Рік тому +1

      Click Create component in the toolbar, or use the keyboard shortcut to turn your selection into a component:
      Mac: ⌥ Option ⌘ Command K.
      Windows: Ctrl + Alt + K.

    • @BROOKLAND_Detailing
      @BROOKLAND_Detailing 11 місяців тому

      gooooooodd@@YeAD1501

  • @ytbravoone7575
    @ytbravoone7575 2 роки тому +5

    Привет почему у меня при запуске плагина появляется надпись to start exporting components, select a component, then open Overlay with я зарегался и в фигме тоже зарегался но нечего не получается

    • @bloody_roomchik
      @bloody_roomchik Рік тому

      Нужно выделить полностью весь макет (Ctrl + A вроде)

    • @memestrooyy
      @memestrooyy Рік тому +1

      тоже самое

    • @memestrooyy
      @memestrooyy Рік тому +1

      ты уже решил проблему?

    • @bloody_roomchik
      @bloody_roomchik Рік тому

      @@memestrooyy Попробуй выделить весь макет (Ctrl + A или кликнуть по фрейму который нужно конвертировать) и попробуй ещё раз

    • @memestrooyy
      @memestrooyy Рік тому

      @@bloody_roomchik пробовал,но все равно тоже самое пишет

  • @bestofthebest8758
    @bestofthebest8758 5 місяців тому

    все сделала как сказали, но у меня получается так, что нормальное отображение сайта только на 50% разрешения экрана, когда увеличиваю на 100% всё смещается , увеличивается и получается каша , из-за чего это ?

  • @brandonloose8505
    @brandonloose8505 5 місяців тому +1

    05.2024 плагин не работает

  • @Lida_17
    @Lida_17 9 місяців тому

    А почему я не могу экспортировать Desktop ?

  • @ВладиславЯнсон

    У меня проблема такая при использовании , что плагин просит выбрать компонент , хотя тот выбран , сталикивался с таким кто ?

    • @Mordolei_kala
      @Mordolei_kala 8 місяців тому

      Такаеже ситуация

  • @katrinfirefox1456
    @katrinfirefox1456 3 роки тому +4

    Отличное видео, но уточните пожалуйста откуда вы взяли ссылку для тега

    • @viachas
      @viachas  3 роки тому +1

      Импорт стилей из Google Fonts fonts.google.com/specimen/Roboto?query=roboto#glyphs

  • @Владислав-т5ы
    @Владислав-т5ы 9 місяців тому

    Такая ошибка вылазит
    Export
    ERROR
    Could not validate your component

  • @АбдумаликБакиров-ъ4и

    Здравствуйте-это ссылка до сих пор работает? просто у меня выходит какая-то ошибка

    • @viachas
      @viachas  2 роки тому

      Все должно работать

  • @nastya_lucif182
    @nastya_lucif182 2 роки тому +5

    А как открыть окно что бы скачать шаблон? 4:14

    • @viachas
      @viachas  2 роки тому

      Запустить плагин выбрав соответсвующий фрейм

    • @bc.infin1ty
      @bc.infin1ty Рік тому

      как запустить плагин?
      @@viachas

  • @alexsedoykin
    @alexsedoykin Рік тому

    Ну в общем мы поняли

  • @silveringreviews
    @silveringreviews 3 роки тому +3

    Эх, если бы он мог использовать tailwind css framework...

    • @coolhazer9436
      @coolhazer9436 2 роки тому

      подробнее...

    • @pecher5150
      @pecher5150 2 роки тому

      ну у тебя по факту есть структура стилей её переделать совсем не проблема) к счастью

    • @stormbraker637
      @stormbraker637 Рік тому

      Есть плагин для экспорта в тайлвинд

  • @TIMMER_PUBGM
    @TIMMER_PUBGM Рік тому

    Сейчас он работает

  • @atata_r0mk022
    @atata_r0mk022 Рік тому

    как этот плагин справится с более сложной разметкой, например таблицы, формы с чекбоксами, селектами, инпутами?

    • @viachas
      @viachas  Рік тому

      Ну ты можешь пометить компонент как инпут или чекбокс в принципе, так что наверное ок

  • @marl-minecraft
    @marl-minecraft Рік тому

    Почему overlay выдаёт вместо html - react, css - scss

    • @bear3xl48
      @bear3xl48 Рік тому

      Можно выбрать при создании проекта

  • @evilwithin777
    @evilwithin777 Рік тому

    У меня ошибка,не дает скопировать или копирует только как изображение

    • @viachas
      @viachas  Рік тому

      Попробуй не использовать компоненты

  • @viachas
    @viachas  3 роки тому +1

    После апдейта Фигмы плагин стал плохо работать

    • @БекарстанОрозакунов
      @БекарстанОрозакунов 3 роки тому +1

      Куда надо ввести код для очищение кеша

    • @viachas
      @viachas  3 роки тому +1

      @@БекарстанОрозакунов У меня написано как это сделать через терминал на маке, на винде:
      1) Close the Figma desktop app.
      2) Open the Start menu and paste the %APPDATA%\\Figma command. Press the Enter key to submit.
      3) In the window, delete the DesktopProfile folder.
      4) Launch the Figma desktop app again.
      Source: help.figma.com/hc/en-us/articles/360040328553-Can-I-work-offline-with-Figma-

    • @БекарстанОрозакунов
      @БекарстанОрозакунов 3 роки тому

      @@viachas Большое спасибо!

    • @konstantinreimer9341
      @konstantinreimer9341 2 роки тому

      @@viachas Простите а вводить в кмд одну из вариаций на виндоус?

    • @viachas
      @viachas  2 роки тому

      @@konstantinreimer9341 По этой ссылке help.figma.com/hc/en-us/articles/360040328553-Can-I-work-offline-with-Figma-#clear-data

  • @logstik
    @logstik 2 роки тому +1

    Как запустить Overlay?

    • @viachas
      @viachas  2 роки тому

      Как и любой другой плагин в фигме

    • @VeraBarmen
      @VeraBarmen 8 місяців тому

      Тот же вопрос. А как запустить любой другой плагин в фигме? Потому что на видео объясняется, что нажимать потом, а как запустить плагин - нет( ​@@viachas

  • @aham1082
    @aham1082 Рік тому

    Ребята, объясните, зачем макеты из Figma конвертировать в Html?

    • @Relaxlifee
      @Relaxlifee Рік тому +1

      Чтобы посмотреть как он выглядит в жизни 😂

    • @hiirohomura3910
      @hiirohomura3910 Рік тому

      А как по другому сделать из этих макетов полноценный рабочий сайт и запускать его в браузере? Для этого и нужен html код

    • @ГайГеймер
      @ГайГеймер Рік тому

      Ну смотри
      Figma позволяет делать макет сайта ,но не сам сайт.
      Чтобы ты мог повесить свой сайт в открытый доступ тебе нужно повесить его на хост.
      На хост тебе нужно залить исходники твоей верстки.
      Вопрос- каким образом ты импортируешь макет из figma на хост если у тебя нету исходников твоей верстки?

    • @averkom
      @averkom Рік тому +1

      Конвертация макетов из Figma в HTML имеет несколько целей. Во-первых, это позволяет визуализировать дизайн макета и увидеть, как он будет выглядеть на практике. HTML является основным языком разметки для создания веб-страниц, поэтому преобразование макета в HTML позволяет создать интерактивный прототип или рабочий сайт, который можно просматривать в браузере. Это важно для тестирования и предварительного просмотра внешнего вида и взаимодействия элементов макета перед его фактической разработкой.
      Во-вторых, конвертация в HTML позволяет создать исходный код, который может быть использован разработчиками для дальнейшей работы над макетом. Код HTML содержит информацию о структуре и компонентах макета, таких как заголовки, текст, изображения, кнопки и другие элементы интерфейса. Разработчики могут использовать этот код вместе с CSS (каскадные таблицы стилей) и JavaScript для создания функционального и адаптивного веб-сайта.
      Таким образом, конвертация макетов из Figma в HTML позволяет визуализировать дизайн, создать прототип или рабочий сайт для предварительного просмотра и тестирования, а также предоставляет исходный код, который может быть использован для дальнейшей разработки и внедрения.

    • @official_royce
      @official_royce 10 місяців тому

      хорошо, но сайт ведь будет без адаптива, тогда нужно весь код переписывать?@@averkom

  • @M718rs
    @M718rs 2 роки тому

    А как открыть окно что бы скачать шаблон?

    • @MDREG
      @MDREG 2 роки тому

      Для начала нужно зарегистрироваться в Figma, если вы про мой макет

    • @M718rs
      @M718rs 2 роки тому

      На 4:14

    • @MDREG
      @MDREG 2 роки тому

      @@M718rs Запустить плагин выбрав соответсвующий фрейм

  • @YuriiAvram
    @YuriiAvram 2 роки тому

    Доброго дня не зрозумів як ви вивели всі теги.??

    • @viachas
      @viachas  2 роки тому +2

      Паглядзіце падрабязней у дакументацыі faq.overlay-tech.com/designer-faq а таксама ў файле прыкладу ў фігме www.figma.com/community/file/921066411285098081

    • @YuriiAvram
      @YuriiAvram 2 роки тому

      Сбпробую дякую я починаючий

    • @WynautUA
      @WynautUA 2 роки тому

      @@viachas це такий тролінг на український комент відписувати на білоруській?

    • @viachas
      @viachas  2 роки тому +10

      @@WynautUA Чаму раптам, я не маю магчымасці на сваёй роднай мове адпавядаць на каментарыі?

    • @valerii7323
      @valerii7323 Рік тому

      ​@@viachasебу петух дерзит