Как стать веб дизайнером и зарабатывать

Содержание

Как стать веб дизайнером с нуля самостоятельно

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

Как говорил Конфуций: «Путь в тысячу миль начинается с первого шага». Поэтому важно не просто прочитать статью, а применять полученные знания на практике. Только в этом случае вы получите результат и приблизитесь к своей цели.

Базовая подготовка

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

Как зарабатывать 1000$ в месяц на презентациях в Canva | Как стать веб-дизайнером в 2021 году?

Веб-дизайнер — что это за профессия простыми словами
UX UI дизайнер — кто это и чем занимается

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

У меня в блоге есть статья, в которой я рассказываю про один из популярных видов сайтов — лендинги. Но помимо лендингов, есть еще и другие, не менее популярные, виды сайтов: интернет магазины, корпоративные сайты, блоги. Чтобы «быть в теме» рекомендую потратить немного времени и хотя бы вкратце почитать про них.

Как стать веб дизайнером с нуля самостоятельно — 5 шагов

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

Шаг 1 — Изучите основную теорию веб дизайна

Я рекомендую начинать обучение именно с теории, а не с изучения программ, как многие советуют это делать. Освоить графический редактор можно за 2-3 дня, максимум за неделю. Но какой в этом смысл, если вы еще не знаете, что и как в нем нужно делать.

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

Ваша задача изучить лишь 20% всей ОСНОВНОЙ теории веб дизайна, которая в итоге даст вам 80% результата.

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

Как я стал веб-дизайнером и нашёл первых клиентов

Что входит в основную теории дизайна:

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

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

4. Принципы иерархии и контраста. Как отделять главное от второстепенного и тем самым упрощать восприятие дизайна для пользователей.

5. Цвет. Как выбирать цветовую палитру для сайта и сочетать между собой цвета. Сочетание цветов и умение грамотно их применять также является важным навыком веб дизайнера.

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

Шаг 2 — Изучите программу Figma для веб дизайна

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

В этом вам поможет ряд моих видео:

Как стать веб дизайнером с нуля самостоятельно

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

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

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

Шаг 4 — Составьте портфолио веб дизайнера

Портфолио для дизайнера — это архиважная вещь, поскольку без него вас не существует как дизайнера. Если у вас нет портфолио, то для новичков это приговор, потому что в этом случае вам никто не предложит работу.

Отбирайте самые удавшиеся на ваш взгляд работы и формируйте из них портфолио.

Пусть оно у вас будет «так себе», но это лучше, чем ничего.

Как должны выглядеть работы в портфолио? Здесь опять же я рекомендую вам зайти на behance и посмотреть, как другие дизайнеры оформляют свои работы.

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

Заводить портфолио я рекомендую тоже на behance. Это и удобно, и бесплатно.

Шаг 5 — Найдите первую работу по веб дизайну

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

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

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

Как получить первую работу? Нужно понимать, что никаких секретов здесь нет и прежде всего у вас должно быть огромное желание и упорство. Идете на hh.ru и начинаете отправлять отклики на все дизайнерские вакансии. В отклике пишите сопроводительное письмо с ссылкой на ваше портфолио и небольшой текст о себе. Это хоть немного, но выделит вас среди других кандидатов.

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

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

Как гарантированно стать веб дизайнером и начать зарабатывать

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

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

Заключение

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

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

Сохранить себе в соцсети:

Источник: georgytim.ru

Как стать веб-дизайнером – пошаговое руководство

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

Продуктовый дизайнер (UX/UI), веб-дизайнер и бренд-дизайнер. Опыт проектов в международных компаниях Omega-R (агентство), iSpring Solutions (продуктовая) и со стартапами по всему миру. Преподаватель курсов «Веб-дизайн» и «Дизайн и проектирование цифровых продуктов (UX/UI)» в Институте программных систем и godesign.school.

Сен 30, 2020 · 23 мин читать

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

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

Содержание:

В чем ценность веб-дизайна для бизнеса
Чем полезен веб-дизайнер
Что такое хороший веб-дизайн

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

