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

Кто такой веб-дизайнер

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

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

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

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

Визуальный дизайнер

Рис 2.1: Визуальный дизайнер создает макеты сайтов, веб-приложений, мобильных приложений, а также руководства по стилю, шаблоны и т.п. Все примеры на картинке — работы с CreativeMarket.com.
Визуальный дизайн — одна из основных тем этого курса. Мы будем говорить обо всем, что касается создания визуального опыта пользователей: о лейаутах, цветах, типографике, UI-элементах, изображениях и других деталях, которые помогают создать эстетичный, приятный и функциональный дизайн.

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

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

Навыки и личные качества веб-дизайнера

Главные навыки:

• умение работать с различными программами по графике;
• наличие отличного художественного вкуса и стиля;
• знание основ юзабилити;
• знание принципов вёрстки и языков HTML, CSS;
• иметь хорошее представление об интернет-маркетинге;
• возможность быть всегда онлайн (если речь идёт о работе на дому).

Главные качества:

• усидчивость;
• большой запас креативности, идей и умение их воплощать в реальность;
• коммуникативность, умение общаться с заказчиками;
• хорошая память и образное мышление;
• терпеливость, особенно с заказчиками.

Ну а что же веб-дизайнер делает с этим, мы сейчас с вами и разберёмся.

Где искать заказы и заказчика?

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

1. workzilla — на мой взгляд самая простая биржа для старта в удаленке
2. weblance — тоже неплохая биржа для начинающих
3. «Дистанция» — вк группа

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

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

Размер дохода в этой сфере может варьироваться от нуля до шестизначных цифр, это зависит от уровня подготовки и ассортимента услуг. Специалист, предлагающий в одном пакете оформление и верстку, котируется на рынке гораздо выше, так что на вопрос «сколько можно заработать» однозначного ответа нет – все решает «прокачанность» и умении продавать свои таланты.

Этапы работы веб-дизайнера

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

• Подготовка технического задания или сокращённо ТЗ

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

• Юзабилити (удобство использования)

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

• Графическое оформление

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

• Вёрстка сайта

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

Обучение на web-дизайнера

Курсы

Международная школа профессий (40 городов РФ)

Вы на практике научитесь проектировать адаптивные веб-сайты с помощью самых популярных инструментов веб-дизайнера — программ Adobe Illustrator и After Effects. Сможете визуализировать проекты сайтов в Figma. Вы узнаете, как улучшать юзабилити сайта, разрабатывать элементы пользовательского интерфейса и оптимизировать сайты под различные устройства. По итогам защиты проекта выдается диплом. Возможность оплаты в рассрочку. Филиалы в 40 городах РФ. Обучение очно в учебном центре или онлайн.

Компьютерная Академия ШАГ

Учебная программа “Разработка и продвижение WEB-проектов” создана для тех, кто хочет научится создавать сайт с нуля, получать на него качественный трафик и удерживать его в ТОПе поисковых систем. В результате прохождения курса Вы получите знания не только по технологиям и инструментам web-программирования и веб-дизайна, но и охватите все этапы создания сайта — от начала и до конца. Программа строится от простого к сложному. За время обучения вы освоите востребованные навыки веб-разработчика, соберете портфолио проектов и станете уверенным специалистом, способным работать в ведущих Web студиях либо самостоятельно на фрилансе. Гарантия трудоустройства. Продолжительность курса: 12 месяцев Возраст: 15-55 лет Время обучения: 2 раза в неделю по 4 академ. часа

Contented — прямой путь в дизайн (Онлайн)

Веб-дизайнеры — это те самые маги, которые создают удобные сайты, эффектные лендинги, презентации и волшебные баннеры. Стать востребованным специалистом можно на курсе от Contented. За полгода вы научитесь создавать все то, что нужно для поддержки бизнеса в интернете. Модули по маркетингу, созданию лонгридов и промо-сайтов помогут освоить профессию с нуля. Лекции читают опытные дизайнеры из Contented и Сбербанка, а наставники дают обратную связь по всем домашним заданиям. Итог обучения — портфолио из 6 кейсов; лучший дипломный проект будет запущен в работу и оплачен.

Образовательный IT-портал GeekBrains (Онлайн)

