Видеокурс Даниила Волосатова

веб-дизайн

Полное руководство

Изучите весь процесс создания современного веб-дизайна в Figma за 60 дней.

Создавайте дизайны сайтов и зарабатывайте 35 000 – 180 000 рублей в месяц.

Веб-дизайн – в первой пятерке
лидеров по востребованности

Веб-дизайн входит в ТОП-5 самых востребованных онлайн-направлений в Рунете и мире.

Прямо сейчас более 1800 вакансий для дизайнеров только на одном hh.ru.

Совокупная ежемесячная потребность в штатных веб-дизайнерах по одной только России насчитывает более 3200 вакансий.

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

За крутыми
веб-дизайнерами
идет настоящая охота

Спрос на веб-дизайнеров значительно обгоняет предложение, так что эта профессия – одна из самых востребованных, перспективных и высокооплачиваемых.

За крутыми веб-дизайнерами идет настоящая охота среди бизнесов всех направлений: от локальных магазинчиков до интернет-магазинов международного уровня и транснациональных корпораций.

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

Профи веб-дизайна «при любой погоде» зарабатывают достойно и стабильно. И никакой кризис нам не страшен.

Кризис?
Нет, не слышал…

В 2014 году, когда на Россию обрушился кризис, я вообще не ощутил никакой разницы, был он или нет. Я постоянно был загружен работой.

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

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

К слову, у меня есть знакомый дизайнер Н. У них в компании в этом году сократили в один день 80% сотрудников, но не его…

Потому что дизайнер нужен всегда. И если дизайнер хороший, он всегда будет востребован.

Автор курса
Даниил Волосатов

Сколько зарабатывают дизайнеры

Если рассматривать работу в веб-студии на полный рабочий день, то в уже в первый год работы можно ориентироваться на отметку 70 000 рублей.

Средний заработок веб-дизайнера по данным рекрутингового сайта hh.ru составляет 65 000 рублей.

Средний заработок
веб-дизайнера на фрилансе

40 000 – 80 000 рублей

По данным сайта фриланса fl.ru, средний гонорар веб-дизайнеров составляет

Лендинг от 14 000 до 40 000 руб. за 1 страницу

Веб-сайт от 20 000 до 80 000 руб. за 3 страницы

Веб-дизайнер — профессия творческая, а оценка дизайна для многих проходит очень субъективно. Поэтому заработок может очень сильно варьироваться и достигать и 200 000, и даже 300 000 рублей в месяц.

WebForMyself представляет

веб-дизайн

Полное руководство

Видеокурс Даниила Волосатова

Научись создавать современный дизайн сайтов в Figma по урокам профессионала, у которого за плечами 1800+ работ!

Кому подойдет курс

1

Новичкам

В видеокурсе сделан упор специально на новичков и даны все необходимые знания для старта и успешной карьеры с полного нуля: основы Web UX/UI дизайна, работа с графикой, стилями, актуальными инструментами и технологиями, сервисы для веб-дизайнера, Figma от А до Я, успешный старт во фрилансе и на веб-студии. Вам даже не обязательно уметь красиво рисовать.

2

Дизайнерам с базовым уровнем

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

Для этого просто изучите программу курса и убедитесь в этом сами!

3

Дизайнерам-фрилансерам

Материалы курса направлены на то, чтобы показать, как на практике успешно начать работать и монетизировать полученные знания из видеокурса. Разбираются всевозможные вопросы работы с заказчиками на фрилансе: как искать заказчиков и как правильно выстроить работу с ними: ТЗ, сроки, предоплата, стоимость и т.д.

Краткий обзор курса от автора


купить

Вы получаете*

Мега-актуальную теорию и бесценные навыки

Теории в курсе всего 30% от общего объема, и вся она тщательно отобрана на актуальность и востребованность.

Повторяя за автором, вы сможете создать адаптивный дизайн лендинга под все виды устройств. В курсе также показано, как создавать дизайн сложных сайтов по дизайн-системе на примере современного функционального интернет-магазина.

Сможете освоить Фигму, UX/UI, Grid-систему, UI kit, стили, Pixel Perfect и другие прогрессивные фишки.

Низкий старт и пошаговая система для новичков

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

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

Если будете достаточно замотивированы и исполнительны, то сможете начать зарабатывать уже в процессе изучения.

И тем самым отбить стоимость курса еще во время учебы.

Удобный формат изучения из любой точки мира

Вам просто нужно скачать видеокурс на свой жесткий диск, и вы тотчас же можете приступить к изучению.

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