Способ 1. Онлайн-университет
Способ 2. Самообразование
Способ 3. Онлайн-курсы
Способ 4. Мастер-классы и практикумы онлайн
Способ 5. Фриланс
Способ 6. Сбалансированный подход

Погрузитесь в международную культуру веб-дизайна с помощью курса Рафаля Томаля
Начните посещать ежедневно самые популярные веб-ресурсы и их соцсети от известных брендов на ру и глобале
Повышайте насмотренность
Возьмитесь за первый проект по веб-дизайну сделайте его вместе с наставником
Изучите процессы и портфолио ТОП-диджитал агентств;
Изучите ТОП-3 книги по веб-дизайну (международный ТОП);
Выпишите TOP-10 навыков дизайнера и поразмышляйте о графике тренировок
Вступите в самые популярные сообщества по дизайну и задайте самый волнующий вопрос
Пройдите практику на настоящем сайте под руководством наставника
Опубликуйте портфолио

Сила и ценность веб-дизайна для бизнеса

В чем ценность веб-дизайна для бизнеса

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

Сайт и бренд-дизайн от Focus Lab для калифорнийского кафе Gordo Taqueria

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

Интересуетесь свежими статьями по продуктовому дизайну (UX/UI)?

Чем полезен веб-дизайнер

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

Выращивание сайта: вайрфреймы, стилизация и UiKit

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

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

Информационная архитектура и вайрфреймы

Что такое хороший веб-дизайн

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

Работы для веб-дизайнеров все еще очень много. Повсюду вокруг нас типовые и однообразные интернет-магазины, информационные порталы, сервисы и т.п. Однообразие — не лучший инструмент для привлечения клиентов. Альтернатива ему выразительность, но попытки веб-разработчиков выделиться приводят к откровенно провальным результатам и вызывают у пользователей лишь раздражение. Чтобы делать лучше, требуется особая культура работы, чувственный опыт потребления товара и понимание культурного контекста клиента, с которым требуется установить контакт.

В современном веб-дизайне подчеркивают четыре ключевых компонента:

Бренд-дизайн (Графический дизайн и коммуникация с целью развития бизнеса) – это графический дизайн, который применили с целью произвести впечатление и вызвать определенные чувства у определенной аудитории. Этот инструмент помогает нам увлечься изучением продукта;
Сторителлинг (Копирайтинг) – это истории о культуре потребления бренда, которые раскрывают перед нами полезное действие продукта/компании/бренда и особый образ жизни с ними. Благодаря историям мы сознаем ценность. Истории разжигают желание обладать;
Проектирование и дизайн интерфейсов (UX/UI) – это создание комфортных функциональных интерфейсов, которые обволакивают контент сайта, находятся под рукой и помогают перемещаться в пространстве;
Интернет-маркетинг – информация о поведении клиентов собирается датчиками в реальном времени. Благодаря этой информации веб-дизайнер видит как организованы потоки клиентов, откуда они приходят, как-то покупают и может предлагать способы сделать сайт ценнее для клиентов и эффективнее для бизнеса;

Чек-лист качеств хорошего веб-дизайна:

Формирует сильное первое впечатление
Увеличивает ценность продукта в глазах клиента
Формирует доверие
Побуждает закупиться

Кто такой веб-дизайнер и чем на самом деле он занимается

Какие задачи решает веб-дизайнер и чем зажигает эта профессия

Веб-дизайнер создает лендинги, корпоративные сайты и промо-подачу. Он боец в команде диджитал-маркетинга. Есть еще UX/UI-дизайнеры – это ребята из продуктовой команды и больше работают над веб- и мобильными приложениями, приложениями для смарт-часов, TV и автомобилей.

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

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

Основные этапы работы над веб-проектом

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

