Бесплатный курс «Веб-дизайн и создание сайтов с нуля»

О курсе Авторы Содержание

Команда, которая работала над курсом

Среди авторов эксперты с опытом в международных проектах.

Анастасия Свеженцева

Продуктовый дизайнер (UX/UI), веб-дизайнер и бренд-дизайнер. Опыт проектов в международных компаниях Omega-R (агентство), iSpring Solutions (продуктовая) и со стартапами по всему миру.

Делюсь опытом в дизайне на офлайн- и онлайн-платформах с 2017 года: Институт программных систем, godesign.school, онлайн-платформа breezzly.ru и пишу микролекции о дизайне на Яндекс.Кью (226 ответов).

Ольга Жолудова

Копирайтер, UX-писатель, редактор и контент-стратег. Увлекается переводами в tech-тематиках. Помогает собрать гибкую контент-стратегию, улучшить коммуникации с пользователями и проработать tone of voice. Работала с UsabilityLab и «iSpring».

Rafal Tomal

Креативный директор в Authentik Studio, в дизайне с 2005.

Содержание курса

Читайте главы последовательно по одной в день или начните с наиболее интересной.

Глава 1

Веб-дизайн с нуля: что читать и где учиться? | Глава 1

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

Глава 2

Что должен уметь веб-дизайнер? Главные навыки веб-дизайнера | Глава 2

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

Глава 3

Зачем учиться программировать непрограммистам? Должен ли дизайнер кодить? | Глава 3

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

Глава 4

Чем занимается веб-дизайнер на самом деле и к чему нужно быть готовым | Глава 4

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

Глава 5

5 направлений, в которых веб-дизайнеру нужно развиваться постоянно | Глава 5

Дизайн — одна из тех профессий, где и без диплома можно найти классную работу и даже сделать карьеру. Крупнейшие tech-компании не попросят у вас никаких документов об образовании — если, конечно, вы реально круты в дизайне. ← Назад | Продолжение…

Глава 6

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

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

Глава 7

Программы для веб-дизайнера: где создавать сайты? | Глава 7