А если по какой-то причине вы возьмете паузу, то в любой момент сможете обновить знания и навыки.

Две крутые работы в портфолио и море практики

Повторяя за автором шаг за шагом по материалам уроков видеокурса, вы создадите яркое и выделяющее вас из толпы портфолио с полного нуля, состоящее из дизайна адаптивного лендинга и интернет-магазина по дизайн системе.

Эти работы и будут вашей визитной карточкой и подтверждением вашей квалификации при трудоустройстве.

Портфолио на Behance

Ежедневно Behance посещают 1 500 000 пользователей со всего мира, в том числе заказчики и руководители топовых студий.

Повторяя по шагам за Даниилом, вы сможете создать презентацию своего интернет-магазина и лендинга для платформы Behance и оформить на ней свое портфолио и тем самым продемонстрировав свою квалификацию для будущих работодателей.

Резюме на hh.ru

HH.ru – крупнейший сайт по поиску работы в рунете.

Повторяя по шагам за автором, в результате прохождения уроков онлайн-курса, вы сможете грамотно оформить ваше резюме и определить уровень зарплаты.

А также разместите свое резюме на этом портале.

Главные
фишки
курса*

  • Повторяя по шагам за автором курса, вы узнаете, как с нуля овладеть самым продвинутым инструментом для веб-дизайнера – Figma. Если сейчас посмотреть все резюме на hh.ru, то в большей части из них есть требование владения Фигмой.
  • Вам не придется лазить по YouTube, разгребать тонны скорее всего устаревшей информации. Все что необходимо и актуально, включая личные авторские секреты и наработки, собрано в одном месте.
  • Вы изучаете лишь самые современные инструменты и только востребованные подходы веб-дизайна.
  • Вы узнаете, что такое UX/UI – не только в теории, но и на практике.
  • Вы узнаете, как придумывать яркие красивые дизайны – даже если совершенно не умеете рисовать и никогда не работали дизайнером и не умеете кодить.
  • Вы узнаете актуальную и востребованную Grid-систему.
  • Вы узнаете, как создавать UI kit и работать с ним.
  • Вы узнаете, как создавать стили для текста, цвета и сеток.
  • Вы узнаете, как создавать дизайн-систему.
  • Вы узнаете, как делать дизайны по технологии Pixel Perfect.
  • Вы узнаете, как создавать современные адаптивные лендинги.
  • Вы узнаете, как создать дизайн интернет-магазина по дизайн-системе.
  • Вы узнаете, как создавать интерактивные прототипы.
  • Вы сможете изучить всю необходимую техническую сторону для создания качественного веб-дизайна.
  • В итоге вы получите очень востребованный навык и актуальную профессию, которая входит в ТОП-5 наиболее популярных и высокооплачиваемых профессий в интернете.
  • Вы узнаете не только, как применять полученные знания на практике, но и как начать зарабатывать деньги либо в веб-студии, либо работая удаленно, или на фрилансе.
  • Вы получаете решение самой главной проблемы каждого новичка: «ГДЕ найти заказ или КАК найти работу».

Практический итог*

Повторяя за Даниилом шаг за шагом по материалам уроков видеокурса, вы создадите яркое и выделяющее вас из толпы портфолио с полного нуля: адаптивный современный красивый дизайн лендинга под все виды устройств и функциональный интернет-магазин по дизайн системе.

Эти работы будут вашей визитной карточкой и подтверждением вашей квалификации при трудоустройстве в веб-студию и поиске заказов на фрилансе.

Дизайн адаптивного лендинга

Интернет-магазин по дизайн системе

Купить

Автор курса

  • 10 лет в сфере дизайна
  • №1 в сфере дизайна для инфобизнеса, работает с топами в этой теме Сделал более 1800 работ
  • За всю карьеру ни потратил ни рубля на рекламу
  • Обучил более 1500 человек веб-дизайну
  • В 19 лет (!) поставил цель за 12 месяцев заработать на новую BMW 3-й серии и успешно ее достиг
  • Стабильный ежемесячный доход на дизайне колеблется у отметки 200 тысяч рублей

Преподаватель курсов:

Основы коммерческого дизайна,
Дизайн-система,
Веб-Дизайн (UX/UI),
Веб-дизайнер профессионал,
Дизайн+Верстка

Специализация:

Лендинги, сервисы, упаковки, оформление соц. сетей, блоги, соц. сети, презентации и сложные дизайн-системы