Стратегия – вектор движения по развитию бренда с помощью сайта. Как правило, приходит в формате маркетинговой обстановки по рынку (комплексный анализ конкурентов, мест обитания целевой аудитории, способов захвата ее внимания, прогнозы по выручке и т.д);
Исследование – на этом этапе дизайнер погружается в культурную среду потенциальных клиентов, изучает их жизнь, трудности и неудачи, пристрастия и порывы;
Анализ – здесь факты о клиентах склеиваются в портреты и происходит фокусировка на конкретной аудитории, которую планируется привлекать первым делом;
Проектирование – конструкторская работа по созданию макетов сайта, проработке навигации;
Разработка – визуальный дизайн, программирование и тестирование;
Beta-запуск – запуск первой версии сайта и проверка всех систем в работе. Настройка счетчиков аналитики и срез первых показателей. Настройка потоков посетителей;
Оценка – анализ конверсионных маршрутов, коммерческих и поведенческих факторов и корректировка сайта;
Запуск – официальный старт ресурса и постановка его на рельсы непрерывного развития;

Особенности работы в компании, агентстве и на фрилансе

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

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

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

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

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

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

Сайт помогает привлекать клиентов из интернета 24/7, рассказывая о пользе товаров/продуктов/услуг. Коммерческие сайты разрабатывают в команде.

Focus Lab | We Build Brands That Lead And Inspire

Минимальный состав команды:

Интернет-маркетер — придумывает концепцию подачи продукта и выстраивает систему привлечения клиентов из интернета
Копирайтер — на простом и понятном для потребителя языке пишет статьи и тексты для сайта в которых раскрывает ценность продукта
Веб-дизайнер — создает выразительный дизайн сайта и помогает подать продукт в интернете так, чтобы клиент понял, что это «то, что нужно»
Веб-разработчик — придумывает, как воплотить дизайн сайта с помощью технологий HTML/CSS/JavaScript/CMS и запускает его в плавание

Обязанности веб-дизайнера

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

Какими знаниями, личными качествами и навыками обладает веб-дизайнер

Графический дизайн. Веб-дизайнеры работают с цветом, шрифтами, фото, иллюстрацией и композицией – все это помогает рассказать захватывающую убедительную историю и вызвать определенные чувства целевой аудитории.
UX-дизайн и дизайн интерфейсов. Основы UX помогают проектировать сценарии на сайте с учетом нюансов психологии пользователя – такой подход чаще помогает попадать в базовые ожидания клиентов;
Веб-дизайн, заточенный на конверсии. Cайт – система, задача которой – продавать. А значит нужно понимать с помощью каких действий можно влиять на конверсию сайта;
Веб-разработка. Хотя некоторые дизайнеры ограничивают свою работу проектированием сайтов, многие также берут на себя часть кода, особенно интерфейсную разработку.
Интернет-маркетинг. Веб-дизайнер работает плечом к плечу с диджитал-маркетингом (SEO-профи, SMM-спецы, Копирайтеры и Контент-маркетологи). Фронт работа задает контент, а понимание контекста всегда плюс один к смелости и точности.
Работа с клиентами и управление проектами. После запуска сайта работа только начинается, развитие сайта – это отдельная большая работа по увеличению конверсии с помощью новых блоков, доработок, создания выразительной графики и запуска новых страниц. А еще здесь много психологических тонкостей по работе с клиентом, которые можно учесть, если подойти грамотно к организации работы.

Какие инструменты веб-дизайнер использует в работе

В запуске сайта с нуля есть минимум три digital-стратегии:

Приводить клиентов из поисковиков (SEO): по поисковым запросам из Yandex, Google
Приводить клиентов из соцсетей (SMM): Instagram, ВКонтакте, Facebook
Приводить клиентов с рекламы (PPC/Target): Контекстная реклама (Google Ads, Yandex.Директ), Таргетированная реклама(Instagram, ВКонтакте, Facebook, TikTok, MyTarget)

Идеальный заказчик тот, кто уже решил вопросы связанные с интернет-маркетингом и диджитал-стратегией. Т.е заказчик изучил рынок и решил насчет того, каких клиентов и с какими потребностями и из каких каналов (SMM, PPC, SEO) он будет привлекать на старте. И ему требуется помощь в создании эффективной и полезной интерактивной витрины и поток клиентов будет приходить из поисковиков Yandex/Google.