Занятия ведут практикующие Web-дизайнеры с профильным образованием и стажем работы по специальности от 5 лет. 7 практических курсов и 2 месяца стажировки. 10 лет на рынке образования, 4 миллиона пользователей. Все курсы можно купить с беспроцентной рассрочкой на год. Также можно получить IT-специальность в Geek University, а оплатить учебу через год после ее начала.

SkillBox (Онлайн)

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

Вузы

Московский гуманитарный университет, МосГУ

Графический дизайн (Факультет рекламы, журналистики и дизайна)

Институт бизнеса и дизайна

Графический дизайн (Факультет дизайна и моды)

Образовательное учреждение высшего образования «Московский финансово-промышленный университет «Синергия»

Дизайн (по отраслям) (Колледж «Синергия»)

Оренбургский государственный университет

Дизайн (Архитектурно-строительный факультет)

Уральский федеральный университет имени первого Президента России Б.Н. Ельцина

Дизайн (Уральский гуманитарный институт УрФУ)

Должностная инструкция

Это самое важное, ведь задав любому работодателю вопрос: “Что должен знать и уметь хороший веб дизайнер?” Будет много задач и требований, поэтому стоит заранее быть готовым.

1. Создание макетов сайта.
2. Разработка уникального дизайна.
3. Стилевое оформление страниц сайта, учитывая все технологические стандарты интернета: создание иконок, баннеров, логотипов, лендингов, промо-страниц, анимаций, картинок, аватаров, визиток.
4. Создание образцов web-документов.
5. Умение пользоваться различными программами и кодами: HTML, CSS, Photoshop, Corel Draw, Illustrator Macromedia Flash и т. д.
6. Работа с графикой: оптимизация элементов графики (тон, корректировка цвета).
7. Создание программной части страницы.
8. Создание электронных презентаций.
9. Отслеживание новинок в данной отрасли.
10. Разработка маркетинговых и рекламных мероприятий.

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

Программы разделим на несколько категорий:

1. Программы для обработки растровой графики. Их назначение заключается в редактировании графических файлов и работа с эффектами: Adobe Photoshop – один из главных инструментов. Его аналоги – Paint.net и GIMP.
2. Работа с векторной графикой. Эти программы предназначены для работы с надписями и кнопками. Самыми популярными стали: Corel DRAW и Adobe Illustrator.
3. Текстовые редакторы. Чтобы полностью создать сайт, нам важны знания ещё двух языков для вёрстки, таких как HTML и CSS. Знание основ будет огромным плюсом, как для начинающего, так и для опытного фрилансера.
4. Есть ещё и дополнительные программы, к примеру, Colormania (работа с цветом) или Adobe Flash (для создания анимаций и баннеров), но это уже тема отдельной статьи, так как нюансов и знаний в этой области достаточно.

Что должен знать и уметь специалист по веб-дизайну

Исследование немного старое: сейчас процент мужчин снизился, но в остальном +- так и осталось. (спасибо IDBI за инфографику)

Чтобы сделать удобный и функциональный сайт хороший мастер:

• знает и применяет в работе теорию цвета, типографику и другие составляющие основы дизайна;
• делает сайт удобным для всех пользователей: продумывает UI/UX;
• владеет инструментами для веб-дизайнеров: Adobe PhotoShop, Paint.net, GIMP, Corel DRAW и Adobe Illustrator, NotePad++, FineReader. В некоторых случаях использует специальные программы: Colormania, Adobe Flash, GIF Animator;
• знает специфику работы с HTML, CSS;
• правильно оформляет дизайн-макеты для последующей вёрстки;
• умеет разрабатывать рекламные мероприятия на сайте, знает маркетинг и методы привлечения новых пользователей (покупателей);
• имеет отличный художественный вкус и стиль;
• работает с изображениями по модели при помощи компьютерных программ;
• хорошо знает русский язык.

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

Эстетические навыки

Эстетика – это сложная штука. Похоже, что отличная цветовая схема для одних людей может выглядеть совершенно странно для других. Шрифты, которые для вас в этом месте смотрятся «как раз», могут совершенно не понравиться заказчику. Это кажется очень, очень субъективным, но все же в каждом из этих аспектов есть свои правила, о которых мы с вами сейчас и поговорим.

Сочетание шрифтов и типографика

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