Владение инструментами:

  • Photoshop

  • Illustrator

  • Sketch

  • Figma

Постоянные клиенты Даниила:

behance.net/daniilvolosatov

Несколько работ Даниила Волосатова:

Уроки курса

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

Урок 1

Этапы создания дизайна. От идеи до реализации

07:26

В данном уроке поделимся опытом создания дизайна от А до Я. Мы разберем 12 этапов, которые помогут сделать создание дизайна более эффективным и быстрым.

Урок 2

Сетка, отступы и выравнивание

14:16

В этом уроке мы поговорим о видах сеток: какие они бывают, зачем их применять и чем они полезны веб-дизайнеру. Также мы поговорим об отступах, почему они важны. Узнаем, как выравнивать все элементы правильно.

Урок 3

Формы, кнопки и скругления

04:53

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

Урок 4

Типографика

04:01

В этом уроке мы разберем базовые принципы типографики, которые вы сразу же сможете применить на практике. Мы разберем типы шрифтов, а также сколько можно использовать шрифтов в одном дизайне. Как правильно подобрать шрифт для проекта. Где искать шрифты. Поговорим о контрасте цветов для шрифтов.

Урок 5

Цвета для сайта

02:56

В данном уроке мы затронем общие принципы подбора цветов для сайта.

Урок 6

Что такое UX/UI

02:52

В данном уроке мы разберем что такое UX и UI.

В данном модуле мы разберем все необходимые сервисы, которые помогут вам сделать работу более эффективной.

Урок 1

Все о шрифтах. Где искать и качать

03:33

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

Урок 2

Всё о стоках, платных и бесплатных

03:22

В этом уроке мы разберем два самых популярных фотостока и научимся ими пользоваться.

Урок 3

Качественный̆ бесплатный фотосток

01:33

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

Урок 4

Сервис иконок

03:18

В этом уроке вы узнаете о полезном сайте с огромным количеством качественных, векторных иконок.

Урок 5

Сервис по подбору палитры цветов

03:39

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

Урок 6

Сервис по подбору пары для шрифта

00:54

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

Урок 7

Сообщества дизайнеров

02:59

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

В Figma нет нескольких функций, которые есть в Фотошопе и которые необходимы для веб-дизайнера. В этом модуле мы их разберем.

Урок 1

Инструмент ластик

02:55

В этом уроке я расскажу о том, как с помощью одного инструмента удалить фон у любого изображения.

Урок 2

Mockup

04:44

В этом практическом уроке я расскажу о том, где искать мокапы, зачем они нужны и как с ними работать

В этом модуле мы разберем детально, весь функционал Figma: как выглядит интерфейс, какие есть инструменты, какие есть настройки и функции.

Урок 1

Скачивание программы

01:05

В этом уроке мы сделаем аккаунт в Figma и скачаем десктоп версию на компьютер.

Урок 2

Обзор интерфейса

04:23

В этом уроке мы познакомимся с интерфейсом.

Урок 3

Frame

02:18

Из этого урока вы узнаете о таком инструменте как Frame, о его свойствах и как с ним работать.

Урок 4

Move и Scale

02:43

Из этого урока вы узнаете о таком инструментах как Move и Scale, о его свойствах и как с ним работать.

Урок 5

Инструмент формы

03:39

В этом уроке мы разберем такой инструмент как формы и разберем их свойства.

Урок 6

Перо и карандаш

01:36

Из этого урока вы узнаете о таком инструменте как Перо и карандаш, о его свойствах и как с ним работать.

Урок 7

Инструмент текст

05:00

В этом уроке мы разберем инструмент Текст и его свойства.

Урок 8

Комментарии

01:05

В этом уроке мы разберем такой инструмент как Комментарии, зачем они нужны и как сделать работу более эффективной при работе в команде.

Урок 9

Экспорт

01:24

В этом уроке мы разберем экспорт, какие форматы экспорта бывают и другие его свойства.

Урок 10

Смарт выравнивание

03:23

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

Урок 11

Маска слоя

02:12

В этом уроке мы разберем функцию маски слоя и узнаем, как ей пользоваться.

Урок 12

Share

01:57

В этом уроке мы разберем такую функцию как Share и ее свойства. Благодаря ей вы сможете отправлять свой проект, не сохраняя его.

Урок 13

Модульная сетка

01:27

В этом уроке мы разберем функцию добавления сетки и ее свойства.

Урок 14

Режим смешивания

03:33

