Начало пути веб-дизайнера. Поделюсь теми проблемами, с которыми я… | by Anastasia Mahorina | Дизайн-кабак
Поделюсь теми проблемами, с которыми я столкнулась, когда начала путь веб дизайнера, и какие решения я нашла
Anastasia Mahorina
·
Follow
Published in
·
3 min read
·
Jan 21, 2020
Однажды одна моя знакомая показала мне вебинар по веб-дизайну, и с тех пор я в деле! Меня зацепило в веб-дизайне наличие большого количества логики, психологии и в принципе сам факт такого близкого взаимодействия с человеком. Так я записалась на курсы по веб-дизайну и начала в это уходить с головой.
Через некоторое время я для себя выяснила определенный ряд вещей, которые очень сильно тормозили мое развитие в направлении веб- дизайна.
Препятствия, с которыми я столкнулась
- Боязнь чистого листа.
Когда я видела открытый фрейм в Figma, назревала легкая паника — как из пустого пространства может выйти макет? Порой быстро перебороть это не получалось, много времени тратилось на бессмысленное изучение чистого фрейма. - Непонятно, какой информацией запонять сайт.
Несмотря на то, что есть четко поставленная задача и тема, нехватка контента иногда встает на пути. Отрисовав свой сайт в виде простейших фигур, которые дают информацию о расположении объектов на сайте, я начала думать, чем заполнить этот сайт. Эта проблема аналогична проблеме чистого листа, т.к существует непонимание задачи в полной мере, и не хватает контента. - Перегрузка макета.
На равне со страхом чистого листа стоит противоположная тема перегруза макета. Не всегда уместно использование необычных сеток и графических решений, заигрывание со шрифтами и т.д. Клиент сразу чувствует, что сегодня дизайнер решил испробовать много новых, не всегда имеющих объяснения, решений. Самое важное, что это очередная причина, которая мешает спокойно продвигаться на пути к осмысленному дизайну.
Это три основные проблемы, которые сильно тормозили процесс в самом начале моего пути, иногда демотивируя.
Решение вышеперечисленных препятствий
- Боязнь чистого листа.
В данной ситуации мне помогло тщательно искать референсы. Я отсортировала найденные референсы по разным темам: сайты с едой, сайты мероприятий и т.д. А после начала описывать, что общего у референсов, которые собраны по одной тематике. Стоит заранее в свободном режиме найти референсы на основные тематики сайтов, чтобы потом, когда надо будет разрабатывать сайт на определенную тему, не тратить время на поиск референсов. Референсы я старалась брать с реализованных сайтов, чтобы не делать проектов, которые будет нереально разработать.
Я веду отдельный файл в фигме. Данный метод посоветовали на курсах, которые я прохожу.2. Непонятно, какой информацией заполнять сайт.
В большинстве случаев данную задачу решит корректно составленный и заполненный бриф. Тогда вопрос с пониманием задачи отпадет.
Решение я также нашла в анализе найденных референсов. Я завела таблицы в google docs, где начала четко расписывать, что именно находится на сайте:
1. Размер фото
2. Текст и количество знаков
3. Критерии фильтрации
4. Информация на карточке товара, на странице товара и в сортировке.
Особенное внимание стоит обратить именно на фильтрацию, т.к это важно в масштабах логики сайта. Данный анализ помогает более четко понять поставленную задачу и не ошибиться с выбором контента. На каждый тип сайта я делала разные таблицы, потому что на лендинг надо гораздо меньше контента, чем на интернет-магазин.
Описав весь сайт словами, не бросаясь сразу за отрисовку, гораздо проще не растеряться в процессе работы.
3. Перегрузка макета.
Нужно помнить, что в разработке дизайна веб-сайта важна не красивая картинка, а осмысленные решения, чтобы каждую часть своего макета можно было подкрепить логичным объяснением, а не абстрактными безосновательными аргументами. Важно не ставить себе нереальных креативных целей — из-за недостатка опыта качественно выполнить это в большинстве случаев не получится, лучше заняться закреплением простых вещей. Макет должен оставаться чистым, чтобы вызывать приятные ассоциации от знакомства с продуктом, а не отвлекать посетителя сайта “креативными решениями”.
Напоследок могу сказать, что очень важно уделять много времени развитию и не делать больших перерывов, т.к постоянно в мире дизайна появляется что-то новое, надо успевать обновлять свои знания, применять их на практике и делать офигительные прорывные макеты!)
Как стать веб-дизайнером / Хабр
Говорят, что профессии веб-дизайнера уже не существует. Считается, что она эволюционировала и разделилась на специализации. Отдельным навыкам, которые могут пригодиться в веб-дизайне, учат в сотнях колледжей, вузов и рассказывают на тысячах онлайн-курсах в сети. При этом получить сразу весь комплекс знаний по теме практически невозможно. Но все-таки стать веб-дизайнером реально, ведь я им стала и работаю по этой профессии в ЛАНИТ. Исходя из своего опыта, расскажу, где и чему можно учиться, какие инструменты пригодятся, какие книги стоит полистать. Будет много личных наблюдений, которыми я решила поделиться с почтенным сообществом многоуважаемого Хабра.
Веб-дизайнер, что это за птица?
По-моему, веб-дизайнер – это птица-феникс, возрождающаяся от проекта к проекту. А еще это человек, живущий на стыке двух миров: цифрового технологического и творческого художественного. Конечно, если не вспоминать о реальном мире, где мы засыпаем и просыпаемся, ужасаемся или радуемся новостям, болтаем, ссоримся, любим, дружим, ходим за покупками. Хотя многое из перечисленного тоже давно нырнуло в цифровую реальность, в которой обитаем мы – те, кто проектирует логическую структуру веб-страниц, продумывает наиболее удобные решения подачи информации, занимается художественным оформлением веб-проекта.
Итак, что же нужно, чтобы по праву называться веб-дизайнером? Прежде всего, у вас должны гореть глаза, и вы обязаны быть жадным к знаниям. Их много не бывает, потому что вместе со скоростью развития технологий веб-дизайнер должен постоянно обновлять свои навыки.
Запоминайте, какие:
UX-дизайн (User Experience, пользовательский опыт) — определяет то, каким образом пользователь взаимодействует с сайтом/приложением/платформой/сервисом, насколько это удобно и все ли маршруты логично и правильно спроектированы. UX-дизайн отвечает за функционал, навигацию, диалоговые окна, настройки поиска и форм, то есть за то, как работает интерфейс (то, что пользователь видит в браузере при переходе на страницу и где осуществляет разные действия),
UI-дизайн (User Interface, пользовательский интерфейс) — процесс проектирования, нацеленный на то, чтобы пользователю было интуитивно понятно и визуально приятно взаимодействовать с сайтом/приложением/платформой/сервисом. Отвечает за внешний вид, визуальное решение сайта: сочетания цветов, шрифты, иконки, кнопки и т.д.,
прототипирование — процесс создания предварительного дизайна сайта, его структуры со схематичным изображением основных элементов,
бизнес-аналитика — определение бизнес-целей и задач заказчика, разработка решений на основе ожиданий от проекта, изучение конкурентов и т.д.,
копирайтинг — написание текстов для решения маркетинговых задач,
графический дизайн — разработка проектов художественного оформления, создание эскизов, логотипов, фирменных стилей для брендов и др.,
маркетинг — комплекс методов, которые помогают создать и поддержать спрос, репутацию и известность бизнеса, в т.ч. сделать сайт посещаемым и эффективно продающим,
знание программы Figma — графического редактора для создания прототипов сайтов и приложений (или Sketch, но первое почти вытеснило второе, так как работает в сети и на любой системе: как Mac OS, так и Windows), программ: Adobe Photoshop, Adobe Illustrator, Indesign,
знание основ композиции и цвета — от цвета или формы многое зависит – будет ли желание у пользователя совершить нужное нам действие на сайте и захочет ли он вернуться, чтобы, к примеру, что-то купить (если речь об интернет-магазине),
навыки иллюстратора — создание разных видов графики, изображений к тексту, технические иллюстрации.
Если и после прочтения перечня остается желание вникнуть в профессию, тогда welcome. Кстати, английский язык тоже пригодится.
Думаю, что любому, мечтающему работать над созданием сайтов, стоит стартовать с изучения UX и UI-дизайна. Это два направления веб-дизайна, которые неразрывно связаны друг с другом и без которых не обойтись. Важно еще быть на «ты» с кодерами, разработчиками сайтов. Для этого необходимо понимать базовые значения в коде и тегах, разбираться в процессе верстки сайта, уметь пользоваться модульными сетками (универсальный инструмент организации визуального пространства в веб-дизайне). Нужны знания HTML, чтобы понимать, как все работает внутри кода, который применяется для структурирования и отображения веб-страницы и её контента.
Весь мой опыт подсказывает, что веб-дизайнер — это еще и аналитик, которому необходимо разобраться в бизнесе конкретного проекта, над которым работает. Только потом он творческая личность. Ведь веб-дизайнер проектирует логическую структуру сайта, в зависимости от задачи веб-страницы. А сайт — это инструмент для достижения конкретной цели пользователя, бизнес-цели. Например:
купить или заказать,
узнать,
записаться,
быть информированным,
оставить заявку,
забронировать.
Вам наверняка приходится ежедневно нажимать на каком-нибудь сайте кнопку с подобной надписью, которую для вас любовно создал веб-дизайнер, вложивший годы в свое образование.
Желающим стать веб-дизайнером с нуля не советовала бы верить, что после покупки месячного курса в интернете вы станете готовым специалистом и немедленно начнете получать огромные деньги за разработку сайтов. Поберегите свое время и финансы и обязательно читайте отзывы о курсах не на их сайтах, а на сторонних независимых площадках.
В своей работе я оперирую знаниями UX и UI, которые получила в Британской высшей школе дизайна (но об этом позже) и дополнила самостоятельно, посещая тематические конференции. Графический дизайн изучала в университете. Знания из сферы маркетинга и копирайтинга приобретала на практике в процессе работы и самообразования.
Где я училась и что рекомендую
На последних курсах университета я точно знала, кем хочу стать — веб-дизайнером и никак иначе. Я получала истинное удовольствие от того, как из ничего получается работающий бизнес в сети. Тогда я начинала делать сайты, разбиралась в коде и модульных сетках (инструмент организации визуального пространства, который используют и графические, и веб-дизайнеры). Модульная сетка делит будущую веб-страницу на «модули» с помощью горизонтальных и вертикальных линий. Это помогает определить, как будет выглядеть макет в целом, и где будут расположены отдельные элементы. Подробнее почитать про систему модульных сеток можно тут.
Так выглядит работа с модульными сеткамиМодульная сетка помогает логично разместить элементыПогружение в такие подробности веб-дизайна и искусства дизайна в целом происходило в рамках университетского учебного процесса, который был творческим и не всегда обычным. К примеру, мы делали афиши к театральным постановкам, предварительно сходив на спектакль. Создавали макеты витрин магазинов прямо со стеклянными окнами, съездив на замеры входной группы. Также я получила навыки аэрографии (одна из техник изобразительного искусства, где картины создают, распыляя краску специальным инструментом-аэрографом). Интересной была работа с логотипами и фирменными стилями. Например, были такие задания: за 30 минут накидать гелевой ручкой около 100 логотипов на заданную тему.
Это все дало мне колоссальный опыт работы с материалом, композицией и графическим дизайном. Существует много споров на эту тему, должен ли веб-дизайнер уметь рисовать? Или достаточно просто изучить программу Figma, посмотреть пару вебинаров и закончить курс для новичков? Ну, сами посудите, какой кругозор будет у такого «веб-дизайнера», какие навыки и умения?
Бесспорно, в нашей сфере первоначальны навыки прототипирования и проектирования, изучение пользовательского опыта и аналитика. Но я уверена, что и базовые знания, связанные с изобразительным искусством, необходимы. Лично знаю специалистов, работающих в веб-дизайне, которые рано или поздно это понимали и говорили: «Мне не хватает базы, хочу изучить подробно композицию и теорию цвета». Так что, чем больше веб-дизайнер знает и умеет, тем больше захочется обратиться именно к нему: и оффер сочинит, и выгоду для клиента объяснит, и иллюстрацию на сайт отрисует, и конкурентов проанализирует.
В веб-дизайне есть и своя романтика, которую можно уловить только во время выполнения практических задач. Одним из первых моих рабочих мест стала небольшая веб-студия из семи человек, среди которых было два дизайнера (веб-дизайнер и иллюстратор), программист и верстальщик, менеджер проекта и основатель студии.
Мы работали прямо на сцене большого кинозала. У студии в аренде был целый кинотеатр. Мы работали в полумраке. Софиты оттеняли боковые стены. Словно вечерняя прогулка по тихим улочкам — это была таинственная атмосфера создателей чего-то крутого, и время там жило по другим законам.
Практика и только практика может сделать веб-дизайнера из новичка. Понимая это, я окунулась с головой не в лендинги, а начала с самого сложного. Это были многостраничные сайты: интернет-магазин Sony для одного из регионов и сайт агентства недвижимости с полноценным поисковиком и огромным количеством уникальных страниц (более 40). Очень круто работать в команде и видеть, как твоя задумка преобразуется в оболочку кода, а затем становится функционирующим бизнесом в сети.
Но настоящему веб-дизайнеру всегда должно быть мало того, что уже есть, достигнуто, поэтому я шагнула в медийную сферу — performance-агентство рекламы в сфере недвижимости. И началась большая работа с сайтами новостроек и крупных жилых комплексов Москвы. Здесь удалось максимально погрузиться в аналитику, маркетинговые исследования и изучение особенностей бизнес-проектов, ведь у каждого из них есть своя специфика. Если интернет-магазин — это витрина, карточки товара, акции и навигация, которая делает покупку удобной, то на сайтах жилищных комплексов важен цепляющий визуал с грамотно продуманной повествовательной структурой, рассказывающей о преимуществах комплекса, инфраструктуре, планировках, схеме проезда. И главная задача каждого экрана таких сайтов — вызвать у пользователя желание оставить заявку на просмотр квартиры или офиса, чтобы купить эти новые квадратные метры.
Самое интересное было отрисовывать еще и карту метро с нуля — мы делали поиск недвижимости при клике на станцию в заданном радиусе.
Необходимые знания я дополнила при повышении квалификации в той самой Британке, о которой обещала рассказать. Здесь вам подробно разъяснят, что такое целевая аудитория, метрика, аналитика. Когда училась я, нас объединяли в команды, мы получали задачу, а точнее проблему пользователя, и решали ее в разработанных прототипах приложения. У нашей команды был проект Mail.ru, и нам надо было сделать удобный поиск по папкам и файлам. Например, пришлось найти выход из знакомой до боли ситуации, когда тебе некий Вася Иванов отправил файл три года назад, но ты не помнишь ни даты, ни времени, ни названия файла или письма, помнишь только зрительно – он точно был. И, благодаря нашему упорству и наставникам (одним из них был Юрий Ветров, руководитель команды проектирования и дизайна интерфейсов Mail. ru) проблема была решена.
Из преподавателей особенно запомнился Ярослав Шуваев, у которого более чем 15-летний опыт разработки цифровых продуктов для крупнейших российских и зарубежных компаний. Были и другие интересные лекторы, например, Вова Лифанов с рассказом о его знаменитом брендинговом агентстве SUPREMATIKA.
Если же вам хочется синтезировать обучение и рабочий процесс, то в Британке есть интенсивы на 10 дней. Ради такого дела можно взять короткий отпуск.
Еще я была на интенсиве у Фила Смирнова — это дизайн-студия «MOTKA». Там мы разбивались на группы и на больших листах ватмана прямо на уроке отрисовывали прототипы мобильных приложений. Учиться всегда полезно, а возможность перенять опыт и расширить кругозор всегда пойдет в плюс.
Теперь несколько слов о студиях и курсах, где я еще не успела побывать, но очень бы хотела. И поясню, почему.
К примеру, «Дизайн-бюро Артёма Горбунова». На его сайте можно найти интересные лекции Ильи Бирмана (очень крутой продуктовый и информационный дизайнер) и Максима Ильяхова (это гуру текстов, как он сам себя заслуженно называет). Уверена, что вы что-то слышали о советах Ильяхова, как писать просто, понятно, коротко и полезно для окружающих. В бюро есть интенсивы «Переговоры и отношения с клиентами», «Школа редакторов» и другие очень нужные и важные курсы для развития обширных навыков дизайнера.
Очень известная студия «Икра». Это курсы про генерацию идей и креативность — как раз то, что нужно дизайнерам, живущим в огромном потоке задач.
Классная студия «Чипса». Она делает сайты «не как у всех» — это и есть ее слоган на главной странице интернет-ресурса студии. Она разрабатывает крутые и удобные проекты. Рекомендую следить за их новыми решениями, чтобы вдохновляться и быть в тренде.
Мне очень нравится «Студия Олега Чулакова». Эта команда гордится серьезными проектами для банков. Стоит посмотреть и изучить.
Еще я любитель посещать конференции по UX&UI, а также конференции о бизнесе. Ведь веб-дизайнер должен быть человеком широкого кругозора и аналитиком, от которого тоже зависят развитие бизнеса и конверсия продаж. Поэтому в свое время я побывала на форуме «Трансформация-3», где узнала, что такое по-настоящему правильные и стоящие скрипты продаж. Одним из самых крутых спикеров там была Настасья Белочкина — топ-скриптолог России и СНГ, к которой бизнес занимает очередь на три месяца вперёд.
Для начинающих советую отслеживать вебинары и мастер-классы от Skillbox. Зачастую спикеры платформы — это ведущие специалисты и арт-директора ведущих московских веб-студий и студий дизайна.
Совсем немного об инструментах
Теперь поговорим о программах, при помощи которых происходит волшебство – появляются сайты. Коротко скажу о нескольких таких инструментах. Несмотря на появление огромного количества новых сервисов, все же есть самые актуальные и необходимые на 100%.
Figma — программа, которую в этом тексте упоминаю несколько раз. Да просто потому, что она удобная. Это сервис для разработки интерфейсов и моя правая рука. Очень комфортен в использовании: регистрируешься и работаешь онлайн. Также у программы есть и оффлайн-версия.
Figma содержит в себе функцию показа проекта по ссылке, которую можно быстро скинуть в мессенджер коллеге по разработке. Это очень удобно (особенно сейчас, когда около 50% людей работают удаленно) и полезно, когда необходимо быстро собраться на brainstorm и решить, какая функция логически представлена, лучше проработана и не вызовет сомнений у пользователя. Так легче решить, какую информацию мы покажем на десктопе, а какую функцию скроем в мобильной версии. Или какое цветовое решение производит правильное визуальное впечатление и призовет к действию. Ведь всё должно быть понятно тем, кто в итоге будет работать с сайтом, платформой, сервисом или личным кабинетом. Чтобы чекбокс был чекбоксом, а не радиобаттоном.
Чекбокс — это маленький элемент графических интерфейсов, тот самый квадратик, внутри которого можно поставить галочку.А вот этот кружочек, который помогает выбрать нужный вариант из списка выпадающего меню, и есть радиобаттон.Для разработки сайтов и создания пользовательских интерфейсов существуют еще программы Sketch – для Macintosh и Adobe XD для всех операционных систем. Вообще, и Sketch, и Figma, и Adobe XD – отличные инструменты, но если вы новичок, то начинайте все-таки с Figma. Хорошая новость в том, что все эти три программы очень похожи, и если вы изучите хоть одну из них, то большая часть знаний пригодится при переходе на другую.
Говоря об остальных инструментах, как не вспомнить о старом добром «дядюшке» Adobe Photoshop, который подготовит изображение для веба нужного размера. А строгая «тётушка» Adobe Illustrator всегда придёт на помощь в отрисовке векторных иконок.
Для создания интерактивных прототипов сайта с возможностями анимации (движущихся изображений) придуманы отличные программы Axure и InVision. Если вы работаете без команды разработчиков, то блочный конструктор сайтов Tilda может оказаться незаменимым, потому что он не требует навыков программирования.
Рекомендую также познакомиться с программой Adobe InDesign. Изначально она придумана для верстки и дизайна брошюр, буклетов, журналов и т.д. Однако многие находят ее полезной и для оформления цифровых публикаций: в InDesign можно создавать интерактивные онлайн-документы со встроенными аудио- и видеоматериалами, слайд-шоу и анимацией. Программа упрощает управление элементами дизайна и помогает быстро создавать впечатляющий контент в любом формате.
Также хочу упомянуть онлайн-сервис CodePen — это популярная платформа для редактирования и хранения кода на HTML, CSS и JavaScript. Для веб-дизайнера она может быть интересна, тем, что там можно найти любопытный элемент для сайта сразу с анимацией и кодом для разработчика.
Если говорить об использовании шрифтов, то оптимальным для веб-проектов будет применение goggle fonts. Вы можете быть уверены в том, что эти шрифты всегда быстро загрузятся на страницу пользователя. Серверы, где они хранятся, практически никогда не дают сбоев в работе.
Читайте для вдохновения
Есть такое мудрое высказывание: «Чтение для ума — то же, что физические упражнения для тела». И для веб-дизайнера чтение – это не рекомендация, а обязательное условие.
Глубже погрузиться в основы дизайна, композиции, понять, как и что работает и влияет на восприятие, помогут книги. К примеру, советую сборник авторских эссе Пола Ренда «Дизайн: форма и хаос», посвященный взаимодействию дизайнера с клиентом и другим важным и интересным темам.
Все люди — дизайнеры. С этой фразы начинается книга «Дизайн для реального мира» Виктора Папанека, выдающегося американского дизайнера-философа и преподавателя. Здесь будут раскрыты темы о роли дизайнера в современном мире, о свежих принципах и методах проектирования, о дизайне как универсальном виде человеческой деятельности, включающем в себя разные знания. Рекомендую прочитать книгу не только дизайнерам, но и всем людям, которые любят познавать многогранность нашего мира, размышлять над изобретениями. Одна из глубоких цитат автора: «Убеждать людей приобрести то, что им не нужно, на деньги, которых у них нет, чтобы произвести впечатление на тех, кому до этого нет никакого дела, — сегодня это мошенничество стало поистине виртуозным».
«100 главных принципов дизайна» авторства Сьюзан Уэйншенк — это ответы на ключевые вопросы по теме. Из книги вы узнаете, что лежит в основе психологии поведения людей. Как люди думают? Как они принимают решения? Что заставляет человека нажать кнопку или купить что-нибудь? Как заставить людей сделать то, что вы хотите?
Книга Артемия Лебедева «Ководство» рассчитана на широкий круг читателей, интересующихся графическим и промышленным дизайном, проектированием интерфейсов, типографикой (художественное оформление текста с помощью шрифтов, символов и знаков), семиотикой (раскрывает значение и ассоциации для символов и знаков в позиционировании брендов) и визуализацией.
Чтобы настроить свою творческую личность на понимание работы разных бизнесов и для расширения кругозора, я рекомендую к прочтению бизнес-хит Рене Моборн и Ким Чана «Стратегия голубого океана», а также «45 татуировок менеджера. Правила российского руководителя» авторства известного предпринимателя Максима Батырева. Как я уже отмечала, в работе веб-дизайнера каждый проект уникален и практически нет ни одной повторяющейся задачи. Вот и приходится постоянно разбираться в концепциях бизнеса — каждый раз нового. Эти книжки помогут расставить мысли по полкам.
Совет Майкла Джанда «Сожги свое портфолио» — это то, чему не учат в дизайнерских школах. Книга про стык дизайна и бизнеса, ее содержание выходит за рамки одной профессии. Автор рассказывает на страницах издания о случаях из своего реального опыта.
В этой книге вы найдете ответы на такие вопросы, как общаться с клиентом, как руководить дизайнерским бизнесом, как принимать решения в креативной индустрии.
Никогда не будет лишним, на мой взгляд, почитать об истории жизни незабвенного Стива Джобса. Есть классная книга Уолтера Айзексона – биография, в основу которой легли беседы с самим Стивом Джобсом, а также с его родственниками, друзьями, врагами, соперниками и коллегами.
А вообще, профессия веб-дизайнера настолько стремительно меняется, что давно расширила свои границы и приобрела новые. Веб-дизайнеру уже нужно не только быть хорошим аналитиком и уметь проводить исследования. Ему нужно научиться хорошо писать тексты и придумывать оффер (основная маркетинговая идея сайта, «обещания» компании потенциальным клиентам). Я бы сказала, оффер — это самое главное, потому что маркетолог компании-заказчика может отсутствовать по уважительной причине или его может вовсе не быть на проекте. Веб-дизайнер должен уметь самостоятельно решить задачу: а вдруг срочно придет клиент и попросит презентовать проект?
Мне всегда помогают знания из книги Максима Ильяхова «Пиши, сокращай». Рекомендую его всем без исключения, даже для общего развития.
На мой взгляд, не будут лишними и знания собранные в «Новых правилах деловой переписки». Эту книгу Ильяхов создал в соавторстве с Людмилой Сарычевой – писателем и преподавателем школы редакторов в дизайн-бюро Артёма Горбунова. Следуя рекомендациям издания, вы научитесь писать коммерческие предложения, сопроводительные письма, просьбы коллегам, ответы клиентам и любые другие письма по работе.
А еще для дизайнера обязательной является насмотренность — разглядываем и изучаем крутые проекты со всего мира на Awwwards (интернет-сайт конкурса профессиональных веб-дизайнеров и разработчиков), Behance (популярная среди дизайнеров и иллюстраторов социальная медиа-платформа) и Dribbble (одна из крупнейших платформ для дизайнеров, где они делятся своими работами). Кроме того, лично я люблю журнал о мировом дизайне «КАК» — отличные графические приемы и способ развлечься, окунувшись в смежную дисциплину.
В завершение поделюсь своим профессиональным девизом: «Хороший дизайн — коммерчески эффективный». Именно об этом всегда должен помнить грамотный веб-дизайнер. Он также должен обладать умением взглянуть на свои решения другим взглядом – человека, который впервые открыл твой сайт. Куда этот человек пойдет на странице и что захочет сделать, всех ли функций ему хватит? Так что, дорогой будущий веб-дизайнер, думай как пользователь, и все будет ОК.
Поделитесь своим опытом освоения профессии веб-дизайнера в комментариях. Всегда интересно и полезно узнать мнение коллег по цеху и их рекомендации.
Карьера веб-дизайнера | Thinkful
Несмотря на то, что веб-дизайн существует уже несколько десятков лет, с тех пор эта работа сильно изменилась. Веб-дизайнеры развивались и должны были идти в ногу со временем.
Системы управления контентом (CMS), такие как WordPress, упростили процесс создания профессионально выглядящих сайтов. Но у CMS есть свой набор ограничений, и квалифицированные дизайнеры по-прежнему пользуются большим спросом.
Когда клиент запрашивает функцию, которая недоступна в виде подключаемого модуля, когда в шаблоне обнаруживается ошибка или когда требуется совершенно новый фирменный стиль, талантливые веб-дизайнеры должны вмешаться и взять бразды правления в свои руки.
Типичный карьерный путь веб-дизайнера теперь сильно изменился. Если вы подумываете о карьере в веб-дизайне и интересуетесь, что ждет вас в будущем, вот краткое описание ваших потенциальных должностей и обязанностей.
Какая техническая карьера вам подходит?
Готовы изменить свою карьеру и присоединиться к новой рабочей силе в мире? В Thinkful мы поддерживаем вас различными техническими программами, которые помогут вам вооружиться востребованные навыки.
Прежде чем принимать какие-либо решения о своей будущей карьере, важно понимать тонкие различия между ролями веб-дизайнера. Вот ключевые различия между некоторыми из самых популярных должностей в области веб-дизайна:
Веб-дизайнер и веб-разработчик
Веб-дизайнер в первую очередь отвечает за визуальные аспекты, макет и структуру сайта. Это творческие художники, которые разбираются в дизайне UX/UI (пользовательский опыт и пользовательский интерфейс). Их цель — создать фирменный, эстетически приятный сайт, интуитивно понятный и простой в использовании. Веб-дизайнеры являются экспертами в таких инструментах дизайна, как Photoshop и Illustrator.
Веб-разработчики заботятся о технической стороне сайта. Они отвечают за функциональность и меньше интересуются тем, как сайт представлен пользователю. Разработчики обычно имеют более техническое образование и владеют несколькими языками программирования. Они используют PHP, Python и SQL, чтобы убедиться, что сайт работает так, как задумано. Например, им может быть поручено разработать безопасную систему корзины для покупок на сайте электронной коммерции.
Веб-дизайнер и UX-дизайнер
UX-дизайнер отвечает за то, чтобы у пользователя был положительный опыт использования продукта. UX-дизайн является ключевым компонентом процесса веб-дизайна. Но роль UX существует и за пределами веб-дизайна. UX-дизайн можно применять как к физическим, так и к цифровым продуктам.
Это означает, что все веб-дизайнеры должны изучать элементы UX-дизайна, но не все UX-дизайнеры должны понимать веб-дизайн.
Самое главное отличие заключается в том, что веб-дизайнер клиентоориентирован и работает на удовлетворение потребностей клиента. UX-дизайнер ориентирован на пользователя и сосредоточен на том, чтобы пользователь был доволен, когда он использует продукт или веб-сайт.
Давайте посмотрим на типичную траекторию карьеры веб-дизайнера.
Начните свою карьеру в качестве стажера или младшего дизайнера. У вас будет очень ограниченная ответственность, и вы можете первые несколько месяцев следовать за более опытным дизайнером. Это даст вам прекрасную возможность освоить новые навыки, понять свои цели и получить четкое представление о том, какое место вы занимаете в организации.
Через шесть-двенадцать месяцев вам постепенно будут давать новые задания, и вы начнете работать самостоятельно. Вас повысят до веб-дизайнера. Ваши проекты должны быть одобрены старшими членами, но вы будете более активно участвовать во встречах с клиентами. Вы будете постоянно осваивать новые технические навыки, а также развивать свои навыки общения, презентации и организации.
После нескольких лет работы веб-дизайнером вы станете старшим веб-дизайнером и получите больше свободы в дизайне. Вы будете нести ответственность за несколько разных клиентов и проводить встречи с клиентами для сбора требований. Теперь ваша работа может включать представление заинтересованным сторонам компании и информирование менеджеров о ходе проекта.
Затем у вас есть возможность занять руководящую должность, где вы будете руководить командой дизайнеров, нанимать новых дизайнеров и принимать ключевые решения по проекту. Вы также можете перейти на роль UX-дизайнера или бэкенд-разработчика.
Набравшись опыта, вы сможете подняться по карьерной лестнице и со временем стать креативным директором или старшим менеджером.
Редко можно найти организацию, которая не инвестирует в свое цифровое присутствие. Компании понимают ценность веб-сайта. Это позволяет им подключаться к клиентам и продавать товары по всему миру. Большая часть процесса — дизайн интерфейса. Он представляет бренд, поэтому должен быть безупречным и профессиональным. По этой причине лучшие дизайнеры пользуются большим спросом в технологической отрасли. И трудно представить, что спрос замедлится в ближайшее время.
Помимо надежной работы, работа веб-дизайнером дает и другие преимущества. У вас будет возможность работать удаленно, и вы можете рассчитывать на гибкий график работы.
Неудивительно, что веб-дизайнеры также получают зарплату выше среднего. Вы можете заработать от 40 000 до 125 000 долларов в зависимости от вашего опыта и навыков. Кроме того, у вас будет множество возможностей для карьерного роста.
Независимо от того, где вы находитесь в своей карьере, вы можете перейти в веб-дизайн. И вам даже не нужна четырехлетняя степень.
- Изучите роль: Ознакомьтесь с ролью и убедитесь, что вы хотите ее выполнять. Читайте книги, читайте блоги о дизайне и смотрите видео на YouTube.
- Практика: Создайте веб-сайт в свободное время. Вы можете создать личный блог WordPress или заняться небольшим внештатным проектом.
- Создайте свое портфолио: Чтобы произвести впечатление на потенциальных работодателей, вам нужно показать им, на что вы способны. Не забудьте заархивировать любую свою работу по веб-дизайну в портфолио.
- Запишитесь на учебный курс: Эти онлайн-курсы научат вас навыкам, необходимым для карьерного роста, чтобы быстро получить первоклассную работу в области веб-дизайна. Запишитесь на наш учебный курс по дизайну UX/UI и узнайте, как создавать потрясающие дизайны интерфейсов. Мы даже поддержим вас в поиске работы.
Часто задаваемые вопросы
Как стать веб-дизайнером?
Вы можете стать веб-дизайнером, получив степень бакалавра в области компьютерного программирования или графического дизайна. Вам также необходимо знать, как использовать Photoshop для создания графики для веб-сайтов. В дополнение к этому рекомендуется знание языков программирования, таких как HTML, CSS, PHP, jQuery, JavaScript и Flash, а также базовое понимание методов SEO.
Как стать веб-дизайнером
Оценка надежности веб-сайта на 75% основана на общей эстетике веб-дизайна.
В области веб-дизайна требуются разнообразные навыки. Веб-дизайнеры — талантливые профессионалы, отвечающие за создание полностью адаптивных и интерактивных веб-сайтов через:
- Программирование
- Код
- Креативное направление
- Работа в серверной части платформы
- Создание сайтов с нуля
- Обеспечение общей согласованности между элементами
Если вы хотите включить веб-дизайн в свою карьеру, вам необходимо использовать всесторонний опыт, которого требует отрасль, проявляя творческий подход и логичность в своем мышлении и действиях.
Распространенное заблуждение состоит в том, что веб-дизайнеры — это то же самое, что и UX-дизайнеры. В таблице ниже указаны различия между этими двумя карьерными путями:
Веб-дизайнер | UX-дизайнер |
Дизайны для веб-сайтов | Дизайн веб-сайтов, приложений и других элементов программного обеспечения |
Подходит для любого бизнеса | Работает в основном для интернет-компаний |
Базовые знания информационной архитектуры (HTML, Javascript) | Продвинутые знания сложной информационной архитектуры |
Информировано клиентом | Основано на тщательном исследовании |
Веб-дизайнер |
Дизайны для веб-сайтов |
Подходит для любого бизнеса |
Базовые знания информационной архитектуры (HTML, Javascript) |
Информировано клиентом |
UX-дизайнер |
Дизайн веб-сайтов, приложений и других элементов программного обеспечения |
Работает в основном для интернет-компаний |
Продвинутые знания сложной информационной архитектуры |
По результатам тщательного исследования |
Каковы основные обязанности веб-дизайнера?
Ежедневные обязанности веб-дизайнера могут различаться в зависимости от:
- Вашего уровня опыта
- Ваша работа Окружающая среда
- Что ваш клиент ожидает от вас
Не забывайте об этих обязанностях и навыках, когда будете продвигаться по карьерной лестнице в области веб-дизайна.
Вам следует продолжать повышать квалификацию в следующих трех ключевых областях:
Код |
Хотите эти навыки? |
Визуализация сайта |
Хотите эти навыки? |
Не упускать из виду бренд |
Хотите эти навыки? |
Код |
Хотите эти навыки? |
Визуализация сайта |
Хотите эти навыки? |
Помните о бренде |
Хотите эти навыки? |
Веб-сайт будет необходимой коммуникационной платформой, в которую компаниям потребуется инвестировать время и опыт, если у них есть продукт или услуга, которые они хотят расширить до широкой аудитории.
Какова карьера веб-дизайнера?Карьера веб-дизайнера безгранична. То, как вы начнете в этой отрасли, будет отличаться от человека к человеку. Одним из захватывающих результатов изучения веб-дизайна является то, что вы будете готовы работать в самых разных отраслях. Вы находитесь в уникальной ситуации, когда можете сочетать творческую страсть с востребованными навыками, тесно связанными с успешным ведением бизнеса.
Как веб-дизайнер, вы можете начать свою карьеру в стартапе, корпоративной среде или рекламном агентстве. Вы также можете начать с фриланса и перейти на более постоянную должность или наоборот.
Какова возможная траектория карьеры веб-дизайнера?Можно изучить следующие популярные приложения в контексте веб-дизайна, особенно учитывая скорость, с которой машинное обучение и ИИ развиваются во многих отраслях.
- Чат-боты
- Голосовой поиск 2
- Улучшенный пользовательский интерфейс
Связанный контент: Зачем изучать веб-дизайн?
Какова потенциальная зарплата веб-дизайнера?
Чтобы построить прибыльную карьеру веб-дизайнера, важно отточить свои знания в определенных областях. Это ключевые навыки, которые вам понадобятся, чтобы увеличить свой потенциальный доход.
- Продвинутые знания HTML5 и CSS3
- Опыт работы с адаптивным и мобильным дизайном
- Экспертные возможности Adobe Creative Suite
- Возможность совмещать несколько проектов на ходу
Нажмите на страну, чтобы узнать, на какую оплату вы можете рассчитывать в качестве веб-дизайнера в Южной Африке, Великобритании или Соединенных Штатах Америки:
3- ЮАР.
Начальный уровень 119 145 руб. Середина карьеры 197 791 рэндов 15-летний опыт 240 000 рэндов Начальный уровень 20 652 фунтов стерлингов Середина карьеры 25 846 фунтов стерлингов 15-летний опыт 28 813 фунтов стерлингов - США
Начальный уровень 45 4350 долл. США Середина карьеры 51 409 долларов 15-летний опыт 60 621 $
Некоторые профессионалы в творческой сфере считают, что восхождение по карьерной лестнице происходит медленнее, но это возможно, если вы помните, что продвижение по карьерной лестнице будет лучше всего, если вы будете постоянно совершенствовать свои навыки.
Если вы уже являетесь веб-дизайнером или хотите перейти на должность с дополнительными обязанностями в области веб-дизайна, вам нужно быть в курсе передового опыта, тенденций и навыков, чтобы убедиться, что вы сможете расширить свои знания дальше, чем описание работы, занимающей недвижимость в настоящее время, в вашем профиле LinkedIn.
Некоторые сопутствующие навыки, относящиеся к веб-дизайну, о которых вы должны подумать:
- Дизайн взаимодействия с пользователем
- Бренд-менеджмент
- Графический дизайн
- SEO
- Управление ИТ
- Цифровой маркетинг
При работе с веб-дизайном вам также потребуется активно улучшать свои технические навыки и навыки управления проектами, используя следующие варианты повышения квалификации:
- Степень бакалавра в области веб-дизайна или мультимедийных исследований — это высшее образование, которое вам необходимо. если вы хотите пойти по этому пути.