Основные инструменты работы над веб-проектом по готовой диджитал-стратегии (то, что любят веб-дизайнеры):

Сбор ТЗ (Маркетинг-кит): Google Docs, Miro;
Визуальный анализ конкурентов и Поиск креативных концепций подачи: Pinterest, Dribbble, Behance, Figma;
Поиск интерактивных (UX/UI) дизайн-концепций: Principle, ProtoPie;
Требования к контенту и информационная архитектура сайта: Figma;
Дизайн интерфейсов и навигации: Figma, Sketch;
Бренд-дизайн и разработка уникальной графики: Photoshop, ProCreate;
Верстка и запуск сайта: Tilda, WebFlow, Readymag;

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

Какие инструменты помогут проверить диджитал-стратегию заказчика и скорректировать курс:

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

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

Wordstat – подскажет, что и какими словами ищут клиенты заказчика в сети и сколько раз в месяц;
Кластеризатор – найдет конкурентов по найденным поисковым запросам в интернете (1 кластер = 1 страница сайта). Пригодится для анализа структуры, навигации и подачи каждого конкурента, который борется за внимание той же аудитории;
SEO META in 1 CLICK – подскажет позиционирование конкурентов в поисковой выдаче (Title, Description). Напомню, что в Title должен содержать поисковый запрос из wordstat (чем ближе к началу заголовка, тем лучше);

Какими концепциями должен владеть веб-дизайнер

Сайт как интерактивная книга с историей, навигацией и подачей
Сайт как продукт полезен в определенных ситуациях
Первый экран каждой страницы сайта как вывеска – сообщает самое интересное для целевой аудитории и призывает начать
Сайт как презентация – 1 блок = 1 мысль;
Концепция точек контакта и CJM помогает улучшить сценарий взаимодействия на различных экранах в различных ситуациях: мобильник, планшет, ноутбук;
Атомарный дизайн. Паттерны проектирования и дизайн-системы помогают попадать в ожидания на любой платформе и ускорить проектирование и дизайн сайта;
Визуальный дизайн сайта – отражение характера, культуры и ценностей бренда
Сайт как столица вселенной бренда в диджитал;
Сайт как кино, захватывает внимание и разогревает интерес
Сила итерации: думай-делай-проверяй

6 способов стать веб-дизайнером: онлайн, бесплатные и платные

Смотреть ролики на YouTube, брать уроки Photoshop на мастер-классах или все же поступить на специальность в вуз? Узнаем, как стать веб-дизайнером, когда все вокруг стремительно развивается.

Способ 1. Онлайн-университет

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

Плюсы

Учиться можно в удобное время (если дедлайны не жесткие);
Диплом государственного образца (смотря где);
Обещают работу (частенько * не ставят);

Минусы

Узковатый кругозор по творчеству и мало живых командных практик за приличные деньги. Даже на долгих курсах не преподают все лучшие преподаватели из лучших студий в стране и в мире. Перед вами просто частная практика, как и везде;
Частенько даже траектория 2 года – это как купить разом просто серию краткосрочных курсов в одном пакете. Тогда в чем ее комплексность;
1-3%+ трудоустроенных по итогам обучения (найдете онлайн-университет, где вероятность хотя бы 50%, присылайте);

Способ 2. Самообразование

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

Плюсы

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

Минусы

Путь потребует значительного времени на эксперименты, настойчивости, увлеченности и воли к победе;
Нужно самостоятельно найти проект и наставника, иначе все, что будете изучать, может не сложиться в единую картину;
Есть риск подобрать не лучшие агентства (особенно без знания английского). Поэтому предподготовку в Google нужно сделать внимательно;

Способ 3. Онлайн-курсы

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

Плюсы

Учиться можно в удобное время;
Можно купить в рассрочку;
Обещают работу;

Минусы

