Уроки Веб и приложения Даниил Волосатов 12 августа 2019

Повторяем дизайн формы пользователя в FIGMA

Сложность урока: Средний

Мы видим в комментариях ваш интерес к веб-дизайну и это здорово. Поэтому Даниил Волосатов подготовил для вас практический урок. 

В нем вы узнаете, как работать и создавать какие-либо элементы или даже дизайны и проекты, используя Figma. Даниил возьмет конкретный пример с Dibbble и на его основе создаст адаптивный дизайн формы пользователя на сайте.

Что вам понадобится для урока:

*Если нет звука – установите в настройках плеера качество 1080p
Длительность - 15 мин 22 сек, формат MP4

Домашнее задание от Даниила:

  • Повторить адаптивный дизайн формы пользователя
  • Добавить к нему дополнительные элементы (напр., иконки, выпадающий список, всплывающее окошко)
  • Загрузить в комментарий работу по уроку
  • Прислать Даниилу личным сообщением ссылку на свой проект в Figma. Первые 10 человек, которые пришлют свою работу, Даниил откомментирует.

Источник: creativo.one

16 тыс. 81
Печать Жалоба

Комментарии 81

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

Ksergey010, Мы здесь, в условиях написано чтобы вы отправляли в диалог Даниилу.

Евгений Иванов, Следующий за мной комментарий от Ruslan Bakeev идёт с прикреплённой ссылкой на figma.com, я точно также пытался вставить ссылку, как Даниил говорил сделать в уроке, но мне сайт запретил вставлять ссылку на figma.com, это только для меня, или регион не тот?

Ksergey010, попробуйте вставить без https://

Спасибо за урок!

отличный урок!
https://www.figma.com/file/gwo11LcxSkmwhqoTMmgQvk/Untitled?node-id=7%3A12

Спасибо за урок по фигме, было очень познавательно! :thumbs-up:

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

Спасибо! Интересный урок.
https://www.figma.com/file/DQjtYH284MEvcQdQaS1GBl/Untitled?node-id=6%3A11

https://www.figma.com/file/w5aVRQZQXJg98v8iqHfrIZ/Untitled?node-id=3%3A9

Спасибо, (но у меня сегодня очень медленный интернет, не могу нормально работать)

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

Огромное спасибо за урок!

Люблю фигму) спасибо за урок!

Урок понравился, но не смогла понять, как заполнить цветом иконку указателя-руки белым цветом только внутри границ
https://www.figma.com/file/Z5Ln2OwB3RJxNxr4pdGiTc/%D0%9C%D0%B0%D0%BA%D0%B5%D1%82-%D0%BF%D1%80%D0%BE%D1%84%D0%B8%D0%BB%D1%8F?node-id=0%3A1

Хороший урок, все просто и понятно.
https://www.figma.com/file/C9HjflnB5AdCh2NkeERnCt/Untitled?node-id=3%3A11

Моя "броаузерная" работа:) Теперь вперед, на марафон!:)

Спасибо за урок. Но! Figma не устанавливается на 32-разрядную виндоус. Это огромный "минус" программы, о котором никто не упомянул. Возможно, п.ч. такие уже мало у кого стоят))) И автор курса просто о нём не знает.

Nadegdash82, не надо фигму устанавливать. Работайте в браузере - разницы никакой. Во всяком случае - многие авторитетные товарищи это утверждают наверняка.

Спасибо! Понравился урок!

Хорошее исполнение!

www.figma.com/file/qdPQ0RQ4wgRjSItJpIioox/%D0%9F%D1%80%D0%BE%D0%B1%D0%BD%D0%B0%D1%8F-%D1%80%D0%B0%D0%B1%D0%BE%D1%82%D0%B0?node-id=0%3A1
Ещё раз пытаюсь вставить свою работу. Первый раз отправляю что-то на этот сайт, хотя читаю его давно и подписался давно. Очень интересна для меня новая тема по Вэб-Дизайну.

Спасибо за урок

www.figma.com/file/gOZYBKDgi4snYy6YMBAmGQ/Untitled?node-id=0%3A1

мою, мою зацените)))

Как-то так Спасибо за урок!

Добрый вечер. Первые 4 работы уже откоментировал, жду еще 6)

Установка Figma для тех кто в Linux:
snapcraft.io/figma-linux

Я, конечно, обожаю Фотошоп... Но и в Фигме есть своя прелесть Во всяком случае - для меня! А если соединить (в случае необходимости) владение и тем, и другим - получится вообще класс! Огромное спасибо за урок и тем. кто меня поддержал! Пока не закончила (на 10й минуте видео), но доделаю обязательно!

Valentinadizain, Именно в связке эти два инструмента ТОП в 2020, мы знаем это. Так как на основе веб-дизайнеров нашего сайта приводим пример

СЕРЁГА, Понравился инструмент Серега? :)

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

Добрый день!
программа интересная

Спасибо! Всё просто и понятно.
Жаль, у меня качество видео не очень, а шестерёнка позволяет только скорость регулировать

Еще 5
Добавить комментарий / работу

Новые работы пользователей

По заданным фильтрам работы не найдены

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


Смотреть все работы

Предыдущая Следующая
Добавлена {{work.date}}
Не удалось загрузить работу. Возможно она была удалена.
GIF {{work.bite}} Мб Загрузить
Редактировать Удалить
18+
Работа имеет содержимое для 18+ лет
{{work.views}} {{work.comments}}
Жалоба

Комментарии {{work.childs.length || 0}}

Видео к работе
Популярные работы автора:
Работа получила награды:
Курсы автора:
Онлайн-курс

Жалоба

Опишите суть жалобы, при необходимости добавьте ссылки на скриншоты

Спасибо! Ваше обращение ушло на рассмотрение.

Название работы

Описание работы (необязательно)

Комментарий

Ваша миниатюра:

Название:
{{name}}
Описание:

Исходник:

{{source.name}} {{source.name}}

Тэги:
#{{tag.label}}

Есть ли у вас исходник к работе?

Исходник — это файл из исходных изображений, которые использовались для создания вашей работы. Исходник позовляет лучше понять вашу работу. Он не обязателен, но работы с исходниками получают больше лайков и имеют право на участие в еженедельных конкурсах.
jpg-файл, максимальный размер 1920x1080px

Пример исходника

Выберете тэги работы:

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

Не более десяти тэгов на одну работу

Комментарии к работе будут отключены, на их месте будет выведена реклама.

После добавления работы:


Запланировать публикацию

Отменить планирование
Запланировать

Используя данный сайт, вы даёте согласие на использование файлов cookie, данных об IP-адрес, помогающих нам сделать его удобнее для вас. Подробнее