В этом уроке мы разберем функцию режима смешивания, как ее применять и в каких случаях.

Урок 15

Стили для текста

03:31

В этом уроке мы разберем очень полезную функцию создания стилей для текста.

Урок 16

Стили для цвета

04:13

В этом уроке мы разберем очень полезную функцию создание библиотеки цветов.

Урок 17

Компоненты

07:47

В этом уроке мы разберем компоненты, их виды и как их создавать.

Урок 18

Адаптивные элементы

03:58

В этом уроке мы разберем функцию адаптивности элементов в дизайне.

Урок 19

Прототипирование

03:14

В этом уроке мы разберем функцию прототипирования макета.

Урок 20

Плагины

02:37

В этом уроке мы разберем раздел плагины, и вы узнаете, зачем они нужны.

Урок 21

Гифки в Figma

01:38

В этом уроке мы разберем гифки и как их использовать при создании дизайна.

В данном модуле мы будем создавать дизайн лендинга от А до Я. Мы поработаем с UX и UI. Сделаем дизайн по дизайн системе – с библиотеками цветов, шрифтов, сеток и компонентов. Сделаем адаптив под планшет и мобильные устройства. Плюс весь дизайн мы сделаем по технологии Pixel Perfect.

Часть 1. Десктоп версия

Урок 1

Создаём фрейм и сетку

01:19

В этом уроке мы создадим фрейм и сетку.

Урок 2

Идея, концепция и UX. Проектируем дизайн

08:42

В этом уроке мы разберем ТЗ, набросаем концепцию и определим цель лендинга.

Урок 3

Первый̆ экран

09:53

В этом уроке мы соберем структуру первого экрана. Поработаем с инструментом текст, формами, создадим компоненты и проставим им адаптив.

Урок 4

Второй̆ блок

06:45

В этом уроке мы создадим три карточки на основе компонентов.

Урок 5

Третий̆ блок

07:14

В этом уроке мы создадим новый компонент и на его основе сделаем третий блок.

Урок 6

Четвёртый блок

04:25

В этом уроке мы создадим на основе компонента блок с объяснением шагов.

Урок 7

Форма заявки и футер

09:44

В этом уроке мы сделаем блок с формой подписки, поработаем с текстом, формами и компонентами, сделаем футер.

Урок 8

Добавляем иконки по дизайн-системе

11:44

В этом уроке я покажу как быстро добавлять иконки по дизайн системе.

Урок 9

Работа с мокапами и доработка первого экрана

12:43

В этом уроке мы найдем нужный нам мокап и с помощью фотошопа отредактируем его и добавим в наш дизайн.

Урок 10

Учимся подбирать графику

12:58

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

Урок 11

Работаем с градиентами и добавляем фон

06:01

В этом уроке я покажу как добавлять эстетичные градиенты и как их сливать с фоновыми изображениями.

Урок 12

Создаем библиотеку цветов для текста

06:08

В этом уроке мы создадим свою библиотеку цветов.

Урок 13

Подбираем цвета для иконок и кнопок

13:09

В этом уроке мы подберем цвета для всех иконок и для кнопок.

Урок 14

Дорабатываем дизайн

10:24

В этом уроке мы пройдемся по ошибкам и исправим их.

Урок 15

Плагин Logo Creator

02:38

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

Урок 16

Выравниваем все элементы

06:04

В этом уроке мы выровняем все элементы по системе Pixel Perfect.

Урок 17

Интерактивные элементы

01:34

В этом уроке мы создадим интерактивные элементы для того, чтобы дизайн был более живым.

Урок 18

Component Master Manager

01:25

В этом уроке мы воспользуемся плагином, который позволяет в пару кликов перенести все мастер компоненты на отдельную страницу.

Урок 19

Проставляем адаптив элементов

04:57

В финале мы проставим адаптив для всех элементов, для того чтобы было более удобно создавать версию для планшета и телефона.

Часть 2. Версия для планшета

Урок 1

Создаем фрейм и сетку

01:27

В этом уроке мы создадим фрейм под планшет и добавим ему свою сетку.

Урок 2

Первый̆ блок

05:20

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

Урок 3

Второй̆ блок

03:26

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

Урок 4

Третий̆ блок

05:01

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

Урок 5

Четвёртый̆ блок

06:41

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

Урок 6

Пятый̆ блок

02:48

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

Урок 7

Переносим фон

01:55

В этом уроке мы перенесем весь фон из десктоп-версии и адаптируем его под планшет.

Урок 8