Скорее всего, потребуется еще серия курсов;
Бывает попадаются дорогие траектории с упором на инструменты, а не проекты и навыки (хотя бы приближенные к реальности), а называются курсы;
1-3%+ трудоустроенных по итогам обучения (найдете курс, где хотя бы 50%, присылайте);

Способ 4. Мастер-классы и практикумы онлайн

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

Плюсы

Сразу в бой;
Содержат актуальную и прикладную информацию;
Научитесь решать задачи, приближенные к действительности;

Минусы

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

Способ 5. Фриланс

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

Плюсы

Сразу в бой;
Возможность получить настоящий кейс в портфолио;
Сможете попробовать все, что захотите;

Минусы

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

Способ 6. Сбалансированный подход: серия разноформатных курсов с выходом на тестовое задание/стажировку

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

Плюсы

Учиться можно в удобное время;
Гарантированно учитесь у опытных экспертов и студий страны и получаете кругозор по практике;
Международный кругозор по теории, готовым дизайн-решениям и хорошая международная планка;
Получите только актуальную и прикладную информацию;
Научитесь решать задачи, приближенные к действительности;
Получите серьезную предподготовку перед боем;
Соберете разноплановое портфолио (со статусными логотипами студий) и покажете серьезный настрой перед заходом на тестовое задание и проект;
За меньшее время и деньги получите больше боевого опыта;
Все можно купить недорого;

Минусы

Нужно хорошо разведать экспертов и компании, у которых стоит поучиться и спланировать свое развитие;
Диплом государственного образца и диплом международного уровня не получите (хотя, это можно наверстать, как устроитесь на работу);
Вам не обещают работу и не ведут за ручку, вы сами боретесь за свой успех (но так как пока нет вуза с хотя бы с 50% вероятностью успеха с трудоустройством (100 начали обучение и 50 трудоустроены) – это, вроде бы, не минус);

Как я начинала в веб-дизайне

В веб-дизайн я пришла через веб-разработку. Иногда, верстая сайты, мне казалось, что дизайн пришел какой-то не такой, в общем я исправляла ошибки дизайнера и искала пути как сделать лучше, понятнее и удобней для пользователя (по крайней мере мне так казалось). В общем считаем, что глубина исследований у меня тогда была не запредельная, но мои версии сайтов вполне нравились клиентам, так как в них что-то да было поудобнее Тогда я и поняла, что что хочу создавать действительно удобные полезные и интересные сайты. Ну, чтобы сочненько было в общем.

Однажды я наткнулась на видео Юзабилити лаб с Дмитрием Сатиным и заинтересовалась темой юзабилити исследований. Мне нравилось, как разбирают кейсы и находят точки по улучшению сайтов. Тут я и поняла, что в этом деле есть все-таки система, а значит это можно вполне себе изучить за какой-то конкретный срок. Но все-таки в то время все равно не могла понять почему сайт Apple в 2009 году был крайне странным.

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

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

С чего лучше начать изучение в Веб-дизайне – первые 10 шагов в Веб-дизайне

Шаг 1. Погрузитесь в международную культуру веб-дизайна с помощью курса Рафаля Томаля

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

Глава 1 | Веб-дизайн с нуля: что читать и где учиться?
Глава 2 | Что должен уметь веб-дизайнер? Главные навыки веб-дизайнера
Глава 3 | Зачем учиться программировать непрограммистам? Должен ли дизайнер кодить?
Глава 4 | Чем занимается веб-дизайнер на самом деле и к чему нужно быть готовым
Глава 5 | 5 направлений, в которых веб-дизайнеру нужно развиваться постоянно
Глава 6 |Основные этапы работы над веб-проектом
Глава 7 |Программы для веб-дизайнера: где создавать сайты?

Шаг 2. Начните посещать ежедневно самые популярные веб-ресурсы

Регулярно посещайте сайты и соцсети известных брендов в РФ и глобалии: блоги, интернет-магазины, лендинги, сайты продуктовых компаний.

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

Вот несколько сайтов для разбора: mailchimp, intercom, ozon, stripe, airbnb, apple, тинькофф журнал, inmyroom.