Чтоб провести вас «от А до Я», предлагаю просмотреть книгу Эмиля Рудера «Типографика» . Чтение может быть довольно долгим, потому для желающих сразу же приступить к практике – короткое видео по теме, а так же гайд по определению шрифтов по картинке (это если вдруг вы уже нашли хороший пример текста, и хотели бы идентифицировать его шрифт).

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

Многие люди, включая меня, выбирают свои шрифты из Google Web Fonts. Шрифты Google можно «встраивать» в сайт, и это довольно удобно. Более того, можно пользоваться готовыми комбинациями шрифтов:

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

Если Google шрифтов мало, то можно заглянуть на WebDesignerDepot, Fonts-online, и другие сайты.

Теория цвета и цветовые схемы

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

Из обязательных инструментов – Adobe Color CC

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

Композиция и общая организация

Как стать веб дизайнером без знаний основ композиции? Да никак! Для меня эта часть является едва ли не самой важной. Ведь можно подобрать прекрасные шрифты, отличную цветовую схему, а потом банально напороть с правильным расположением блоков, иерархией и пропорциями и получить «отвратительнейшее блюдо из отличных продуктов».

Плюсы и минусы профессии

Работа web-дизайнера нам немного прояснилась, верно? Теперь давайте поговорим о подводных камнях и бонусах, которые мы получим, выбрав данную профессию.

Плюсы:

• Возможность стать свободным фрилансером.
• Востребованность вакансии на рынке труда.
• Карьерный рост.
• Перспективная возможность сотрудничать с заказчиками со всего мира.
• Высокая заработная плата (при наличии определённого опыта и хорошего портфолио).
• Возможность воплощения различных идей без финансовых вливаний.
• Творческая самореализация.
• Развитие в команде единомышленников.

Но, как бы ни была привлекательна эта профессия, всегда найдётся «ложка дёгтя».

Минусы:

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

Где найти работу веб-дизайнером

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

Сотрудники требуются:

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

А может вы и вовсе хотите стать одним из сотрудников компании Red Keds, Студии Артемия Лебедева или Яндекс? Или вы мечтаете открыть собственную студию? Тогда вам точно нужно применять все советы на практике!

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

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

Где учиться веб-дизайну?

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

1. YouTube-каналы о веб-дизайне. Самый популярный в мире видео-хостинг содержит десятки полезнейших видео и лекций. Обучение веб-дизайну с нуля по видео из YouTube — один из самых простых и доступных способов.
2. Книги и статьи. Полезные образовательные материалы на тему веб-дизайна намного чаще выходят в текстовом виде, нежели в формате видео. Именно поэтому, мы рекомендуем вам подписаться на лучшие блоги о веб-дизайне, чтобы оставаться в курсе современных трендов и тенденций. Список лучших блогов о веб-дизайне имеется в нашей коллекции.
3. Бесплатные курсы веб-дизайна. Они имеются как на вышеупомянутом YouTube, так и на других, не менее известных площадках. Подробнее про то, как стать веб-дизайнером, обучаясь на бесплатных курса, мы рассказываем в отдельной статье.
4. Профессиональные курсы. Как понятно из названия, данная категория образовательных курсов и программ является полноценной подготовкой, охватывающей все необходимые знания в области веб-дизайна. Лучшие курсы на эту тему мы также собрали в отдельной подборке.

Мы описали лишь некоторые популярные способы изучения веб-дизайна с нуля. Благодаря повсеместному использованию Интернета, обучиться сегодня можно практически чему угодно. Самое главное — это желание. Надеемся, статья была для вас полезна, делитесь своими впечатлениями в комментариях. Хорошего дня!

Заработная плата

А сколько же зарабатывает веб-дизайнер? Нужно чётко понимать, что сумма прямо пропорциональна вашему опыту, наличию портфолио, а также престижу студии и количеству заказов. По всему Рунету вы можете найти разные суммы, так как фиксированной зарплаты нет. Всё зависит от объёма выполняемой работы и дедлайна.

Если говорить примерно, то средняя зарплата веб-дизайнера составляет 30–50 тыс. руб. в месяц. Профессионалы в этом деле могут получать больше 100 тыс. руб.

Готовы потрудиться, чтобы обрести финансовую свободу, и как бонус — найти работу онлайн? Тогда просторы интернета ждут именно вас. Читайте в следующей статье, с чего начать и как стать веб-дизайнером самостоятельно.