Выравниваем по 8-пиксельной сетке

03:24

Так же, как и в версии для планшета, мы воспользуемся технологией Pixel Perfect и выровняем все элементы.

Часть 3. Мобильная версия

Урок 1

Фрейм и сетка

01:13

В этом уроке мы создадим фрейм под мобильную версию и добавим ему сетку с определенными свойствами.

Урок 2

Первый̆ блок

07:07

В этом уроке мы перенесем первый блок из десктоп-версии и адаптируем его под мобильную версию.

Урок 3

Редактируем версию для планшета

07:55

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

Урок 4

Второй̆ блок

05:01

В этом уроке мы перенесем второй блок из десктоп-версии и адаптируем его под мобильную версию.

Урок 5

Третий̆ блок

01:42

В этом уроке мы перенесем третий блок из десктоп-версии и адаптируем его под мобильную версию.

Урок 6

Четвёртый̆ блок

05:17

В этом уроке мы перенесем четвертый блок из десктоп-версии и адаптируем его под мобильную версию.

Урок 7

Пятый̆ блок

03:43

В этом уроке мы перенесем пятый блок из десктоп-версии и адаптируем его под мобильную версию.

Урок 8

Шестой̆ блок

03:55

В этом уроке мы перенесем шестой блок из десктоп-версии и адаптируем его под мобильную версию.

Урок 9

Седьмой̆ блок

08:00

В этом уроке мы перенесем седьмой блок из десктоп-версии и адаптируем его под мобильную версию.

Часть 4. Финальные штрихи

Урок 1

Component Master Manager

02:09

В этом уроке мы опять воспользуемся плагином Component Master Manager и снова перенесем новые созданные мастер компоненты на отдельную страницу.

Урок 2

Delete hidden layers

00:54

В этом уроке мы в один клик удалим все лишние слои.

Урок 3

Подготавливаем макет для верстки

04:08

В этом уроке мы подготовим макет для верстки.

Урок 4

Интерактивный̆ прототип

05:01

В этом уроке мы создадим интерактивный прототип для презентации дизайна клиенту или другим лицам.

В данном модуле мы будем создавать полноценный дизайн интернет-магазина. Мы хорошо поработаем с UX. Также создадим UI-кит с библиотекой цветов, шрифтов, сеток и компонентов.

Весь дизайн будет сделан по дизайн системе. В дизайне будет несколько страниц. Также мы все сделаем по системе Pixel Perfect. И по итогу сделаем интерактивный прототип.

Урок 1

Создаем фрейм и библиотеку сеток

04:01

В этом уроке мы создадим фрейм для десктоп-версии и создадим библиотеку сеток.

Урок 2

Проектируем прототип

15:39

В этом уроке мы спроектируем прототип будущего дизайна.

Урок 3

Меню

07:55

В этом уроке мы создадим меню.

Урок 4

Лого, поиск, избранное, корзина и категории

13:20

В этом уроке я покажу как уместить много информации в компактный блок.

Урок 5

Выгоды

04:05

В этом уроке мы поработаем с компонентами и сделаем блок с выгодами.

Урок 6

Популярные разделы

04:07

В этом уроке мы сделаем из одного компонента 18 карточек.

Урок 7

Спец. предложение

05:46

В этом уроке мы сделаем блок со спец. предложением.

Урок 8

Бестселлер, новинки, популярное

09:26

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

Урок 9

Пять карточек товара

08:54

В этом уроке мы проработаем и создадим адаптивный компонент, из которого сделаем 5 внешне отличимых карточки.

Урок 10

Популярная категория

05:18

В этом уроке мы снова на основе компонентов соберем блок с популярной категорией товаров в интернет-магазине.

Урок 11

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

08:43

В этом уроке мы создадим большую карточку с множеством скрытых элементов, используя компоненты.

Урок 12

Полезные статьи

04:40

В этом уроке мы сделаем шаблон из компонентов для блока со статьями.

Урок 13

Блок инстаграм

02:10

В этом блоке мы создадим шаблон блока для фотографий из инстаграма.

Урок 14

Три карточки

02:39

В этом уроке мы сделаем 3 шаблона карточек на основе компонентов.

Урок 15

Футер

08:11

В этом уроке я покажу как грамотно структурировать и располагать информацию в футере.

Урок 16

Подготавливаем фрейм для новых страниц

02:08

В этом уроке мы создадим компоненты из повторяющихся элементов на других страницах для более удобного дальнейшего редактирования.

Урок 17

Создаем страницу категории