Дизайн создает не программа, а вы. Если вы владеете дизайном, то сможете сделать работу качественно в любой программе. Однако, правильно подобранные инструменты облегчают процесс дизайна и помогают работать эффективнее. ← Назад (Перед вами бесплатный курс Рафаля Томаля «Интро в…

Бесплатные курсы веб-дизайна

Средняя зарплата веб-дизайнера в Украине – примерно $1,5–2 тыс . При этом можно работать не только на компанию, но и искать заказчиков на биржах фриланса.

Курс Front-end Basic.

Отримайте практичні навички та відкрийте безліч можливостей у світі Front-end розробки. Досягніть професійного успіху разом з нами!

Ознайомитись з курсом

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

---

На украинском языке

«Основы UI/UX»

Продолжительность: 3 дня

Организатор: Logos IT Academy

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

На занятиях расскажут, какие обязанности есть у дизайнера и какие инструменты нужны для работы. Еще вы узнаете:

Не пропустите ни одной важной новости от MC.today

• как работать с текстом;
• как совмещать цвета;
• что такое композиция;
• что такое UI-элементы.

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

Занятия проходят в Zoom. Записаться на курс можно до 23 мая.

«Как работает цвет»

Продолжительность: 10 лекций

Организатор: Projector

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

Курс Business English для фінансистів.

Оволодійте мову фінансів англійською за 3,5 місяці.

Використовуйте її в роботі: презентації бюджетів для нейтив-спікерів та співбесіди в міжнародних компаніях.

Дізнатись про курс

Лектор также расскажет:

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

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

Этот курс входит в программу Projector Humanitarium. До победы Украины и еще месяц после нее можно пройти бесплатно. Для этого после регистрации нужно ввести промокод 0688-5072.

«Основы веб-дизайна» 

Продолжительность: 2,5 месяца

Организатор: «Креативная практика»

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

Курс Комерційний аудіопродакшн.

Ти освоїш саунд-дизайн, аудіобрендинг та музику для відео. Дізнаєшся, як захищати авторське право та збільшувати прибуток. Розвинь свою кар’єру в аудіоіндустрії.

Ознайомитись з курсом

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

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

Бесплатный доступ к курсу действует только до 1 июня. Сколько он будет стоить потом, неизвестно.

«Профессия: веб-дизайнер»

Продолжительность:

3 урока

Организатор: «Образовательный хаб города Киева»

Краткий курс, на котором вы узнаете:

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

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

Записаться и пройти курс можно в любое время.

Курс Front-end Pro.

Розширте свої можливості у розробці веб-сторінок з використанням JavaScript та React. Володійте інтерактивністю та зручністю розробки з React!

Вивчити курс

На английском языке

Web Design for Everybody: Basics of Web Development & Coding Specialization 

Продолжительность: 4 курса

Организатор: Университет Мичигана

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

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

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

На втором курсе вы узнаете, как работают каскадные таблицы стилей CSS3. Затем можете создать дизайн HTML-страницы.

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

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

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

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

Web Design Bootcamp: Design like a PRO

Продолжительность: 2 часа 20 минут

Организатор: Udemy

Курс поделен на три части:

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

Напоследок нужно пройти небольшой тест и ответить на четыре вопроса.

Этот курс подходит тем, кто владеет любой программой для дизайна. Например, Photoshop, Illustrator и другими. Начать обучение можно в любое время.

Этот материал – не редакционныйЭто – личное мнение его автора. Редакция может не разделять это мнение.

Учебный лагерь по веб-дизайну для фрилансеров

Хорошо, до сих пор в этом курсе мы рассмотрели, среди прочего, привлечение клиентов, создание предложений, оценку нашей работы и захватывающий 21-минутный обзор того, как Star Trek: First Contact переосмыслил зомби жанр. Тема, которую Гримур пообещал в очередной раз не вырезать из этого курса. И то, что мы делаем здесь, — это берем концепции, которые мы рассмотрели до сих пор, и готовимся к нашей первой запланированной встрече с клиентом. Потому что мы хотим подготовиться к взаимодействию с клиентами, как к дебатам, и такая подготовка помогает нам оставаться сосредоточенными, и, конечно же, чем лучше мы подготовимся, тем меньше вероятность того, что нас застанут врасплох. Итак, мы разделим это на четыре части: планирование первой встречи, подготовка правильных вопросов, планирование правильных ответов, а затем мы пройдем через фактическое взаимодействие с Ребеккой из Hayes Valley Interior Design.

Разница между подготовкой к дебатам на политической сцене и подготовкой к переговорам с клиентом заключается в том, что в большинстве случаев вы не противники. Наша цель — сопереживать им и уважительно отвечать на их вопросы. Потому что, разослав предложения потенциальным клиентам, вы часто будете получать ответы. И то, как вы это делаете, у всех разное. Кто-то предпочитает разговаривать по телефону, кто-то в видеочате, кто-то хочет встретиться лично, и нет правильного или неправильного способа сделать это. В последней части этого курса мы установили звонок с Ребеккой. Почему? Потому что один из лучших способов организовать свои мысли и убедиться, что вы подготовили свои исследования до любого формального взаимодействия с клиентом, — это составить расписание. Вы получаете звонок или электронное письмо с желанием узнать больше, иногда мы сразу же хватаемся за этот шанс. Но если мы сбавим обороты и предложим запланировать короткий звонок, чтобы поговорить о том, чего они хотят достичь, это даст нам время на подготовку и организацию. И это хороший сигнал вашему потенциальному клиенту, что вы цените и уважаете свое время. Поскольку телеконференция назначена на сегодняшнее утро в 10:30, это дает нам довольно короткое время для подготовки. Но нам нужно подготовить не только вопросы, которые может задать нам наш потенциальный клиент. Нам нужно подготовить вопросы, чтобы задать их нашему потенциальному клиенту, и это ключ. Цель этого звонка не в том, чтобы продать им нашу способность работать на них, а в том, чтобы углубиться, лучше понять их бизнес. Потому что пока у нас есть только та информация, которую мы нашли сами. Это прекрасная возможность, и опять же, чем лучше мы понимаем их потребности, потребности их бизнеса, тем лучше мы можем порекомендовать курс действий, услуги, которые мы можем им предложить. К счастью, у нас уже есть основа. Первые вопросы исходят из предложения: как клиенты их находят, что происходит, когда клиенты попадают на их сайт, и как мы, как фрилансер, можем им помочь. До сих пор наше исследование в основном основывалось на том, что мы могли найти, поэтому вопросы, которые мы задаем, должны начинаться там, где заканчивается это исследование. И некоторые из наших исследований основаны на предположениях. Что нам нужно сделать, так это опираться на это, точно так же, как Care Plus, о котором мы говорили ранее в курсе. Мы будем задавать вопросы нашему потенциальному клиенту, чтобы понять не как есть, а как он хочет, чтобы было. Сам акт звонка или письма нам уже является признаком. Они заинтересованы. Они смотрят на вас и обращаются к вам, скорее всего, потому, что хотят развивать свой бизнес. Но сейчас не время продавать. Теперь пришло время пойти глубже. Итак, давайте рассмотрим вопросы, которые вы можете им задать. И для этого Гримур вызвался позвонить и помочь нам в подготовке.

[McGuire] Большое спасибо, Ребекка, за то, что нашли время.

[Гримур фальцетом] С удовольствием.

[МакГуайр] Итак, прежде чем мы начнем, я хочу убедиться, что мы на одной волне.

[Гримур фальцетом] Звучит великолепно.

[МакГуайр] Знаешь, Гримур, это действительно здорово.

[Гримур фальцетом] Я знаю.

[МакГуайр] Ты действительно в этом заинтересован.

[Гримур фальцетом] Ага.

[МакГуайр] Вам не обязательно делать голос.

[Гримур] Я выбираю подлинное.

[МакГуайр] Если вы чувствуете давление-

[Гримур] Это ломает характер.

[Макгуайр] Хорошо.

[Гримур] Хорошо.

[Макгуайр] Можете ли вы рассказать о типах клиентов, которые у вас есть сегодня?

[Гримур] Я, Гримур, или ты имеешь в виду?

[Макгуайр] Нет, Ребекка.

[Гримур] Так ты не хочешь сделать голос?

[МакГуайр] Вы можете играть за Ребекку, но, возможно, не так сильно.

[Гримур] Хорошо.

[Макгуайр] Хорошо.

[Гримур] Идти?

[Макгуайр] Ммм.

[Гримур] Конечно, мы уделяем особое внимание дизайну интерьеров высокого класса. Большинство наших клиентов ремонтируют или строят дом с нуля.

[МакГуайр] Значит, в основном жилой?

[Grimur] У нас было несколько коммерческих клиентов, несколько предприятий, но да, в основном жилые.

[McGuire] И как это соотносится с клиентами, которых вы хотите?

[Гримур] Почему ты спрашиваешь ее об этом?

[МакГуайр] Что?

[Гримур] Почему ты задаешь ей этот вопрос?

[МакГуайр] Теперь ты ломаешь характер.

[Гримур] Ладно, представь, что я снова Ребекка. Почему ты спрашиваешь меня, Ребекка, о клиентах, которых я хочу.

[McGuire] Потому что их текущий сайт говорит только о работе с жильем, если они заинтересованы и в коммерческой работе-

[Grimur] А, понятно.

[Макгуайр] Итак.

[Гримур] Ага.

[МакГуайр] Сейчас жилой дом, вы хотите получить больше коммерческих клиентов?

[Гримур] Нам бы хотелось, чтобы у нас было больше коммерческих клиентов.

[МакГуайр] Отлично, спасибо, Ребекка. Итак, я хочу перейти к более крупным целям. Чего вы хотите достичь в плане развития вашего бизнеса? Что для вас слэм-данк? Спортивные метафоры — самые худшие.

[Гримур] Да, я думаю, что сейчас мы многое узнаем о том, что нужно для масштабирования нашего бизнеса. Это началось еще в 1943 году, и тогда (исчезает) 

[МакГуайр] Гримур действительно продает это. Подготовка к звонку с другом или коллегой — отличный способ попробовать и подготовиться. Итак, одна из вещей, которую мы хотим понять, это процесс, процесс, через который проходят ваши клиенты. Так вот, Гримур все это выдумывает, но мы хотим составить список вопросов, которые вы могли бы задать во время разговора. Какова ваша цель для веб-сайта? Что вам нравится в вашем нынешнем сайте? Что бы вы хотели улучшить на своем сайте?

[Гримур] Могу я ответить?

[Макгуайр] Конечно.

[Grimur] Ну, я думаю, многие люди смотрят на наш сайт и думают, что это мусор. Я не особенно горжусь этим. Мой племянник (исчезает)

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

[Гримур] Я готов идти?

[МакГуайр] Да, спасибо, Гримур.

[Гримур] Еще бы.

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

То, что у нас есть вопросы к ним, не означает, что у них нет вопросов к нам. И здесь вам нужны не просто отличные вопросы, вам нужны отличные ответы. Итак, в этой части мы поставим себя на место клиента. Запишите все вопросы, которые могут возникнуть у этого потенциального клиента. Сколько это будет стоить? Вы можете сделать эту работу бесплатно? Сколько времени это займет? Составьте список самых сложных вопросов, которые вы можете получить. Поначалу эти вопросы могут пугать, но вот что замечательно: будет лучше, если мы придумаем сложные вопросы до запланированного взаимодействия с клиентом, а не будем ждать, чтобы выяснить все в режиме реального времени. И благодаря этому мы можем лучше тренироваться и готовиться. И она может спросить нас о чем угодно. Каков ваш процесс? Сколько времени занимает процесс? Что, если мы захотим изменить ситуацию позже? Все эти вопросы могут помочь нам лучше подготовиться, и мы можем потренироваться, как мы будем на них реагировать. Итак, звонок назначен, мы хорошо подготовились, у нас есть свои записи, мы берем еще, давайте сделаем звонок. Какой номер?

[За кадром] 415

[МакГуайр] 415

[За кадром] 555 

[МакГуайр] 555

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

[Ребекка] Эй, это Ребекка, спасибо за звонок.

[Макгуайр] Нет проблем. Приятно познакомиться с вами по телефону. Как проходит твой день?

[Ребекка] Хорошо! Мы получили эту брошюру, которую вы сделали, и я хотел выяснить, сколько будет стоить такой веб-сайт.

[МакГуайр] Совершенно верно, и это одна из главных вещей, которую мы хотим выяснить в ходе этого звонка. Теперь, в этот момент, многие люди могут захотеть спросить, сколько стоит клиентский проект ее фирмы, потому что это дает нам отправную точку. Ничего плохого в том, что мы говорим что-то вроде того, что большинство проектов наших клиентов начинаются с 3000 долларов, но вместо того, чтобы сразу перейти к цене, мы хотим сначала лучше понять их потребности, чтобы вы могли давать рекомендации на основе этих потребностей. И дело в том, что во многом это зависит от масштабов того, что хочет сделать ее фирма. Ребекка?

[Ребекка] Да?

[McGuire] Многое из этого зависит от объема того, что ваша фирма хочет сделать.

[Ребекка] Хорошо.

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

[Ребекка] Понятно.

[McGuire] Итак, давайте начнем с вашего текущего сайта, потому что по этому поводу возникло несколько вопросов.

[Ребекка] Хорошо.

[McGuire] Итак, мы смотрим на ваш текущий веб-сайт, и первый вопрос: много ли ваших клиентов приходят с этого сайта?

[Ребекка] В основном это сарафанное радио. Мы сделали наш сайт еще в 2011 году. 

[МакГуайр] Хорошо, кстати, такие детали — это здорово, потому что я делаю заметки.

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

[МакГуайр] Понятно, так что эти звонки, со стороны бизнеса, как выглядит этот процесс?

[Ребекка] Что ты имеешь в виду?

[McGuire] Допустим, вам звонит клиент, который хочет с вами работать, что дальше?

[Ребекка] Ну, обычно у нас клиент знает, что ему что-то нужно, он переделывает кухню или строит новый дом.

[McGuire] И это для частных клиентов, или вы также занимаетесь коммерческими услугами?

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

[МакГуайр] Мы хотим делать заметки здесь.

[Ребекка] Таким образом, мы получаем понимание того, что они ищут, будь то строительство нового дома или ремонт. Затем мы работаем с ними, чтобы получить цитату.

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

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

[МакГуайр] Это ремонт?

[Rebecca] Рино или новая постройка, в любом случае мы выйдем и встретимся с клиентом, чтобы снять размеры, посмотреть помещение-

[McGuire] И кто этим занимается?

[Ребекка] Обычно один из наших младших дизайнеров.

[McGuire] Мы действительно пытаемся понять, на что это похоже, на что похож этот процесс для их клиентов. И причина в том, что если мы понимаем их процесс, мы можем быть уверены, что предлагаем, а затем создадим сайт, который не только отлично выглядит, но и очень эффективно передает этот процесс своим клиентам. Хорошо, Ребекка, сначала они звонят или пишут по электронной почте, потом ты перезваниваешь им и назначаешь консультацию, дизайнер уходит, а потом что?

[Ребекка] Итак, когда мы начинаем, у нас обычно есть бюджет, поэтому мы работаем с ними, чтобы оценить проект. Это в основном фаза контракта. Мы работаем с ними, чтобы заключить контракт, а затем мы фактически делаем всю работу, весь дизайн и разработку.

[МакГуайр] Хорошо, отлично. Это действительно полезно, потому что чем лучше мы понимаем ваш процесс, тем лучше мы можем создать сайт, который сообщает об этом вашим клиентам и формирует ожидания.

[Ребекка] Звучит здорово.

[МакГуайр] Итак, во-первых, это консультация, во-вторых, это контракт-

[Ребекка] На самом деле, если это на сайте, мы должны назвать это письмом-соглашением.

[МакГуайр] Хорошо, приятно знать. Консультация, письмо-договор, затем проектные работы?

[Ребекка] Дизайн и разработка.

[МакГуайр] Хорошо, отлично, записываю все это.

[Ребекка] Потом все остальное, последний шаг — это строительство, установка и, в основном, завершение проекта.

[McGuire] Итак, что касается существующего сайта, теперь, когда мы немного больше понимаем ваш процесс, как ваш текущий сайт помогает донести этот процесс до ваших клиентов?

[Ребекка] Мне очень нравится, что мы можем получить всю контактную информацию из контактной формы.

[МакГуайр] А что тебе в нем не нравится?
[Ребекка] Контактная форма?

[McGuire] Ну сайт в общем но может быть и форма тоже.

[Ребекка] Что ж, в форме мы получаем много спама. Для всего сайта, и вы указали это в брошюре, на iPhone он действительно крошечный.

[Макгуайр] Верно.

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

[McGuire] Что ж, мы определенно можем над этим поработать. Идеальный веб-сайт, что для вас домашняя работа? Мы должны перестать использовать спортивные метафоры.

[Ребекка] Вот почему я с вами разговариваю.

[McGuire] Отличное замечание, но представьте на секунду, что у вас идеальный сайт. Забудьте о дизайне, контактной форме, что вы хотите, чтобы этот веб-сайт делал для вашего бизнеса?

[Ребекка] Ну, было бы здорово получить больше клиентов.

[McGuire] Итак, вы сказали, что сарафанное радио было довольно большим, у вас есть оценка того, сколько клиентов вы получаете, звонков или электронных писем, которые вы получаете с сайта?

[Ребекка] Я бы сказал пару раз в месяц, может два или три.

[McGuire] Таким образом, цель вашего веб-сайта, если вы создадите новый веб-сайт для своей дизайнерской фирмы, в основном состоит в том, чтобы привлечь клиентов.

[Ребекка] Да.

[Макгуайр] Понятно. Получение довольно хорошего понимания, так что спасибо.

[Ребекка] С удовольствием.

[МакГуайр] Хорошо, давайте поговорим о том, что будет дальше. Что я хочу сделать после этого звонка, так это взять то, что у нас есть, и рассказать вам об этом. Поэтому я хочу точно указать, что мы рекомендуем на основе того, что мы рассмотрели, и сколько именно мы вам за это цитируем.

[Ребекка] Итак, сколько времени это займет?

[McGuire] Давайте постараемся, чтобы оно было в вашем почтовом ящике завтра в это же время.

[Ребекка] Звучит неплохо.

[Макгуайр] Отлично. Итак, какие вопросы у вас есть ко мне?

[Ребекка] Для тебя?

[МакГуайр] Да, какие у вас самые сложные вопросы.

[Ребекка] Хорошо, сколько времени вам понадобится, чтобы создать сайт?

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

[Ребекка] Да.

[МакГуайр] Сколько времени занимает твой?

[Ребекка] Намного больше, чем три-шесть недель, у нас бывают разборчивые клиенты.

[Макгуайр] Придирчивый хорош. Какова самая долгая работа над клиентским проектом?

[Ребекка] Для нас?

[Макгуайр] Да.

[Ребекка] О Боже, теперь есть один.

[Макгуайр] Более шести недель?

[Ребекка] Прошло два года.

[Макгуайр] Тот же клиент?

[Ребекка] Мы работали над этим проектом два года.

[Макгуайр] Ребекка.

[Ребекка] Макгуайр.

[МакГуайр] Я хочу дать вам обещание. Ничто из этого не имеет отношения к дизайну их сайта, цене, техническим деталям, но клиенты хотят знать, что мы их понимаем. И это то, что мы делаем здесь, мы сопереживаем кому-то, основываясь на чем-то, что у нас есть общего. Это основа для развития взаимопонимания. Мы понимаем чувства и разочарования друг друга, потому что знаем, каково это, когда что-то занимает больше времени, чем ожидалось. До этого момента мы довольно хорошо понимали бизнес-потребности клиента, но теперь мы демонстрируем им, что можем общаться с ними лично. И это важно, потому что, когда мы взаимодействуем с клиентом таким образом, мы не только показываем, что понимаем бизнес-потребности клиента, но и можем понимать, что он чувствует. И когда мы это понимаем, мы можем давать им рекомендации и обязательства, основанные на этих чувствах. Ребекка.

[Ребекка] Макгуайр.

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

[Ребекка] Мне нужно это в письменном виде.

[Макгуайр] Мы получим это в письменном виде.

[Ребекка] Хорошо.

[МакГуайр] Следующий сложный вопрос.

[Ребекка] Хорошо, как у вас дела?

[McGuire] Для веб-сайтов?

[Ребекка] Да.

[McGuire] Это помогает заранее продумать весь процесс. Цифры работают хорошо. Ребекка, мы работаем вместе на четырех этапах. Мы сейчас на первом этапе. Мы начинаем с беседы, чтобы лучше понять потребности вашего бизнеса, затем мы работаем над контентом, это работа с вами над письменным контентом и сбор активов, таких как фотографии работы вашего клиента, проекты, над которыми работала ваша команда. .

[Ребекка] Хорошо.

[McGuire] Затем на третьем этапе мы работаем над дизайном и разработкой реального сайта.

[Ребекка] Хорошо.

[McGuire] И, наконец, мы тестируем и развертываем его.

[Ребекка] Не говорю, что это произойдет, но что, если нам это не понравится?

[МакГуайр] Хороший вопрос, и ответ: мы работаем вместе на каждом этапе пути. Таким образом, у нас будут регулярные проверки, чтобы мы могли открыто получать любые отзывы, и мы будем включать исправления как часть того, что вы получаете для проекта.

[Ребекка] Что насчет изменений? Как мы можем изменить сайт позже?

[МакГуайр] Отличный вопрос. Настроим систему управления контентом.

[Ребекка] CMS.

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

[Ребекка] Хорошо, отлично. Что, если нам потребуются изменения дизайна в будущем?

[McGuire] Конечно, иногда есть вещи, которые выходят за рамки нашего первоначального объема работ, и мы обязательно включим почасовую оплату за дополнительную работу, которая выходит за рамки нашего первоначального соглашения. Таким образом, если вам понадобится что-то еще, вы точно будете знать, какова эта ставка.

[Ребекка] Понятно.

[МакГуайр] Что еще у тебя есть?

[Ребекка] Итак, странный вопрос, не поймите его неправильно… 

[МакГуайр] Неудачное начало.

[Rebecca] Но мои партнеры будут спрашивать, плюс наш админ уже создал несколько сайтов, и я понимаю, что ваша работа заключается в том, чтобы продать мне сайт, так что что-то вроде этого: почему мы не можем сделать это сами?

[МакГуайр] Давай помедленнее. Мы на связи. У нас есть еще около шести секунд, пока все не станет неловко, и мы не можем винить в этом плохое соединение. Вопрос в следующем: почему они не могут построить сайт сами? И прежде чем мы дадим ответ, мы должны сначала понять мотивацию. Давайте разбирать. Осталось пять секунд. Какова мотивация вопроса? Почему она спрашивает, почему она разговаривает с нами, если сама это даже рассматривает? Три возможные причины, четыре, если она просто жестока. Мы можем предположить, что она не понимает всей сложности, и если это так, мы можем просто сказать ей, скажем, как сложно создать индивидуальный веб-сайт с нуля. Но это может иметь неприятные последствия, плюс звучит так, будто мы говорим, что она не может, ее фирма не может этого сделать, а это не так. Может быть, они хотят учиться. Четыре секунды. Вариант номер два: дело в деньгах. А если у нас слишком дорого? Ей нужны все ее варианты, вот и все. Но есть и номер три. В-третьих, она хочет знать, в чем отличие, какую ценность мы могли бы добавить, что ее фирма не может сделать самостоятельно. Мы могли бы пойти по этому пути, указать на ее текущий сайт как на отражение ее бизнеса и клиентов, которых они упускают, поскольку универсальный шаблон — не лучший вариант. А может быть и четыре: она нас испытывает, хочет посмотреть, какая у нас реакция на давление. Осталось три секунды. Все эти возможности, полный стол, мы могли спросить продолжение, притвориться, что не понимаем, выиграть время, мы тратили время на голоса ранее с Гримуром, у нас был список трудных вопросов, так и не придумали этого. Но это никуда нас не приведет. Итак, давайте перевернем это, начнем с будущего, представим, что мы получили клиента, мы уже заключили сделку, и теперь мы собираемся подробно рассказать, что мы сделали для этого. Правило номер один взаимодействия с клиентом, думайте как клиент, если вы думаете о себе, вы уже проиграли. Правило номер два: никогда не играй в защите. Две секунды. Мы получили клиентку в первую очередь потому, что был какой-то уровень доверия, и ей казалось, что мы знаем, о чем говорим. Каждый из этих четырех вариантов подразумевает ответ, который гласит: вы не можете этого сделать, вы не можете сделать сайт самостоятельно. Но это не то, как мы получили клиента, потому что ответ не в том, что они не могут сделать это для себя, и мы можем подойти к этому одним из двух способов. Осталась секунда. Мы могли бы сказать хороший вопрос, мы свяжемся с вами. Безопасный. Это дает нам время. Но есть и другой вариант: прыгнуть в огонь. Скажи им, что они могут, а потом объясни им, почему это должен быть ты. Глубокий вдох.

[Ребекка] Алло?

[Макгуайр] Да.

[Ребекка] Итак, что мешает моей команде построить это, может ли это сделать моя фирма?

[McGuire] Итак, это действительно хороший вопрос, и я могу понять, почему вы спрашиваете, и ответ таков: можете.

[Ребекка] Прости?

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

[Ребекка] Хороший вопрос.

[McGuire] И, поскольку мы работаем над этим, мы здесь на каждом этапе пути, чтобы ответить на любые ваши вопросы о том, как то, над чем мы работаем, обеспечивает эту ценность.

[Ребекка] Отлично. Это все, что я могу придумать, но я уверен, что придумаю что-нибудь, как только положу трубку.

[McGuire] Что ж, если у вас есть какие-либо вопросы между сегодня и завтра, пожалуйста, обращайтесь.

[Ребекка] Подойдет.

[МакГуайр] А пока давайте начнем с этой цитаты, двадцать три часа и пятьдесят четыре минуты.

[Ребекка] Звучит здорово.

[McGuire] Большое спасибо за ваше время, Ребекка, было здорово поговорить с вами.

[Ребекка] Приятно побеседовать с тобой, Макгуайр, приятного общения.

[МакГуайр] Пока.

[Ребекка] До свидания.

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

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

19 бесплатных курсов по веб-дизайну: UX, графика, код и др.

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

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

Бесплатные курсы дизайна

Основы графического дизайна . Часть Школы дизайна Canva, этот курс представляет собой серию из 12 быстрых уроков по дизайну, включая основы цветового круга, типографику, оттенки и затенение.

Школа дизайна Canva

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

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

Веб-дизайн для всех . Это специализация из пяти курсов Мичиганского университета, на которой студенты учатся проектировать и реализовывать адаптивный сайт как минимум для трех платформ. Специализация начинается со знакомства с HTML5, CSS3 и JavaScript, а затем изучает расширенные стили с адаптивным дизайном.

Coursera — веб-дизайн для всех

Создайте свои первые веб-страницы с помощью HTML и CSS . Это вводный курс от OpenClassrooms по созданию веб-страницы с помощью HTML и CSS. Используйте теги и атрибуты для идентификации ключевой информации. Узнайте, как семантические теги HTML структурируют веб-страницу, и применяйте CSS к элементам HTML.

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

Изучение веб-разработки. Из веб-документов MDN (ранее Mozilla Developer Network) это набор статей с основными инструкциями по кодированию веб-сайтов. Оттуда изучите остальную часть MDN и другие источники от среднего до продвинутого уровня.

MDN — Обучение веб-разработке

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

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

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

Основы UX-методов . В этом часовом курсе рассматриваются пять процессов проектирования взаимодействия с пользователем: дизайн-мышление, проектирование, ориентированное на пользователя, Agile UX, Lean UX и процесс поведенческого проектирования. Сравните методы UX и найдите подходящую систему для разработки оптимального дизайна взаимодействия с пользователем.

Udemy — Основы методов UX

Научитесь графическому дизайну . От Envato Tuts+, вот план курса самообучения для изучения графического дизайна. Изучите краткие и учебные ресурсы по принципам дизайна, включая форму, интервалы, ритм, цвет, текстуру, тип, историю, процесс проектирования и многое другое.

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

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

Основы дизайна логотипа. В этом часовом курсе вы научитесь создавать уникальный дизайн логотипа с помощью Adobe Illustrator и Photoshop.

Udemy — Основы дизайна логотипа

Скетч для начинающих. Sketch — популярный редактор векторной графики. Используйте его для разработки веб-сайтов, значков, логотипов и многого другого. Этот краткий курс научит основам Sketch, включая элементы и стили многократного использования, прототипирование, совместную работу и плагины Sketch.

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

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

Высший курс веб-дизайна . Этот курс веб-дизайна от Webflow University включает более 100 видеороликов.