Шаг 3. Повышайте насмотренность

Собирайте дизайны на доски в Pinterest. Так вы сможете повысить насмотренность. А еще попробуйте делать чуть больше. Возьмите сайт, который вам нравится, схватите руками и помните его, порежьте на части, попереставляйте блоки, предложите альтернативный вариант композиции из обрывков. Затем возьмите лист A4 и перерисуйте оригинальный сайт и сделайте разбор плюсов и минусов.

Развивайте привычку каждый день лазить на land-book.com нырять в 5 разных сайтов, восстанавливать по ним скетчи. Дополняйте скетчи цветовыми пятнами, как в оригинальном дизайне. Это задание можно выполнять в своем скетчбуке или на планшете. Всего 5-7 минут в день и через месяц вы уже набьете руку более чем на 100 сайтах и станете смелее в композициях.

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

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

Подыщите курс с легким стартом и ассортиментом интересных и жизненных проектов. К примеру курсы UX/UI на Breezzly. Задизайните промошапку, затем попробуйте себя в интерактивном дизайне эффектной промошапки магазина скейтов и соберите эффектную карусель транзишн-переходом, а затем уже погружайтесь дальше через очные курсы с командной работой (поможет сильнее прочувстWowать весь дух профессии).

Шаг 5. Изучите процессы и портфолио ТОП-диджитал агентств

Следите за работами диджитал-агентств, многие из них делятся своими кейсами и процессом работы. Вот некоторые из них: Focus lab, Ueno.

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

Шаг 6. Изучите ТОП-3 книги по веб-дизайну (международный ТОП)

Сейчас я рекомендую всем следующую подборку книг для старта:

Slide:ology. Нэнси Дуарте:https://www.mann-ivanov-ferber.ru/books/paperbook/slideology/
Эмоциональный веб-дизайн:https://www.ozon.ru/context/detail/id/8747236/
Веб-юзабилити и здравый смысл. 3-е издание | Круг Стив:https://www.ozon.ru/context/detail/id/139556451/

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

Шаг 7. Выпишите TOP-10 навыков дизайнера и поразмышляйте о графике тренировок

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

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

Шаг 8. Вступите в самые популярные сообщества по дизайну и задайте самый волнующий вопрос

Есть три самых насыщенных информацией сообщества в рунете на тему веб-дизайна. И задайте самый волнующий вопрос. Вступайте же:

UxJournal | Максимально полезные статьи для дизайнеров:Группа Fb | Telegram-канал
Дизайн-кабак – это «клуб по интересам» для людей, готовых делиться своими знаниями и опытом в формате статей.
Дайджест продуктового дизайна:https://www.facebook.com/groups/pdigest

Шаг 9. Пройдите практику на настоящем сайте под руководством наставника

Первые 8 шагов – это предподготовка. А вот эти три проекта могут стать хорошим планом ближайших серьезных высот. Каждый пункт – это серьезный профессиональный рост.

Важно: в проектах используйте только живой контент, забудьте о “Lorem Ipsum” и генераторах бессмысленного контента. Не знаете где взять тексты, посмотрите на сайтах конкурентов или сайтах смежных тематик, тексты всегда можно позднее заменить или доработать вместе с заказчиком.

