Figma Tutorial in 13 minutes for web designers and web developers 

🔥 Бесплатный интенсив по веб-разработке: frontendblok.com/intensives/start

Благодарю за краткий курс по ликбезу. Информативно, кратко и всё по сути.

Стоило упомянуть самое главное, что есть раздел именно для верстальщиков - "Code" (справа в панельке где информация о блоке), а также стоило рассказать не о дизайнерских, а инструментах для верстки, вы же так себя и позиционируете..., как верстальщик. Ещё один момент где всякие фишки как настроить полотно для верстальщика ? Где полезные дополнение ? Короче есть повод запилить ещё 1 видосик по Фигме). К сожалению мне пришлось самому во всём этом разбиратся.

Очень полезное видео. Причем, урока такого про фигму такого хорошего качества я не смог найти. Спасибо автору.

Отличный урок, подробное объяснение, все показываемые действия озвучены просто, ясно, легко! 👍

Класс! Спасибо не только за инфу, но и за грамотную подачу! 👍👍👍

Спасибо, уже пользуюсь фигмой месяц, но некоторые мелкие фишки от видео узнал, спасибо! Все коротко и ясно!

Спасибо большое за такой ускоренный, но очень информативный обзор!

Хейтеры которые говорят что слишком мало фишек, вы учтите что это обучалка для полных чайников как я. А если рассказывать обо всех нюансах то новички утонут в информационном потоке и ничего не поймут. Ну скажу то ради чего полез в комменты - Огромное спасибо, с меня лайк и подписка

❤️Спасибо, оказывается это не так уж сложно нежели я думал.❤️👍🏻

здравствуйте, спасибо за видео! скажите, мы маркетинг-кит сможем здесь отрисовать и сохранить для печати...? или где это лучше сдлать? спасибо)

Спасибо за уроки! Есть вопрос касаемый асимметричности (Figma): При работе очень часто сталкиваюсь с проблемой разных расстояний от объекта. Приведу пример, отступы от текста до краев прямоульника слева и справа отличаются на один пиксель. Бывает, из-за этого приходится переделывать пол работы, так как заказчик решил изменить текст блока. Как можно данную проблему пофиксить? Благодарю за ответ!

Спасибо! Отличное руководство! 👍

Все понятно и по существу, спасибо, отличное видео😊👍

Равнозначный круг с равными сторонами =))) типичный верстальщик =) А вообще приятный спикер. Все поделу. Лайк

Спасибо. Очень качественная подача

Отличное видео, спасибо 😉

можно ли каким-то образом скачать все активы макета одним архивом (картинки, логотипы и т.п) или нужно все делать вручную?

Спасибо, Анна!

Подскажите, пожалуйста, как в фигме несколько объектов, если они логически представляют собой один объект, экспортировать как один png (или svg) файл. Если просто их выделить, то выгружаются все объекты отдельными файлами.

Отличный урок, спасибо!

Ясно и по делу! Спасибо!

И тебе спасибо за очень полезный видос!)

Анна, спасибо за контент!

Отлично Ань, умница просто, все простенько и наглядно!

Начал разбираться с фигмой. Тут как для новичка очень хорошо все рассказали. Но у меня вопрос. Если мне на фон блока (или на фон всей страницы) нужно поставить картинку, то как правильно это сделать? Просто вставить область с картинкой или там есть какая-то хитрость?

Даже лайк поставлю, самое информативный видеообзор, что я видел

Спасибо большое, помогли 🖤

Супер. Анюта молодец. Спасибо за видео

Спасибо вам огромное Все легко и в одном видео

как добавить все те инструменты, которые у Вас вверху? у меня их только два там (стрелочка move и кружочек show comments)?

Хорошее видео, спасибо!

Спасибо что коротко и по делу

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

Слышал про Figma но никак не находил время ознакомиться, а тут все кратко и четко и по существу. Спасибо. Одно жалко что он psd не принимает, тут ему тягаться с Avocode сложно. Но за приятное видео Спасибо!

Я рад что я когда-то подписался на этот канал. Вот щас пригодилось. Спасибо!!!

Добрый вечер! Анна, подскажите можно как-то настроить вывод кода в фигме для Sass без ";" ?

Большое спасибо Вам за это видео.

Спасибо! Помогли разобраться что к чему))

Полезная инфа. С меня лайк

Про основную вкладку Code и расстояния между блоками/элементами не рассказали. Тоже очень полезные инструменты.

Благодарю Вам, Анна!

Очень интересно, спасибо. 😎👍

Сердечно благодарю! Крайне познавательно.

Подскажите пожалуйста, как понять какие обьекты должны быть динамическими по задумке дизайнера макета? Что должно анимироваться и как. В Фигма.

Все по делу! умничка

Анна, а позволяет ли Фигма как-то автоматизировать процесс превращения дизайна в HTML-верстку?

Почему изображение изначально свг ? дизайнер сказал ? Рассказывать в какую папочку сохранить это отличные знания, спасибо

Круто. Всё по делу .

Привет, всем. Дайте добрый совет, если учиться рисовать макеты сайтов то можно сразу с фигмы или фотошопом овладеть тоже стоит ?

Вы лучшая!

Обзор показался поверхностным, чем хотелось бы, ну и было много повторений. Но видел еще ролик про фигму, мб там информативнее. Но в любом случае спасибо. Подача материала хорошая)

Анна спасибо!

вау, вау,вау...ты просто космос. Тоесть, я хочу сказать информацию очень полезная, так как я вообще не знала о Figma.

спасибо за контент!

Доброго времени суток. Подскажите, линейки не работают в режиме просмотра?

Бомба! Лучший канал!👍

