Одну секунду
Что-то сучилось. Попробуйте еще раз.
Figma старт смотреть последние обновления за сегодня на .
За один урок научим вас работать с самым прогрессивным инструментом дизайна и нарисуем стильный промо-сайт. Figma – революционный бесплатный онлайн-сервис для дизайнеров. Его возможности безграничны – вы можете создавать прототипы и дизайн, интерфейсы и мобильные приложения в одной программе. По функциональности Figma на несколько шагов впереди ближайших конкурентов – Sketch и Adobe XD, а Photoshop уже давно остался далеко позади. Figma заменит все ваши привычные программы - Работает прямо в браузере - Не нужно ничего скачивать и устанавливать – для работы вам нужно лишь подключение к интернету. Не нужно платить В отличие от остальных графических редакторов, Figma бесплатна для частного использования. Для командной работы есть несколько лояльных тарифов. Интуитивно понятный интерфейс Для обучения основным инструментам вам понадобится всего вечер. Все файлы хранятся в облаке Все ваши макеты автоматически сохраняются и всегда доступны. Любой из них можно отправить клиенту или разработчику в виде ссылки. Система стилей и компонентов Незаменимая функция при работе над большими проектами – объедините все элементы в систему и вносите глобальные изменения парой кликов. Передача файлов разработчикам Figma облегчает взаимодействие дизайнеров и разработчиков. Все нужные уточнения можно оставлять прямо в макете, в виде комментариев. Как перейти на Figma за один час Лучший способ научиться работе с новым софтом – это практика. Потому мы проведем практический экспресс-урок – в прямом эфире с нуля создадим стильный промо-сайт, а параллельно изучим все необходимые инструменты. По окончанию вебинара у вас будет готовый алгоритм создания сайта в Figma. Программа урока Интерфейс Figma: основные инструменты, фреймы, работа с текстом, изображениями, компонентами и стилями. Полное погружение в современные тренды веб-дизайна: композиция, сетки, шрифты. Создание полноценного макета с дизайном в стиле студии Uprock, десктопного варианта и адаптива. Передача дизайна разработчику: как отдавать макет верстальщику, чтобы у него не оставалось никаких вопросов. Кому будет полезно Новичкам Если вы только начинаете осваивать веб-дизайн, поможем не тратить время на изучение лишнего Адептам Photoshop Если вы дизайнер старой закалки, покажем вам, как делать макеты гораздо быстрее и прогрессивнее Дизайнерам Если вы уже умеете работать в Figma, дадим много практических советов и поделимся своими методиками создания дизайна Бонусы Макет с урока останется у вас Ответим на все ваши вопросы по дизайну Дадим алгоритм создания стильных и дорогих сайтов Преподаватель 26 место по дизайну по версии рейтинга Tagline 14 лет практики 300+ реализованных проектов Евгений Кузьмин, основатель и владелец студии Uprock и школы дизайна Uprock Newschool. «Я занимаюсь дизайном 14 лет и работал во множестве программ, но в итоге пришел к работе только с Figma. Этот софт объединил в себе всё лучшее, что происходило с инструментами UI-дизайна за эти годы. Если вы хотите научиться быстро создавать современный и практичный дизайн, вам следует начать именно с Figma. На вебинаре я дам все самые актуальные советы по работе с софтом и быстрому входу в профессию». школа-дизайна: 🤍 telegram: 🤍 instagram: 🤍 Не пропускай прямой эфир!) #веб #дизайна #вебдизайн #обучение #фигма #программа #интерфейс #вебсайт #практика #урок #вебдизайнер #дизайнеров #курсы #новичков #начинающих #figma #web #design #interface #photoshop #старт
🔥СКАЧАЙТЕ БЕСПЛАТНО учебный файл к видео "Фигма-бургер. Быстрый старт в Фигме", для этого подпишитесь на канал, оставьте комментарий под видео и скачайте файл: 🤍 ССЫЛКИ: ▪ INSTAGRAM Ильи Боронникова с фишками дизайна в постах и сторис — 🤍 ▪ БЛОГ о дизайне, с трюками по презентациям и полезным контентом — 🤍 ▪ 5 мощных плагина для Фигмы — 🤍 ▪ комплексный мощный курс по освоению навыков работы в Фигме для маркетологов и СММ-специалистов — 🤍 ▪ Придать воздушности дизайну "5 трюков, как сделать летающие объекты в Фигме 🔥" - 🤍 ДЛЯ СПЕЦИАЛИСТОВ ПО ОБУЧЕНИЮ, ТРЕНЕРОВ: 💥Бесплатно, закрытый мастер-класс "5 принципов презентации чего угодно" — 🤍 ДЛЯ ЭКСПЕРТОВ И ОНЛАЙН-ШКОЛ: 10 признаков хорошей презентации для вебинара — 🤍 ПОЛЕЗНО ДЛЯ ДИЗАЙНЕРОВ ПРЕЗЕНТАЦИЙ: 🔥 Цветовые тренды 2021 — 🤍 ✨ 5 шагов, повысить читаемость текста — 🤍 ⬜ Серый — новый белый — 🤍 ⬛ Серый — новый чёрный — 🤍 💓Ставьте ЛАЙК, если хотите увидеть следующие видео! Набираем 100 лайков, открываю доступ к новым видео. 💥Пишите, обсудим ваш проект и выведем ваш бизнес на полную мощность! - разработка презентаций для онлайн-школ, выступлений и продаж, - разработка фирменного стиля и оформление социальных сетей, - групповое и индивидуальное обучение дизайну и презентациям, - курсы для онлайн-школ. 👉ДЛЯ СВЯЗИ: Дружить в VK - 🤍 Дружить в Facebook - 🤍 Instagram - 🤍 Telegram - 🤍 Email - boronnikov🤍gmail.com
Проектирование и дизайн мобильного приложения в Figma (Старт дизайна) Начинаем отрисовывать дизайн приложения на основе скетча, а также mind-карты приложения. 📘На моем канале вы можете изучить профессию веб-дизайнера с нуля с помощью программы Figma. Я рассказываю о веб-дизайне без воды и ненужной информации. Разбираем как UI принципы, так UX. Также вы можете узнать особенности работы фрилансером. Основа обучение делается на уроках в программе Figma. Обучение Figma является приоритетной задачей для начинающего веб-дизайнера. Будь то вы дизайнером сайтов, мобильных приложений или других интерфейсов. В уроках вы узнаете как создать дизайн сайтов, Landing Page, интернет-магазинов, многостраничных сайтов. 🎥Сохраните это видео себе или поделитесь им с коллегами - 🤍 🔔Подписывайтесь на канал 🤍 💻Сайт с полезными статьями по веб-дизайну, шаблонами для Figma 🤍 ✍ Индивидуальное обучение - пишите на mail - denis.timoshitskiy🤍gmail.com (Работаю как с начинающими, так и с опытными веб-дизайнерами). Проектирование и дизайн мобильного приложения в Figma (Старт дизайна) ☑️ Instagram - 🤍 ☑️ Telegram канал - 🤍figma_info ☑️ Паблик ВК - 🤍 ☑️ Мой сайт по Figma - 🤍 Смотрите также, 📺 Обзор программы Figma 🤍 📺 Курс веб-дизайн за 1 месяц 🤍 📺 Дизайн интернет-магазина в Figma 🤍 📺 Ре-брендинг ресторана 🤍 #Вебдизайн #Вебдизайнер #Figma #UI #UX #ДизайнСайта #РаботаФрилансером #WebDesign #WebДизайн #WebДизайнер #КурсыВебДизайна #ДизайнСайтов #ВебДизайнСнуля #КурсыВебДизайн #КакРаботатьУдаленно #УрокиFigma #КакСтатьВебДизайнером #ДизайнИнтерфейсов #УрокиВебДизайна #ШколаВебДизайна #КакСделатьДизайнСайта #ДизайнерМобильныхПриложений #ДизайнLandingPage #КурсFigma #КурсПоФигме #КурсФигма #КурсыUxДизайн #ПрофессияВебДизайнера #БесплатныйКурсПоФигме #БесплатныйКурсFigma #НаучитсяВебДизайну #ВебДизайнДляНовичков #ВебДизайнСайта #СекретыВебДизайна
Быстрый старт в Adobe Figma CC 2023!!! Легендарный софт получает радикальное обновление и я научу вас в нем работать! Все тонкости Figma CC в одном видео! Лайфхаки, шорткеи, типс энд трикс от Антона Дизайнера! Причтного просмотра и всех вам благ!🥨❤️🔥 Мой блог🍞t.me/xlebomir
Всем привет. В этом видео я покажу, как новичку можно научится повторять работы других дизайнеров в Figma. Ссылка на сайта с которого копировал 🤍 Все права на дизайн, тексты и изображения принадлежат Double. Работа сделана исключительно в образовательных целях. Ссылка на сервис вдохновения 🤍 Расширения для Chrome: WhatFont - 🤍 Image Downloader - 🤍 ❤️❤️❤️ Буду рад вашим лайкам, подпискам и самое главное комментариям )) Мой инстаграмм 🤍 Мое портфолио на Behance 🤍 #studyweb #вебдизайн #КакКопироватьДизайнСайтавФигме
Подробнее о курсе "Веб-дизайн и верстка": 🤍 Для начала Вы увидите создание аккаунта на платформе Figma, а также скачивание программы на компьютер. Ознакомление с базовым интерфейсом.
Do you want to learn Figma but don’t know where to start? Well, if you follow this step-by-step tutorial, it will only take you 24 minutes to learn all the basics you need to know to start designing apps and websites in Figma. In this Figma tutorial for beginners, UX designer Amr guides you through Figma’s interface and tools following a very valuable principle to start mastering this tool. “If you want to learn the basics, you should copy other designs”. Do you have more questions about Figma or the next steps you should take? Leave them in the comments below ⬇️ ✅ If you want to learn about facilitation and workshopping join our FREE FACILITATION COMMUNITY where hundreds of workshop facilitators gather to share their resources, insights and experiences 👉 🤍 Also if you haven't already, subscribe to our Youtube channel for weekly UX / UI / Career / and Design Sprint videos: ❤️ 🤍 😉 🛠Free resources mentioned in this video: 1️⃣ Figma website - 🤍 2️⃣ Figma resources (Food delivery app UI template) - 🤍 3️⃣ Free Figma icons - 🤍 4️⃣ Unsplash (Free images) - 🤍 ⏰ Video Timestamps 0:00 Intro 0:22 Advantages of using Figma 1:22 How to log in into figma.com 1:36 Why you should copy other designs Start of Tutorial 2:28 How to start a project from a TEMPLATE 5:10 Interface OVERVIEW 5:27 Create a FRAME 6:38 SHAPE and COLOR creation 8:28 CORNER RADIUS adjustment 10:12 Create a CIRCLE 12:25 How to use an ICON 14:28 How to paste IMAGES 15:32 How to use TEXT 18:39 BUTTON UI 21:39 Conclusion 22:32 Next steps ✅ Check out our new FREE FACILITATION TRAINING and learn the 5 things you can do to become a top 1% facilitator and earn 6 figures while doing it! 👉 🤍 Thanks for watching! #Figma #FigmaTutorial #UXDesign 📣 FREE FACILITATION TRAINING! 👉 🤍 We’ve JUST launched a new 1-hour facilitation training, where we’ll teach you: ✅How we landed facilitation gigs with the world’s best companies (Google, Twitter, LEGO & more!) ✅How to successfully build & facilitate ANY workshop, even when you’re not a subject-matter expert ✅How to become a high-paid facilitator in 90 days or less, using our special ‘5-1-6 method’. Interested? This training is available for a limited time only, so unlock it now and start watching! If you want to stay ahead of the UX game, level up your career, and be in the know on the nerdiest, ‘techiest’ things, sign up for our FREE newsletter here: 📩 👇 📝 🤍 👀 Want more? Join 200,000+ people subscribing to our AJ&Smart YouTube, LinkedIn and Instagram channels for free content to help you and your team do more valuable work. AJ&Smart is the #1 design sprint firm in the world, the official Design Sprint training partner with Jake Knapp inventor of the google design sprint and partner of choice for the world's most successful brands. Figma UI Design Tutorial: Get Started in Just 24 Minutes! (2021) 🤍
★ Бесплатно учись веб-дизайну – 🤍 В этом видео Алексей – куратор школы Максим Солдаткина расскажет о преимуществах программы Figma, полезной для начинающих и опытных веб-дизайнеров. Ролик посвящен вступлению, поэтому вы узнаете такую информацию: ➢ Как выбирать шрифты? ➢ Возможно ли создать библиотеку? ➢ Как запустить проект в Figma? На примере 2-х экранов Максим Солдаткин объяснит главные нюансы, а также поможет ученику вникнуть в процесс. Чтобы не пропустить следующие уроки, подписывайтесь на канал и не забывайте ставить пальцы вверх. Ссылка на это видео - 🤍 Уроки веб-дизайна с нуля для начинающих – 🤍 Блог о веб-дизайне и интерфейсах – 🤍 Я Вконтакте – 🤍 Мой Instagram – 🤍 Бесплатный курс – 🤍 Двухмесячный курс с обратной связью и трудоустройством – 🤍 ВК: Двухмесячный курс с обратной связью и трудоустройством – 🤍
Подробнее о курсе "Верстка-Мастер. Полное руководство": 🤍 Исходные материалы к уроку тут: 🤍 Это первый урок из серии уроков по верстке сайта. В нем мы рассмотрим структуру макета, выполним все необходимые подготовительные задачи. Установим Figma, редактор кода, вырежем из Figma все необходимые для верстки изображения.
Промокод на скидку 15% на все курсы ITVDN- H94BCAB UX/UI дизайн для начинающих - 🤍 UX/UI базовый курс - 🤍 Материалы вебинара - 🤍 Figma — это кросс-платформенный онлайн-сервис для разработки интерфейсов и прототипирования с возможностью организации совместной работы в режиме реального времени. Figma подходит как для создания простых прототипов и дизайн-систем, так и сложных проектов (мобильные приложения, порталы). В последние годы Figma стала одним из любимых инструментов в работе дизайнеров интерфейсов и веб-разработчиков. Участников вебинара ждет знакомство с программой Figma, ее функционалом и возможностями. Алла Штогрина покажет основные фишки этой программы и подскажет, как начать работу с ней. План вебинара: - Панель инструментов. - Работа с фреймами. - Создание структуры сайта, сетки и колонки. - Рисование в Figma, работа с изображениями. - Создание компонентов. - Прототипирование. - Основные плагины. - Адаптация макетов под различные устройства. 00:00 Вступление. Знакомство с автором 1:31 Курсы по UX/UI дизайну 3:07 План вебинара 5:06 Панель инструментов (слои, инструменты) 11:17 Координаты, сетка. Работа с фреймами 16:00 Стили 24:07 Рисование в Figma. Работа с изображениями 38:21 Создание компонентов 49:30 Прототипирование 1:04:29 Плагины 1:22:56 Адаптация под планшет 1:27:10 Адаптация под мобильные ус-ва 1:31:43 Объяснения по адаптации 1:37:50 Вопросы и ответы #figma #фигма
Урок по Figma с нуля за 1 час! Веб дизайн для начинающих (основы UI). 🤍 - скидка 30% на курс «Супер Figma», действует только 2 дня! Фигма - самый популярный софт для веб-дизайна и создания интерфейсов. Программа по праву считается главным инструментом среди веб и UX UI-дизайнеров по всему миру. Скачать Figma: 🤍 Автор курса: Максим Кузнецов (🤍 Канал автора: 🤍 00:00 - установка приложения 05:20 - интерфейс 09:47 - инструменты и главное меню 12:20 - создание и редактирование frame 17:10 - иерархия фреймов и страниц 20:30 - перемещение по холсту 24:30 - работа с текстом 37:20 - создание первого экрана сайта 44:10 - добавление изображения 50:10 - создание кнопки 58:40 - курс «Супер Figma» 01:00:40 - плагины 01:03:00 - работа с векторными объектами 01:10:40 - заливка и обводка Подробнее о курсе от команды VideoSmile.ru: Курс разработан таким образом, что вы изучите Фигму на практике, создавая веб-сайты, интерфейсы и приложения. Под руководством автора вы познакомитесь с возможностями программы и создадите крутые работы для своего портфолио. Дополнительно в курс мы включили главы по основам графического дизайна и финальную главу о том, как успешно начать карьеру в веб-дизайне. После успешного прохождения курса вы сможете брать свои первые заказы на фрилансе или устроиться джуниором (младшим специалистом) в студию. В курсе вас ждёт: - 40 практических занятий - Сертификат о прохождении курса - Никаких ограничений по времени - Обратная связь и кураторство - Чат в Telegram Сайт: 🤍 Telegram: 🤍 ВК: 🤍 Instagram: 🤍 Facebook: 🤍 #figma #videosmile #webdesign
В данном уроке вы узнаете как сделать дизайн карточки товара для Wildberries с нуля в Figma. Мы будет оформлять дизайн товар Дезодорант в Фигма для Вайлдбериз. Таймкоды: 00:00 - Старт 01:56 - Начинаем рисовать 05:50 - Фон 07:05 - Делаем тень 10:22 - Подбор шрифта 12:43 - Кружок для объёма 15:20 - Цветок 17:05 - Результат _ Мои контакты: 🤍 Мой ТГ с уроками: 🤍 _ #wildberries #карточкатовара #figma #дизайнкарточки #валдберис
В этом видео мы изучим основы Фигмы с нуля до первых результатов. Оно рассчитано на новичков, никогда ранее не работавших с программой. Цель этого видео — дать быстрый старт, если вы хотите начать изучение Фигмы. Если вы хотите освоить Фигму во всех подробностях, то у меня для этого есть отдельный курс: 🤍 — курс "Супер Figma" Другие видео с канала, которые полезно посмотреть в дополнение: 🤍 — Фреймы и группы 🤍 — Auto layout 🤍 — Компоненты 🤍 — Сетки 🤍 — Лучшие плагины 🤍 — Эффекты слоев 🤍 — Figma community 🤍 — Варианты 🤍 — Интерактивные компоненты Подписывайтесь на соцсети: Телеграм: 🤍 Инстаграм: 🤍 Behance: 🤍 Dribbble: 🤍
Скачать файлы для проекта здесь 🤍 #карточкатовара #wildberries #figma
🔥Промокод на скидку 15% на все курсы ITVDN- H94BCAB UX/UI дизайн для начинающих - 🤍 UX/UI базовый курс - 🤍 Материалы вебинара - 🤍 Мобильные устройства - телефоны, планшеты, другие гаджеты - стали неотъемлемой частью нашей жизни. Разрешение их экранов могут варьироваться от 200 до 3000+ пикселей, что добавляет пикантности процессу разработки дизайна. Однако, графический редактор Figma является прекрасным средством проектирования актуальных и отзывчивых интерфейсов мобильных приложений. Он обладает всеми необходимыми удобствами и полезными инструментами для веб-дизайнера. Автор вебинара Алла Штогрина покажет на практике, как использовать весь потенциал Figma, реализуя дизайн с нуля до уровня полноценного макета, готового к передаче разработчикам. Вас ожидает создание дизайна мобильного приложения с Figma. Если вы еще не знакомы с программой Figma, рекомендуем посмотреть запись вебинара «Веб-дизайн с Figma. Легкий старт». В нём Алла Штогрина прошлась по основам работы с программой Figma. План вебинара: Особенности мобильного дизайна. Отрисовка прототипов, подготовка набросков того, как будут выглядеть экраны в Figma. Проектирование User Flow в Figma. Отрисовка эскизов для wireframes в Figma. Подбор подходящей цветовой гаммы и графических элементов в Figma. Прототипирование в Figma. Анимация и микровзаимодействие в Figma. Тестирование на этапе дизайна в Figma. Передача разработчикам. 00:00 Вступление. Знакомство с автором 1:57 План вебинара 2:46 Особенности мобильного дизайна 7:09 Проектирование User Flow 9:35 Отрисовка эскизов 10:24 Создание wireframes и прототипирование 13:10 Figma: проектирование экранов мобильного приложения 26:25 Подбор цветовой гаммы, графических элементов. Отрисовка 1-го экрана 53:29 Отрисовка 2-го экрана 1:28:55 Отрисовка 3-го экрана 1:46:36 Тестирование на этапе дизайна 1:47:57 Передача файлов разработчику с использованием Zeplin. Добавление стилей 1:54:28 Подведение итогов 1:58:32 Вопросы и ответы Если вас интересует веб дизайн с чего начать, веб дизайн уроки, уроки веб дизайна, фигма уроки, обучение Figma, веб-дизайн Figma, фигма, на ITVDN вы найдете подборку качественных материалов, которые позволят вам овладеть данным инструментом веб-дизайна.
Хочешь больше полезностей о веб-дизайне и карьере в IT? Вступай в чат Гильдии дизайнеров: 🤍 Подписывайся на мой инстаграм: 🤍 Читай мою книгу: 🤍 Приходи ко мне на курсы: 🤍 Мой Dribbble: 🤍 Мой Behance: 🤍 #IT #карьера #дизайн #веб-дизайн #UX #UI 0:00 Приветствие 0:32 Десктопное приложение и веб-версия 1:35 Создание файла 2:10 Фреймы 3:10 Инструмент «Прямоугольник» 3:28 Выравнивания 5:44 Скругления и повороты 6:10 Привязки (Constraints) 7:21 Полупрозрачность 8:05 Заливка (Fill) 8:25 Растровые изображения, фотографии, картинки 9:28 Обводки, рамки (Stroke) 10:28 Эффекты (тени, размытия) 11:47 Фигуры и вставка картинок 12:10 Слои и их порядок 12:51 Эффект стекла 14:38 Размытие элемента 15:34 Экспорт 16:17 Перо и карандаш 17:15 Текст 20:22 Авто-лейауты 20:28 Компоненты 25:22 Стили 28:36 Ссылка на файл 29:26 Подведем итоги
Это мини-курс Первая космическая скорость в Figma! Чтобы получить остальные уроки нужно пойти в чат-бота в Телеграм по ссылке 🤍 и вводить команды уроков из видео.
Меня зовут Катя, в этом видео я рассказываю о там, как стать UX/UI и как я искала первых клиентов на фрилансе. Канал с полезностями: 🤍 Та самая статья: 🤍 Книга про фигму: 🤍 Сайты, которые можно повторить: 🤍 🤍 🤍 ——— Подпишитесь на канал. Спасибо! Приятного аппетита! Мой instagram: podkamushkina Моё портфолио: 🤍 #дизайн #uxui
#абрамовамарина #дизайнприложений В этом видео показываю как сделать простой кликабельный прототип приложения в Фигме. Плюс немного рассказываю про Smart Animate. ••• 9 июня старт курса по дизайну мобильных приложений 🤍 ••• Мой инстаграм 🤍 Телеграм канал 🤍
Это видео-уроки с закрытого курса по веб-дизайну Веб-Старт. Получить доступ к домашним заданиям, дополнительным материалам, итоговой работе можно по ссылке: 🤍
↓↓↓ Макет и ссылка на материалы в описании под видео ↓↓↓ Адаптивная верстка сайта с нуля для начинающих. Объяснение действий. В этом видео уроке я подробную покажу HTML CSS верстку простого макета из FIGMA. Поделюсь полезными приемами как быстро сделать адаптивную верстку, добавить мобильную навигацию и разместить видео на вашем сайте. :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: 💻 Курс "Профессия HTML верстальщик": 🤍 Обучение с наставником, 3 месяца, результат, гарантия. Старт курса: 27 Марта 2023 года 💻 Курс "JS Frontend разработчик + React": 🤍 Обучение с наставником, 3 месяца, результат, гарантия. Старт курса: 17 Апреля 2023 года 🏁 Обучение с нуля 💁♂️ Обучение с наставником 🎯 Доведение с нуля до результата 🏢 Помощь с трудоустройством 💵 Поможем взять первый заказ на фрилансе :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: 💻 Бесплатный курс по верстке сайтов: 🤍 :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: МАТЕРИАЛЫ К УРОКУ: • Макет: 🤍 • Код с урока: 🤍 • Урок по VS Code: 🤍 • Основы HTML: 🤍 • Сброс стилей reset.css: 🤍 ТАЙМ КОДЫ: 00:00 Знакомство с макетом и старт проекта 03:38 Сброс стилей 18:02 Базовые стили, контейнер, шрифты 29:57 Контейнер 33:40 Верстка шапки с навигацией 1:10:30 Верстка верхней секции 1:47:35 Секция How It Works - заголовок 2:04:48 Секция How It Works - колонки 2:32:34 Секция Story 2:56:56 Секция Our Product 3:27:54 Подвал 3:34:16 Правка багов 3:37:37 Читкод для отображения десктопной версии на смартфонах 3:41:58 Адаптивная верстка шапки и навигации 3:50:20 Адаптация первой секции 3:56:10 Адаптивная верстка секции How It Works - заголовок 4:00:30 Адаптивная верстка секции How It Works - колонки 4:07:42 Адаптивная верстка Story 4:12:51 Адаптив для секции Product 4:38:05 Адаптив для подвала 4:43:02 Мобильная навигация, скрипты 5:06:24 Видео в секции Story, Скрипты :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: Меня зовут Юрий Ключевский. Я занимаюсь разработкой сайтов уже много лет, специализируюсь на front-end разработке и верстке сайтов, JavaScript и PHP программировании. Здесь буду делиться с вами информацией на разные темы по веб-разработке - HTML, CSS, JavaScript, jQuery, PHP, MySQL, React, Gulp. На нашем канале 🤍 вы найдете много полезных обучающих материалов, а так же сможете поработать со мной лично пройдя мои курсы. :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: Сайт школы ВебКадеми: 🤍 Наша группа Вконтакте: 🤍 Telegram канал: 🤍
В этом уроке сделаем классный шот в портфолио по UX/UI дизайну мобильных приложений для Dribbble или Behance. Это приложение мы дизайнили на одном из марафоном по дизайну приложений. Чтобы не пропустить следующие — залетай по ссылкам внизу. 🔹 Ссылки из видео: – Марафоны в ТГ: 🤍 – Марафоны в ВК: 🤍 – Саня Кво в Инсте: 🤍 – Исходники из урока: 🤍 – Курс по UX/UI дизайну: 🤍 🔹 Навигация по видео: 00:00 — Начало урока 00:25 — Как скопировать исходники 02:20 — Дизайн фильтров категорий через Auto Layout 06:16 — Дизайн карточки 10:28 — Наполнение остальных карточек 12:27 — Дизайн навигации Tab Bar 13:50 — Применение эффекта Background Blur 15:16 — Дизайн второго экрана приложения 16:40 — Дизайн блока с видео через Auto Layout 18:36 — Дизайн тегов через Auto Layout 22:40 — Кнопка 22:55 — Лайфхак с изменением непрозрачности слоя 22:37 — Финальный финал Кстати, не смотря на то, что мы дизайним два экрана, даже на них можно обкатать работу со стилями в Figme, Auto Layout и компоненты. Чтобы не удлинять урок, работу с компонентами разберём в отдельных видео: – Компоненты часть 1: 🤍 – Компоненты часть 2: 🤍 #figma #ux #ui
🎄 Большой предновогодний стрим с Андреем Гавриловым о перспективах карьеры в UX/UI-дизайне, граф. дизайне, и разработке сайтов. Оценим спрос, текущие реалии и востребованность на примерах и в цифрах. 🎉 Новогодняя распродажа курсов, подарки и волшебная игра: 🤍 👑 Наставничество с Андреем: 🤍 – старт 30 декабря 🚀 WAYUP. Время пришло.
Все материалы для даного макета вы можете скачать по ссылке 🤍 Также вы можете посмотреть урок по установке шрифтов 🤍 #figma #figma_tutorial #wildberries #карточкатовара
Подробнее о курсе "Веб-дизайн и верстка": 🤍 В финале из дизайна Вы увидите, как сделать интерактивный прототип, который можно отправить друзьям или заказчику.
Это DEMO-версия курса по анимации интерфейсов от школы UPROCK. Получить информацию и записаться на полный курс Вы сможете по ссылке 🤍 ⚡️⚡️⚡️ Получи профессию UX/UI дизайнер: 🤍 Освой дизайн мобильных приложений: 🤍 На этом канале Евгений Кузьмин (CEO & Design director студии UPROCK, топ-26 в рейтинге веб-дизайнеров по версии Tagline) делится своим опытом, рисует крутой дизайн, и разбирает типичные ошибки и портфолио участников вебинара. #апрок #uprock #вебдизайн #анимация #aftereffects
❗Подписывайтесь на мой телеграм-канал, чтобы получать стратегии быстрого старта в IT! - 🤍 Привет, я Сергей Дмитриевский: — Провожу курс по web разработке SD.CODE — Создаю полезный контент про IT и программирование — Руковожу командой программистов в Авито — Делюсь жизнью айтишника в Дубае За 2 года помог более 100 людям начать работать в IT. Сейчас у меня целая методология по обучению web разработке. У новичков часто возникает непонимание, в каком порядке и что нужно изучать, чтобы стать frontend разработчиком. Наличие плана обучения - критичный компонент, чтобы дойти до результата и устроиться на первую работу. Это видео даст тебе понимание, какие первые шаги тебе нужно сделать, чтобы начать. Секции: 0:00 Вступление. Как должен выглядеть план для Frontend-разработчика? 0:37 Шаг 1. Создание страницы на Git Pages. Основы Git и Hello world на html 2:29 Шаг 2. Где найти макет для вёрстки сайта? Figma community 4:11 Шаг 3. Создай структуру сайта 4:24 Основные html теги. Селекторы и правила CSS 5:18 Как правильно верстать страницу? Методология БЭМ 6:35 Как правильно разбить макет на блоки? 8:32 Вёрстка структуры для ПК и публикация на Git Pages 9:12 Шаг 4. Добавление интерактивности и изучение основ JS 10:13 Шаг 5. Убери различия между сайтом и макетом 10:38 Адаптивная вёрстка - с чего начать? 11:04 Как работает Pixel Perfect? Проверка адаптивности сайта 13:40 Проверь свой сайт в разных браузерах 14:21 Шаг 6. Как оптимизировать свой сайт? 15:03 Как оптимизировать изображения на своём сайте? 16:03 Автоматизация оптимизаций 16:33 Как измерить производительность сайта? 18:13 Шаг 7. Улучшение структуры кода 18:46 Подключи шаблонизатор вёрстки 19:48 Подключи css препроцессор 20:25 Линтинг кода - зачем он нужен и как добавить? 21:02 Автоматизация сборки 21:23 Оформление Readme.md 22:21 Итоги ССЫЛКИ ИЗ ВИДЕО: Git 🤍 Поиск макетов 🤍 Про БЭМ 🤍 Расширение Pixel Perfect для Chrome 🤍 Оптимизация картинок 🤍 PUG 🤍 Sass 🤍 Поставьте лайк и подпишитесь на канал, чтобы стать успешным программистом! #айти #программирование #разработка #frontend #backend ✅ Подписывайтесь на канал: 🤍 Подписывайтесь на меня в соц. сетях: 📲 Telegram 🤍 📸 Instagram 🤍
Дизайн экрана мобильного приложения в Figma В этом видео впервые на канале я создам дизайн пары экранов мобильного приложения в программе Figma. Веб-дизайн будет в следующих видео. Скачать макет - 🤍 📘На моем канале вы можете изучить профессию веб-дизайнера с нуля с помощью программы Figma. Я рассказываю о веб-дизайне без воды и ненужной информации. Разбираем как UI принципы, так UX. Также вы можете узнать особенности работы фрилансером. Основа обучение делается на уроках в программе Figma. Обучение Figma является приоритетной задачей для начинающего веб-дизайнера. Будь то вы дизайнером сайтов, мобильных приложений или других интерфейсов. В уроках вы узнаете как создать дизайн сайтов, Landing Page, интернет-магазинов, многостраничных сайтов. 🎥Сохраните это видео себе или поделитесь им с коллегами - 🤍 🔔Подписывайтесь на канал 🤍 💻Сайт с полезными статьями по веб-дизайну, шаблонами для Figma 🤍 ✍ Индивидуальное обучение - пишите на mail - denis.timoshitskiy🤍gmail.com (Работаю как с начинающими, так и с опытными веб-дизайнерами). Дизайн экрана мобильного приложения в Figma ☑️ Instagram - 🤍 ☑️ Telegram канал - 🤍figma_info ☑️ Паблик ВК - 🤍 ☑️ Мой сайт по Figma - 🤍 Смотрите также, 📺 Обзор программы Figma 🤍 📺 Курс веб-дизайн за 1 месяц 🤍 📺 Дизайн интернет-магазина в Figma 🤍 📺 Ре-брендинг ресторана 🤍 #Вебдизайн #Вебдизайнер #Figma #UI #UX #ДизайнСайта #РаботаФрилансером #WebDesign #WebДизайн #WebДизайнер #КурсыВебДизайна #ДизайнСайтов #ВебДизайнСнуля #КурсыВебДизайн #КакРаботатьУдаленно #УрокиFigma #КакСтатьВебДизайнером #ДизайнИнтерфейсов #УрокиВебДизайна #ШколаВебДизайна #КакСделатьДизайнСайта #ДизайнерМобильныхПриложений #ДизайнLandingPage #КурсFigma #КурсПоФигме #КурсФигма #КурсыUxДизайн #ПрофессияВебДизайнера #БесплатныйКурсПоФигме #БесплатныйКурсFigma #НаучитсяВебДизайну #ВебДизайнДляНовичков #ВебДизайнСайта #СекретыВебДизайна
Освойте базовые навыки в веб-дизайне за 9 дней и научитесь создавать сочные элементы интерфейса в Figma и Photoshop 🤍 Группа WDI VK - 🤍 Записаться на наши курсы - 🤍
❗Подписывайтесь на мой телеграм-канал, чтобы получать стратегии быстрого старта в IT! - 🤍 Привет, я Сергей Дмитриевский: — Провожу курс по web разработке SD.CODE — Создаю полезный контент про IT и программирование — Руковожу командой программистов в Авито — Делюсь жизнью айтишника в Дубае За 2 года помог более 100 людям начать работать в IT. Сейчас у меня целая методология по обучению web разработке. Одна из задач при реализации интерфейса - расположить элементы там, где нужно. С помощью flexbox можно удобно управлять расположением элементов в рамках родительского блока. В этом видео разобрался основные css правила по флексбоксам. Обязательно повтори всё своими руками! Приятного просмотра 🚀 0:00 Интро 0:32 Что такое Flexbox в CSS и зачем он нужен 0:43 Создание колонок в Flexbox 4:36 Создание меню в Flexbox 7:53 Добавим адаптивности 9:45 Подведём итоги Поставьте лайк и подпишитесь на канал, чтобы стать успешным программистом! #айти #программирование #разработка #frontend #backend ✅ Подписывайтесь на канал: 🤍 Подписывайтесь на меня в соц. сетях: 📲 Telegram 🤍 📸 Instagram 🤍
Всем привет, добро пожаловать, на первый урок из моего курса по вёрстке сайта с нуля для начинающих Верстать будем на чистом HTML | CSS без дополнительных инструментов. Ссылки: Дизайн - 🤍 Исходники - 🤍 HtmlBase - 🤍 Can i use - 🤍 Дизайн файлом - 🤍 Brackets - 🤍 VsCode - 🤍 Поддержать канал - 🤍 Телеграм чат - 🤍 00:00 - Введение 05:06 - Начало работы 12:16 - Шрифты 15:04 - Верстаем шапку 36:07 - Верстаем интро #Вёрстка #HTML #CSS
👇 FREE DESIGN RESOURCES 👇 🐦My Twitter: 🤍 🖥️ Personal website: 🤍 🎓 Design Courses: Figma:🤍 Learn UI/UX: 🤍 Design Portfolio: 🤍 Design Theory: 🤍 💰 Find High Paying Clients: Toptal: 🤍 Braintrust: 🤍 📊 Mockups + UI Kits: Ui8.net: 🤍 Ls.graphics: 🤍 💎 Design Systems: Stacks: 🤍 ✏️ Wireframe Kits: Source: 🤍 🤍 🎓 My Design Bootcamp: 🤍 💎 My Design Products: 🤍 ............................................................................................ 👉 Figma Course (50% OFF Coupon: FIRST-25): 🤍 🎓 Get Started in UI/UX (75% OFF Coupon: UX-24-HOURS): 🤍 💎 MY DESIGN ACADEMY: Get Started in UI/UX Design: 🤍 Figma Course: 🤍 Sketch Course: 🤍 Adobe XD Course: 🤍 How to Find Clients Course: 🤍 Sales Course: 🤍 ............................................................................................ DESIGNER'S ESSENTIALS: 🖥 The Best Software for WEB DESIGN: 🤍 📊 My UI Kits : 🤍
Это видео-уроки с закрытого курса по веб-дизайну Веб-Старт. Получить доступ к домашним заданиям, дополнительным материалам, итоговой работе можно по ссылке: 🤍
☑️НОМЕР КАРТЫ : 2200 3803 6693 7209 ☑️Моя группа VK 🤍
Подробнее о курсе "Веб-дизайн и верстка": 🤍 Увидите добавление основной информации: заголовок, подзаголовок, кнопку и другие элементы, которые будут в дизайне.
🔥🔥🔥 Гайд по UI/UX за подписку в Instagram! 1. Подписывайтесь на меня в Instagram 🤍im.poliakov 2. Пишите в ЛС «Хочу Гайд» 3. Бесплатно получите Пошаговое руководство «Как стать дизайнером интерфейсов и начать зарабатывать»: 🤍 🔥🔥🔥 Рассказываю, как проектировать мобильное приложение в Figma. Создаем основные ваерфреймы приложения для инвестиций. Разбираем на примерах основные моменты и нюансы при дизайне мобильного приложения в Фигме. 📍 Навигация: 00:00 Вступление 00:58 Создание основных фреймов блока авторизации 03:28 Проектирование блока авторизации 10:16 Создание фреймов для приложения 11:36 Проектирование мобильного приложения 17:44 Подведение итогов 18:10 Завершение ★Полезные видео★ Auto Layout в Figma на реальных примерах (2021): 🤍 UI, UX и Usability | Что это такое, в чём отличия и кто такие UI/UX Дизайнеры: 🤍 Работа с мастер-компонентом в Figma: 🤍 #figma #mobileapp #design
❗Подписывайтесь на мой телеграм-канал, чтобы получать стратегии быстрого старта в IT! - 🤍 Привет, я Сергей Дмитриевский: — Провожу курс по web разработке SD.CODE — Создаю полезный контент про IT и программирование — Руковожу командой программистов в Авито — Делюсь жизнью айтишника в Дубае За 2 года помог более 100 людям начать работать в IT. Сейчас у меня целая методология по обучению web разработке. Верстка - это просто. Нужно знать несколько базовых концепций, которые покрывают большую часть задач. Основные задачи: 1) Структура 2) Layout 3) Стилизация В этом видео на примере верстке блока из макета я показываю реализацию этих трех основных задач. Полезные инструменты: 1) Сервис 🤍 для оптимизации изображений 2) Браузерное расширение Pixel Perfect 🤍 Поставьте лайк и подпишитесь на канал, чтобы стать успешным программистом! #айти #программирование #разработка #frontend #backend ✅ Подписывайтесь на канал: 🤍 Подписывайтесь на меня в соц. сетях: 📲 Telegram 🤍 📸 Instagram 🤍
Figma 2021 Smart animate Tutorial - Gif and Parallax animation for Website. Smart animate parallax Website Design for project Presentation. I will show design process, animation techniques and recreate animation in Figma. I'll show How you can Animate website project in Figma. ―――――― *What do I use to speed up my workflow?* 🚀 👉 Mouse Corsair Scimitar: 🤍 👉 Stream Deck: 🤍 👉 Desktop Whiteboard: 🤍 ―――――― 🎬MP4 to GIF Converter - 🤍 🍕If you like what I do - you can support me and buy a pizza - 🤍 00:00 Start 00:46 First screen 05:35 First screen Graphs 09:00 Create gif for animation 13:40 Parallax Bottle 20:21 Zoom / Parallax / Masks 23:14 Create simple gif in Photoshop 27:40 Hand with bottle 29:41 x4 bottles 31:25 Simple parallax 35:03 Fade in white 36:24 Final touch 💪 Follow me Behance 👉 🤍 Dribbble 👉 🤍 Instagram 👉 🤍 Facebook 👉 🤍 👽 Igor Vensko Web / Graphic / UI / UX / Designer Always available for interesting projects Working in Photoshop / Adobe XD / Sketch / Principle / Illustrator / Indesign / Blender Playlists: Book Cover Design - 🤍 Motion - 🤍 ~~~~~~~~~~~~~~ 📃 Images - Adobe stock / Pixabay / Unsplash 🎼 Music - Youtube Audio Library / Adobe stock #website #figma #animation #tutorial #ui #ux #designer #parallax #igorvensko #freelancer #motion #photoshop
❤️ 2-х месячный курс UI/UX Designer Pro: 🤍 ✅Подпишитесь на канал: 🤍 📲Сайт академии digital-професии: 🤍 📲Instagram Игоря Джазова: 🤍 На этом вебинаре поговорим о том, как начинающему и практикующему UI/UX дизайнеру повысить свой доход и уровень. Программа вебинара: 3:15 Почему твой доход в дизайне не растет 6:17 Специализации UI/UX дизайнера 12:00 Форматы работы в UI/UX дизайне 13:00 Программы для UI/UX дизайна 17:20 Автоматизация UI дизайна 20:25 Как повысить доход в UI/UX дизайне 24:00 Навыки и вакансии по UI/UX дизайну 30:40 Будущее UI/UX дизайна 41:00 За что платят в UI/UX дизайне 49:00 Курс UI/UX Designer Pro Игоря Джазова 1:11:00 Ответы на вопросы 🔥Последние популярные видео: Учимся веб-дизайну на примере с нуля: 🤍 UX дизайн для новичков: 🤍 Основы digital-маркетинга: 🤍 Как новичку стартовать в UI/UX Дизайн: 🤍
.svg){kind=small}
![[Анимация интерфейсов: Старт] Программы для создания веб анимации](https://i.ytimg.com/vi/vI0cS3EB354/mqdefault.jpg "[Анимация интерфейсов: Старт] Программы для создания веб анимации")