Задизайните форму для сайта научитесь работать с существующими компонентами сайта(заголовок, текст, кнопки, поля ввода, ссылки), проработайте все состояния элементов — наведенные и активные состояния для кнопок и полей ввода — и не забудьте про дизайн подтверждения отправленной заявки.
Спроектируйте страницу отписки от рассылок. В этой задаче можно поработать со сценарием путешествия пользователя. Кроме этого, эта задача интересна по проработке текстов, ведь интерфейс вступает в диалог с пользователем, чтобы помочь ему достичь цели;
Создайте лендинг продукта с полезной и интересной историей. Вас должно немножко злить, что нечто важное, все еще никто не знает во всех деталях – это и называется сторителлинг. Расскажите чем хорош продукт, подкрепите рассказ элементами доверия и продумайте конверсионные элементы. Используйте весь свой арсенал инструментов: типографика, цвет, композиция и работа со свободным пространством, сетка и модуль. Полезный совет: иногда хорошая иллюстрация, коллаж или анимированная гифка на странице помогут лучше рассказать историю, чем несколько абзацев текста, например как тут https://marvelapp.com/
Задизайните многостраничный сайт: либо небольшой интернет-магазин либо продуктовый сайт с несколькими ключевыми продуктами. В этом проекте можно прокачать проектирование и работу со сценариями взаимодействия пользователей.
Соберите информационную архитектуру для сайта, продумайте навигацию между разделами, определите сколько уникальных страниц будет в вашем ресурсе и какие страницы будут типовыми, например, можно проработать только одну страницу карточки товара или одну страницу категории товаров, остальные такие же страницы будут отличаться только контентом(фотографиями и текстами). Также в этой задаче хорошо помогает стайлборд со всеми стилями страницы и ui-kit, они помогут прошить все страницы единым стилем и проработать все состояния для интерактивных компонентов.

Шаг 10. Опубликуйте портфолио

Упакуйте свои наработки в портфолио и доработайте подачу по обратной связи от практиков в сообществе или руководителей в компаниях, где хотите работать (можно через мессенджеры, а лучше личные встречи). Такой шаг поможет вам почувстWowать себя увереннее и пойти к новым высотам (Минутка мотивации!).

Вы можете собрать подробное портфолио в Readymag, Tilda или Webflow:

https://readymag.com/amelkina/AmelkinaTatiana/
https://zhenyary.com/
https://readymag.com/woodie/gofman/

Или поделиться примерами работ, кусочками процесса прямо в dribbble: https://dribbble.com/NewWingsAsya

Очень важно. В портфолио фокусируйтесь на презентации навыков, умений и подхода, а не только на клевом и интересном визуале. Следуйте принципу “один экран/слайд – одна мысль”.

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

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

А еще Readymag, Tilda и Dribbble поддерживают установку счетчика веб-аналитики, так вы сможете видеть из каких стран/регионов и в каком количестве каждый день к вам заходят новые клиенты и чем они интересуются.

Что дальше изучать по веб-дизайну: качайтесь в бренд-дизайне, анимации и иллюстрации

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

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

Controforma. Брендинг. Смелость, основанная на понимании. Курс от брендингового агенства Шишки. Курс создан для людей, которые хотят более свободно чувстWowать себя в мире брендинга. Здесь уделяют немалое внимание всем этапам создания фирменного стиля — от стратегии до визуала.

Controforma. Слово дизайнера. Для всех кто сталкивается с барьером при коммуникации в работе. Потеют ладошки на сцене, нужные слова приходят после встречи, в очередной раз не выходит убедить в правильности своих идей или рассказать о себе и своей работе.
Пройдите курс по работе с клиентом. Есть классный курс у Ильяхова: Курс о работе с клиентом для редактора. Для веб-дизайнеров он тоже годится.
Освойте iPad для создания концептов и иллюстраций. Мне освоить иллюстрацию на iPad помогала Настя Никсен.
ПройдитеGoPractice: Курс управления продуктом на основе аналитики. Курс поможет увидеть пользу цифр для принятия творческих решений и корректировки курса.
Изучите книгуЗагмайстер и Уолш: О Красоте. Книгу создали известные дизайнеры Стефан Загмайстер и Джессика Уолш. В книге со смаком раскрыта сущность красоты и продемонстрирована сила эстетически красивого дизайна. Мне прямо зашла.

Вывод и рекомендация

Если вас интересует творческая сторона веб-дизайна и быстрый системный ответ на вопрос «Как стать веб-дизайнером», то вы можете пройти сначала практику в проектах на курсах Breezzly, затем изучить копирайтинг и основы работы с клиентом у Ильяхова, основы типографики, бренд-дизайна и работы с клиентами в Controforma, а затем уже подбирать следующую серию курсов.

Источник: ux-journal.ru