ym104432846
Вставьте ссылку на видео из Youtube, Rutube, VK видео
Задайте вопрос по видео
Что вас интересует?
00:02:17
Регистрация и интерфейс Figma:
  • Участники обсудили процесс регистрации и входа в сервис Figma, предложив использовать регистрацию через Google-аккаунт
  • Показано различие между браузерной версией и десктопным приложением Figma, рекомендовано скачивать последнюю версию для удобства работы
  • Рассказали о возможностях и функционале Figma, включая создание различных проектов, рекламных материалов и сайтов, подчеркнув потенциал заработка дизайнеров
00:05:51
Создание первого дизайн-файла:
  • 1. В дизайн-файл Фигмы можно загружать картинки, изображения, шрифты и создавать новые проекты, которые сохраняются на серверах программы бессрочно
  • 2. Пользователи смогут находить ранее созданные файлы благодаря подписанному названию рекламных креативов, удобному поиску внутри программы
  • 3. В одном дизайн-файле возможно создание нескольких страниц для разных типов материалов (например, рекламные креативы и обложки для YouTube)
00:07:57
Работа с объектами и слоями:
  • 1. В дизайн-файле сейчас отсутствуют созданные слои
  • 2. Пользоваться будут основным интерфейсом и инструментами, начиная с фрейма
  • 3. Фрейм является начальной точкой создания любого дизайна
00:08:28
Рисование и работа с фигурами:
  • 1. Участники обсудили возможность рисования различных фигур (прямоугольника, линии, стрелки, эллипса, звезды)
  • 2. Для начала рисования выбирается фигура, после чего ставится крестик в произвольной точке рабочей области
  • 3. Предложено использовать термин «ректангл» (прямоугольник) для обозначения стандартной геометрической фигуры
00:09:13
Управление масштабом и позиционирование:
  • Разработана новая функция приближения рабочей области с помощью комбинации клавиш Ctrl + колесико мыши
  • Для передвижения рабочей области используется комбинация клавиш Пробел + левая кнопка мыши
  • В интерфейсе программы добавлены инструменты рисования (перо, ручка, инструмент Pen), а также возможность вставки текста в произвольное место
00:11:00
Комментарии и совместная работа:
  • Появилось новое облачное поле-комментарий для заметок дизайнеров
  • Средняя стартовая зарплата начинающего дизайнера составляет около 70 000 рублей в месяц
  • Стоимость небольших проектов (например, дизайн рекламного креатива) варьируется от 2 000 до 3 000 рублей
00:13:18
Использование плагинов и дополнительные возможности:
  • 1. В программе Figma реализованы дополнительные инструменты (плагины), позволяющие деформировать текст и изменять его форму
  • 2. В интерфейсе Figma выделены три режима работы с векторной графикой, каждый из которых имеет уникальные возможности для рисования и изменения объектов
  • 3. В панели настроек объектов можно выбирать толщину линий, цвет и степень прозрачности объектов, используя встроенную палитру цветов и ползунки регулировки параметров
00:20:10
Цветовое решение и градиенты:
  • Показана работа с градиентной заливкой, включая создание перехода между цветами и изменение положения цветовой линии
  • Рассмотрено использование различных функций работы со шрифтами, таких как закругление углов фигур и добавление обводки
  • Описаны функции добавления теней и различных эффектов (блюз, внутренняя тень, шум, текстура), позволяющие улучшить визуальное восприятие объектов
00:28:46
Практическое применение знаний:
  • 1. Задача рекламной кампании — привлечение внимания через провокационный юмор и использование ярких фирменных цветов (красный, желтый, коричневый)
  • 2. Основные элементы рекламного креатива: изображение бургера, слоган «Смотри, не обострись», логотип, фон с элементами огня и искр
  • 3. Используемый инструмент для разработки рекламного креатива — программа Figma
00:44:49
Основы дизайна и типы шрифтов:
  • 1. Для рекламного креатива планируется использовать шрифт с провокационным юмором, подходящий современным и технологичным сферам (строительство, спорт, бытовая техника)
  • 2. Рассматриваются три типа шрифтов: гротескные (прямые, без засечек), антиквенные (классические с засечками) и стилизованные (рисовка, рукописные буквы)
  • 3. Предположительно выбранный шрифт будет стилизованным, похожим на буквы из игры «Киберпанк»
00:46:37
Настройки шрифтов и стилизация текста:
  • Принято решение
  • Договорились
  • Поручено
01:12:18
Применение сетки и направляющих:
  • Логотип решено разместить структурированно, чтобы он гармонично вписался в общий дизайн рекламного креатива
  • Для размещения логотипа использованы направляющие линии и сетка дизайна
  • Размер логотипа (171×171 пикселей) и отступ от заголовка установлены равными 20 единицам
01:15:00
Создание рекламного креатива для Бургер Кинг:
  • 1. Разработан новый рекламный креатив для компании Бургер Кинг, объединяющий элементы слогана, изображений искр и логотипа
  • 2. Достигнуто решение разместить слой искр поверх логотипа и текста, сделав его наиболее заметным элементом дизайна
  • 3. Созданная композиция визуально воспринимается объемной и глубокой, улучшая восприятие текста и общей композиции рекламы
01:17:31
Процесс дизайна рекламного креатива для Тимати Картиг:
  • 1. Участники проекта решили создать рекламный креатив для мероприятия «Race Day», ключевая тема которого — картинг
  • 2. В процессе разработки креатива участники использовали готовые изображения и текстуры, включая логотипы, фотографии картинга и текстуру асфальтового покрытия
  • 3. Итоговый результат включает в себя рекламный креатив с элементами стилизации (потёртые буквы, дым, текстура асфальта), выполненный в стиле гоночной трассы, подчеркивающий атмосферу драйва и финальной гонки
