Введение и первый результат
8 уроков. 1 домашнее задание
1.1. Интро курса
Сергей Попков основатель и творческий руководитель AIC (Behance).
Игорь Коропов основатель SKILLBOX.
Первый курс в формате интерактивного сериала. В курсе используется индуктивный метод обучения, то есть все наоборот — в начале практика, потом теория “натягивается” на практику.
1.2. Брифинг от заказчика
Важно понимать что заказчики бывают разные. В большинстве своем это владельцы бизнесов, они видят конечный результат, но не всегда понимают и знают как до него дойти.
- Понять задачу — зачем нужен заказчику сайт, тот продукт, который будет разрабатываться.
- В каких моментах нужно обучить заказчика.
Важно создавать “сарафаное радио” вокруг себя, то есть ваши клиенты должны оставаться довольными от работы с вами и продуктом, чтобы рекомендовать вас своим знакомым.
Перед встречей обязательно необходимо изучить материалы от заказчика (часто материалов нет или, например, фотографии плохого качества, нет логотипа). В процессе разговора вероятно возникнут вопросы даже если задача кажется кристально прозрачной. Также в процессе коммуникации необходимо их просмотреть вместе с заказчиком чтобы уточнить нюансы или сделать встречные предложения в ходе разговора, могут возникнуть наводящие вопросы.
Д: Что должен продавать лендинг? Яхту или Мальдивы?
К: И то и другое. Они неотделимы друг от друга.
Д: Фотографии взяты с сайта производителя. Видно что яхта ходила где-то в другом месте, а не на Мальдивах. Нужно создавать коллаж)))
О репутации. На фрилансе есть вероятность набрать много заказов, но при этом срывать сроки. Один довольный клиент приведет двух новых. Поэтому никогда не срывайте сроки! Если этого не избежать, то нужно заранее извиниться и сообщить заказчику что необходимо по такой причине (указать причину) перенести дедлайн, а не в последний день.
Старайтесь найти более неформальный формат общения с клиентом, общие интересы. Часто клиенты могут стать вашими потенциальными партнерами, друзьями.
О референсах. Пробуйте и пытайтесь вытащить из заказчика почему ему нравится тот или иной референс. Как дизайнер вы понимаете почему пользователю нравится картинка: сочетание шрифтов, пропорции, цвета и т.д., именно по этим параметрам чаще всего бывают правки; заказчик не мыслит такими категориями, но общаясь с ним, вы должны подмечать эти вещи.
Очень удобно создавать подборки на pinterest
О вариантах. Заказчик будет просить сделать 100500 вариантов, он хочет повыбирать, он так привык. На самом деле заказчику не нужно много варинтов. Вы можете сделать два или три варианта: один хорошо, остальные чтобы было по остаточному принципу. Избегайте этого. Обсуждайте сразу что вы будете работать над одним вариантом, прорабатывать его максимально, вкладываться в него. Если заказчику не понравится, обсуждайте. Дизайнер: “Я не хочу делать пять так себе вариантов. Я хочу делать один классный вариант, потому что в итоге мы с вами выберем один.”
Дизайнер: “Я не хочу делать пять так себе вариантов. Я хочу делать один классный вариант, потому что в итоге мы с вами выберем один.”
1.3 Приветствие от арт-директора
Филипп Соломин руководитель дизайн-студии OKTAEDER (philipp.solomin)
1.4 Практика — создаем документ
Дизайн-концепция важнейший этап всего проекта. Если дизайн-концепция хорошая, интересная и клиенту она нравится, то в последствии вам будет легче, клиент даст вам все карты в руки, так как он поймет что вы понимаете что к чему и что он хочет. Если концепция окажется слабой, то вам обеспечено большое количество правок. Внимание к вашей работе будет усилено.
В большинстве случаев конечный результат значительно отличается от первоначальной дизайн-концепции, так как со временем вы больше погружаетесь в бизнес клиента, лучше понимаете что ему нужно.
Структурируем материалы.
папка inbox — в ней все материалы от заказчика (бриф, логотипы, шрифты, референсы и т.д)
папка psd или sketch — в этой папке хранятся исходники
папка png — папка с файлами для отправки на согласование клиенту
папка reference — папка с референсами и материалами для работы
папка архив — в этой папке хранятся неактуальные макеты и прочее )))
Photoshop
Обязательно настроить рабочую среду.
Создание нового документа: выбрать шаблон для web, включить артборды для создания адаптивного дизайна (есть в версиях фотошопа CC).
После создания документа необходимо создать сетку через панель new guide layout (окно-новый макет направляющих).
Плагины для работы с сетками и другие дополнительные инструменты для фотошоп можно скачать тут Adobe Fuckers
1.3 Практика — слои и изображения
Отличие растра и вектора: если просто, то растровое изображение это совокупность точек — файл весит больше, векторное изображение задается математическими формулами.
В web-дизайне используется paragrapfh text, то есть блочный текст, так как нужны границы (блоки).
Фотошоп позволяет работать с 4 видами масок — маски слоя (Layer Mask), векторные маски (Vector Mask), Обрезающая маска (Clipping Mask) и быстрая маска (Quick Mask), которая не совсем маска…)
Полезный инструмент clipping mask или обрезающая. Эта функция позволяет наносить содержимое верхнего слоя точно внутри контура нижнего, не выходя за его края.