07:52

В этом уроке мы добавим хлебные крошки, заголовок, количество товаров и на основе созданных ранее компонентов добавим блок с товарами.

Урок 18

Делаем попап

05:22

В этом уроке я покажу как сделать попап, который будет выезжать справа.

Урок 19

Страница товара

11:30

В этом уроке мы создадим новую страницу с подробным описанием товара.

Урок 20

Подготавливаем фрейм для страницы с корзиной

̆01:28

В этом уроке мы создадим свой фрейм для страницы с корзиной.

Урок 21

Карточка товара

07:53

В этом уроке мы создадим шаблон карточки товара для корзины.

Урок 22

Доделываем страницу корзины

08:23

В этом уроке мы создадим фиксированный блок со всей информацией о корзине пользователя.

Урок 23

Grid-система выравнивания

09:54

В этом уроке мы используем технологию Pixel Perfect и выровняем все элементы в дизайне.

Урок 24

Component Master Manager

01:29

В этом уроке мы воспользуемся очень полезным плагином, который в пару кликов создает отдельную страницу со всеми мастер компонентами.

Урок 25

Модульная сетка

01:27

В этом уроке мы воспользуемся очень полезным плагином, который в пару кликов создает отдельную страницу со всеми мастер компонентами.

Урок 25

Структурируем папки

04:20

В этом уроке мы структурируем все созданные слои по папкам для более удобной работы с макетом.

Урок 26

Плагин Similayer

02:37

В этом уроке мы воспользуемся плагином Similayer, который позволяет в пару кликов найти все похожие элементы и задать им определенные параметры.

Урок 27

Добавляем иконки по дизайн-системе

19:47

В этом уроке мы добавим все иконки в макет по дизайн системе.

Урок 28

Где взять качественную графику?

03:57

В этом уроке я расскажу, где можно взять качественную графику.

Урок 29

Добавляем графику. 1 вариант

05:04

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

Урок 30

Плагин Avtocrop

03:26

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

Урок 31

Плагин Unsplash

03:03

В этом уроке мы используем плагин от фотостока Unsplash. который позволяет быстро добавлять качественные изображения в дизайн.

Урок 32

Подбираем цвета для сайта + плагин Uigradients

15:26

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

Урок 33

Делаем более живой̆ сайт

01:13

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

Урок 34

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

03:19

В этом уроке мы доработаем блок с полезными статьями.

Урок 35

Сканер компонентов

02:12

В этом уроке мы используем сканер макета, который позволит найти все косяки и разбитые компоненты.

Урок 36

Делаем интерактивный̆ прототип

12:23

В этом уроке мы, исходя из всех созданных страниц, сделаем интерактивный прототип, который можно будет показать заказчику.

Урок 37

Плагин Delete Hidden Layers

01:13

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

Урок 38

Интерактивные элементы

04:37

В этом уроке мы создадим все интерактивные элементы.

В данном модуле мы разберем вопросы связанные с фрилансом. Как начать, как наработать портфолио, как определить сроки, как работать с ТЗ и много-много других вопросов.

Урок 1

Как быстро наработать портфолио

03:16

В этом уроке я расскажу о 4-х способах того, как быстро наработать портфолио.

Урок 2

Декомпозиция

02:49

В этом уроке я расскажу о декомпозиции для дизайнера, мы по полочкам разложим, что такое 100 000 рублей в месяц для дизайнера.

Урок 3

Как определить сроки и уложиться в них

02:12

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

Урок 4

Как определить стоимость за дизайн и за час

04:06

В этом уроке я расскажу о стоимости услуг на рынке и то, как определить цену конкретно для вас за час.

Урок 5

Техническое задание и бриф

02:55

В этом уроке я расскажу, что такое техническое задание, из чего оно должно состоять и как по нему работать. Также затронем тему брифа.

Урок 6

Где искать клиентов

06:23

В этом уроке я расскажу о 9 источниках, где можно искать клиентов.

Урок 7

Предоплата

03:28

В этом уроке я расскажу о предоплате, зачем она нужна, что будет если ее брать и если не брать.

Урок 8

Ошибки общения с клиентами

06:32

В этом уроке я расскажу о 10 ошибках общения с клиентами, которые лучше не допускать.

Урок 9

Как из клиента сделать партнера

02:39

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

Урок 10

Дополнительный̆ заработок

02:29

В этом уроке я расскажу вам как без трудозатрат получать дополнительный заработок.