так макеты же в пдф скидываются, не понятно из какого он приложения или я что-то не понимаю?

Вы молодец! Все четко, без воды

Какая красивая девушка. Спасибо у меня не вставляется изображение Ctrl+V не реагирует и нет цифровых линеек по краям что не так подскажите для особоодаренных

Допустим: я сделал прототип и у меня косяк с расстоянием между карточками, внутри блока. Как мне замерять нужные расстояния, если автоматически они не вылезают? Тоже самое с текстом внутри кнопки. Допустим: у меня расстояние от текста до краев кнопки равны по 50, а должны быть 28. Как мне замерять эти расстояния?

Добрый день. Подскажите пожалуйста, возможно ли в Фигма сделать плашку с прозрачным текстом? Если да, направьте в нужном направлении)) Спасибо

Крутая штука, я раньше для себя в фотошопе делал макеты сайтов, а здесь еще лучше оказывается! Я в (энглише ноль) здесь есть возможность сделать кнопку, при наводке она меняет цвет, структуру и ТД ??

Однозначно лайк и подписка !

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

Спасибо большое!

Благодарю!

Добрый день! Проблемка 🙈не могу сгруппировать элементы, всё было нормально,а затем опс не получается ctrl+G и слева элементы выделяю и пытаюсь сгруппировать, не получается 🤔хорошо, до сегодняшнего момента 😔 Подскажите пожалуйста где допущена ошибка???

спасибо тебе, глазастик)))

Ох ничего себе у тебя глаза!) Гипнотизируют просто!)

спасибо за обнову моих знаний

При экспорте изображений как указать путь в папку с проектом и изменить название перед скачиванием?

А если нужно объединить несколько слоев в одну картинку для экспорта?Как тогда?

Круть! Для первого ознакомления - самое оно. Без воды, быстро и по теме.

Большое спасибо

как всегда ты лучшая

Подскажите Анна , я перехожу по ссылке на макет и могу только выделять элементы , но не могу изменять их!

Спасибо 👍

А border-radius она покажет у кнопок?

Почему я не могу поменять шрифт на русской раскладке в режим бебас?почему меняется только англоязычная раскладка помогите пожалуйста

полезный Спасибо!🤍

Спасибо!)

У тебя очень красивые глаза, а глаза, как мы знаем, это зеркало души. Если серьезно, то всё было здорово, познавательно и интересно. Благодарю!

Анна. У меня очень старый комп с intel core 2 запустится ли у меня figma?Ps. Комп стоит 19к скоро коплю ноут за 45к

Привет) Когда скачиваю декстопную версию, мне предлагают продолжить в браузере, когда нажимаю, ничего не происходит, и нет поля для ввода логина. Не подскажешь, почему может быть так? Видос отличный, спасибо)

Какая милая дочка Flesh и Corel) А где там инструмент адаптации готового продукта под смежные источники стресса? То есть я рисую для Яблока и он только на нём будет корректно отображаться?

отлично!

Захожу чтобы посмотреть рецепт булочек - в итоге смотрю твои видео

Спасибо!

Спасибо за видео!! А с какими форматами работает figma? Не совсем понял.

Анна, я вот ждал, что ты расскажешь о каких-то плюшках для верстальщиков и для дизайнеров, чтобы сделать жизнь верстальщика проще, а ты сказала, мол вот панель свойств, и там все можно посмотреть, а вот инструменты, которые как-то работают. Так вот, для вертстальщика есть в этой самой панели свойств вкладка CODE. Оттуда можно копировать стили и текст элемента. А ещё в фигме есть классы(стили) и компоненты. Это очень упрощает жизнь верстальщику и ещё более упрощает жизнь дизайнеру, которому больше не нужно заниматься выдергиванием цветов. Я вот прям даже расстроился, что ты об этом не рассказала, но я так понимаю, что ты и сама не особо разобралась. Да, чтобы создать файл не нужно лезть в контекстное меню, можно просто нажать плюсик на панели вкладок. По поводу «разработчику не нужно устанавливать приложение». Ну по-мимо банального, что браузер ты используешь для просмотра результата, то иметь вкладку с макетом уже не очень удобно. По-мимо этого приложение работает быстрее, чем браузер и жрет меньше ресурсов, что является премуществом для слабых ноутов. Про отсутствие ненужного браузерного интерфейса я даже говорить не хочу. Учитывая, какие дотошные видосы у тебя есть по всяким простым вещам (например «как прибить футер к низу», что мне, лично очень нравится) я даже как-то расстроился.

Если на рабочем месте 2 рабочих объекта, как я могу сохранить и экспортировать только один?

*самый главный вопрос: Когда я отрисовал сайт и мне надо добавить высоту т.к в макет добавился еще один кусок сайта, почему весь макет растягивается а элементы улетают... как отрубить привязку контекта от ширины макета*

А в фигме шрифт в пт или в px?

У меня нету вкдадок design, pototype, code? как іх найти? А также нету всех інструментов, и пишет, что макет только для просмотра.

Никак не могу попасть в приложение. На сайте зарегалась, приложение скачала. Открываю, пишет "Welcome to Figma. Log in with browser", нажимаю, вижу "go to the browser to complete login" и предлагает мне попробовать еще раз , перекидывает на предыдущую страницу "Welcome to Figma..."и так по кругу. Хелп. Что это такое? Как открыть приложение?

Здравствуйте. А у меня не такое меню и все на английском. Хотя там же скачивала. Почему?

я не нашел в нем линейке. есть тут такой инструмент?

12:03 по моему в пнг лучше всегда сохранять. Это супер-распространенный формат работающий везде, и без ошибок.

А какая лучшая OFFLINE алтернатива без подписки и чтобы была поддержка windows?