0: Полный курс по фигме для Новичков. Сегодня мы с вами освоим весь самый полезный функционал программы фигма, и вы будете готовы к тому, чтобы начать работать над реальными дизайн проектами. В этом видеоуроке вы познакомитесь с интерфейсом и освоите все инструменты в программе фигма после просмотра.
1: Этого видео. Вы создадите свои первые 2 работы в дизайне по реальным заданиям от 2 крупных компаний. Это компании бургер кинг и тимати картинг. В этом уроке я максимально понятным языком, без сложных терминов все расскажу и, самое главное, покажу, куда нажимать, чтобы вы
2: Самостоятельно смогли повторить дизайн вместе со мной и добавить эти работы к себе в портфолио. Даже если никогда до этого не занимались дизайном. В этом видео вы узнаете, как правильно делать продающий дизайн и как начать зарабатывать на этом деньги. Также я расскажу, какие са
3: Самые частые ошибки совершают новички, и как начать работать без опыта я дам ответы на все вопросы, и вы уже сможете делать дизайн лучше, чем большинство дизайнеров, и начнёте работать удалённо все материалы к этому уроку находятся в моём telegram канале по ссылке в описании, сразу скажу это.
4: Видео разбито по тайм кодам. Если какая-то информация вам неактуальна, например, мы сейчас будем проходить регистрацию в фигме. Если у вас уже есть аккаунт, если вы уже зарегистрировались в сигме, то можете спокойно этот момент перемотать, но я рекомендую смотреть видео полностью, потому что параллельно буду показывать
5: И регистрацию, и я буду рассказывать об интерфейсе и полезных инструментах. Меня зовут Кротенко Александр, я работаю дизайнером уже более 5 лет работал с авито, яндексом, втб и пикабу, а сейчас я главный дизайнер ювелирного бренда sokolov благодаря своему опыту я прекрасно.
6: Знаю, какими навыками должен обладать дизайнер и что он должен уметь, чтобы устроиться в крупную компанию и зарабатывать на самом старте от 70 000 ₽ в месяц. Смотрите видео до конца, запоминайте или записывайте обо всем. Об этом я буду рассказывать сегодня.
7: Уроке. А если вы хотите получить от меня обратную связь на ваши работы и задать мне вопросы лично приходите на марафон по дизайну для Новичков. Ссылка на него в описании, там же программа и отзывы учеников. Сигма ещё очень удобна тем, что она абсолютно не
8: Требовательно к железу. Что это значит? Вы можете работать в фигме с абсолютно любого старого компьютера или ноутбука. Почему так? Потому что фигма это онлайн программа бесплатная онлайн программа. Поэтому если у вас какой-то старый ноутбук или старый компьютер, вы
9: Спокойно. Можете уже сейчас начать работать в фигме. Давайте пройдём короткую регистрацию, покажу, как это делать. Для начала переходим на сайт фигма точка ком. Для того чтобы зарегистрироваться, нужно просто нажать вот сюда, на эту кнопку. Здесь вы можете ввести
10: Данные я предпочитаю заходить в фигму через google, то есть я проходил регистрацию с помощью google аккаунта вы тоже можете это сделать, если вам так удобно, нажимаем продолжить с помощью google аккаунта и выбираем аккаунт, с помощью которого хотите зарегистрироваться в сигме.
11: Когда мы с вами заходим в фигму, когда она загрузилась, мы с вами видим вот такую страничку. У вас здесь не будет ничего, кроме вот этих файликов. Здесь версия фигмы для браузера. Мы можем работать прямо в браузере. То есть вот ваш любой браузер, например, я пользуюсь яндекс браузером, но можно
12: Также фигму скачать и на компьютер. Для этого необходимо нажать на своё имя вот здесь слева и здесь у нас есть кнопочка скачать десктопное приложение. Давайте я вам сейчас покажу как это все выглядит. Вот приложение на компьютер. Вот браузерная версия в при
13: В принципе, все 1 и тоже. В десктопной версии нет лишнего интерфейса браузера. То есть вот этих всяких адресных строк кнопочек, которые относятся именно к браузеру, а не к фигме. Поэтому рекомендую скачать его. Теперь давайте быстренько пробежимся по основному
14: Интерфейсу фигмы, что мы видим на нашей домашней странице? Мы видим здесь наш, наш аккаунт. Здесь, кстати, можно выбрать тему. То есть если кто-то любит, например, тему светлую можно здесь переключить. Здесь мы можем переключаться между проектами. Вы можете создать разные вкладки, например,
15: У меня здесь есть вкладка с уроками, где у меня дизайн файлы со всеми уроками, которые я записываю для YouTube канала вот сюда нужно нажать на драфт, и здесь мы видим все, что я создал когда-то для YouTube канала, либо для вот нашего курса по дизайну, поскольку у вас фигма создана с нуля.
16: Для вас эта информация не супер актуальна, но хочу, чтобы вы знали, как в будущем можно делить свои работы на разные проекты. Если, например, работаете с разными клиентами или просто у вас проекты кардинально отличаются по смыслу. Вообще, я хочу, чтобы вы знали, что задач по дизайну очень много.
17: Иногда можно создавать рекламные креативы для социальных сетей, иногда можно создавать карточки товаров для маркетплейсов, например, для вайлдберрис или озона. Также можно создавать сайты, рекламные баннеры, брошюры, меню, открытки. И все это делает дизайнер и
18: Хороший дизайнер зарабатывает на этом от 8 000 ₽ в день. Вы тоже можете научиться делать это сами и начать зарабатывать на этом до работы. Дизайнером. Я работал в охране, зарабатывал 22 000 ₽ в месяц и 6 лет назад, как и вы сейчас, я тоже делал свой 1
19: Учебный проект. Я бы никогда не мог подумать, что он меня приведёт к тому, что я стану дизайнером. И если вы хотите попробовать профессию дизайнера понять, получится ли у вас ваше это или нет, что для этого нужно и сколько можно зарабатывать на дизайне. Приходите на марафон по диза.
20: За 5 дней поймёте всю базу, научитесь создавать рекламные креативы и обложки для видео на YouTube, с помощью нейросетей получите обратную связь, узнаете, как искать клиентов и заработать первые деньги без опыта и вишенка на торте самый активный и.
21: Из вас, то есть человек, который лучше всего будет справляться с домашними заданиями, получит своё 1 реальное оплачиваемое задание прямо на марафоне, ссылка на марафон и все подробности по ссылке в описании. Что ещё мы здесь можем видеть? Здесь мы можем видеть
22: Например, вкладочку вот эту. Здесь у нас отображаются последние дизайн файлы, с которыми мы взаимодействовали. То есть вот самые последние файлы, которые, в которые мы заходили, которые мы редактировали. И здесь у нас есть удалённые дизайн, файлы, остальные кнопочки нам не нужны.
23: Что нужно сделать вообще чтобы начать делать дизайн чтобы начать делать дизайн, нужно зайти вот сюда в drafts и нажать вот сюда дизайн и плюсик. Просто нажимаем 1 раз и у нас создаётся новый дизайн, файл простым языком. Дизайн файл это вот как
24: Папка на рабочем столе в эту папку, да, в этот дизайн файл мы можем загружать в дальнейшем с вами картинки, изображения, шрифты, делать разные здесь проекты. И это все фигма сохраняет у себя на серверах. В этом ещё 1 большой плюс фигмы в том, что она всю
25: Информацию вашу хранит и ничего не удаляет. То есть если вы сами не удалите дизайн, файл фигма будет его хранить бессрочно и вы можете даже через там несколько лет, если делали какой-то дизайн для заказчика и он попросил сделать его снова. Просто мы можем
26: Открыть старый дизайн файл и отредактировать любой рекламный креатив, который раньше делали. Теперь давайте перейдём к интерфейсу непосредственно рабочей нашей области нашего дизайн файла. Давайте пойдём слева направо слева у нас есть кнопочка фигмы. Сегодня она нам не нужн.
27: У нас здесь есть много всяких разделов, но сегодня мы пользоваться ими не будем. Эти разделы нам абсолютно не нужны для того, чтобы сделать наш, наши рекламные креативы. Также у нас есть название нашего дизайн файла. Нажимаем 2 раза сюда и давайте подпишем рекламные креативы.
28: Подписали как рекламные креативы. Для чего вообще подписывать? Для того, чтобы потом здесь у нас есть в фигме поиск, чтобы в поиске мы могли любой наш дизайн файл быстро найти. То есть просто это удобнее для будущей нашей организации работы.
29: Что мы можем видеть с вами дальше? Дальше? У нас здесь есть странички. В данном случае у нас в дизайн файле создана 1 страница, но мы можем создать и другую страницу для примера покажу вам. Видите, вот во 2 страничке мы создаём файл. В 1 страничке этого файла не видно.
30: Но это нужно для больших проектов, если, например, вы работаете с какой-то компанией и в 1 страничке делаете, к примеру, рекламные креативы в другой страничке делаете, к примеру, обложки для YouTube каналов также можно кликнуть правой кнопкой мыши по нашей.
31: Любой странички и удалить её совсем с концами. Дальше слева снизу у нас есть вкладочка слои, но пока что мы ничего с вами в этом дизайн файле не создавали, поэтому у нас в слоях ничего с вами нет. Что мы видим с вами снизу, снизу, посередине у нас
32: Основной интерфейс, которым мы будем пользоваться. Основные инструменты, которые будем использовать здесь у нас есть фрейм. Позже мы будем с вами его использовать. У нас вообще с фрейма начинается создание любого дизайна. Позже я расскажу вообще, для чего он нужен, что у нас ещё здесь есть из основного
33: У нас есть разные фигуры, которые мы можем рисовать, например, прямоугольник, линия стрелка, эллипс, полигон, либо звёздочку, например, давайте нарисуем просто какой-нибудь ректангл, то есть прямоугольник. По-русски говоря, что для этого нужно сделать, нажимаем на стрело.
34: Выбираем здесь фигуру, которую хотим нарисовать. У нас появляется вот такой крестик. Этот крестик ставим в любую часть рабочей области. То есть вот этот большой прямоугольник можем поставить в любое место. Здесь можно двигать его наш прямоугольничек, который мы с вами нарисовали. Соответ
35: Соответственно, вот так рисуются разные фигуры. Можно, например, нарисовать ещё эллипс, так расположить. Также мы можем приблизить наши объекты, то есть приблизиться к ним, не увеличивать объекты, а именно к ним приблизиться. Обратите внимание, у нас размер сейчас нашего объекта вот подписан.
36: То на 100 пикселей, и чтобы было удобнее работать, например, хотим приблизиться к объекту, чтобы видеть его крупнее, зажимаем с вами клавишу ctrl и колёсиком мыши, просто приближаем рабочую область обратите внимание у нас не изменился размер нашей
37: Нашего объекта, но мы рабочую область приблизили. Если мы хотим двигаться влево или вправо, или вверх вниз по рабочей области, просто зажимаете клавишу пробел. Большая широкая клавиша, зажали её и левой кнопочкой мыши. Теперь можем двигаться. Важно
38: Не отпускайте клавишу пробел. Если вы её отпустите, то двигать левой кнопкой мыши вы не сможете. Повторяю, если хотите передвинуть рабочую область, нажимаете пробел и левой кнопочкой мыши передвигаете, куда вам удобно. Отдаляем рабочую область. Делаю это с помощью клавиши.
39: Контрол и колёсико мыши. Давайте теперь посмотрим, что у нас есть ещё. У нас есть перо и ручка, мы можем с вами нарисовать что-то, либо можем нарисовать какие-то фигуры, то есть фигуры рисуются пером, инструментом, инструментом.
40: Penn а пенсилом мы можем просто всякие закорючки заветушки с вами рисовать, как в своё время это было возможно в программе paint кто знает, напишите, пожалуйста, комментарии, если кто-то помнит первые компы, на которых сидели, рисовали просто в пейнте, потому что больше делат.
41: Особо на них было нечего. Двигаемся с вами дальше. Дальше. У нас есть здесь кнопочка текст. Можем на неё нажать и в любое место также ставим наш крестик. У нас появляется место для ввода текста. Можем писать здесь все, что угодно. Давайте пока передвинем сюда.
42: Что у нас здесь ещё, поскольку фигма это онлайн программа, здесь можно работать сразу нескольким людям. То есть в крупных компаниях вы работаете обычно в 1 доске сразу с несколькими дизайнерами, потому что проекты большие, и вы можете работать, например,
43: Со старшим дизайнером в 1 доске. Соответственно, если вы нарисовали прямоугольник и круг, и, например, старший дизайнер считает, что круг получился недостаточно круглым, а прямоугольник недостаточно квадратным, он может нажать на эту кнопочку комментарий.
44: У нас появляется вот такое облачко белое в любое место им тыкаем и здесь можем написать круг недостаточно круглый. Ну, к примеру, все вот таким образом комментарии оставляются для тех,
45: Кто не видел остальные мои ролики, я быстро объясню, что такое дизайн. Некоторые считают, что дизайнеры это люди, которые рисуют иллюстрации от руки или делают сложную 3 д графику. Они правы, но не совсем. Профессия дизайнера гораздо шире, потому что дизайн окружает нас.
46: Повсюду, когда вы листаете ленту, инстаграмма или телеграмма, выбираете товар на вайлдберрис или озон, читаете блог или смотрите ролики на YouTube, вы видите иллюстрации и картинки, которые сделал дизайнер, и компании готовы за это платить, платить за
47: Обложки для YouTube каналов за карточки для wildberries или озон и платить за создание рекламных креативов что же, по деньгам средняя зарплата начинающего дизайнера начинается с отметки в 70 000 ₽ вот скриншоты из сайта по поиску работы headhunter плюс к вам могут обращать.
48: С какими-то небольшими проектами, например, сделать дизайн рекламного креатива стоит от 2 000 ₽, но опять же, когда вы опытный дизайнер, вы можете брать и больше точно также к вам могут обратиться за дизайном обложек для YouTube каналов за 1 я беру 3 000 ₽, а заказчики почти всегда приходят.
49: Запросом на несколько обложек. Вот можете посмотреть, я прикладываю скриншот и если вам интересна тема дизайна, и вы хотите понять, как зарабатывать на дизайне удалённо от 70 000 ₽ в месяц и найти первых клиентов без опыта. Смотрите это видео до конца обо всем этом.
50: В этом же уроке я буду рассказывать, чтобы прочитать этот комментарий, нужно навестись на коммент, и он откроется. Если вы сделали круг достаточно круглым и считаете, что комментарий исчерпан, то есть вы его выполнили, нажимаете на комментарий, и здесь есть вот такая галочка.
51: То есть до этого мы с вами на комментарии просто наводили. Теперь можно на него нажать левой кнопкой мыши, он раскрывается. И если вы правку внесли, можно нажать просто вот сюда он исчезнет дальше. У нас есть вкладочка, где мы можем подключать плагины, вообще пользоваться. Дополни.
52: Дополнительными, более сложными инструментами фигмы. Сегодня, кстати, попробуем с вами потестируем. Это такие программы, которые делают функционал фигмы более широким, более разнообразным. То есть, например, в сигме нельзя деформировать текст, то есть нет базового
53: Инструмента, который позволяет текст деформировать, например, его искажать, переворачивать, делать более плоским и так далее, и так далее. Но с помощью плагинов это можно сделать. Также есть ещё несколько режимов. 3 режима для работы в сигме есть режим для работы с векторами
54: То есть, если вы хотите что-то рисовать, вы можете переключиться вот на вот эту кнопочку нажав. И у вас здесь, во первых, у вас здесь слои отображаются. Иначе, если вы обратите внимание в нашем старта стандартном режиме, слои иконки у слоёв более мелкие в режиме
55: Векторной графики иконки у слоёв более крупные, здесь можно рисовать кистями, кисти можно менять. То есть какие хотите кисти вы можете брать в режиме нашем. Такая функция немножко по другому вызывается. Эта функция тоже есть в обычном режиме.
56: То есть не обязательно переходить в режим рисования. Можно просто вот здесь, в этой вкладочке, где у нас нарисована ручка. Берём перо, проводим любую линию, любую линию, нажимаем клавишу эскейп. 2 раза даже
57: 3 раза я нажал, чтобы вот у нас выйти из режима редактирования. Как понять вообще, что вы вышли из режима редактирования фигуры? Важно, чтобы у нас исчезли вот эти круглые кругляшки. Видите, вот кругляшки на концах нашей фигуры, как только
58: Они исчезли, значит, мы с вами фигуру больше не редактируем, и можно её, например, либо перекрасить, либо изменить. Например, кисть, которой она была нарисована. Как, например, сделать эту линию визуально, как будто бы нарисованной кистью.
59: Все просто вот линию нарисовали. Давайте ещё раз наглядно покажу, нажимаю с вами, пэн, ставлю 1 точку здесь, другую, к примеру, здесь можно, давайте нажмём просто клавишу enter. Все. Тогда с 1 раза у нас редактируемый режим выключается. Что
60: Делаем дальше, когда мы выделяем какой-то с вами файл какой-то с вами объект мы с вами выделяем, у нас справа появляются его настройки, то есть нажали на любой объект, справа появились настройки у каждого, причём объекта они разные, то есть у каждого
61: Они свои, например, у шрифта свои, у линии свои, у фигур свои выбираем нашу линию, например, здесь можно. Вот видите параметр строук. Здесь у нас толщина линии заложена, можно сделать её абсолютно любой толщины.
62: Я сделаю, к примеру, 5 пикселей. Вы можете сделать больше, можно покрасить её в белый цвет. Белый цвет у нас просто нажимаете на этот прямоугольник и выбираете белый цвет. У нас появляется вот такая палитра. Здесь вообще можно цвет выбрать, какой вы хотите, просто двигаете вот этот
63: Кружочек и цвет выбирается. Также можно подвигать цвет, изменить вот здесь, двигая вот этот ползунок, вот этот ползунок отвечает за прозрачность нашего объекта. Чем здесь меньше значение, тем более объект становится прозрачным и теперь
64: Как сделать в этом режиме линию, чтобы она была как будто бы нарисована кистью. Да, изначально мы за этим с вами её начали рисовать, выделяем линию и просто нажимаем вот сюда, на наши настройки линии нажали, здесь мы выбираем
65: Brush то есть у нас сейчас basic нам нужно выбрать браш и выбираем любую кисть, которая нам нравится, например, вот такая такой эффект у нас классный получился, то есть фигма в принципе позволяет быстро получать классное изображение, быстро работать с различ.
66: Эффектами, что у нас ещё есть, есть ещё режим разработчика, но нам он не нужен и он платный. То есть бесплатно мы с ним поработать не сможем. Удалим пока нашу линию и давайте с вами теперь рассмотрим правую панель инструментов, что на ней вообще есть. Давайте на
67: Начнём с простого справа. У нас есть сверху всегда вот 1 параметр, когда никакой объект не выделен, он есть. Если какой-то объект выделить, он исчезает. Это вот параметр страница вот page. Здесь у нас цвет нашей рабочей области. Как только вы зарегистрировались, у вас скорее
68: Всего будет здесь какой-то Светлый цвет. Ну хотя не знаю, сейчас, раньше всегда рабочая область была белой, но сейчас фигма, судя по всему, сразу делает. Если у вас тема серая, то фигма тоже делает серую рабочую область. Вы можете выбрать любой цвет, на котором
69: Вам будет удобно работать, это либо белый, либо чёрный, ну, чёрный, слишком контрастный. Будет давить на глаза. Белый тоже слишком яркий, на глаза давит. Я рекомендую вот что-то среднее, вот что-то вот темно серое, и глаза не устают. И в целом все объе.
70: Очень хорошо видно и все объекты хорошо различимы, что у нас есть ещё у нас здесь есть ещё кнопочка share, что вот эта синяя кнопка здесь мы можем поделиться, например, нашей нашим дизайн файлом. То есть, к примеру, у вас кто-то попросил ваш макет.
71: Заказчик, либо какой-то другой дизайнер попросил вас поделиться макетом, чтобы на его базе сделать какой-то дизайн, либо просто чтобы вам помочь, нажимаете на синюю кнопку, нажимаете копи линк и отправляете ссылочку к тому коллеге.
72: С которым хотите работать у нас на марафоне. Вот ученики, например, так делятся своими рабочими файлами с кураторами. То есть, чтобы куратор проверил, чтобы зашёл, чтобы дал полноценную обратную связь, посмотрел на макет. Отправляется ссылка и
73: Прямо в фигме смотрим домашние работы учеников на марафоне что у нас есть ещё если мы выберем, например прямоугольник, у нас появляются справа его параметры. Это расположение по оси икс и по оси игрек наклон в градусах. Давайте
74: Ставим 0. Здесь можно вводить значение от руки просто цифрами. То есть, например, 50 градусов. Либо, как делаю, я просто зажимаю левую кнопочку мыши на значении, зажимаю левую кнопку мыши и начинаю двигать зажатой левой кнопко.
75: Мыши крутить, вертеть. Но удобнее, конечно, писать вручную. Более точные значения получаются. Также у нас есть размеры нашего объекта 100 на 100, но мы здесь можем, например, сделать объект шире. Буковка в у нас отвечает за ширину дабл ю.
76: Если быть точнее, буковка h отличает, отвечает за высоту, то есть сейчас у нас разрешение нашего нашего прямоугольника 200 пикселей в ширину, 100 пикселей в высоту, чуть позже я расскажу вам, когда будем.
77: Создавать рекламные креативы. Расскажу, какие должны быть у них размеры. Пока что просто тестируем весь интерфейс на прямоугольнике, что у нас есть ещё у нас здесь из основного, что мы будем использовать, есть ещё палитра. Ну, уже мы с вами красили нашу линию, здесь мы можем
78: Нажать на прямоугольник и выбрать абсолютно любой цвет, что мы ещё с вами в палитре не посмотрели. У нас есть здесь пипетка, вот она. Можем её нажать и выбрать любой цвет, который нам нужен. Фигма позволяет делать цвета более сложные. То есть мы можем делать
79: Различные градиентные заливки. Что такое градиент? Градиент, это как бы цвет, который переходит из 1 оттенка в другой. Давайте покажу для того, чтобы включить градиентную заливку, нам необходимо нажать на вот этот прямоугольничек, который называется градиент.
80: Нажимаем и у нас появляется вот 2 таких ползунка, то есть до этого цвет выглядел так, сейчас цвет выглядит так, и на нашей фигуре появилась тоже линия с прямоугольничками прямоугольники это наши как бы цветовые области, то есть внизу у нас
81: Область темнее сверху область более светлая. Что мы можем сделать? Мы можем вообще эту линию как угодно нам располагать, например, по диагонали можно вот так можно так, так, так, так. И вот как вам хочется. То есть, как вы хотите, вот
82: Получить переход вот этот цветовой, так просто левой кнопкой мыши зажимаете вот этот кружочек и спокойно крутите как вам угодно, как вам необходимо. Я поставлю просто по диагонали. Теперь просто каждый из этих цветов мы открываем и можем
83: Здесь выбрать любой цвет, который нам нужен. Открывается та же самая палитра, с которой мы с вами уже работали. Например, здесь мы можем выбрать там цвет какой-нибудь оранжевый. Также можно добавить цвет, как это сделать? Делается? Это легко закрываем палитру, нажимаем про
84: Просто на нашей, на нашей линии в любое место левой кнопкой мыши, видите, появляется плюсик. Нажимаем, у нас создаётся ещё 1 цветовая зона, мы можем её покрасить как угодно получается вот такой красивый градиент. То есть делается это
85: Все супер, супер, быстро и легко. И давайте теперь быстренько ещё пробежимся по работе со шрифтами по настройкам шрифта кстати, ещё не показал вам 1 функцию. Смотрите, у нас есть ещё 1 функция, такая 1 из основных, которой мы с вами будем пользоваться. Давайте
86: Снова сделаем наш наш прямоугольник сереньким, чтобы так не пестрил в глазах. Для этого нам необходимо переключиться на обычную заливку и пипеткой. Просто вот этот серый цвет возьмём. Что мы теперь можем сделать с нашим прямоугольничком?
87: Приближу его, чтобы было удобнее напоминаю, что приближаю с помощью клавиш ctrl и колёсико мыши, выделяю прямоугольник здесь у нас с вами есть вот такой параметр, который позволяет закруглить углы прямоугольника и сделать, например, его.
88: Овальным, либо просто скруглить углы, чтобы они были более изящными, более мягкими. Также мы можем добавить строук, то есть обводку для нашего прямоугольника просто нажимаем вот здесь плюсик, где у нас строук и у нас добавляется на любую фигуру обводка.
89: Мы можем покрасить у неё отдельная палитра. То есть, если вы обратили внимание, вот мы выделили с вами прямоугольник, у нас здесь есть палитра, это его основной цвет и есть палитра его обводки. То есть это, эти 2 цвета могут быть абсолютно разными, какими вы только захотите, что
90: Можно ещё сделать, можно сделать, куда заходит обводка. Например, обводка заходит во внутрь, наружу или просто расположена по центру нашей фигуры. Также можно обводку сделать толще либо, например, тоньше здесь уже
91: Только опираетесь на свою фантазию и на свои задачи, которые вы преследуете, что у нас есть ещё у нас есть ещё блок эффектов. Давайте нажмём здесь на плюсик, посмотрим, что вообще за эффекты у нас есть. Сразу заметим, что у нас, когда мы включаем, просто добавляем
92: Эффект у нас всегда по дефолту, то есть по умолчанию добавляется тень. Нажимаем на наш прямоугольник и здесь можем нашу тень поредактировать, нажимаем вот сюда на квадратик и здесь у нас есть позиция по иксу.
93: По игреку блюр эффект, то есть заблюривание
94: Этот параметр мы с вами не используем. И также у нас с вами есть заливка тени, то есть насколько тень будет насыщенной, насколько тень будет плотной, чтобы изменить плотность тени, сделать её, например, более тёмной. Нажимаем вот сюда опять у нас уже знакомая палитра, которую мы с вами уже
95: Сегодня видели много раз и можем просто вот этот ползунок двигать правее. И у нас тень становится более чёрной. Также тень мы можем сделать, например, красной. Ну, здесь она уже похожа больше на свечение. Либо, например, синей, либо любого цвета, который
96: Вам нравится, который вам необходим, что у нас есть ещё, кстати, чтобы удалить любой эффект, просто нажимаем напротив него на минус. Если вы хотите посмотреть, как объект выглядит без эффекта, просто нажимаете глаз. Какие эффекты можем ещё добавить на наш прямоугольник на самом
97: Деле. Сейчас фигма выкатила много эффектов. Есть очень классные эффекты, которые уже, ну, могут поспорить даже с фотошопом, чтобы посмотреть, какие эффекты ещё есть. Либо нажимаем на стрелочку здесь, либо когда нажали на квадратик, можем нажать на стрелок.
98: Здесь здесь у нас есть эффект внутренней тени. Вот давайте покажу вам, как она выглядит. То есть вот внутренняя тень, то есть тень как бы падает внутри на объект. Видите, объект уже кажется, как будто бы какой-то углублён в наш фон. То есть благодаря внутренней тени мы
99: Можем делать такой эффект углубления фон, что у нас есть ещё у нас есть блюр эффект. Здесь всего 1 параметр. То есть, если, например, во внутри, ну, внутренняя тень и обычная тень не отличаются настройками, то есть также позиция блюр.
100: И заливка тоже самое у внутренней тени позиция блюр и заливка, то в эффекте просто blur в blur эффекте есть только 1 параметр, соответственно блюр одноимённо чем больше здесь параметр, тем сильнее наша фигура.
101: Рассеивается. Чем параметр меньше, тем она рассеяна меньше. Соответственно также у нас сейчас в фигме добавился прогрессивный блюр эффект, то есть градиентный блюр. Что это значит? Нажимаем сюда и теперь мы можем с вами у нас
102: Видите, 2 ползунка. Вот таких есть. 1 из ползунков мы можем сделать заблюренными, а другой нет. И получается вот такой крутой эффект рассеивания по градиенту. Видите, выглядит очень, очень симпатично, что мы теперь можем ещё сделать? Можем посмотреть бэкграунд блюр, но
103: Ground блюр мы сегодня касаться не будем. Есть у нас эффект noise. Можем добавить шум на наш любой объект. То есть вот знаете, как белый шум у нас есть по телевизору, либо сымитировать какой-то эффект соринок, сымитировать какой-то эффект песка. Очень, очень, тоже эффект.
104: Классный, полезный позволяет делать графику более реалистичной. И также у нас есть эффект текстуры, который позволяет делать наши картинки больше, более текстурированными, как будто бы их нарисовали краской, то есть здесь
105: Вот видите, позволяет делать вот такие классные штуки, например, можно рисовать какие-то камуфляжи, можно имитировать какую-то графику уличную, как будто бы, например, объект нарисовали опять же из баллончика и есть ещё 1 глаз эффект, но о нём мы поговорим.
106: Позже, в уроке мы сегодня им будем пользоваться, поэтому сейчас его затрагивать не будем. Именно в уроке об этом поговорим. Все, давайте все удалим и начнём уже делать дизайн по инструментам. Я вам рассказал. Кстати, давайте вернём, пока все назад вернул я назад с помощью клавиш кон.
107: Set если вдруг что-то удалили случайно, к примеру, что-то сдвинули, удалили, действие можно отменить с помощью клавиш ctrl плюс z. То есть нажимаете 2 клавиши ctrl z, и действие отменяется, можно его держать видите, у нас?
108: Все действия отменяются назад если просто держать контрол зет постоянно, если вдруг вы что-то случайно теперь отменили, то можно сделать отмену отмены отмена отмены делается клавишами ctrl shift z, то есть одновременно нажимаете.
109: Клавиши ctrl shift z и уже как бы перематываете действие вперёд например, вот случайно удалили обводку можно отменить клавишами ctrl z. Если вы поняли, что все-таки обводку нужно было удалить, можно действие вперёд.
110: Сделать отмену отмены и зажать клавишу ctrl shift z. И действие как бы отмена отменится надеюсь вы поняли ну постарался максимально понятно объяснить все это удаляем. Кстати, почему вообще вернул все назад, хотел показать вам вот так выглядит.
111: И теперь, то есть, когда вы создаёте объекты, чем больше объектов вы создаёте, тем больше эти, этих объектов будет здесь в слоях каждый объект по умолчанию подписывается. Если это ректангл подписывается как ректангл. Если это эллипс подписывается как эллипс, если
112: Это какой-то текст, он подписывается просто по 1 словам нашего текста. Ну сейчас мы будем с вами работать, мы в любом случае все слои будем подписывать, поэтому к этой части нашего интерфейса ещё будем обращаться неоднократно выделяем теперь все левой кнопкой мыши.
113: И просто нажимаем клавишу delete. Все у нас теперь рабочая область абсолютно пустая, и мы с вами готовы делать дизайн. Начнём с того, что у нас есть с вами 2 технических задания на 2 рекламных креатива, рекламный креатив для бургер кинга. Здесь у нас задача создать
114: Рекламный креатив с ярким акцентом на слоган основная цель привлечь внимание за счёт провокационного юмора в принципе практически всегда техническое задание дизайнер получает либо google документом, либо telegram просто сообщением, то есть примерно оно выглядит всегда вот таким образом.
115: Заголовок у нас воппер слоган смотри не обострись. Очень очень забавный слоган визуальные требования. Слоган должен быть показан крупно, максимально заметно использовать фирменные цвета бургер кинг красный, жёлтый, коричневый
116: Можно добавить аппетитное выражение воппера сочный бургер, пар искры, огонь, расплавленный сыр фон яркий, контрастный, чтобы усилить, усиливать восприятие текста, стиль дерзкий, ироничный, с фирменной провокационной подачей бургер кинг вообще все легко, максимально.
117: Техническое задание. Вот это вообще могли нам не писать здесь мы сейчас с вами и сами круто все сделаем. Сейчас будем делать. Я буду рассказывать вам, как вообще рекламный креатив сделать лучше, как делать его более читабельным, более заметным, чтобы аудитория, которая будет
118: Видеть рекламу вашего клиента, у него покупала, приходила в его магазины, кафе и так далее, и так далее. То есть все буду рассказывать во время дизайна, потому что у нас задача все-таки не просто сделать дизайн, а сделать его круто, чтобы клиент нам заплатил, чтобы мы на этом могли заработать.
119: Все-таки это очень важно. Все мы хотим кушать все мы хотим жить в хорошей квартире, ездить либо на своей машине, либо на такси, пить где-то вкусный кофеёчек и ездить там пару раз в год в путешествие. Поэтому все-таки мы должны помимо того, что работаем мы ещё
120: Должны зарабатывать, давайте теперь перейдём к нашим файлам, которые я уже подготовил для создания рекламного креатива. Вы должны были уже их скачать из нашего бесплатного telegram канала по ссылке в описании рекомендую подписаться, потому что у нас там выходит много полезного.
121: Во первых, там все файлы ко всем нашим урокам размещены, то есть, если вы хотите повторять дизайн из уроков, которые есть на YouTube канале, на нашем все вы найдёте, все файлы к этим урокам, вы найдёте в telegram канале. Плюс там есть разные полезные лайфхаки, например, как оплатить?
122: Подписку на фрипик без англоязычной карты за цену в 4 раза дешевле, чем она стоит. Если бы вы платили с англоязычной карты. Ну то есть всякие такие полезности переходите, подписывайтесь для себя полезные.
123: В любом случае найдёте. Итак, давайте теперь загрузим эти файлы, которые, повторюсь, вы скачали в нашу фигму, как это сделать. Я предпочитаю самый простой способ. Просто наше окошко немножко уменьшаем. Давайте его уменьшим посильнее, чтобы было удобнее и просто.
124: Просто перетаскиваем файлики, я их сложил в папку бургер кинг. Так вот здесь у меня, у меня просто на 2 мониторе она отображается. Давайте на 1 мониторе размещу вот графические материалы сюда заходим. Здесь у нас есть то, что у нас должно получить.
125: Красота наша, но мы пока не будем подсматривать и у нас есть бургер, искры, логотип и огонь. Все это нам необходимо загрузить вот сюда. Давайте выделим все эти 3 картинки, просто перетаскиваем фигму отпуска.
126: Ждём, пока загрузится. Загрузилось просто очень крупное. Можно отдалить с помощью клавиши ctrl и колёсико мыши можно отдалиться назад, и нам теперь ещё логотип нужно загрузить. Загрузили все отлично за.
127: Открываем нашу папку фигму пока можно расширить. Отлично. Мы с вами загрузили все файлы в нашу фигму. Что теперь будем делать? Давайте сначала все подпишем корректно, но у нас и так все подписано. Бургер, искры, огонь, логотип. Давайте подпишем не логотип 1, а прост.
128: Логотип. С чего вообще начинается у нас создание любого дизайна фигме в начале создания любого дизайна у нас лежит фрейм. Я вам о нём говорил в начале, но не рассказал о нём подробнее, обещал рассказать сейчас. И давайте сейчас этим займёмся. Фрейм.
129: Это у нас вот вот сюда нажимаем на стрелочку. Вот здесь у нас есть фрейм, нажимаем на него и в любое место в нашей рабочей области нажимаем левой кнопкой мыши. У нас добавляется фрейм размером 100 на 100 пикселей. Давайте его пока удалим. Покажу как ещё можно добавить фрейм.
130: Нажимаем также сюда фрейм, и обратите внимание у нас справа есть куча уже готовых фреймов под разные задачи например, под экран айфона 13, минии минии, под различные планшеты, например, ipad mini, что у нас ещё есть.
131: Различные десктопные версии, то есть, например, размер экрана macbook здесь уже все. Фрейм в пикселях сразу в необходимом размере создастся, но нам необходим фрейм для социальных медиа, здесь нам необходимо найти
132: Размер поста вот инстаграм пост 1080 на 1080 пикселей. Здесь мы делаем с вами вообще рекламный креатив не для инстаграм, а скорее для telegram, потому что сейчас в инстаграм рекламу делать невозможно, поэтому делаем с вами рекламный креатив для теле.
133: Grime либо можно, его заказчик может его разместить во вконтакте, но размеры всегда у нас одинаковые, то есть у нас размеры 1080 пикселей подходят для всех рекламных креативов, для всех платформ, где размещаются эти рекламные креативы, нажимаем сразу.
134: Вот сюда и у нас создаётся сразу реклам, сразу фрейм нужного размера 1080 на 1080 пикселей. Вот здесь можно проверить его размеры. Давайте немножко приблизимся, чтобы было удобнее и подпишем его сразу, как не инстаграм пост, а
135: Рекламный креатив или просто давайте бургер кинг burger king отлично ой, как-то криво подписал кинг. Вот так бургер кинг здесь вы видите, я собрал уже
136: Разные разные графические элементы. У нас есть с вами уже готовые 3 д изображения бургера, которые нам предоставил заказчик. Есть такой миф, что дизайнеру нужно уметь рисовать или нужно делать там какую-то 3 д графику. Нет, сейчас мы все делаем либо из готовых карт.
137: Либо есть бесплатные фотостоки, где мы можем брать готовые изображения, готовую 3 д графику. Вот, например, вот эти искры, огонь. Я это все скачал абсолютно бесплатно на фотостоках. Здесь все это спокойно находится в интернете и просто главное знать, где искать.
138: То есть чего-то рисовать или делать какую-то сложную графику нам не нужно, нам нужно сейчас просто это все в фигме правильно соединить, чтобы это все, все эти картинки правильно работали на нашу общую идею, на нашу общую цель, потому что мало сделать просто красивый дизайн нам
139: Важно все-таки, чтобы продукт был как бы в фокусе, чтобы продукт был заметен, чтобы продукт хорошо считывался, потому что у нас рекламные креативы все-таки нужны для того, чтобы сделать рекламу, а не показать, какие крутые мы дизайнеры. То есть мы как бы
140: То, что мы крутые дизайнеры, но не как бы не увлекаемся слишком сильно дизайном, чтобы дизайн не отвлекал от продукта. Такое тоже бывает. Если дизайн от продукта отвлекает, это не очень хорошо. Когда человек смотрит на рекламный креатив, должен видеть сразу продукт в данном слу.
141: Случае у нас должен очень хорошо считываться буркер, а текст, который мы с вами добавим, в данном случае заголовок вопер и слоган смотри, не обострись. Это уже как бы второстепенно, второстепенно, просто для того, чтобы человеку этот рекламный креатив, запомни.
142: Но главное, чтобы очень хорошо считывался наш бургер. Что мы с вами делаем? Давайте добавим бургер просто в наш рекламный креатив. Давайте его примерно вот так уменьшим. Если что, мы всегда пока делаем все просто так, по наити.
143: То есть я примерно сейчас расставляю наши объекты, мы их позже можем всегда чуть чуть подвигать, чуть где-то что то поменять спокойно. Если где-то мы поймём, что что-то нам не нравится, мы всегда это можем изменить. Давайте немножко, наверное, поторопился для
144: Сначала как добавить во фрейм наши картинки или давайте немножко даже назад отмотаем, расскажу для чего фрейм нужен, потому что перескочил. А это очень важная информация и это база прям дизайна. Всегда объясняю, это просто frame. Вот представьте художника, который рисует картину.
145: Художник, который картину рисует, он не может рисовать по воздуху. То есть он всегда рисует на холсте. И вот как холст у художника, так и frame у дизайнера. То есть мы своеобразные художники, и мы наши.
146: Краски в данном случае у нас красками. Я называю наши шрифты, наши картинки, мы это все закрепляем на наш фрейм тоже самое как художник, поэтому без фрейма мы просто не сможем собрать все наши части нашего изображения будущего.
147: Воедино, то есть frame нужен нам как такая вот клейкая лента, которая все это вместе соберём, соберёт как вот холст у художника, который все это на себе закрепит и мы сможем потом этой единой картиной, картинкой достать, экспортировать из
148: Фигмы и отправить заказчику. Давайте перетащим наш бургер в наш фрейм. Как понять, что бургер попал во фрейм, вот тащим его левой кнопкой мыши. Как только он сейчас во фрейм попадёт, у него обрежутся края. То есть все, что будет сейчас выходить за пределы.
149: Нашего фрейма, то есть часть бургера, которая за пределы фрейма будет выходить, она нам будет не видна. Давайте покажу. Вот беру снова бургер и затаскиваю его во фрейм. Отлично. Видите, бургер обрезался. Значит, он уже во фрейме. Как ещё понять, что бургер
150: Фрейме, вот обратите внимание, сейчас иконка находится слева. Вот все иконки наравне, но как только мы какую-то, какую-то картинку затаскиваем в наш фрейм, иконка этой картинки располагается немного правее, правее, чем
151: Иконка фрейма. Если у вас все так же, как у меня, то значит у вас все правильно и вы перенесли чётко изображение в наш фрейм. Что мы делаем с вами дальше? Дальше давайте уменьшим бургер сделать это можно следующим образом. Раньше нужно было зажимать несколько
152: Кнопок. Сейчас фигма сделала удобную кнопочку. Вот здесь она есть. Если у вас она выключена, проверяйте, чтобы была включена. То есть вот здесь у вас должно быть вот эта кнопочка должна быть синей. Что это за кнопка? Если её выключить, то у нас вот произойдёт вот такая
153: Такое безобразие с нашим изображением, оно просто обрежется. Если же у нас здесь кнопочка включена, она включена вообще по умолчанию, но на всякий случай проверяйте. И если мы теперь уменьшаем нашу картинку, картинка пропорционально со всех сторон уменьшается. Давайте
154: Вообще здесь зададим какой-то размер давайте например ширина 1000 пикселей чтобы у всех это был одинаковый размер и просто вот здесь посередине бургер разместим достаточно крупно у меня в голове уже есть примерная идея как разместить остальные элементы. Phone мы
155: Сделаем с вами темным фон мы сделаем с вами темным. Здесь мы сверху напишем крупно наш заголовок. У нас заголовок с вами воппер вот здесь крупно напишем. А подзаголовок, то есть наш слоган мы разместим как раз-таки снизу, вот здесь, на бургер.
156: Да, то есть смотри, не обострись, мы напишем как раз-таки внизу. То есть у нас бургер острый, здесь как раз возле лучка, где-то мы и напишем, почему вообще ещё взял, например, искры, почему взял огонь, как и сказал, исходя из слогана у нас вот слоган
157: Смотри, не обострись все мы понимаем, к какой фразе эта отсылка, да, то есть явно там имеется совсем, совсем другое, но слоган написан так, что нам этот слоган говорит о том, что бургер очень острый, и поскольку нам дали
158: Заказчик дал вот такой 3 д рендер этого бургера, как будто бы он в процессе готовки, то я хочу сразу же создать вокруг фон, как будто бы бургер где-то готовится в какой-то печи, в огне, в искрах. Мы сделаем так, чтобы это
159: Сильно не отвлекало от нашего бургера, то есть мы сделаем так, чтобы это не отвлекало, но как бы подчёркивало общую стилистику вот этой остроты и сочности горячести нашего бургера. Ну и конечно же, нужно будет ещё куда-то вписать логотип, чтобы он хорошо смотрелся и
160: Чтобы его было видно, чтобы вообще было понятно, какой компании принадлежит этот рекламный креатив, давайте теперь приблизим немного наш рекламный креатив, чтобы было удобнее с ним работать напоминаю, сделать это можно с помощью клавиш ctrl и колёсико мыши и сейчас с вами.
161: Сделаем фон более темным, но прежде чем мы начнём делать фон рекламного креатива, я расскажу 1 важную вещь, которую понял, когда сам учился дизайну и начал обучать веб дизайну учеников, когда вы только выбираете новую профессию. Неважно, коперайтинг это тестировщик веб сайтов.
162: Или веб дизайн может быть страшно, что работа не понравится, не будет получаться, или вы поймёте, что конкретно вам эта сфера не подходит, потому что обучение это классная инвестиция в себя. Но согласитесь, что все-таки хочется, чтобы она была не напрасной, поэтому здорово, когда есть возможность, прост.
163: Попробовать поработать, как бы пройти тест драйв будущей профессии. Например, сейчас, когда вы смотрите этот мастер класс, вам может казаться, что все, что я делаю, это очень сложно и у вас не получится, и вы не сможете придумать, как расположить шрифт или сделать верные блики на фоне
164: Но на самом деле достаточно просто попрактиковаться, а чтобы протестировать профессию дизайнера и понять, понравится вам быть веб дизайнером или нет и заработать свои первые деньги на дизайне, создал недорогой продукт марафон по дизайну. Марафон длится 5 дней за это время вы
165: Создадите 2 работы, которые сможете положить к себе в портфолио, научитесь создавать обложки для YouTube каналов с помощью нейросетей, поймёте, как найти своего 1 клиента сразу после марафона по сути вы вольётесь в профессию дизайнера и самое крутое лучший из вас.
166: Прямо на марафоне получит свой 1 реальный оплачиваемый проект неделю вы учитесь в группе в telegram, я проверяю ваши домашние задания ежедневно, мы с вами на связи в чате, я делюсь своим опытом и отвечаю на ваши вопросы, чтобы вы максимально быстро освоили.
167: Дизайна и поняли, как на этом зарабатывать. Напоминаю, после марафона в вашем портфолио будет + 2 работы. И в конце марафона у вас будет личный живой созвон со мной, на котором вы сможете задать мне любые, вообще абсолютно любые вопросы. И поймёте
168: Хотите ли вы развиваться в профессии веб дизайнера и начать зарабатывать удалённо или нет, обучение стоит недорого, а окупить его вы сможете сразу после марафона, просто выполнив 1 1 заказ, и если вам понравится, то вы сможете освоить не просто навык, а стать.
169: Востребованным специалистом и начать работать полностью удалённо из любой точки мира и по собственному графику. Захотите будете спать до обеда, как это 1 время делал я. Ну или, наоборот, после 16 ничего не делать и уделять время семье. Главное, вы перестанете тратить время на про
170: И нелюбимое дело, а получите возможность классную зарплату и быстро сделать карьеру, все подробности о марафоне, а также отзывы ребят, которые его уже прошли, вы найдёте по ссылке в описании. Переходите, смотрите и записывайтесь на марафон, пока есть места, а мы продолжаем.
171: Давайте сделаем фон, нажимаем на нашу палитру. Проверяйте, чтобы у вас был выделен фрейм, нажимаем палитру и давайте ползунок просто перетащим вот сюда, практически практически в угол. Вот такой цвет у вас должен
172: Быть можете скопировать просто мой цвет, как у меня 16 0 3 0 3. Этот цветовой код просто у себя его в палитре вводите и у вас такой же цвет будет, что мы с вами делаем. Далее давайте посмотрим на
173: Ещё раз техническое задание. У нас здесь есть текст. Давайте с ним начнём работать. Скопирую отсюда текст воппер контрол ц. Делаю, возвращаюсь теперь в фигму. Давайте с вами приблизим снова наш рекламный креатив, чтобы было с ним удобнее работать, и нажимаю клавишу.
174: Теперь т. Чтобы текст наш добавить, добавляю текст и вставляю сюда наше название воппер, давайте увеличим с вами наш текст до размера в 200 единиц, как я это сделал.
175: Выделяю текст, который хочу увеличить. И здесь у нас есть размер нашего текста. Вот здесь справа, вот здесь его размер вы можете сделать абсолютно любой. Сделаю пока 200. И давайте выберем шрифт, который мы с вами будем использовать. У нас здесь в тз есть как бы Зада.
176: Создать рекламный креатив с ярким акцентом на слоган. Основная цель привлечь внимание за счёт провокационного юмора. То есть у нас здесь как бы в рекламном креативе провокационный юмор. Поэтому нам важно правильно по смыслу подобрать шрифт, то есть шрифт
177: Например, вот такой он не подойдёт. Такой шрифт, вот такой шрифт называется гротескный шрифт. Есть основные вообще 3 основных вида шрифтов. Это гротескные шрифты, то есть шрифты прямые, без засечек, вот просто с прямыми рубленными буквами.
178: Эти шрифты зачастую очень аскетичные, очень простые, очень правильные с точки зрения геометрии, но подходят они для более современных, более технологичных каких-то сфер для строительства, например, для спорта, для какой-нибудь бытовой техник.
179: Все-таки здесь у нас шуточная, шуточная, такой шуточный рекламный креатив, да, с юмором, поэтому нам необходимо шрифт подобрать соответствующий. То есть гротески к нам не подходят. Также у нас есть, например, шрифты из семейства.
180: Тиква это вот 2, 2 разновидность. Ну давайте вот, вот какой-то вот такой например, найдём антиква. Шрифт это шрифт уже такой более классический с засечками, то есть с какими-нибудь хвостиками подходит под какие-то дорогие продукты, под
181: Например, какие-то гольф клубы под дорогие рестораны классические, под какие-то концерты. Ну опять же нам не подходят. Есть ещё шрифты стилизационные, которые такие вот в виде какой-то рисовки, буквы у них выглядят, могут
182: Могут выглядеть рукописными, могут выглядеть как будто бы нарисованные, нарисованы просто от руки. Ну, например, вот так это называется ееще стилизационные шрифты. Здесь мы вот такой шрифт и будем брать. Ну, не такой, примерно не такой конкретно. Это вообще шрифт из игры киберпанк, если кто играл
183: Должны узнать, мы возьмём с вами шрифт obelix pro. Вот он 1 у нас выскакивает это шрифт такой во первых хорошо читается, во вторых выглядит очень непринуждённо, очень как бы неофициально да нет какого-то
184: В нём официоза, он очень простой, но при этом и не супер какой-то искажённый. Легко читается, как я уже сказал ранее, хорошие, большие читаемые буквы, но по смыслу больше подходит под наш рекламный креатив. Вообще всегда, когда вы создаёте какие-то
185: Какой-то дизайн. Всегда выбирайте шрифты, чтобы они соответствовали по характеру к вашей задаче, вашему проекту. Если говорить о шрифтах. У нас есть ещё помимо марафона, полноценный курс по дизайну. Если вдруг вы хотите освоить профессию дизайнера и научиться зарабатывать на дизайне от
186: Тысяч рублей в месяц, то Велком все ссылки опять же в описании. Так вот у нас на курсе есть целый модуль по работе со шрифтами. То есть там я рассказываю о том, как подбирать шрифты, какие шрифты сочетаются друг с другом, как можно шрифтовые пары собирать, какие
187: Шрифты друг с другом использовать нельзя и так далее, и так далее. Даже рассказываю о том, какого размера должны быть заголовки, какого размера должны быть подзаголовки или обычные текстовые блоки, которые мы, например, размещаем на сайте. Поэтому, если вам интересна профессия дизайнера,
188: Хотите в ней развиваться, обучиться и зарабатывать, то переходите по ссылкам в описании вся информация у нас там, двигаемся с вами дальше. Давайте сразу покрасим наш текст, то есть сделаем наши буквы цветными, потому что белые, они мне не особо нравятся и как будто
189: Не супер, хорошо читаются. Выделяем наш текст и идём сразу в его палитру, заходим в его палитру и берём пипетку. Теперь аккуратно ничего не нажимайте. То есть не нажмите левую кнопку мыши, просто аккуратно отдалите рабочую область, зажмите клавишу.
190: Ctrl и двигайте немножко назад, то есть просто с помощью колёсика мыши и клавиши контрол отдалите рабочую область, пока не нажимайте левую кнопку мыши, иначе текст станет серым да, если мы нажмём на рабочую область, хочу сделать текст жёлтого цвета.
191: Фирменного цвета бургер кинга. Просто пипеткой возьму жёлтый цвет с логотипа бургер кинг, который есть в нашей Папке с нашими файлами, которые вы уже должны были скачать. Либо скачаете в конце видео. Отлично, палитру нашу закрываем и теперь давайте
192: Переместим наш текст под наш бургер в слоях ниже, то есть просто аккуратно перетаскивайте. Ага. У нас случился косяк, и хорошо, что он случился. Как раз-таки покажу, что в этом случае делать. У нас получилось так, что мы с вами
193: Случайно вытащили из фрейма наш текст. Как это лечить, лечить это все просто нажимаем просто клавишу ctrl z, но для начала прокомментирую, как я это понял, как я понял, что мы с вами текст вытащили из фрейма, как бы иконка текста встала в слоях.
194: На 1 линию с нашим фреймом такого не должно быть. Иконка. Буковка т нашего текстового блока должна быть правее, чем наш фрейм. Поэтому откатываем действие назад. Контрол зет. Видите, иконочка теперь правее. То есть у нас снова текст в слоях. Давайте
195: Теперь сделаем проще, чтобы не перетаскивать руками, потому что, видите, мы перетащили и случайно вытащили из фрейма нажмём просто правой кнопкой мыши на наш текст и нажмём клавишу сент ту бэк, чтобы у нас текст провалился под бургер отли.
196: Теперь давайте наш текст увеличим, потому что у нас сверху есть ещё место, есть ещё поля, чтобы сделать его больше. Давайте, например, выберем 230 230 размер текста прекрасно и поднимем его выше. Просто выделяем наш текстовый блок.
197: Поднимаем просто его стрелочками на клавиатуре, то есть я просто стрелочку на клавиатуре двигаю вверх, поднимаю наш текстовый блок выше, чтобы были отступы равные справа, слева и сверху, чтобы текст смотрелся более симметрично, более красиво.
198: Но при этом хорошо считывался. Обратите внимание, у нас бургер слегка перекрывает текст, но текст очень хорошо читается, потому что хорошие читабельные буквы хороший читабельный текст. Мы с вами взяли, при этом текст у нас жёлтый и достаточно большой, что
199: Опять же хорошо работает на его читабельность, потому что напоминаю, что когда мы работаем с рекламными креативами, либо с любыми, с любым другим дизайном, нам важно, чтобы текст всегда хорошо считывался. Итак, следующий этап мы переходим с вами к стилизации.
200: То есть мы с вами добавили текст, добавили бургер. В целом у нас очень простой рекламный креатив, 2 будет посложнее, но на этом мы пока разминаемся, a2 уже более поработаем со сложными инструментами и там в целом больше дизайна нам придётся делать также во 2 рекламном креативе, который мы буде
201: Будем делать дальше с вами. В уроке. Мы с вами ещё будем пользоваться плагинами. То есть это дополнительное программное обеспечение, которое доступно фигме, оно абсолютно бесплатное, и вы можете их использовать, чтобы делать свой дизайн лучше, чтобы он выглядел дороже и, соответственно, чем дороже.
202: Уже выглядит e круче выглядит ваш дизайн, тем больше вы можете на нём зарабатывать итак, давайте теперь делать стилизацию берём наш огонь, сейчас мы наш огонь добавим сверху на бургер, давайте огонь уменьшим, уменьшим его примерно давайте, чтобы 700.
203: Со пикселей была высота нашего огня. То есть просто вот здесь прописываю 700 пикселей. Наш огонь уменьшился у нас, чтобы он у всех был с вами одинаковый и прижмём огонь просто к левому краю можно сделать это ручками, просто перетащить. И видите, оранжевая линия, когда у нас
204: Прилипает какой-то объект к краю фрейма. Оранжевая линия появляется вот здесь и как бы сигнализирует о том, что мы с вами выровняли наш объект относительно фрейма. Ну можно делать это не руками, можно просто нажать, например, вот эту клавишу. То есть когда вы видели, выделили огонь,
205: У нас здесь есть на справа на панели слоёв такой как бы пункт позиция. И мы можем просто выровнять по левому краю фрейма. Все отлично. Мы с вами выровняли наш огонь. Давайте опустим его пониже, опустим его пониже, приближу.
206: Чтобы было удобнее работать. Хочу опустить огонь ниже, чтобы он не перекрывал бургер, потому что сейчас языки пламени заходят слишком сильно на вот на помидор, на бургер и немножко, как будто бы это отвлекает от самого продукта. А как мы помним, у нас все-таки
207: Первостепенно должен считываться продукт и продукт должен видеть. Желательно, чтоб его сильно ничего не перекрывало. Давайте просто сдвинем вниз, двигаю просто стрелочками на клавиатуре. Вот примерно до таких пределов. Вот сейчас у нас видно, и наш
208: Бургер и наши составляющие, то есть лук, помидор и при этом огонь тоже у нас классно все виден. То есть у нас уже создаётся такая картинка, как будто бы вот где-то в процессе бургер готовится, собирается, выглядит очень, очень круто.
209: То есть делаем очень классный дизайн с точки зрения визуала, но делаем его, ничего не рисуем, делаем просто из готовых картинок. Повторюсь, которые я скачал бесплатно на фотостоках мы сейчас собираем классную работу, то есть, опять же, это вот к слову о том, что
210: Дизайнер должен уметь рисовать, многие думают нет, есть огромное количество уже готовых изображений, которые вы можете взять и использовать просто в своих проектах. Давайте с вами загрузим наши искры теперь в картинку сверху.
211: Для чего мы вообще добавляем с вами искры, искры? Это будет у нас как бы общий фильтр, который соединит. То есть искры у нас будут сверху всего, то есть сверху текста, сверху бургера, сверху огня. И это будет как будто бы такой общий фильтр.
212: Который объединит все наши графические элементы в 1 единицу. То есть все это визуально соединится уже с помощью наших искр. Давайте покажу, как это сделать. Загружаем наши искры во фрейм. Кстати, у нас искры размера размером 1920 на
213: 1080 пикселей, 1080 пикселей. Высота этой картинки и 1080 пикселей у нас размер. Высота нашего фрейма, в котором мы собираем рекламный креатив. Поэтому мы просто с вами выравниваем наши искры, выравниваем их вот этой кнопкой по
214: Горизонтали, чтобы чётко, по горизонтали выровнялся у нас наша картинка с искрами и прижимаем нашу картинку к правому краю нашего фрейма. Итак, видим с вами, что ничего не видно. Да, у нас не видно текст, у нас не видно нашу картинку бургера, у нас вообщ
215: Ничего не видно. Что делать? Здесь нам на помощь приходит функция наложения. Что это такое? Выделяем нашу картинку, можно выделить её здесь в слоях просто выделяем искры. Кстати, вот для чего важно, для чего нужно.
216: Все подписывать, я вам все слои уже подписал, но иногда, когда вы скачиваете картинки просто с интернета, они могут быть неподписанными, они могут быть называться как то-нибудь цифрами, буквами. Соответственно, всегда все подписывайте, чтобы быстренько в слоях найти то, что вам нужно, и
217: Быстро этот слой либо редактировать, либо убрать, либо как-то изменить. Это просто ускорит в будущем вашу работу. Переходим к функции наложения. Сейчас мы сделаем с вами несколько волшебных действий, которые позволят видеть нам и искры, но при этом
218: У нас чёрный фон просто вот у искр исчезнет, он не удалится, но с помощью функции наложения его просто будет не видно. Выделили искры и идём на вкладочку. Опять же справа на правую панель. У нас здесь такая вкладка и здесь есть вот такая капелька.
219: Нажимаем на неё и смотрим, как наша картинка меняется при разном наложении. Вот просто водим курсором по нашим названиям наложений и смотрим, как картинка меняется. Так, ну здесь уже снизу какие-то наложения не очен.
220: Очень хорошее. Мне нравится наложение, либо лайтон. Вот скрин, наложение классное.
221: Ну, наверное, лучше всего. Плюс Лайтер, вот. Плюс Лайтер самое хорошее, самое классное наложение. Картинка становится яркой. Давайте выберем его и давайте сделаем его чуть более незаметным, потому что сейчас слишком яркое, слишком все засвеченное, прям вот.
222: Прям кровь из глаз сейчас пойдёт. Давайте немножко снизим интенсивность нашего вот этого слоя, наших искр вот здесь, где у нас 100%. Давайте напишем просто 50. Вот таким образом у нас с вами видно теперь и искры, и при этом
223: Там искры нам не перекрывают наш бургер и добавили. Кстати, у нас из за того, что у искр был такой какой-то дымок, помните, у нас на картинке вот если выключить наложение, вот если его убрать, давайте вот так сделаю. У нас есть
224: Дым здесь, и он как бы с помощью из за того, что мы применили наложение, у нас теперь вот этот дымок отрисовался тоже на нашем фоне. То есть как будто бы у нас сейчас здесь все в дыму, в искрах и очень, очень классно все сцена выглядит, кстати, очен.
225: Динамично, то есть рекламный креатив, хоть и статичный, но мы прям с вами сумели с помощью вот этих простейших эффектов, то есть просто с помощью картинки огня, с помощью наложения сверху искры мы с вами сумели сделать вот такой какой-то динамичный рекламный
226: Creative, где как складывается ощущение, как будто бургер действительно готовится. Такие рекламные креативы хорошо цепляют внимание, потому что это не просто фотография бургера на столе, а действительно, вот процесс его приготовления. Все очень яркое, все очень классное и очень
227: Очень все самое главное читабельное. То есть текст мы с вами тоже сделали круто, чтобы он хорошо читался, что нам нужно теперь дальше по дз давайте посмотрим. Нам нужно теперь добавить слоган. Смотри, не обострись. Добавлять мы его будем ниже вот сюда. У нас здесь есть свободная область, как раз немножко пере.
228: Откроем огонь. Ну, постараемся не сильно перекрыть наш бургер и нам нужно будет добавить логотип. Но логотип добавим попозже, когда уже все сделаем, заблокируем, пока бургер, заблокируем слой, огонь и заблокируем слой искры, чтобы случайно ничего не удалить.
229: Ничего не сдвинуть. Видите, сейчас я не могу никакой слой выделить. И вот если я выделяю даже слои здесь, я не могу его слой никуда сдвинуть, можно только слой этот удалить. Поэтому пока блокируем, пока блокируем случайно повторюсь, не удалите и выделяем наш текст. Текст.
230: Копируем, как копируем, нажимаем клавишу ctrl ц и теперь нажимаем клавишу ctrl в обратите внимание, у нас в слоях теперь 2 одинаковых текстовых слоя, то есть, значит, у нас копия с вами создалась 1 из текстовых слоёв перед.
231: Втаскиваем просто вниз, перетаскиваем вниз и можно в слоях его перетащить. Теперь выше, чтобы он был как бы над слоем искры. Текст вытащили повыше. Почему вообще вытащили его наверх в слоях? Потому что вот если его вернуть
232: Его не видно, он перекрыт всеми нашими картинками, вытащим его повыше. И давайте наш текст перекрасим в белый цвет. Он у нас будет белым. И поскольку у нас внизу много графики вообще, да, мы много графики используем на нашем изображении, на нашем рекламном креативе. Мы с вами
233: Нарисуем чуть позже плашку. То есть помните, мы с вами, когда я показывал вам интерфейс фигмы, я показывал функцию перо, и мы сейчас с помощью пера нарисуем с вами классную плашку для нашего текста, чтобы он лучше считывал
234: Этот приём подходит если вы например размещаете текст и у вас неоднородный фон на фоне много всяких изображений, например phone может быть Светлый, либо вот как у нас на фоне искры огонь сам бургер, чтобы текст
235: Лучше считывался. Мы можем просто нарисовать плашку. Идём в наш, в техническое задание, наше копируем наш слоган. Смотри, не обострись контрол ц. Давайте его здесь сюда просто вставим. Огромный слоган получился, потому что у нас до этого было 1 слово.
236: Теперь у нас слов много, размер шрифта тот же, давайте уменьшим его, например, до 80 единиц. Так, ага, давайте теперь видите, у нас внизу вот этот пробел, сразу скажу, не нужно этот пробел убирать. Вот так либо
237: Нужно его как-то пытаться вот так вот сузить. Этого делать не надо если у вас этот пробел образовался если, кстати, если вы уже так сделали, например, вот так-то просто нажмите вот сюда, нажмите вот сюда, чтобы у вас вообще
238: Проверяйте, когда работаете с текстом, чтобы у вас на тексте был включён не этот параметр, не этот, а вот этот. Это очень важно, чтобы текст не искажался. И чтобы не было лишних переносов, которые вы не планировали делать, чтобы убрать вот этот пробел снизу, просто нажимаем 2 раза на
239: Текст и ставим курсор в нижнюю часть, которая у нас вот образовалась здесь у нас просто стоит какой-то пробел, просто его 1 раз удаляем, удаляем, вот стрелочкой на клавиатуре называется, я не помню, не помню, она как называется, no везде отображена как
240: Вот как вы удаляете текст в сообщениях, также удаляете здесь пробел, и у нас текст становится, видите, с нормальным нижним краем, что мы теперь сделаем перед тем, как мы добавим текст на наш рекламный креатив. Я хочу ещё сделать перенос, чтобы текст у нас сейчас текст упирается в края.
241: Меньше я шрифт делать не хочу. То есть меньше шрифт уже будет слишком мелким. У нас все-таки на нашем рекламном креативе очень все громоздкое, очень все большое. Большой заголовок, большой сам бургер. И нам здесь с точки зрения просто вот баланса слишком
242: Маленький текст внизу делать не стоит, потому что он будет плохо считываться. Вообще будет плохо заметен на фоне остальных вот этих громоздких элементов. Поэтому текст я уменьшать не хочу, но он не помещается у меня в рекламный креатив. Что делать мы можем сделать просто перенос можем
243: Сделать перенос вот таким образом, но будет выглядеть это все-таки скучно. Плюс ко всему, например, если мы сделали перенос вот таким образом у нас слева и справа как будто бы много свободного места, что хочу сделать я
244: Давайте с вами возьмём вот эту часть нашего текста, выделим и нажмём клавишу ctrl ц, то есть скопируем этот текст ниже куда-нибудь, просто тыкните курсором и нажмите.
245: Клавишу ctrl v у вас вот появилась копия текста, опускаете её ниже, а здесь удаляем наш текст сверху и давайте текст. Теперь верхнюю строку подвинем немножко левее, чтобы у вас буковка е была на уровне с буквой р.
246: Выделяем наши 2 текстовых блока, просто выделяем их курсором. Обратите внимание, когда мы выделяем несколько текстовых блоков, если они стоят на 1 вертикальной оси. То есть, если они пересекаются по вертикали, у нас здесь справа вот появляется такой параметр, если его
247: Увеличить. У нас текст разъезжается, то есть любые слои это могут быть какие-то фигуры, например, 2 вот эллипса. Если они стоят друг над другом, будут они разъезжаться. Если у нас это тексты будут разъезжаться тексты, если мы этот параметр увели.
248: Давайте здесь, в этом параметре, поставим значение 0, чтобы эти строки текста были рядышком друг с другом. Почему нам важно так сделать, если, например, мы сдвинем нашу эту, эту строку слишком далеко? К примеру, так эти 2 строки уже могут
249: Казаться как будто бы это не единое целое. То есть нам важно, чтобы у нас все-таки текст вот этот блок текста, смотри, не обострись, был единым целым. И ещё такой момент обязательно давайте частичку. Не, не, это у нас частица оставим на верхней строке.
250: Чтобы строчки были примерно 1 длины, потому что если частицу не мы перенесём на нижнюю строку, у нас верхняя строка, смотри, будет слишком короткой относительно по отношению к нижней строке, и это будет просто смотреться некрасиво, несимметрично. Частички мы можем
251: Можем с вами не переносить. Обычно не рекомендуется оставлять висящий предлог. То есть, если бы у нас был вот, вот так, например, смотри, в так лучше не делать. То есть висящие предлоги лучше не оставлять, потому что они оставляют ощущение не
252: Завершённости какой-то мысли в строке, то есть висящие предлоги, мы всегда переносим на новую строчку. Ну если это союз или частичка, то мы можем оставлять их в нашей строке висящими, висящими. То есть в конце строки пока что объясняю все, максимальн.
253: Быстро, но стараюсь максимально много информации вам дать в 1 уроке. А если вы хотите подробнее узнать про работу со шрифтами и про оформление текста, для вас есть пятидневный марафон, о котором я говорил ранее. Напоминаю, на марафоне вы создадите 2 крутые работы в портфолио. Научи
254: Сделать дизайн с помощью нейросетей и поймёте, как найти 1 клиента сразу после марафона. Также на марафоне. Я созвонюсь с вами лично, подробно разберу любые ваши вопросы и подскажу, как вам быстрее начать зарабатывать на профессии дизайнера. И напоминаю
255: Самое крутое. Те, кто сделает на марафоне домашнее задание лучше всех прямо на марафоне получит свой 1 реальный оплачиваемый проект. Напоминаю, что все подробности о марафоне вы найдёте по ссылке в описании, а мы продолжаем. Давайте обратно сдвинем наши 2
256: Точки, чтобы они не были так далеко расположены, потому что сейчас как будто бы нарушается целостность нашего текста, как будто бы это вообще 2, 2 разных текста. Давайте здесь выделим 2 наших текста и поставим здесь значение 0. Теперь давайте текст сгруппируем, что
257: Это было единое целое выделяем 2 текста и нажимаем связку клавиш ctrl г. Либо можно нажать связку клавиш ctrl г, либо можно кликнуть правой кнопкой мыши по нашим выделенным объектам, и здесь мы находим вот эту кнопочку групп селек.
258: Вот здесь, кстати, напротив, сразу и написано, какая связка клавиш за эту функцию отвечает нажимаем сюда, и у нас теперь текст стал единым целым и называется группа 1. Можем подписать его как слоган, сразу подпишем, чтобы
259: Слоях. Нам было понятно, где у нас слоган. Давайте перетащим наш текст в наш фрейм. Отлично. Вот посерединке его размещаем, посередине. Когда вы размещаете текст, у вас должна вот появиться вот такая оранжевая линия прямо по центру, если она не появляетс
260: И, например, текст у вас смещён либо влево, либо вправо. Просто выделяем нашу группу, обратите внимание, не выделяйте отдельный текстовый блок. То есть, если выделите отдельный текстовый блок и захотите его выровнять, например, вот этой клавишей, то выровняется только 1 слово. Нам нужно
261: Выделить именно группу. То есть, чтобы была выделена группа, для этого тыкаем именно по иконке нашей группы и теперь нажимаем вот эту клавишу. Это выравнивание по горизонтали. Прекрасно. Текст у нас абсолютно нечитабелен, но расположен хорошо. Теперь нам нужно нарисовать
262: Плашку, чтобы текст хорошо считывался для того, чтобы плашку нарисовать. Идём с вами в инструменты. Мы сегодня уже их касались, идём в инструменты и выбираем функцию пэн, и давайте аккуратно обведём наш текст, обрисуем его
263: Вот таким образом.
264: Так, так, так, так. Рисуем на глаз, но желательно, чтобы было Ровно. Если что-то рисуете неровно, мы всегда это можем поправить. Нажимаем клавишу enter. У нас появилась вот такая, чер.
265: Линия, то нам нужно, чтобы она была залита цветом. Что мы с вами делаем, когда у нас наша линия выделена. Давайте её подпишем сразу, как плашка. Давайте выделим снова нашу плашку и пойдём на правую панель инструментов. Здесь находим вклад.
266: Фил, и нажимаем. Плюс нажали плюс вкладочке строук, пока можно её просто удалить. То есть это у нас обводка, она нам не нужна. Что делаем теперь давайте группу, пока наш слоган закроем, чтобы она не была раскрыта. Плашку.
267: Перемещаем под наш слоган, чтобы текст был на ней, и давайте нашу плашечку покрасим в цвет фона. Как это сделать? Мы можем просто выделить весь наш фрейм, выделяем фрейм наш. Можно нажать его на название фрейма здесь либо на название фрейма. Вот
268: Здесь в слоях у фрейма, есть вот собственная заливка просто нажимаем сюда на текст. Видите, он весь выделяется нажимаем клавишу ctrl ц, больше ничего здесь не нажимаем, выделяем теперь плашку, также выделяем здесь левой кнопочкой мыши цвет.
269: И нажимаем клавиши ctrl плюс v то есть вставляем цвет, который скопировали просто в любое место теперь нажимаете левой кнопкой мыши, и у нас плашечка стала теперь в цвет фона я не захотел добавлять какие-то другие цвета красный, синий.
270: Считаю, что это нужно. Мне кажется, это будет отвлекать от нашего бургера. У нас все фирменные цвета есть на логотипе. Ну вот давайте потестируем. Можно просто покрасить, например, плашку в синий цвет, либо, например, покрасить в красный цвет. Ну, мне кажется, красный вообще плоховато.
271: Считывается синий, ещё неплохо, но вот я хочу сделать плашечку именно тёмной, чтобы от бургера не отвлекало, потому что напоминаю, что нам нужно, чтобы наш продукт был хорошо, хорошо, наш продукт считывался. Давайте нашу плашечку подравняем, потому что немножк
272: Здесь я напортачил, сделал её косой, выделяю нашу плашку, нажимаю клавишу enter, у нас появились вот такие опорные точки, выделяем нашу точечку, которую нам необходимо опустить ниже, и просто я стрелочками на клавиатуре её ровняю.
273: Плашечка была поровнее, теперь каждый уголочек таким же образом подравняю, чтобы все было более или менее Ровно. Вообще выделю сначала эту опущу ниже точку и теперь эту тоже хочу ниже немножко опустить, чтобы они были, чтобы был у текста побольше отступ.
274: Как бы больше свободного пространства внутри плашки также сдвинуть хочу вот здесь эти 2 точки, чтобы слева от текста тоже было больше пространства. И теперь вот эти 2 точечки эту и вот эту тоже хочу сдвинуть повыше, чтобы вокруг плашки опять же было больше.
275: Место, чтобы лучше текст считывался, потому что если у нас текст зажат слишком сильно в плашкой, то он тоже будет плохо считываться. Чем больше свободного места в плашке вокруг текста, тем лучше у нас текст будет считываться. Выделим на
276: Нашу плашечку и добавим просто обводку, чтобы плашечка выглядела посимпатичнее. Обводку сразу перекрасим в белый цвет и толщину линии. Давайте сделаем в 2 пикселя. Вот здесь просто ставим циферку 2. Отлично.
277: Вот такая плашечка у нас должна получиться. Считывается хорошо, хорошо видна, но при этом не отвлекает от продукта. Что сделаем? Теперь выделим наш текст и выделим нашу плашку. Как это сделать? Как выделить вообще 2 текста, если мы начнём выделять здесь?
278: У нас может выделиться лишнее, да, если мы вот так будем выделять, может выделиться лишнее мы можем выделить здесь, в панели слоёв сразу 2 слоя зажимаем клавишу ctrl и, удерживая клавишу ctrl, нажимаем левой кнопкой мыши по плашке и сразу.
279: По слогану теперь можно клавишу ctrl отпустить нажимаем правой кнопкой мыши по нашим выделенным объектам и включаем функцию групп селекшн, чтобы это теперь было 1 целое можно также написать, подписать эту группу слоган.
280: Для чего все подписывать? Опять же, для удобства у нас есть группа слоган, мы можем её открыть. Здесь мы видим плашку, плашку, мы можем в любой цвет покрасить, если вдруг заказчик скажет, ну вот нам нужно обязательно, чтобы был синий цвет. Хорошо, мы заходим просто плашечку.
281: Перекрасили у нас получается вот такая классная тоже плашка откачу действие с помощью клавиш ctrl z группу теперь можно закрыть и давайте немножко группу наклоним у нас здесь, когда мы группу выделили, есть параметр вот такой мы можем
282: Наклонить её либо вправо, либо влево. Давайте поставим 2 градуса значение, чтобы группа немножечко вправо наклонилась, чтобы как-то мне так нравится больше с помощью вот этого искажения. У нас вот эта вся игривая шуточная стилистика
283: Подчёркивается у нас здесь с вами такой шрифт достаточно игривый, ну что нам и для задачи требовалось. И вот этот наклон, который мы с вами сделали на плашке, он тоже подчёркивает всю эту стилистику, которая у нас в тз написана, у нас все-таки цель.
284: Привлечь внимание за счёт провокационного юмора. Поэтому мы немножечко можем себе позволить, например, исказить плашку. Это тоже работает очень хорошо на общую концепцию рекламного креатива. Дальше нам необходимо с вами разместить логотип. Сделаем это просто
285: Как вообще разместить логотип? Давайте его добавим сначала в наш рекламный креатив. Давайте теперь его уменьшим. И если вы обратили внимание, мы сегодня, опять же, если вдруг вы знаете, мало ли, может быть кто-то слышал, в дизайне есть такие вещи, как сетка.
286: Как направляющие, мы сегодня их не использовали. Не использовали мы их, потому что у нас очень простой рекламный креатив. Плюс ко всему он в стилистике такого провокационного юмора. И здесь какую-то структуру нам не обязательно соблюдать. То есть какая-то жёсткая структура нам
287: Не нужна. Мы это будем уже делать. Более жёсткую структуру мы будем делать уже в следующем рекламном креативе. Как раз-таки мы там будем работать с направляющими и с сеткой. Здесь же мы все расставляли более или менее на глаз, просто чтобы хорошо
288: Смотрелось большой текст сверху да, обычно большие тексты заголовки, они выше в макетах размещены посередине макета продукт и внизу уже дополнительный текст в виде нашего слогана, но для логотипа мы немножечко с вами, с сеткой сейчас поработа.
289: Чтобы его разместить как-то вот, ну, структурировано, чтобы он не был каким-то пятном, который просто влепили, например, сюда, да, либо сюда. То есть, хотелось бы, чтобы он каким-то образом как-то вот аккуратно вписывался в нашу всю картинку, что
290: Мы с вами делаем сейчас мы с вами нажимаем 2 клавиши shift плюс клавиша r. У вас должны появиться вот такие поля, вот такие поля, и давайте приблизим наш рекламный креатив, чтобы было удобнее работать и давайте с полей вот с левого поля нажимайте.
291: Клавишу, левую кнопку мыши задерживаете и перетаскиваете вот такую линию, вот такую линию и давайте вот её выровняем по самому краю буковки в делаем это действие. Ещё раз напоминаю на
292: Нажимаем левой кнопкой мыши, держим и перетаскиваем теперь уже на правый краешек буковки в
293: Так, не могу попасть. Давайте приблизим и немножко подвигаем уже вот так по пикселям. Отлично. Можно теперь выбрать наш логотип? Выбираем и давайте его разместим так, чтобы он был зажат между нашими направляющими
294: Выделим теперь наш заголовок нажимаем здесь воппер и с зажатой клавишей ctrl левой кнопочкой тыкаем на наш логотип, чтобы выделились 2 вот этих слоя, и давайте здесь зададим значение.
295: - 20 единиц. Вот так вот что у вас должно получиться? У меня логотип размером 171 на 171 пиксель и отступ от заголовка - 20 единиц. Вот такой
296: Рекламный креатив у нас получился, я предлагаю ещё немножко его достили овать. У нас есть прекрасные с вами искры, которыми мы пользовались. Я хочу немножко искр наложить ещё на нашу плашку со слоганом. Давайте заблокируем теперь все слои логотип.
297: Слоган искры и воппер мы уже редактировать ничего не будем, пока разблокируем. Только слой искры. Копируем слой искры. Контрол ц контрол в видите, слой продублировался, и стало ярче. 1 из слоёв блокируем.
298: Другой слой, который мы не заблокировали, просто уменьшаем. Опять же, когда уменьшаете изображения любые, проверяйте, чтобы здесь была вот эта кнопочка горела синим цветом. Уменьшаем наш наши искры, чтобы они были
299: Ровно по ширине нашего фрейма, то есть в значении, в этом значении должно быть 1080 пикселей. Давайте теперь наши искры перенесём в самый верх в слоях, чтобы они были над логотипом, чтобы они были самым 1 слоем.
300: И теперь давайте опускать их вниз. Я делаю это просто с помощью клавиш на клавиатуре можно пока перетащить, потому что я хочу прям сильно ниже опустить вот так, чтобы было на уровне где-то середины помидора, чтобы вот край наших искр был на уровне центра.
301: Помидора, у меня это получается, вот я выровнял также по центру эти искры по координате игрек. У меня позиция 676 пикселей. То есть вы можете просто это значение ввести и получите точно такое же.
302: Значение, как у меня. И я хочу сделать вот эти искры, которые у нас над этим текстом поярче. Для этого здесь я впишу не 50%, а 100.
303: Вот теперь отлично. Теперь у нас классно смотрится, теперь у нас искры как будто бы и над этим, и над этой плашкой. То есть сейчас у нас картинка выглядит очень, очень объёмной, то есть как бы это уже не плоское изображение, кажется, как будто бы это какая-то вот глубо
304: Картинка, где у нас и бургер объёмный, и искры, и дымы. Текст хорошо при этом читается. То есть мы с вами сделали очень крутой дизайн и при этом у нас очень круто считывается текст, что нам очень, очень важно. Давайте заблокируем
305: Пока все слои поздравляю. Вы сделали свой 1 рекламный креатив, очень круто смотрится. Мы сделали с вами рекламный креатив для компании бургер кинг. Теперь вы можете этот рекламный креатив положить к себе в портфолио, и вы уже будете выделяться на фоне других дизайнеров.
306: То есть у вас работа очень будет иметь высокое конкурентное преимущество. Давайте теперь перейдём к созданию 2 нашего рекламного креатива. Что для этого нужно? Мы можем, кстати, с вами теперь и попрактиковаться, посоздавать разные
307: Страницы в нашей рабочей области. Можем создать страничку номер 2. Видите, она пустая. Полностью возвращаемся в 1. Здесь у нас наш бургер кинг. Можно подписать её, эту страницу бургер кинг. 2 страничку подпишем как
308: Тимати картинг. С чего начнём? Начнём с того, что снова загрузим наши изображения. Все, которые я подготовил в нашу фигму, немножко уменьшаем окошко, заходим теперь в другую папку и открываем графический
309: Материалы здесь у нас больше всего. То есть у нас также есть готовый креатив. У нас есть здесь изображение самого карта потёртости, дым, 2 логотипа и текстурка, которую тоже мы будем накладывать с помощью наложений. Давайте загружать все в нашу
310: Фигму немножко отдалим, чтобы было удобнее. Так, логотип. Ага, логотип загрузился. Он просто очень мелкий. Загружаем теперь ещё 1 логотип и потёртость готовый креатив вы тоже можете к себе загрузить, чтобы он у вас
311: Был перед глазами. Если вам так будет удобнее, можете вот его держать под рукой, я же буду дизайнить по памяти. Давайте все закроем. Во первых эту папку фигму сделаем на весь экран, расставим наши объекты, можно пока немножко их уменьшить. Не очень, очень
312: Большие так, 2 логотипа. Отлично. Пойдёмте смотреть тз, по которому все это делалось. Тимати картинг. У нас мероприятие, рейс дей, дата и время 11.08, с 11, с 10 до полуночи. А задача у нас создать рекламный креатив для мероприятии.
313: Где ключевым элементом будет картинг. Важно подчеркнуть атмосферу драйва, напряжения и финала гонки. Я, кстати, для этого достал нам дымы, мы с вами будем делать вот какую-то картинку. Опять же, вот как мы сделали с бургер кингом, вроде бы картинка простая, двухмерная.
314: Да, то есть никакой 3 д графики мы с вами не делали, но все выглядит очень динамично, очень живенько, очень классно, как будто бы вся картинка в движении, в динамике. Вот тоже самое будем с вами делать с картингом, поэтому взял дымок, чтобы в конце его добавить вокруг карты, чтобы было
315: Ощущение, что как будто бы только карт отгонял и от него вот идёт какой-то пар дым, что техника вот только двигалась прям очень, очень активно. Давайте дочитаем наше тз, что у нас ещё здесь есть обязательные элементы, это у нас дата и время, конечно же, адрес Москва, улица.
316: Автозаводская 18 трц ривьера, 2 этаж, логотип трц ривьера и логотип тимати картинга блэкстар картинг. Давайте возвращаться в фигму и начинаем делать с вами рекламный креатив. Я думаю этот мы сделаем с вами проще и быстрее, потому
317: Что уже у нас опыт работы с рекламным креативом уже был также начинаем с фрейма, создаём фрейм и выбираем здесь инстаграм пост вот такой же frame, нам нужен 1080, на 1080 пикселей можно подписать его black.
318: Или просто картинг, чтобы долго не печатать. В конце. Мы ещё, кстати, с вами эти картинки все экспортируем, чтобы отправить клиенту, покажу, как это делается. Если вдруг вы не умеете, давайте покрасим наш рекламный креатив пока в чёрный цвет. Он у нас будет темным, как и все.
319: От блэкстар, что мы с вами здесь для начала сделаем, поскольку у нас здесь много с вами текста, текста гораздо больше. У нас здесь нужно и дату, и время поставить, и адрес, и логотипы, и ещё и название заголовок рейс.
320: У нас здесь гораздо больше контента с вами будет. Поэтому, чтобы этот контент классно структурировать, чтобы у нас рекламный креатив выглядел структурировано не чтобы не было каши визуальной, будем работать с вами с помощью сетки. То есть сетку будем использовать в этом рекламном креативе.
321: Чтобы у нас все было очень структурировано, выделяем наш фрейм и нажимаем вот сюда Леут грид плюс здесь меняем грид на колонки, меняем грид на колонки. Скорее всего, с этим рекламным креативом я буду чуть
322: Быстрее рассказывать, потому что вы уже ребята опытные. Мы с вами уже сделали 1 рекламный креатив и буду говорить чуть быстрее, чтобы мы с вами быстрее закончили, а вы получили быстрее 2 работу в портфолио, в самом нижнем значении меняем 20 на 0, а вверху
323: Ставим вместо 5 20. Это наше количество колонок, они у нас сейчас плоховато видны. То есть блёкло, блёкло красные. Давайте добавим здесь, например, чтобы заливка была не 10%, а 40, чтобы лучше были видны. Вы делайте, как вам удобно. Я сделал.
324: 40, чтобы вам было их видно. Цвет, вы тоже можете выбрать любой зелёный, синий, розовый, какой вам нравится? Я работаю с красным, потому что красный как-то меньше всего напрягает. Что удивительно. Да, зелёный как-то вот здесь более яркий даже получается.
325: Оставлю красным, что здесь ещё у нас есть. У нас есть ещё здесь не колонки, точнее колонки. Вот горизонтальные есть линии вертикальные, то есть по вертикали линии распределяются, но нам сетка нужна именно горизонтальная. Что ещё у нас здесь?
326: Значение есть значение вот это здесь у нас обязательно оставляйте стрейч, что это значит? Если мы выставим, например, слева значение, то нам нужно теперь ещё задавать ширину какую-то, чтобы у нас эти линии на определённой ширине на
327: На определённом расстоянии друг от друга были. Если же мы ставим просто значение стрейч, то автоматически наша сетка растягивается под наш фрейм. Все можно теперь закрыть. Не удаляйте её, пока не скрывайте, мы будем с помощью неё работать.
328: Давайте сразу загрузим наш карт во фрейм. Вы уже помните, что, чтобы карт, чтобы проверить, загрузилась ли картинка во фрейм, просто смотрим, сместилась ли её иконка правее. Иконка сместилась. Картинг давайте уменьшим, проверяем, чтобы здесь была
329: Включена вот эта кнопочка синяя. Уменьшаем таким образом, чтобы он был зажат между наших линий вот здесь, чтобы он был на уровне 3 линии 3 линии слева, а здесь на уровне 2.
330: Линии слева у нас будет слева текст рейс дей будет здесь большой текст. Здесь у нас будет дата и плашечка. Здесь у нас вот этот край правый, он будет более свободен, поэтому картинг немножко мы сместили с вами правее. То есть он здесь
331: Отступ больше, чем здесь. Пока что на таком расстоянии. По вертикали его оставляем. Давайте с вами немножко перекрасим фон, сделаем его чуть светлее, потому что сейчас он очень чёрный картинг на нём прям теряется. Выбираем наш фрейм и перекрашиваем.
332: У него phone заходим в палитру фрейма, выбираем, градиентная заливка у нас осветлилась, очень сильно осветлился низ фрейма, но я не хочу, чтобы низ был светлым, давайте сделаем следующее.
333: Расположим, наши направляющую цветовую по диагонали. Мы с вами в начале этого урока уже практиковались, уже так делали. Давайте теперь заменим. Я хочу, чтобы Чёрная точка, чтобы Чёрная точка была вот здесь. Для этого нам не нужно двигать их рукам.
334: Мы можем просто здесь нажать вот эти 2 стрелочки и у нас отзеркалится наш градиент. Но вот этот цвет серый, он слишком все равно Светлый. Давайте его выделим эту цветовую точку и немножко этот ползунок уведём вниз. Вот при
335: Примерно 25, 25, 25. Чтобы у вас было. Закрываем теперь нашу цветовую палитру, закрываем здесь все отлично. Мы разместили с вами карт. Что мы с вами делаем дальше? Я всегда предпочитаю работать с заголовком, потому что заголовок
336: Самая как бы большая логическая единица на нашем слайде. То есть обычно я добавляю изображение товара, то есть, как мы делали в прошлый раз, да, вот сначала мы добавили бургер, здесь я добавляю сначала картинг, и затем я сразу начинаю работать с заголовком, чтобы
337: Разместить его и понять, как сделать его читабельным. Посмотрим, что у нас за заголовок. У нас заголовок рейс дей. Давайте его скачаем сразу, точнее не скачаем, а скопируем контрол ц, делаю, перехожу обратно в фигму, приближу наш фрейм и выберу.
338: Текстовый блок. Вставляю наш заголовок. Видим, что у нас заголовок стал, написался тем шрифтом, который мы с вами использовали уже в этой доске. То есть в этом дизайн файле, когда делали рекламный креатив для
339: Компании бургер кинг. Такой шрифт, конечно же, нам не подходит для нашего рекламного креатива блэк стар картинг, потому что здесь мы будем говорить про спорт. Мы здесь будем говорить про какие-то гоночные технологии, про гонки. И здесь шрифт, конечно же,
340: Нужен нам гротескный. Я рассказывал об этом уже ранее. Шрифт без засечек, шрифт более аскетичный, более минималистичный, более строгий. Он здесь, конечно же, будет лучше смотреться. Давайте с вами выделим наш текстовый блок и пойдём.
341: Выбор шрифтов выберем, шрифт с вами не абеликс про, а пишем здесь swiss суис инт. Если вдруг у вас этот шрифт или какой-то другой из моих уроков не установлен, все шрифты я оставляю также в папках кото.
342: Который вы можете скачать в папках с файлами, где лежат картинки, там также есть шрифты. Все это вы можете скачать в моём telegram канале по ссылке в описании. Если вдруг ещё не скачали, то имейте ввиду, там все есть. Давайте теперь увеличим наш заголовок.
343: Потому что сейчас он на заголовок совершенно не похож. Сделаем, например, 170 единиц, 170 единиц. Так у нас текст уходит влево. Мне это не нравится. Откачу пока действие, что делать, чтобы было удобнее, чтобы текст не уходил левее. Просто выделяем наш заголовок.
344: И вот здесь мы ставим выравнивание не по центру, а от левого края. Теперь, когда мы увеличим сейчас с вами заголовок до 170 единиц, он никуда не уходит за край. Сместим пока наш заголовок.
345: Левее, давайте левее здесь подравняем его, пока подравняем его по нашей линии, по нашей опорной линии. Это будет как бы у нас направляющая для нашего текста. То есть у нас будет вот знаете, как на тетрадках есть поля, так у нас также будут поля, у нас будет поле в на
346: Нашем рекламном креативе по ширине 1 колонки. Что ещё хочу сделать? Есть несколько лайфхаков. Как сделать текст более читабельным, более красивым, более вообще, чтобы он лучше смотрелся, лучше считывался и выглядел более стильно. Давай
347: Сделаем, во первых, перенос. И у нас здесь всего 2 слова. То есть, если вы обратите внимание, у нас нет какого-то большого заголовка и состоящего из нескольких там, из 3, из 4 строк или там из 10 слов у нас всего лишь 2 слова. Если перенести, так тока
348: Кажется, что как будто бы эти слова вообще отдельные, ну, отдельные. То есть, кажется, что это не единое целое. Для нас такой вариант расположения текста не подходит. То есть нам нужно уменьшить расстояние между наших строк, но на
349: Например, когда мы делали с вами рекламный креатив для бургер кинг и здесь уменьшали расстояние между строк мы у нас это были отдельные текстовые блоки. Смотри не и обострись, это 2 разных текстовых блока, здесь у нас текстовый блок 1, у нас уже здесь нету
350: Функция расстояние между строк функция теперь эта вот здесь, где написано auto чтобы изменить расстояние между 2 строчек в едином текстовом блоке. То есть, напоминаю, в бургер кинге мы делили текстовый блок на 2 части, здесь он у нас единый для того,
351: Чтобы изменить расстояние, просто прописываем здесь какое-то количество процентов, например 100% вместо auto. Видите, у нас уменьшилось расстояние между строк. Давайте ещё немного его уменьшим, потому что все равно оно большое. 60%.
352: Это я ввёл случайно. Давайте введём 90 90. Отлично. Текст и не слипается друг с другом. И при этом очень классно считывается. И видно, что теперь это единый текстовый блок. Что ещё сделаем? Давайте
353: Изменим начертания. У каждого шрифта есть начертания, то есть каждый шрифт может иметь разные начертания, может иметь более тонкие буквы, может иметь более толстые. Давайте выберем среднее что-то значение. Ну, среднее значение это у нас
354: Как раз-таки регулар или book, нам нужно выбрать что-то среднее по жирности. Выберем 7 бол, чтобы не слишком текст был жирным, потому что если он слишком жирный уже он очень, ну, слишком большое внимание перетягивает на себя от картинга. Нам все-таки в реклам
355: Креативе нужно ещё показать, на чем ребята гоняют, поэтому выбираем начертания сами болт и ещё 1 классный лайфхак, как я обычно делаю, как вот я стилизую шрифты, точнее как я стилизую текст, чтобы он выглядел более, ещё сбито, собрано, технологично.
356: Я уменьшаю расстояние между букв. Есть определённый лайфхак. Если вы делаете большой заголовок, то мы можем в большом заголовке уменьшать расстояние между букв. Называется это трекинг, то есть расстояние между букв.
357: Называется трекингом. Почему его можно уменьшать именно когда заголовок большой, потому что если мы сделаем заголовок маленький, например, ну если будет какой-то мелкий текст, мелкий текст, это вот там 30, например, 30 размер буквы.
358: Могут между собой слипаться. И, например, если вы смотрите с телефона будет очень тяжело различать буквы между собой. То есть если у нас текст мелкий, мы трекинг не уменьшаем. То есть это нужно для того, чтобы мозг мог даже с какого-то
359: Расстояние даже с далёкого расстояния. Ну, например, если вы смотрите на смартфоне, а большинство людей сейчас потребляют контент, смотрят telegram, соответственно, где эта реклама будет размещена, смотрят telegram именно с телефона. Поэтому, если мы делаем текст мелкий, мы в нём
360: Трекинг не уменьшаем. Если мы делаем текст большого размера, мы можем позволить себе трекинг уменьшить, но слишком увлекаться здесь не стоит, чтобы буквы прям не заползали друг на друга. Это тоже уже выглядит не очень красиво и мешает читабельности. То есть -5 - 6 это
361: Допустимые параметры, но опять же все зависит от шрифта, потому что у каждого шрифта разное расстояние между букв. Изначально прекрасно, что мы с вами делаем дальше. Давайте выровняем теперь наш текст относительно верха, чтобы сверху отступ был
362: Такой же, как и слева, как это сделать. Есть несколько способов. Мы можем выделить наш текст, нажать клавишу альт. У нас появляется вот такой двойной курсор. Теперь мы наводим просто этот курсор на фрейм, что мы видим, у нас здесь появля
363: Отступы слева и сверху текста от края фрейма. И, казалось бы, мы можем подвигать текст вниз, да, если мы двигаем текст вниз, у нас вот сверху 44 пикселя отступ и слева 44 пикселя отступ но если
364: Если мы смотрим явно же, что сверху отступ больше, чем слева, почему так происходит тексты? Вот, вот это расстояние, которое мы можем, которое мы можем посмотреть, оно не от букв, то есть оно показывается не от букв, а от
365: Рамочки, которая вокруг нашего текста, и она всегда несимметричная. То есть посмотрите, слева отступы этой синей рамки и справа он раз, ну, эти отступы разные. То есть эта синяя рамочка всегда несимметричная, но мы её не трогаем, если вы её даже
366: Тронули. Если вы её тронули, то всегда нажимайте просто вот здесь на эту стрелочку, чтобы у вас текст как бы автоматически текстовый фрейм текст облегал. Это очень важно, чтобы вам было удобнее работать с текстовыми блоками. Возвращаемся снова к наш
367: Поля, поскольку фрейм у нас не Ровный по краям, то есть отступ от букв здесь явно больше, чем здесь, мы будем пользоваться с вами для того, чтобы выровнять текст слева и сверху, мы будем пользоваться с вами дедовскими методами, которые работают
368: Всегда они не супер удобные, не супер технологичные, но зато всегда работают и супер быстрые. Что мы делаем? Мы заходим вот в наши фигуры и рисуем прямоугольник. Прямоугольник ставим просто в наш, в наш фрейм включаем.
369: Сразу на прямоугольнике. Вот где у него вкладочка лаяут, здесь нажимаем на этот прямоугольник, нажимаем, чтобы он был синим. Теперь наш прямоугольничек выставляем по краю фрейма, чтобы он Ровно к краюшку фрейма прилипал, и уменьшаем его, чтобы он
370: Прилипал теперь к этой направляющей. Что мы делаем дальше? Я думаю, вы уже догадались. Просто перетаскиваем его вверх и подвигаем текст так, чтобы он к этому прямоугольничку прилипал. Теперь у нас расстояние сверху и слева абсолютно одинаковое. Метод не очень может
371: Быть крутой, но зато работает всегда. Что делаем с вами далее. Далее мы с вами будем размещать текст. Остальной текст. Остальной текст это у нас дата и время проведения. 11.08, с 10 до полуночи. И нам нужно
372: Будет также разместить адрес нашего, где проводится мероприятие. Логотипы будем размещать в самом конце. Давайте скопируем наш текст. 11.08, 11 0 8. Копируем, возвращаемся в нашу фигму.
373: Так, рано скопировали. Давайте сначала копируем этот текст. Контрол ц контрол в отлично. В слоях у нас копия появилась. Давайте перетащим теперь текст ниже, ниже. Вот сюда, здесь разместим нашу дату и наши
374: Время теперь дату все-таки скопируем. Можно было, конечно, написать от руки, но лучше сделать. Мне легче сделать копию. Вставляем сюда. Отлично. У нас получается вот такая дата, также подравниваем носики единичек, чтобы они были чётко по нашей
375: Левой направляющей я рекомендую всегда подравнивать текст под направляющим, чтобы у вас максимально эстетично выглядел ваш слайд. Вообще в целом кто-то говорит, что дизайнер не должен быть таким перфекционистом. Я, например, учу и на курсе, и на марафоне, что дизайн
376: Дизайнер должен уделять особое внимание мелочам вообще искренне считаю, что дизайн строится как раз-таки из мелочей, и чтобы устроиться в крупную компанию, чтобы устроиться в компанию с хорошей зарплатой, зарплатой шестизначной, то есть зарплатой от 100 000 ₽ как раз-таки.
377: Нужно уделять дизайн мелочам. Я так делаю. Сам работал с кучей компаний, где все это просто подтверждают. И арт директора, и другие коллеги. Также точно также учу и на курсе, и на марафоне. Поэтому, если вам интересна профессия дизайнера, если вам
378: Интересно научиться зарабатывать на дизайне от 70 000 ₽ в месяц, то приходите на наш марафон, ссылка и все подробности в описании. А мы продолжаем, переходим снова в наш документ. Выделяем теперь время. Время мы сразу под, да.
379: Разместим время, сейчас разместим в классной плашке, делаем её с помощью эффекта, о котором я вам говорил ранее, но который мы с вами в начале не посмотрели. Так рано снова скопировали, копируем снова текст контрол ц контрол в переходим сюда, копируем.
380: Этот текст, когда, если, ну, если мы делаем просто копию, если бы мы скопировали и сделали здесь копию, мы бы не смогли этот текст вставить. Давайте уменьшим наш шрифт до 45 единиц. Этого будет достаточно, ой, до 1 уменьшил, вообще ничего не видно, до 45 единиц также
381: Давайте здесь уберём такой низкий трекинг. То есть - 6 это слишком, слишком малые отступы букв друг от друга для такого небольшого текста. И ещё я хочу сделать буквы менее жирными, они будут лучше считываться. То есть чем жирнее шрифт, опять же большое заблуждение.
382: Многие дизайнеры делают там шрифт очень жирным, но это большое заблуждение, что жирность влияет хорошо на читабельность не всегда мозг может хорошо различать тексты, если они очень жирные. То есть если сделать все супер жирным, просто мозг видит кашу, все это сливается.
383: Это сливается в единое целое и ничего становится неразличимым. Гораздо лучше где-то сделать, например, текст потоньше, где-то сделать текст, там потолще, здесь важно работать именно над акцентами, чтобы у вас не было. Вот каши не было, все просто.
384: Мозгу человека, который будет смотреть на ваш рекламный креатив, будет комфортнее воспринимать информацию. Итак, теперь выделяем наш, наши цифры, наши данные, нашей нашего времени и нажимаем связку клавиш.
385: Shift, plus, a shift plus a. У вас текст должен превратиться из просто текста. Обратите внимание на слои. У вас иконка сейчас должна поменяться из просто текста вот в такие 2 полосочки это тоже фрейм, но.
386: Frame необычный, это не такой фрейм, в котором мы делаем с вами дизайн. Давайте покажу, чем они отличаются. Пока что вы можете ничего не делать. Я покажу просто разницу, залью его цветом. Пока давайте вот сделаю красный цвет просто для удобства и если мы на
387: Начнём что-то печатать. У нас вот этот фрейм, эта плашка, она начинает автоматически подстраиваться под ширину нашего текста. Эта функция называется автолут. С помощью неё можно делать плашки и быстро их редакти.
388: То есть любой текст, который вы меняете, например, в опере, мы плашку рисовали самостоятельно, и если мы там захотим, захотим текст сделать другим, нам придётся плашку перерисовывать, но у нас и плашка другая у нас плашка, там зигзагообраз.
389: Здесь плашка полностью Ровная, нам проще её не рисовать, а сделать её через слой автолут. И почему ещё мы делаем именно автолут слой, потому что у нас функция, например, вот давайте выделим наш текстовый блок.
390: В эффекты. И здесь есть глаз эффект, который серым светится. Он неактивный, он работает только с фреймами, то есть он работает только с фреймами. Видите, теперь он активный, он не работает с обычными блоками, с текстовыми
391: Либо с обычными изображениями, только с фреймами. В фигме есть 2 вида фреймов. Это либо frame, автолёт, либо обычный фрейм, в котором мы делаем дизайн. Продолжаем нашу работу. На что, кстати, стоит обратить внимание, если мы
392: Вот обратимся к настройкам фрейма. Проверяйте, чтобы у вас здесь был везде написано хук. Если здесь у вас будет другие значения, например, фиксит, то когда мы пишем какие-то здесь дополнительные буквы, у нас букв.
393: Пишутся, но плашка не увеличивается для того, чтобы плашка увеличивалась. Напоминаю, у вас здесь в настройках именно фрейма, то есть не в настройках текста, а в настройках именно фрейма должен стоять хук контент, то есть
394: Вот здесь у нас функция автолут, где размеры нашего фрейма написаны. Здесь должно стоять хук контанс, чтобы автоматически плашка подстраивалась под размер нашего текста. Теперь можно выключить свет. У нас просто удаляем цвет у нашего
395: У нашего фрейма здесь я ещё случайно включил эффект тени подпишем наш фрейм как время.
396: Время и давайте теперь включим функцию, которую про которую я вам говорил. Функция называется так, эффекты выбираем глаз, глаз. Эффект у нас появляется вот такая приятная обводка по фону для
397: Чего её сделал у нас на фоне с вами сразу небольшой спойлер. У нас на фоне с вами будет текст под картингом. Картинг будет стоять на тексте. Давайте покажу, как он будет выглядеть. Свернём все.
398: Вот так это будет выглядеть. То есть картинг будет стоять на тексте. Я сейчас покажу, как сделать такой текст такой изогнутый, чтобы он как бы лежал под картингом. Делать это будем с помощью плагинов, как я и говорил, и у нас эта плашечка будет при
399: Ловлять все, что находится под ней. То есть это называется глаз. Эффект это был небольшой спойлер. Давайте делать дальше. Просто чтобы вам было интереснее, переходим обратно в фигму. Давайте, наверное сначала подравняем вот здесь нашу текстовку и плашку.
400: И потом уже будем делать вот этот текст под картингом. Делаю его для того, чтобы рекламный креатив выглядел более привлекательным, потому что сейчас он выглядит все равно пустовато. По сути, у нас здесь текст, текст, вот здесь будет небольшой текст в виде адреса, и здесь будут логотипы, остальное
401: Все очень пустое. Хочется как-то стилизовать. Во первых, создать ощущение гонки. Я разместил здесь текст для того, чтобы показать как бы ощущение того, что гоняли по этому тексту. Вот знаете, иногда всякие спортивные автомобили, спортивные болиды.
402: Гоночные автомобили фотографируют как бы сверху на трассе, и зачастую под ними трасса потёртая. Поэтому мы с вами сделаем ещё буквы вот эти, которые под картингом будут, сделаем их ещё и потёртыми, чтобы создавалось ощущение, что по ним гоняли, что по ним ездили.
403: Давайте включим снова наши направляющие, выделим наш фрейм и нажмём вот сюда. Отлично. Давайте плашку, сделаем более красивой, выделим её и зададим расстояние от текста до края плашки не 10 единиц.
404: А 30 единиц, чтобы как бы текст в плашке было больше воздуха. То есть текст так не был зажат, чтобы текст лучше считывался. Что ещё хочу сделать. Ещё хочу сделать следующее. Хочу закруглить края у этой плашки, чтобы она не была квадра.
405: Была с овальными краями. Для этого здесь, в этом значении напишу просто 100 единиц. 100 единиц. Это практически максимальное закругление. Отлично подравняем теперь нашу плашку, подравняем нашу плашку мы чуть позже, кстати, с вами чуть
406: Позже ещё покопаемся здесь в эффектах, когда у нас будет готов фон. То есть когда на фоне у нас будет текст под картингом, мы с вами поклацает разные эффекты на этой плашке, чтобы вообще понять, что этот глаз эффект из себя представляет. Давайте
407: Сразу подравняем нашу плашечку относительно, ну, выровняем поля, чтобы слева и снизу они были одинаковые. Нажимаю клавишу альт. Здесь уже обратите внимание, у нас это не текст, это именно плашка. И здесь вот этот фрейм, который вокруг синий, он идеально
408: Прилегает к краям. То есть мы сейчас можем, выделив нашу плашку, нажимаем клавишу альт наводим на фрейм. Вот видите, у нас клавиша раздвоился курсор, если мы на объекте курсор держим и когда мы переводим зажатой клавишей alt
409: Курсор на наш фрейм сразу показывает отступы от краёв перемещаем вниз, делаем 54 здесь уже все идеально, потому что синий фрейм нашей плашки, он идеально прилегает к её краям, то есть здесь это у нас не текст.
410: Здесь работать проще, что ещё хочу сделать? Хочу уменьшить немного вот этот текст, потому что у нас все-таки должен заголовок, должен выделяться и заголовок должен быть больше, чем любой другой текст, который у нас есть. Кстати, здесь у нас почему-то тень ещё включена
411: Давайте выключим тень, я не знаю, почему она включилась. Может быть, случайно что-то не то нажал уменьшим. Давайте хотя бы до 160 единиц. Сильно не хочется уменьшать, но немножко уменьшить надо. Теперь давайте сделаем следующее. Давайте снова нажмём клавишу shift плюс r и выйти.
412: Направляющую ещё 1 вот сюда, то есть чтобы основную сетку не менять, но 1 направляющую хочу сюда вытянуть, чтобы вот этот текст. То есть наша дата была по ширине, как эта плашка, чтобы вот этот блок текстовый внизу выглядел.
413: Очень структурировано и как бы симметрично. И верхняя, и нижняя строчка. То есть верхняя строчка у нас дата, нижняя строчка, время тянем немножко наш текстовый блок. Делать это будем уменьшая, точнее увеличивая трекинг между букв. Давайте увеличим до - 1
414: Процента, потому что - 6 было слишком мало, что делаем теперь, теперь немножечко будем уменьшать по пункту наш шрифт, пока он как бы не станет зажат между направляющей вот этой, которой касается наша плашка, и направляющей вот этой, которая
415: Мы тоже с вами сейчас создали, теперь можно текст наш переметь, переместить ниже и теперь выделим с вами и плашку и текст. Напоминаю, чтоб выделить плашку. И текст нам необходимо. Выделяем, например, плашку зажим.
416: Нажимаем клавишу ctrl и в слоях выделяем с зажатой клавишей ctrl левой кнопочкой необходимый нам текстовый блок посмотрим, какое у нас расстояние теперь между этих 2 текстовых блоков 27 пикселей давайте увеличим до 40.
417: Можно сделать это. Давайте сделаем проще. Давайте просто 13 раз 13 раз нажмём на стрелочку и поднимем наш текст выше. 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 13. Вроде так. Выделяем снова наши
418: 2 текстовых, 2 вот этих блока. 1, 2, 39 единиц. Давайте сделаем 40, чтобы вот такой отступ был более более заметный. Выключим пока все наши направляющие. Выделяю фрейм здесь.
419: Глазиком скрываю направляющие и нажимаю клавишу shift плюс r, чтобы эта направляющая тоже у нас пока исчезла, отлично смотрится, я поднял немного буквы, чтобы они друг от друга не отвлекали все-таки это 2, это хоть и 1 текстовый блок, но по значению.
420: Это разные, это дата, это время, чтобы они слишком близко не были, чтобы, например, если слишком, например, если сделать вот так, то дата очень сильно отвлекает от времени, поэтому немножечко дадим им воздуха и немножко больше расстояние между ними.
421: Сделаем так. Давайте теперь сделаем фоновый текст. Делать его очень легко. Просто берём, копируем заголовок контрол ц контрол в давайте подумаем, что можно написать на фоне, чтобы это не дублировалось. Давайте напишем, например, картинг кар.
422: Тинг, вот так вот с переносом, с вот таким переносом увеличим наш текст где-то до пятиста единиц. Вот до 5 шрифт сделаем размером 500. Давайте пока его вытащим даже из нашего, из нашего рекламного креатива. Предлагаю
423: Вот вот эти 2 текстовых блока, их выделить, выделить, сгруппировать, нажимаем правой кнопкой мыши на них групп селекшн подпишем как дата и
424: Дата и время заблокируем сразу рейс дей тоже подпишем как заголовок.
425: Тоже заблокируем и заблокируем наш карт, чтобы ничего сейчас случайно не сместить, что мы с вами делаем. Далее давайте снова этот вот этот текст картинг перенесём вот сюда, в наш фрейм. Можно пока его покрасить в какой-нибудь другой цвет, чтобы просто о
426: Там был лучше нам заметен, чтобы нам было удобнее работать. Отлично. Теперь пока размещаем его, как вам удобно. Вообще без разницы, что делаем. Теперь нажимаем вот сюда, на вот эту звёздочку здесь.
427: Заходим плагины и виджеты и ищем вот этот плагин у меня он есть вам необходимо написать fast fast изометрик, он здесь 1 у нас выскакивает, нажимаем на него, просто кликаем скорее всего у вас
428: Он загрузится сначала. Ну там это буквально происходит секунд за 30. Плагин абсолютно бесплатный. Здесь можно подключить платную версию, но я, честно, даже не знаю, за что она вообще отвечает. Она нам не нужна. Мы можем абсолютно работать с бесплатной версией. Что мы здесь делаем в окошке?
429: В этом окошке мы берём и двигаем вот этот ползунок, либо двигаем здесь, либо просто двигаем здесь. Нам нужно наклонить буквы таким образом, чтобы они как бы лежали под картом примерно вот, вот.
430: Так, давайте сразу буквы эти в слоях перенесём в самый низ под карт, кликнем по буквам правой кнопкой мыши и направим сент ту бэк, отправим их под карт. Видим, что немножечко как будто бы они не в 1 плоскости. Давайте ещё покрутим
431: Вот так вот теперь карта как будто бы действительно на них стоит. То есть теперь выглядит это все более
432: Более реалистично. Сейчас мы с вами выберем вот так отлично. Вот смотрите, у вас должно быть в верхней, в верхней графе 40 градусов, в нижней - 19 градусов. Можете просто руками прописать и все будет прекрасно. Нажимаем здесь просто теперь на
433: Крестик все отлично. Мы сделали с вами классные буквы под картом. Давайте теперь сделаем их более массивными и побольше, чтобы они как бы были стилизацией на фоне. Нам не нужно, чтобы этот текст читался. То есть нам это не важно, нам нужно просто чем-то
434: Логически подходящим занять фон под картингом. В данном случае мы делаем это буквами и как бы делаем отсылку на какую-то потёртую дорогу, на какой-то потёртый трек. То есть у меня есть вот в голове просто видение, что вот
435: На гоночных треках всякие надписи на дорогах или там какие-то, какая-то разметка на дороге. Она просто потёртая. Мы здесь делаем тоже самое. Давайте увеличим текст до семиста единиц. Вот вообще круто выглядит. Выделяем его, перетаскиваем под карте.
436: Под card Ровно вот как-то вот так давайте, чтобы с заголовком не пересекался и давайте попробуем жирность увеличить, увеличим жирность наверное, до
437: А давайте сделаем блэк выглядит прям очень круто, выглядит очень круто и вот так примерно, чтобы у нас между буковкой k и буковкой р. Был наш картинг обратите, кстати, внимание на действие нашего глаз эффекта видите, как круто преломляется на нём цвет.
438: Который цвет наших букв, которые мы разместили под этим под плашкой с глаз эффектом. Можно, кстати, сейчас сразу эту потестировать различные настройки на этой плашке разблокируем, пока дату и время откроем нашу группу.
439: Нажмём на нашу плашечку время, зайдём в настройки глаз эффекта и здесь можно поиграться с разными настройками. Здесь у нас есть вот 1 настройка отвечает за преломление. То есть видите, если в 0 выкрутить, вообще у нас ничего
440: Не преломляется. Если сделать больше, то у нас прям сильно по краям преломляется, преломляется все, что попадает под эту плашку. 2 кнопочка у нас отвечает за глубину как бы преломления. То есть чем меньше здесь значение, тем преломление ближе к краю, чем значении
441: Больше тем преломление ближе, как бы к центру идёт, что у нас ещё есть какие у нас ползунки ещё есть, есть ещё предпоследний ползунок, он как бы добавляет ещё больше преломления и, ну, здесь у нас не видно, здесь у нас не видно, но как бы у нас ещё блики добавляются по края.
442: Дополнительные. И последний, последний ползунок отвечает за блюр эффект внутри плашки. Ну, я обычно его не трогаю, он здесь в дефолтных позициях, я у себя ничего менять не буду. Мне нравятся дефолтные значения. Выглядит все очень, очень классно. Вы можете
443: Крутить, как вам нравится, либо оставить такие же значения, как у меня. Я значения вообще не менял. А, кстати, ещё не показал вам. Также здесь можно изменить источник света. То есть, видите, вот эту камеру просто двигаем и можно изменить источник света, откуда свет падает. Здесь можно также изменить
444: Например, яркость вот этой обводки по краям, то есть яркость солнечного света, который падает на нашу плашку. В общем, эффект достаточно классный. Его добавили недавно, поэтому пользуйтесь. Это очень, очень крутая штука, которая позволит делать ваши работы.
445: Более визуально красивыми. Идём дальше. Что нам нужно сделать? Давайте сразу закончим со стилизацией, закончим с фоном и потом уже перейдём к дальнейшему, к дальнейшей работе над нашей текстовкой. Используем ещё 1 эффект. Во первых, для начала давайте, наверное, перекрасим наш текст в не такой
446: Ядерный, то есть очень прям было все такое красное. Давайте сделаем посветлее.
447: Ну давайте наверное так. Если будет слишком темно, мы всегда можем цвет сделать поярче вот такой темно серый, все тройки у меня вот 333333 это цветовой код, заходим в эффекты, плюс здесь выбираем не drop shadow, а выбираем.
448: Прикольный эффект текстура. Мы сейчас будем с вами имитировать эффект как будто бы на вот покрытие, на асфальт, на покрасили эти буквы. То есть как будто бы их красили, как будто бы это не просто вот текст, который мы с вами включили, а как будто бы действительно это
449: Крашенный накрашенный текст заходим в настройки текстуры и вот это значение немножко с вами изменяем. Делаем, например здесь давайте сделаем 11 а здесь сделаем давайте здесь тоже
450: Делаем 11. Что вообще это за значение? Чем больше у нас значение верхнее, тем менее заметные, тем больше, тем изгибы большего размера. То есть обратите внимание, чем меньше здесь значение сверху, тем
451: Ну вот этот край, видите, если значение прям сильно мелкое, он как бы вообще так распыляется на мелкие, на мелкие частички, как будто бы с баллончика краской пошли. Чем значение больше, тем изгибы становятся менее заметными, тем они больше становятся.
452: И, соответственно, 2 ползунок отвечает за глубину, то есть на какую глубину проникают вот эти изгибы. Поэтому давайте поставим и там, и там 2 единички. Сейчас у нас прям видно, как будто бы на асфальт, на какое-то гоночное покрытие, как
453: Будто бы накрасили вот эти буквы. Может быть оно не супер сильно заметно, но в общей картине будет выглядеть хорошо и будет добавлять реализма. Чем реалистичнее работа у нас получается, тем больше ей доверяют клиенты. И именно за такие работы реалистичные.
454: Хорошо читаемым текстом клиент и готов платить не 500 ₽, a2 3000 где находить таких клиентов, чем ещё занимаются дизайнеры, кроме рекламных креативов, как работать с нейросетями и использовать их как помощника, который позволяет делать дизайн быстрее я как раз
455: Рассказываю на моём пятидневном марафоне, ссылка на marathon находится по прежнему в описании под этим видео, поэтому кому интересно, кто хочет научиться зарабатывать на дизайне, переходите и записывайтесь, пока есть места, мы берём всего 20 человек, чтобы максимально каждому уделить время.
456: Хочу обратить ваше внимание на то, что мы снова здесь ничего не рисовали. Картинг мне предоставил клиент уже без фона. То есть карт у картинга это снова 3 д моделька картинга, у которой снова нет фона. Нам ничего даже не нужно фон удалять. Нам ничего не нужно рисовать, мы просто берём изгото.
457: Готовых изображений. Соединяем готовые изображения воедино и получаем классные рекламные креативы. Давайте теперь сделаем эффект потёртости как это делать. Берём нашу картинку, берём нашу картинку и снова открываем
458: Плагин fast изометрик, напоминаю чтобы его открыть, нажимаем звёздочку, можно зайти либо в плагины и виджиты, либо вот здесь у вас должен быть в последних используемых и прописываем те же значения.
459: По моему, сверху у нас было 40, а снизу было минус. Если я правильно помню, 19 закрываем пока плагин и загружаем нашу, загружаем нашу, нашу потёртость в наш фрейм и давайте нажмём.
460: На нашу потёртость и отправим правой кнопкой мышки. Нажимаем, отправляю её в самый нижний слой под наш текст. Давайте сделаем следующее. Уменьшим теперь её, уменьшим её, чтобы она была по высоте, как наши буквы. Может быть, чуть давайте вот.
461: Примерно вот такого размера сделайте немножко увеличим. Я забыл, что нам же нужно, чтобы буквы читались, чтобы они не полностью стёртые были. Копируем потёртость контрол ц контрол в перемещаем её, копируем ещё раз контрол ц контрол в перемещаем. Вот.
462: Здесь копируем ещё раз контрол ц контрол перемещаем так, чтобы потёртость у нас закрыла все, почему я так сделал. Давайте просто я сейчас вытащу все наши потёртости, чтобы вы на них посмотрели. У потёртостей есть заливка, то есть есть цвет.
463: Вот здесь, да, есть вот такие пятнышки и есть очень много пустот. Так вот, мы сейчас будем с вами использовать функцию, которую сегодня ещё ни разу не использовали. Это функция маски. Функция маски позволяет сделать наложение объекта, который находится сверху в слоях на
464: Объект, который находится снизу, снизу в слоях, и объект, который находится сверху слоем выше, наложится на объект ниже таким образом, что он будет виден потом только в тех местах, где у объекта в слое, в нижнем.
465: Слое, есть заливка. Какой бы вам пример привести, блин, даже не знаю. Давайте сейчас, чтобы вам было понятно. Сделаем это на листке бумаги, чтобы вы вот наглядно поняли, что я имею ввиду.
466: Вот у нас есть с вами лист бумаги. Надеюсь, вам не сильно он сейчас шелестит. Он у нас находится в слоях выше, и я хочу его наложить, например, на свою руку, на свой кулак. Лист бумаги у меня больше, чем моя рука, но я хочу, чтобы он был по форме, как моя рука.
467: И когда я включу функцию маски, лист бумаги примет вот такую форму, то есть лист бумаги станет по форме, как моя рука, потому что он слоях выше, и мы включили функцию маски. Надеюсь, вам было понятно, куда ни
468: Пока туда мы отправим лист бумаги, потом его выброшу давайте теперь возвращаем наши потёртости там, где они были, выделим их все нажимаю клавишу ctrl держу её и выделяю все потёртости свои теперь нажимаю правой кнопкой мыши по по.
469: Потёртостями также их группирую групп селекшн. Давайте подпишем этот слой, подпишем потёртости.
470: Потёртости что теперь нужно сделать, чтобы у нас буквы стали потёртыми, необходимо выбрать слой потёртости и с зажатой клавишей ctrl выделить картинг, то есть наш текст. Теперь мы идём направо.
471: Панель инструментов вот сюда нажимаем на эти 3 точки и нажимаем клавишу use маск пум. У нас буквы стали потёртыми. То есть у нас теперь буквы отображаются только в тех местах, где у потёртостей есть
472: Заливка, я думаю, пример с бумажкой вам должен был быть понятен, чтобы, например, если нам хочется, чтобы буквы были не такими потёртыми или, наоборот, более потёртыми, мы можем обратить внимание. У нас теперь появился слой маск.
473: Групп. То есть у нас до этого были 2 слоя картинг и потёртости. Теперь слой масс групп. И вот этот слой выглядит как маска. То есть видите, вот такая луна и квадратик. Давайте, во первых, подпишем как фон, этот слой и теперь
474: Чтобы здесь изменять интенсивность потёртостей, нам необходимо открыть вот этот слой, маску потёртости. Здесь у нас есть все наши 4 картинки. Мы можем картинку скопировать контрол ц контрол в и аккуратно её подвигать.
475: И видите, у нас, у нас на буквах появляются появляется заливка. То есть если мы хотим сделать буквы более читабельными на фоне, мы можем скопировать ещё раз картинку, переместить её и разместить в том месте, где нам необходимо добавить заливку.
476: Если же нам, наоборот, заливки слишком много и мы хотим буквы сделать ещё более потёртыми, любую картинку просто удаляем, просто удаляем картинки. Видите, у нас буквы также исчезают, потому что под ними нет слоя, на котором они могут проецироваться.
477: Давайте пока закроем и потёртости и закроем фон, и пока его заблокируем, прекрасно идём с вами хорошими темпами. В принципе, самое сложное, что здесь можно было делать, мы сделали. Давайте продолжать дальше. Теперь нам необходимо разместить адрес нашего
478: Нашего клуба, куда нужно прийти, чтобы поучаствовать в этом мероприятии под названием race day. Кстати, если вы обратили внимание, я нашёл здесь текстуру нам. Мы её с вами опять же в начале, когда приступали к этому логотипу, мы её с вами уже сюда предзагрузил.
479: Она уже готова для использования, мы тоже её будем использовать как наложение. Она мне понравилась из за того, что она вот как будто бы с такой текстурой асфальта. И мы сверху на нашу картинку эту текстурку загрузим, чтобы она дала нам вот асфальт.
480: Текстуру реального гоночного покрытия. Также мы попозже добавим с вами дым, но пока ещё не время, пока сначала разбираемся с текстом и в конце уже будем добавлять дым и вот эту текстурку с бликами. Что с вами делаем? Давайте разблокируем какой-нибудь текст.
481: Давайте можно разблокировать заголовок контрол ц контрол. В его скопируем 1 из заголовков, заблокируем 2 копию перенесём сюда. Мы с вами делали вот этот текст размером в 45 единиц. Давайте тоже самое сделаем здесь 45 единиц.
482: Уберём трекинг до - 1 единицы. У нас здесь он - 1, чтобы слишком большой трекинг не был. То есть, чтобы не было слишком маленькое расстояние между букв, потому что текст мелкий. Если слишком мелкое расстояние между букв сделаем. Напоминаю, то у нас очень плохо текст
483: Будет читаться. Переходим в наш документ, копируем давайте для начала Москва контрол ц переходим в фигму, вставляем сюда слово Москва. Давайте сделаем капсом, напишем, напишем Москву капсом, чтобы все было у нас симметрично у нас
484: Везде просто большие буквы. Везде, везде вот даже вот здесь цифры. Хочу написать заголовок адреса капсом. Как это сделать? Нам не нужно перепечатывать вручную большими буквами мы просто выделяем текст, заходим в его настройки вот здесь, вот здесь
485: Нажимаем кнопочку и выбираем. Вот здесь есть у нас параметр, который отвечает за написание. Мы можем сделать либо все буквы мелкими, либо все буквы крупными, все закрываем настройку. У нас получился вот такой классный заголовок. Выделяем наш
486: Рекламный креатив. Давайте включим снова наши направляющие, приблизим немного и где-то здесь, пока выровняем наш текст. Просто пока по правой полосе. То есть я напоминаю, что у нас с вами отступы слева и права.
487: Рекламном креативе, то есть наши поля по ширине ширина, точнее ширина наших полей 1 колонка. Вот. И вот переходим снова в наш документ. Хотя нет давайте сделаем сначала копию текста контрол ц контрол в у нас кстати
488: Он подписан как заголовок, но можем пока ничего не менять, потом все равно сгруппируем и это у нас сгруппируем и группу уже подпишем как адрес. Ну, можем для удобства на всякий случай, чтобы не запутаться. Давайте подпишем все-таки Москва, эту строку подпишем как адрес.
489: Отлично. Переходим в наш документ, копируем вот этот текст. Контрол ц. Переходим в фигму, вставляем сюда текст, видим, что он гигантский. Давайте его уменьшать. Ух ты, как красиво он под этим преломляется.
490: Здорово. Давайте все равно его уменьшать, чтобы здесь ничего не пересекалось, ничего не закрывалось. Давайте его уменьшим в 2 раза. Давайте до 25 пикселей уберём начертание капсом, уберём начертание капсом, начертание капсом. Хорошо, когда
491: Хорошо выглядит, когда у вас короткие строки, когда у вас короткие заголовки, когда у вас там в строке 1, 2 слова. Но если вы пишите большие строки капсом, это неудобно для восприятия. То есть, если мы пишем какую-то большую строку, особенно если это адрес, особенно если здесь
492: Есть вот такие сокращения, типа трц, то лучше писать прописными буквами, то есть без капса так будет считываться гораздо лучше. И давайте заменим начертание на более тонкое, на regular, чтобы опять же, у нас не было не
493: Грузить слишком сильно наш слайд, потому что мы можем сделать все капсом. Мы можем сделать все жирным, но человек, когда будет смотреть, у него просто кровь будет из глаз течь. Это не наш вариант. Нам нужно, чтобы человеку было комфортно смотреть, потому что чем пользователю будет приятнее, удобнее смотреть на конечные
494: Рекламный креатив, который мы сделаем, тем больше заработает наш клиент. Тем больше он будет заинтересован платить нам, что с вами делаем. Далее. Давайте выровняем оба этих текста по правой направляющей. Теперь выделим их оба.
495: Выделяем и Москва, и с помощью клавиши ctrl и левой кнопочки мыши в слоях выделяем адрес здесь давайте поставим 10 единиц, чтобы это все было близко и рядышком располагалось снова выделяем 2 наших текстовых блока.
496: Напоминаю клавиша ctrl и левая кнопка мышки выделяем теперь кликаем правой кнопкой мыши по нашему тексту, выделенному нажимаем групп селекшн, подписываем нашу группу, называем её адрес, группу можно закрыть.
497: Нажимаем теперь связку клавиш shift плюс r shift плюс r, чтобы вытянуть ещё 1 направляющую видите, мы здесь вспомогательную направляющую с вами вытаскивали. Теперь нам нужно вытащить направляющую горизонтальную, для этого вытаскиваем её сверху, нажимаем клавишу.
498: Левую кнопку мыши и держим её, и тянем вниз.
499: Выставляем нашу направляющую по низу вот этих Ноликов по низу Ноликов и выравниваем вот этот текст по нашим ноликам можно выровнять по краю плашки. Можно вы
500: По краю плашки это тоже допустимо, но мне не очень нравится. Кажется, что как будто у нас низ перекошён. То есть обратите внимание, если вот так вот посмотреть, кажется, что внизу сейчас у нас все перекошено, если же мы вот контрол зет нажимаю
501: Откатываю действие назад. Если же мы выравниваем именно по тексту, то у нас снизу все кажется таким ровненьким. Опрятненький очень классно выглядит, поэтому выравниваем именно по нашему, по нашим цифрам направляющие, кстати, эти выключаю той же клавишей, которой их и
502: Вызываю, то есть клавиша shift плюс r, направляющие у нас исчезают далее нам необходимо с вами разместить логотипы, давайте снова включим с вами наши направляющие и притащим наши логотипы сначала тимати и теперь ревью.
503: Отлично. Что нужно сделать перед тем, как с ними начать работать? Обратите внимание, у нас логотипы подписаны. Вот видите, видно их название. Это значит, что это сейчас фреймы. То есть это не группа, это фрейм с фреймом. Нам ра.
504: Работать неудобно, что я рекомендую сделать? Я рекомендую выделить фрейм. Видите, он отображается как frame, наш логотип, нам это не подходит. Нажимаем правой кнопкой мыши и ищем здесь не групп селекшн.
505: А у нас здесь есть анн групп, вот здесь an групп. Видите, у нас теперь превратилось все это в группу, в мэск групп. То есть теперь работать будет проще. Будет легче деформировать этот фрейм, будет легче уменьшать его размеры, либо, наоборот, его увеличивать с фреймом это делать.
506: Неудобно. Так, давайте сделаем тоже самое. С ривьерой. Также выделяем ривьера лога правой кнопкой мыши нажимаем, ищем анн групп отлично. Давайте теперь подпишем их логотипы, чтобы они были не mass групп, а, например, тимати лог.
507: И давайте ривьера.
508: Лого, отлично. Так перетаскиваем наши логотипы. Давайте их размещать. Обратите внимание, что у нас фрейм логотипа, да, вот эта синяя рамка больше, чем сам логотип, поэтому нам не очень удобно сейчас будет выравнивать автоматически, поэтому будем делать это вручную. Что с вами?
509: Делаем, выравниваем, чтобы буковка г прилегала к красной линии, и давайте растянем наш логотип растягивается. Видите, он неудачно. Почему он так растягивается плохо? Потому что мы с вами не включили вот здесь вот эту функцию
510: Во вкладочке ляут. Нам необходимо включить вот этот квадратик, чтобы он был синим, чтобы у нас пропорционально логотип увеличивался. Видите, теперь все хорошо. Давайте растянем его таким образом, чтобы он прилегал к нашей вот этой красной линии. Вот.
511: Отлично. Теперь он между красными линиями зажат, то есть мы его максимально структурировано разместили относительно других наших элементов. Для этого нам нужна сетка. То есть, чтобы у нас все было красиво, чтобы у нас было все структурно и все было размещено по определённым силовым линиям. Вообще силовые линии.
512: Нам нужны для того, чтобы управлять вниманием пользователя. И обычно мы как бы текст размещаем всегда, точнее не всегда, а, как правило, мы текст размещаем сверху вниз по значимости сверху вниз, слева направо то есть
513: Как написан у нас текст в книгах у пользователя уже есть определённые паттерны восприятия, поэтому ему просто удобно читать сверху вниз и слева направо, так же как мы читаем книгу, поэтому таким образом мы с вами размещаем и информацию. То есть он видит сначала
514: Заголовок читает ниже. Здесь уже у нас основная информация это дата и время проведения. И, соответственно, справа, когда мы уже, когда он уже всю информацию получил, он видит адрес. Поэтому вот таким образом мы расставили с вами информацию на нашем слайде. Давайте
515: Теперь снова включим функцию шифт плюс р. Включим наши направляющие и вызовем ещё 1 направляющую горизонтальную, выровняем его по буковкам, по слову рейс опустим логотип, чтобы он был выровнен относительно
516: Относительно нашего заголовка. Перетаскиваем теперь логотип ривьера и выравнивать его будем с вами по внутренней рамке тимати. То есть по вот этой чёрной, по внутренней чёрной области. Почему не выравниваем, например, по
517: Высоте логотипа. Так, давайте напоминаю, что если мы с вами забудем включить вот эту функцию, у нас вот такая беда с логотипом случится. Нажимаем сюда, растягиваем теперь логотип. Видите, он получается слишком огромным из за того, что он очень широкий, то ест
518: Он широкий и плоский, поэтому мы не можем их выравнивать вот таким образом давайте вот наши направляющие, которые мы с вами вызвали с помощью функции shift плюс r, выставим по внутренней части нашего логотипа тимати и наш логотип ривьера. Вы
519: Зададим размер, высоту как у внутренней рамки логотипа тимати. Теперь они одинаковые по размерам. То есть теперь они с точки зрения баланса выглядят хорошо, давайте зададим какое-то расстояние межд.
520: Между ними здесь расстояние задавать будет неудобно из за того, что у нас фрейм очень широкий. То есть видите, у нас логотип кончается здесь, а фрейм логотипа, от которого идёт подсчёт вот как раз-таки вот расстояние вот этого вот этих пикселей идёт
521: Аж от этой синей рамки. Поэтому давайте вручную нарисуем просто rectangle.
522: Нарисуем ректангл, например, зададим ему 20 единиц, 20 единиц и давайте вот прижмём просто логотип.
523: Чтобы прижмём логотип аврора к этому ректангель логотипом аврора, точнее, не аврора, а ривьера, прошу прощения, чтобы между логотипом ривьера и нашим логотипом тимати картинг было расстояние в 20.
524: Пикселей прекрасно. Теперь у нас логотипы тоже выглядят сбалансировано. Можно выключить направляющие и посмотреть, что у нас получается. В принципе, у нас рекламный креатив готов, но мы сейчас будем его стилизовать, чтобы он выглядел более драйвово и более динамично.
525: Что мы с вами делаем дальше? Дальше? Я предлагаю немножечко перекрасить наш заголовок. Давайте все заблокируем. Что что нам не нужно уже пока мы редактировать здесь ничего не будем. Разблокируем заголовок и я хочу сделать его, покрасить его в градиентный цвет для того,
526: Чтобы было ощущение, как будто бы он находится за картингом и на него падает небольшая тень. Выделяю заголовок, Иду в его палитру и включаю здесь градиентную заливку. Отлично, я даже не буду менять этот цвет. То есть вот дефолтный цвет, который мне
527: Предлагает фигма то есть все девятки просто я хочу немножечко разместить его немножко наискось вот таким образом вот теперь у нас кажется, что как будто бы текст заходит слегка за картинг из за того, что он слегка затем
528: Давайте немножко притени. Теперь текст внизу. Это у нас дата и время. Выделим нашу дату и возьмём пипеткой цвет где-то с середины, с верхушки буквы. А для чего это делаю? Для того?
529: Того, чтобы так сильно текст не отвлекал от картинки, не отвлекал от картинга, потому что картинг здесь тоже очень важный элемент. И вот эти большие текстовые блоки, они были слишком яркие. Сейчас все немножко. Вот композиция у нас более сбалансирована теперь по акцентам
530: Теперь нет чего-то кричащего. Теперь у нас и текст, и картинка работают в совокупности, работают как бы как 1 целое. До этого немножко текст выделялся и перетягивал на себя внимание. Поэтому вот так оставим здесь я градиентную заливку делать не буду. Вот только здесь её хотел сделать, здесь прост.
531: У нас будет текст более серенький. Отлично. Давайте теперь добавим наш дым, добавим дым, дым. Давайте развернём. Сделать это можно либо вот так вот руками, либо просто написав здесь 180 градусов, либо ещё сейчас.
532: Покажу 1 лайфхак правой кнопкой нажимаем на наш дым. Хочу просто, чтобы вот этот дымок более пористый заходил на картинг. То есть не вот этот плотный дым, который его перекрывает, а более вот пористая его часть. Поэтому как перевернуть дым, чтобы не
533: Крутить руками, чтобы было быстрее, правой кнопкой на дым нажимаем, и здесь у нас в самом низу есть flip horizontal, то есть отразить по горизонтали и отразить по вертикали, отражаем по вертикали и перетаскиваем наш дым в наш рекламный кре.
534: Прекрасно. У нас получается просто все офигенно. Опять же, видите, мы с вами ничего не рисуем, мы с вами вообще не делаем какую-то сложную там 3 д графику, ничего не придумываем с нуля не рисуем от руки. То есть мы просто берём готовые элементы, которые можно скачать.
535: Абсолютно бесплатно. С фотостоков абсолютно бесплатно можно найти в яндексе и сделать вот такой классный рекламный креатив. Просто в фигме без фотошопа, без каких-то сложных программ, просто на обычном компьютере или ноутбуке и мы уже сможем после
536: Урока. Вы уже сможете после этого урока положить эти работы в своё портфолио и начать искать работу. Сразу скажу я не рекомендую искать клиентов на биржах фриланса. Там часто попадаются заказчики, которые не готовы платить много
537: Иногда вообще не хотят платить и просто кидают дизайнеров и не платят деньги. Эта история случилась с моей ученицей буквально неделю назад. Это ученица с основного курса, то есть не с марафона, а уже с основного курса. Ученицу зовут Екатерина. Она делала заказ для клиента, которого нашла на бирже фриланса. Ей
538: Нужно было нарисовать логотип, и за это client ей обещал заплатить 12 000 ₽. В ходе работы заказчик начал просить делать дополнительные задачи, рисовать иллюстрации, показывать, как картинки будут смотреться на мокапах. Ну то есть денег больше платить не хотел, а количество задач увеличил, но по итогу он прост.
539: Пропал и ничего не заплатил. Есть, конечно, и хорошие клиенты на биржах, правда, их меньше. У этой же ученицы был клиент, для которого она делала меню для бургерной. Ну, знаете, меню, которое висит вот в небольших заведениях, прям над стойкой, где можно заказать еду. Сама она с задачей, к сожалению,
540: Не справилась она пока на старте обучения и прошла даже меньше половины основного курса. Катя решила не дожидаться идеального момента и обратилась за помощью к нашему куратору Сергею. Он откликнулся на просьбу помочь и разобрал проект вместе с ученицей, дал рекомендации и помог отредактир.
541: Макеты, как итог заказчик доволен и заплатил Екатерине за работу 7 000 ₽ с Катей. Мы потом созвонились, обсудили ситуацию, которая случилась с 1 клиентом, который не заплатил. Я ей рассказал, как общаться с клиентами. Как вообще понимать хороший клиент.
542: Перед тобой или клиент, с которым не стоит связываться, также подсказал, как лучше попросить клиента увеличить зарплату. Если проект стал больше, объёмнее, если появились новые задачи, и настоятельно порекомендовал не работать без предоплаты. Это, кстати, история абсолютно реальная. Вы можете посмотреть все.
543: Скриншоты переписки екатерины и сергея, а также скриншот о переводе 7 000 ₽ в моём telegram канале недавно выложили этот кейс очень классная история ученица, повторюсь, прошла меньше половины основного курса и уже заработала свои первые деньги где же искать работу?
544: Если не на биржах, я рекомендую искать работу только вот на 1 единственном сайте. Это сайт ххру. Кстати, вы уже можете собрать портфолио из работ, которые мы с вами делаем в бесплатных уроках на этом канале, и начать откликаться на вакансии. Если не умеете, то как это де,
545: Правильно вы можете узнать в моём telegram канале, я об этом там пишу. Если не хватает навыков или хотите поработать лично со мной, чтобы я разобрал ваши вопросы и подсказал, как быстрее начать зарабатывать на дизайне от 70 000 ₽ в месяц. Приходите на мой пятидневный марафон по дизайну.
546: Сделаете 2 работы в портфолио, освоите нейросети, созвонимся с вами лично. Узнаете, как правильно упаковать портфолио, и поймёте, как найти 1 клиента сразу после марафона без опыта. И самое крутое. Лучший из вас получит 1 реальный оплачиваемый
547: Проект все ссылки в описании. Переходите, записывайтесь и до встречи в чате марафона. Так, ребят, у нас сейчас дым перекрывает наш текст. Мне это не очень нравится. Давайте дым уберём под текст, под получается дату и время.
548: А, нет, давайте под адрес, потому что адрес сейчас тоже перекрывается. Мне это не очень нравится. Хочется, чтобы дым все-таки не мешал восприятию нашей информации, которую мы с вами разместили, а как бы наоборот, дополнял визуал. Давайте теперь дым скопируем. Контрол ц контрол в
549: И нажмём на 1 из дымов и отразим его по горизонтали. Вот так теперь разместим его. Здесь можно немножко его наклонить вот примерно так, чтобы он у вас был, ну, чтобы дым как бы
550: Ходил вверх вот сюда, за картинг левый дым. Давайте немножко переместим сюда и вот тоже чуть чуть его наклоним, но уже вправо можно наклонять по моим градусам, то есть правый дым я наклонил на 35 градусов, левый дым я наклонил на 100
551: 169 градусов. Можете сделать как я можете примерно как я здесь не критично дым. В принципе у нас не что-то важное, это просто элемент стилизации. Выглядит все шикарно. Теперь хочу добавить последний штрих, буквально последний штрих. Давайте нарисуем с вами
552: Здесь свечение берём инструмент перо. Мы сегодня с вами уже им пользовались неоднократно. Давайте нарисуем вот какую-то такую фигуру, чтобы она как бы шла вскользь по нашему правому краю. Вот эту часть, правую часть вы можете рисовать как хотите.
553: Как хотите, она не видна. Нам главное, чтобы вот левая часть была вот такая волнистая, аккуратная, вот именно справа и не слишком сюда заходила. То есть примерно как я, нарисуйте правую сторону. Повторюсь, можете рисовать как хотите, она не будет видна. Нажимаем enter. Теперь давайте.
554: В нашу фигуру можно подписать её как свечение, свечение давайте выберем теперь нашу фигуру свечения можно немножко приблизить рабочую область напоминаю, если вдруг забыли клавиша ctrl плюс колёсико мыши.
555: Добавляем здесь заливку цветом и убираем обводку и давайте теперь приблизим прям посильнее наш рекламный креатив. Проверяем, чтобы у нас было выделено свечение, заходим в нашу палитру и выбираем функцию
556: Пипетка пипеткой берём цвет с буковки. Давайте с буковки её возьмём с ривьеры. Я хочу добавить слева, точнее справа вот такой такое какое-то свечение голубого света, потому что сейчас у нас рекламный
557: Выглядит круто, но как будто бы хочется немножко разнообразить его цветом, чтобы он как-то дизайн выглядел глубже, более разнообразно, потому что текста много, картинка вроде классная, но хочется немножко её ещё улучшить, чтобы человек был заинтересован досмотреть картинку.
558: До конца, потому что сейчас все равно она выглядит немножко суховато и не очень ярко. А нам все-таки важно, чтобы картинка цепляла, чтобы человек был заинтересован до конца, дочитать информацию, которую мы ему даём, потому что хороший визуал
559: Образы. Хороший визуал тоже цепляет внимание и тоже способствует дочитываемости текстов. Свечение включаем. И давайте теперь добавим сюда эффект. Мы его сегодня тоже с вами щупали, так скажем, Леер блюр захо.
560: Ходим в его настройки и поставим, например, 500 единиц. У нас получается вот такое свечение, но оно пока не очень реалистичное. Во первых, давайте его переместим под адрес, чтобы оно не затрагивало текст, а ложилось только на дым и на наш фон.
561: Все равно оно выглядит не очень естественно. Давайте теперь перейдём на вкладочку справа вот сюда, нажмём на капельку. Это наше наложение. Мы уже в рекламном креативе бургер кинга с ними работали. Давайте выберем какое-то наложение, которое сделает наше свечение более
562: Реалистичным, чтобы оно выглядело более реальным.
563: Так, смотрим, что у нас здесь перемотаем. Даже вот, вот мне очень нравится свечение калор прям очень хорошо выглядит, как будто бы действительно там как будто бы действительно
564: На картинг что-то светит отлично. Вот теперь мне все нравится. Теперь у нас картинка стала более объёмной. Давайте ещё раз посмотрим. Тз. Создать рекламный креатив для мероприятия, где ключевым элементом будет картинг. Важно подчеркнуть атмосферу драйва на
565: Жени и финала гонки. Мне кажется, мы с вами прекрасно справились с задачей. У нас здесь и драйв, и напряжение. У нас здесь какая-то потёртая дорога, по которой гоняли, и дым как будто бы от колёс, от резины. Мне кажется, мы с вами справились абсолютно идеально.
566: Можно заблокировать теперь слой свечения, чтобы случайно с ним ничего не сделать. Теперь нам необходимо экспортировать наше изображение. Как мы это делаем. Я покажу 1 раз. Вы можете, вы уже обе картинки экспортируете самостоятельно. Давайте на примере картинга выби.
567: Просто ваш фрейм выделяете, мы с вами, знаете, что забыли? Мы с вами забыли текстуру. Вот она в слоях есть вообще, как мы, как мы, как мы так опростоволосились. Давайте, давайте её добавлять. Хорошо, что сейчас я заметил, когда уже собирался
568: Экспортировать. Думаю что-то лишняя какая-то картинка не во фрейме. Тут все просто в принципе добавляем её просто сюда, в наш фрейм и давайте её подравняем. По давайте во первых выровняем её по центру ещё раз.
569: Нажмём сюда, чтобы она прилипла к верхнему краю фрейма, и давайте её уменьшать, чтобы она была по размеру нашего фрейма. Вот 1080 на 1080 пикселей. Проверяйте, чтобы по иксу и по игреку её координаты были 0 единиц.
570: И теперь нажимаем правой кнопкой мыши по ней и нажимаем сент ту бэк, чтобы она была самым последним слоем, но сейчас она слишком яркая, наша текстурка, слишком яркая и кажется, как будто бы картинг не на асфальте стоит, а где-то в море давайте.
571: Снова обратимся, выделим нашу текстуру и снова обратимся к наложениям, то есть снова перейдём на вкладку справа. Вот выделили текстурку, наложение и давайте посмотрим, какое наложение создаст ощущение, что это асфальт.
572: Важно, чтобы ещё текстурка нам притемняет очень сильно наш фон. Хочется, чтобы фон сильно не затемнялся. Вот наложение калор додж. Оставляем его и давайте просто вот скроем текстуру и посмотрим, как с ней смотрится. В принципе, у нас ничего
573: Сильно не поменялось, но phone стал гораздо реалистичнее, как будто бы действительно какое-то резиновое покрытие для гонок, можем теперь её заблокировать и теперь можно выделить с чистой совестью наш фрейм, мы с вами все доделали, мы с вами все.
574: Делали. Теперь мы можем его экспортировать. То есть теперь нам нужно эту картинку отдать заказчику, как это сделать. Выделили фрейм, переходим на панельку справа, перематываем в самый вниз колёсиком мыши. Обязательно. Кстати, проверяйте, чтобы у вас были скрыты направляющие
575: Потому что если направляющие вы не выключили, они будут при экспорте отображаться. Скрываем направляющие и здесь у нас кнопочка экспорт. Нажимаем плюс и выбираем файл, в котором хотим отправить заказчику, если заказчик вам не прислал, какие
576: Какие-то требования, например если он не написал, что вам что ему нужен какой-то конкретный формат, всегда отправляйте в формате png, здесь проверяем чтобы был, чтобы здесь стояло 1 x формат png и нажимаем экспорт картинг давайте
577: Вот сюда, например, экспортируем здесь я выбрал папку картинг нажимаем сохранить, идём на рабочий стол, графические материалы вот сюда я экспортировал вот картинг, который мы с вами сделали. Так выглядит наш рекламный креатив.
578: Теперь вы можете спокойно отправить эту картинку, например, в telegram либо любым другим способом, который вам удобен передать её заказчику, чтобы он с ней работал напоминаю, что все материалы к этому уроку находятся в моём бесплатном телеграмме.
579: Ссылки в описании переходите и повторяйте дизайн вместе со мной, если повторяли дизайн вместе со мной во время просмотра видео тоже очень круто. Если вдруг у вас появились какие-то вопросы, обязательно пишите в комментариях, я стараюсь все читать и на все отвечать на этом.
580: У меня все. Всем спасибо за просмотр и до встречи.