В этом модуле мы разберем две темы: как оформить портфолио для того, чтобы презентовать ее работодателю и то, как оформить резюме.

Урок 1

Оформляем портфолио Behance

07:13

В этом уроке я расскажу о Behance, о том какую информацию стоит там указывать и как добавлять свои работы.

Урок 2

HH.ru: оформляем резюме и ищем работу

10:57

В этом уроке мы познакомимся с сайтом hh.ru, создадим резюме, поймем какую заработную плату ставить.

От новичка до профи
за считанные недели!

Я много работаю с западными заказчиками. И у них есть определенные требования к веб-дизайну, то есть обычные требования у них – это норма. А если у нас так сделать, это всегда выглядит креативно, свежо и считается супер профессионально по меркам Рунета.

Теперь и у вас есть возможность перенять все эти секреты и тренды, и за считанные недели научиться создавать дизайн сайтов на мировом уровне. Даже если вы полный ноль в дизайне и технических вопросах.

В отличие от бессистемного поглощения информации из бесплатных источников (зачастую устаревшей и даже вредной для новичков), материал в курсе подается в удобной структурированной форме: от простого к сложному, от азов до продвинутых приемов и инструментов.

Я даю только то, что вам понадобится в реальной жизни.

Автор курса
Даниил Волосатов

Мы даем уникальную
3-уровневую гарантию

КУПИТЬ

Гарантия №1 Безусловная гарантия возврата средств

Мы гарантируем вам полный безусловный возврат стоимости курса, если вы по каким-либо причинам посчитаете, что знания и навыки из курса оказались вам бесполезными.

Для этого просто напишите в нашу службу поддержки и мы вернем вам все средства обратно.

Деньги вы сможете получить обратно любым удобным для вас способом по первому вашему требованию даже без объяснения причин. Вы полностью лишены финансового риска при покупке этого видеокурса.

Срок действия гарантии возврата средств – 90 дней с момента получения вами курса.

Гарантия №2 Гарантия качества и актуальности

Все уроки — авторские, актуальные, подробные и тщательно подготовлены лично автором видеокурса: профессиональным дизайнером Даниилом Волосатовым.

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

Гарантия №3 Гарантия получения курса

Этот видеокурс предоставляется только в электронном виде – ссылка на скачивание на ваш жесткий диск будет доступна сразу же после оплаты.

Размер видеокурса в заархивированном виде составляет порядка 2,5 ГБ. Скачивание займет от одной минуты до нескольких десятков минут (в зависимости от скорости вашего интернет-провайдера).

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

Наша репутация –
гарантия вашего успеха

Авторы – практики высокого уровня

Все авторы команды WebForMyself.com являются успешными, высокооплачиваемыми, востребованными практиками высочайшей квалификации

12 лет на рынке

За 12 лет своего существования мы выпустили более 30 комплексных видеокурсов на тему сайтостроения, разошедшиеся многотысячными тиражами

Покупайте без риска!

Ваш риск полностью исключён благодаря нашей 100% гарантии возврата полной суммы денежных средств в случае вашей неудовлетворенности.

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

Ответы на частые вопросы

Веб-дизайнер – это тот, кто проектирует и создает понятный и удобный в использовании дизайн веб-сайта на основе анализа данных о целевой аудитории. Он проектирует страницу так, чтобы ею было удобно пользоваться.

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

UX — это аббревиатура от User Experience, буквально — «пользовательский опыт». UX определяет то, какое впечатление получает человек от взаимодействия с цифровым продуктом. Соответственно, UX-дизайн — это процесс глобального проектирования простых, удобных и приятных в использовании веб-интерфейсов.

UI (User Interface) буквально — «пользовательский интерфейс». UI-дизайн отвечает за то, как лучше реализовать задумку UX-дизайнеров: выбрать оптимальный цвет и размер элементов сайта, кнопок, блоков, продумать чекбоксы, разобраться со всеми полями, добиться хорошей читабельности текста и т.д. То есть — сделать интерфейс функциональным и приятным для глаз.

Figma – это новая, невероятно мощная, но легкая в освоении и использовании программа и одноименный веб-сервис (который практически ничем не уступает по функциональности программе), созданные специально для веб-дизайнеров.

С помощью нее можно создавать не только прототипы, но и сами интерфейсы (сайты, приложения, панель управления). Причем делать это намного быстрее и проще, чем в Photoshop.

Доступность

Figma работает прямо в браузере. Не нужно ничего скачивать, устанавливать. Есть и десктопная версия, но она совсем немного отличается функциональностью от веб-версии программы. В десктопной версии можно работать без подключения к интернету.

Работа со шрифтами

В Photoshop или другой графической программе нельзя использовать для дизайна шрифт, который не установлен в системе. В Figma шрифты подтягиваются из Google Fonts либо автоматически подгружаются в проект.

Совместная работа

В Figma очень продумано сотрудничество над одним проектом. У каждого есть возможность оставлять комментарии, есть настройка прав для отдельных пользователей. Работа отслеживается в режиме реального времени.

Удобные инструменты

Photoshop изначально создавался как редактор фотографий, поэтому инструменты именно для рисования в нем — не самые удобные для дизайнеров. В Figma совершенно иной подход: удобный Pen Tool, удобное создание эффектов.

Удобный бэкап

Все версии и изменения хранятся в Figma. Можно в любой момент откатиться на нужную версию. Больше нет необходимости хранить много версий одного проекта на компьютере.

Хранение файлов

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

Да подойдет. Видеокурс создавался как раз с особым акцентом на полных новичков, которые никак не связаны с веб-разработкой и дизайном.

Даже если вы совсем не умеете рисовать – это не имеет никакого значения. Веб-дизайн — это не изобразительное искусство, требующее природного таланта или особых способностей, а именно навык, мастерство, которое можно и нужно прокачивать.

Поэтому ответ однозначный – видеокурс вам подойдет, если вы серьезно намерены освоить навык веб-дизайна и готовы немного поработать над собой.

Да. Данный видеокурс можно смотреть как в Windows, так и в OS X (Mac OS).

За программу такого уровня – это очень дешево и примерно равно стоимости одного месяца обучения на онлайн-курсах и тренингах аналогичной тематики у конкурентов.

При этом на тренингах обычно специально обучение аналогичного по объему материала растягивается минимум на 3-6 месяцев, поскольку оплата там взымается помесячно. Что, впрочем, никак обычно не влияет положительно на качество.

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

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

Курс спроектирован таким образом, чтобы вы успешно выполнили программу и имели необходимую базу для того, чтобы начать зарабатывать в среднем около 70 000 рублей уже в первые полгода-год.

И все это вы получаете по цене в 5-10 раз ниже, чем у большинства конкурентов за аналогичный объем и качество материалов!

Если вы будете достаточно дисциплинированы и выполнять все рекомендации Даниила, то с большой вероятностью сможете начать зарабатывать уже в процессе изучения. И тем самым отбить частично или полностью стоимость курса еще во время учебы.

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

Не получится только в том случае, если вы сами ничего не будете делать. Других вариантов нет.

Для прохождения курса не нужны никакие специальные технические знания и навыки, умение рисовать, а также владение иностранными языками, кроме уверенной работы с ПК.

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

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

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

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

В среднем курс рассчитан на 1-2 месяца изучения при занятии от 5 до 10 часов в неделю. В большинстве случаев этого будет достаточно. Кто-то усвоит быстрее, кто-то – медленнее, но в среднем можете ориентироваться на эти сроки.

Нет, количество устройств не ограничено, нет никакой привязки к «железу». Вы можете запускать курс на любом компьютере либо ноутбуке без ограничений.

JustClick — возможность оплаты следующими способами: Visa, MasterCard, электронные деньги (Вебмани, Киви, Яндекс-деньги), интернет-банкинг, терминалы и салоны связи (Евросеть, Связной, Яндекс-деньги), платежные системы (RBKMoney), денежные переводы (Банковский перевод, Альфа-клик, Промсвязьбанк, Контакт, Лидер).

PayPal — международная система оплаты PayPal.

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

Если у вас остались сомнения или вопросы по любому вопросу, связанному с курсом и процедурой оплаты, напишите нам в службу поддержки.

Мы ответим вам в течение 48 часов (обычно в течение 24 часов) и постараемся решить вашу индивидуальную проблему.

Стартуйте с места
сразу в карьер!

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

Все, что вам нужно для этого, я даю в курсе… Остальное – зависит лишь от вас.

Если вы, как и я, всю жизнь мечтали о любимом деле, которое приносит по-настоящему хороший доход, то вам определенно стоит изучить этот курс. И самое подходящее время для этого – именно сейчас.

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

Прямо сейчас жмите на кнопку заказа и приступайте к изучению! Чем раньше вы приступите, тем быстрее получите ощутимые результаты и достигнете поставленной цели…

Автор курса
Даниил Волосатов

Купить