Тестовое задание для дизайнера
Если вы заглянете в любой толковый словарь, то узнаете, что дизайн, если в двух словах, - это художественное конструирование. Это означает, что дизайнерская деятельность представляет собой палку о двух концах - с одной стороны, нечто рациональное и практичное, а с другой, - творческое и интуитивное.
Технарь или художник?
Дизайн - это обширная сфера, которая включает в себя дизайн интерьера, рекламный дизайн, промышленный дизайн, ландшафтный дизайн, ну и, конечно же, веб-дизайн. От своих коллег-дизайнеров веб-дизайнера отличает склонность к программированию, умение работать с графическими редакторами, этакий симбиоз творческого и технического склада ума.
По результатам обучения на web-дизайнера вы должны уметь:
самостоятельно создавать веб-страницы с необходимым графическим и текстовым наполнением;
эффективно использовать анимацию, размещать информацию в виде логических блоков, оптимизировать графические элементы;
проектировать сайты любой сложности и запускать их в сети;
оформлять веб-страницы, в соответствии с запросами и ожиданиями пользователей, целями и задачами сайта;
налаживать взаимодействие страниц сайта между собой.
Все эти моменты доступно и подробно объясняются в различных платных и бесплатных видеокурсах, которые всего за несколько месяцев научат вас, как стать веб-дизайнером с нуля.
Какие знания требуются от веб-дизайнера?
Вообще, для начала я бы посоветовал завести вам какую-нибудь толковую книжку по дизайну, к которой можно было бы постоянно обращаться за детальными объяснениями того или иного понятия. А на начальном этапе обучения на веб-дизайнера у вас будет появляться очень много вопросов, это я вам гарантирую.
Вначале вы можете читать обучающий материал по диагонали, лишь бы ознакомиться с основами веб-дизайна, которые позволят вам более профессионально выполнять практические задания. В частности, вам необходимы базовые знания о структуре веб-сайта, принципах и элементах веб-дизайна, основах существования и продвижения сайтов в интернете, теории цвета, типографике, верстке сайта, основах программирования (по желанию).
Даже если вы не собираетесь сами верстать сайты, все равно вы должны иметь представление о CSS и HTML. Неплохо бы разобраться и в WordPress - платформе, на которой работают большинство сайтов.
На всякий случай еще добавлю: знание основ работы в интернете, интерфейса OS Windows и хотя бы школьный минимум по английскому языку - это то, что каждый человек должен знать как само собой разумеющееся, перед тем как начинать обучение на web-дизайнера.
Какие программы нужно освоить?
Еще один вопрос, который чаще всего задают новички, размышляющие над тем, как стать web-дизайнером, - по поводу программ, которые нужно изучить.
Лично я в этом вопросе придерживаюсь минимализма. Я считаю, что для обучения на дизайнера сайтов достаточно знать Adobe Photoshop и Adobe Illustrator, которые позволят обрабатывать и нарезать изображения, выполнять сборку макетов и множество других функций.
Для начала хватит и Photoshop. Этой программой, однако, надо владеть в совершенстве, поэтому придется потратить много времени на ее изучение.
Как видите, мнение работодателей немного отличается от моего - большинство из них считает, что хороший веб-дизайнер, в первую очередь, должен владеть программами Adobe Photoshop (96,6% опрошенных), CorelDRAW (50%), Adobe Flash (36,6%), Adobe Illustrator (23,3%).
Современные тенденции и подходы в веб-разработке
Узнайте алгоритм быстрого роста с нуля в сайтостроении
Главное - практика!
Если вам интересно, как стать дизайнером сайтов самостоятельно, без посещения каких-либо обязательных курсов, то решение можно охарактеризовать одним словом: ПРАКТИКА! Вы можете прочитать хоть тысячу книг, но они не станут оружием в вашем арсенале. Как я уже упоминал выше, информация может стать знанием только через практику.
Нет ничего зазорного, чтобы обучаться у других веб-дизайнеров. В качестве тренировки вы даже можете копировать понравившиеся сайты. У вас все равно получится не так, как на исходнике. Зато вы разовьете свой вкус и набьете руку в практических занятиях.
В дальнейшем, чтобы научиться управлять элементами дизайна, можете взять какую-нибудь качественную WordPress-тему и посвятить время доскональному изучению ее кода. Этот разобранный код, кстати, потом можно будет использовать в качестве основы для будущих дизайнов.
Вы также можете воспользоваться комплексными обучающими видеокурсами, которые содержат в своей программе и теоретические, и практические занятия. И даже задают вам домашние задания, а потом проверяют.
Вступайте в сообщества дизайнеров, знакомьтесь с вашими коллегами по цеху и обменивайтесь с ними мнениями - это сделает ваше обучение на веб-дизайнера максимально плодотворным.
Подведем итоги
Таким образом, для того чтобы стать профессиональным веб-дизайнером, вовсе не обязательно посещать художественную школу, заканчивать вуз или просиживать долгие часы в аудиториях компьютерных курсов, выполняя указания вчерашнего учителя информатики, с устаревшими знаниями и базовыми навыки работы в Фотошопе.
Я предлагаю потратить свое драгоценное время на приобретение важнейших для веб-дизайнера качеств, путем непрерывного самообучения и самосовершенствования:
отменный художественный и эстетический вкус;
отличная память, образное и аналитическое мышление;
креативность;
способность к переключению внимания;
логическое мышление;
внимательность;
систематичность;
усидчивость;
тщательность;
аккуратность.
Развитие этих качеств позволит вам резко вырасти в пределах своей профессии и делать по-настоящему красивые, функциональные и грамотные сайты.
На этом буду прощаться. Буду рад видеть вас среди постоянных подписчиков нашего блога. Подписывайтесь и делитесь полезными материалами со своими друзьями в социальных сетях. До новых встреч!
Современные тенденции и подходы в веб-разработке
Узнайте алгоритм быстрого роста с нуля в сайтостроении
Задание на ассоциацию обычно задают на предмете дизайн.
Эти задания для развития фантазии и ассоциативного мышления.
Упражнение№1
Даются слова и в зависимости от Вашей будущей профессии, на них выполняются задания. Если это задание для урока рисовавния в школе или художественном кружке, тогда можно дать задание как и для профессии - учитель рисования или предметный дизайн. Даю примеры слов, но Вы их можете придумать гораздо больше, главное - проявить творчество!
Карусель
Архитектура
Если Ваша специальность дизайн интерьера , тогда Вы даёте слова, а студенты выполняют разные дизайны интерьера на слова, то есть сам интерьер должен быть похоже на то слово, которое Вы сказали. Даётся не одно слово, а список слов и на каждое Вы должны сделать проект интерьера.
Если Ваша специальность - это учитель рисования , тогда Вы даёте те же слова, но уже просите выполнить какую - то абстракцию, или фантазийную композицию - это может быть и реальные персонажи и предметы и абстракция. Например слово карусель: Вы выполняете настоящих детей, но можете расположить их как угодно, карусель нарисовать где захотите, или вообще вместо карусели нарисовать, что дети держаться за ленточки и сидят на каких-то лошадках, или чудиках, можно вокруг нарисовать какие-то конфетти или просто пятна разной формы. То есть всё, что хотите Вы можете использовать в своём фантазийном задании. Главное - посмотрев на Вашу работу, можно было сразу сказать, что за слово Вы задали.
Если Ваша специальность - дизайн одежды , тогда Вы даете список слов, и задаёте выполнить дизайны одежды на эти слова. Точно так же как с интерьером, но только с одеждой нужно выполнить задание.
Если Ваша специальность - это дизайн предметной среды или предметный дизайн, то конечно же даёте слова и рисуете на них предметы, эти предметы должны выражать эти слова.
С дизайном предметной среды и дизайном одежды ещё интереснее, можно так же давать слова, называя конкретных животных (кошка например), птиц (ворона например), ракушки, растения, цветы, деревья и.т.д.
Упражнение№2
Упражнения по дизайну на ассоциацию:
Одно из любимейших упражнений детей любых возрастов (от3 до бесконечности) по дизайну:
Я его называю - «Каки маляки».
На формате А4 у Вас должно получиться шесть рисунков выполненных простым карандашом. Рисуете один: каки -маляки рисуем, как дети маленькие рисуют. Дальше начинаем смотреть на этот рисунок и искать на что это может быть похоже, можно найти несколько линий или одну, на что-то похожую, на птицу, животное, ракушки, морских животных, медузы, мультяшных персонажей, на что угодно. Решили например, похоже на птицу: берём эту птицу и подрисовываем ей то, что не хватает: клюв, крыло, глаз, дорисовываем недостающие детали. Очень часто «находят» стилизованные мультяшные головы: старушка, дедушка, мужчина, женщина, мальчик, девочка. Обычно- это смешные рожицы, как из мультиков. Рисунок можно крутить в разные стороны, можно даже вниз головой смотреть и подрисовывать, то есть рисунки могут быть расположены в самые разные стороны. Рисунки начинаем делать по одному. Нужные детали можно подводить карандашом. В одном рисунке даже может быть и несколько рисунков. Вот я набросала в векторе расположение рисунков на формате А4. И рядом готовый рисунок, так как оно должно быть выполнено - карандашом.
Многие молодые люди желают связать будущую профессию с разработкой сайтов. Естественно, не все хотят быть программистами, часть из них их вполне устраивает веб-дизайн.
Обучение этой профессии с нуля – дело не легкое, ведь кроме навыков работы в необходимо быть креативным человеком, хотя бы немного разораться в коде (знать CSS и ), уметь общаться с заказчиком на одном языке и т. д.
Прежде, чем начинать ознакомление с азами профессии, возникает ряд вопросов, и ответы на них приходится искать самому. Сделать это непросто ввиду отсутствия опыта, материалы с интернета не всегда становятся полезными, а порой и наоборот, лишь добавляют новые вопросы, да и опытный товарищ есть не во всех.
Давайте разберёмся, с чего начинать обучение веб-дизайну, какие знания для творчества понадобятся, где и в каком порядке их добывать, сколько времени уделять практическим занятиям, как обзавестись первым опытом и заказом…и с массой сопутствующих вопросов.
Cодержание:
Этап первый – выясните, почему вы хотите этим заниматься
С одной стороны, это простой вопрос, ведь большинство хочет заниматься веб-дизайном ввиду хорошей оплаты труда.
Сайтостроение – очень прибыльное дело, а опытного, и главное, толкового разработчика днём с огнём не всегда сыскать.
Хотя бывает много случаев, когда человек хочет заняться именно , а без знаний создания графического движка сайта программировать его непросто.
И третий распространённый случай, почему люди начинают интересоваться веб-дизайном, – тяга к изобразительному искусству.
И данная область может послужить отличным средством для реализации своих талантов на практике с извлечением из этого финансовой выгоды.
Важно! Для какой бы цели не знакомились с веб-дизайном, помните, что как обучение, так и работа должна быть интересной, выполняться с желанием и приносить удовольствие, но не превратиться в рутину.
Ввиду того, что графический художник – молодая профессия , её точного определения пока не существует, и многие специалисты трактуют понятие по-своему.
Если раньше этот человек должен был сделать странички красивыми и приятными глазу, то нынче необходимо и навыками кодера обладать, и в маркетинге разбираться, и понятие в SEO-продвижении иметь.
Без уникальных решений, оригинальных идей и индивидуального творческого подхода задача не решается.
Дизайнер сайтов – это технический художник, работающий над внешним видом и оптимизацией загрузки сайта и веб-приложений.
В задачи этих людей входят:
- работа над логической структурой страницы – дабы любому начинающему пользователю всё было понятно, он с первого раза смог отыскать то, что ищет, все важные ссылки должны быть на виду;
- разработка наиболее рационального способа подачи контента – способность заинтересовать посетителя, заставить его подольше задержаться на ресурсе, полистать страницы сайта;
- графическое оформление – где какие элементы будут размещаться, какими будут кнопки и надписи после клика, как осуществляется взаимодействие с клиентом, как и что будет изменяться в процессе работы посетителя, изменения масштаба и т. п.
Вот мы вкратце и выяснили, почему люди хотят заниматься графической частью сайтов.
Для будущих программистов достаточно ознакомиться с азами визуального оформления веб-ресурсов, хотя бы поверхностно освоить графические редакторы, верстку по шаблону.
Уж жаждущим многие годы жизни посвятить созданию интерфейса интернет страниц и получить соответствующую профессию поначалу придётся потрудиться, им и посвящена данная статья.
Этап второй – выберите направление веб-дизайна в котором вы хотите себя попробовать
Интернет-технологии стремительно развиваются, а вместе с ними повышаются и требования к разработчикам. Сначала красивая эстетичная и яркая страница были задачей художника.
Нынче различают целых семь направлений в их оформлении, и это только основных.
Жесткий
Старый как само сайтостроение вид оформления страниц , не требующий прикладывания усилий, отлично подойдёт для новичков.
Суть заключается в том, что все элементы ресурса размещаются в виртуальных ячейках таблицы с фиксированными размерами, которые задаются дизайнером.
Такая страничка будет абсолютно одинаково выглядеть на всех устройствах, независимо от платформы и размера экрана.
И это не значит, что подобный ресурс отсталый, ведь опытный разработчик с применением жесткого дизайна может создать прекрасно оформленный сайт, а корректировка чего-то в таком случае занимает считанные минуты.
Гибкий
Также табличный дизайн , но ширина ячеек виртуальной таблицы не строго задана, а зависит от размеров экрана (соотношения сторон, разрешения). Объекты будут стараться заполнить всё пространство ячейки, изменяя её размер. Главная особенность подобного решения – повышение удобства визуального восприятия данных за счёт динамически изменяющихся параметров отображения. На подобных страницах нет пустых, свободных от контента, мест.
Сложностями подобного дизайна являются:
- отсутствие гарантии, что на старых «квадратных» и огромных широкоформатных дисплеях ресурс будет отображаться правильно , без растягивания или сжимания содержимого;
- далеко не все браузеры нормально справляются с обработкой так называемых гибких ячеек, да и интернет-обозреватели, созданные на различных движках, делают это каждый по-своему;
- на подгонку и доведение проекта до идеала уходит много времени .
Комбинированный
Соединение двух предыдущих методов : если размеры монитора (соотношение его сторон) сильно отличаются от параметров дисплея, что использовался при создании сайта, применяется гибкий дизайн, в ином случае используются и те, и иные ячейки, в зависимости от наличия свободного пространства в них.
Текстовый
Применяется при оформлении одностраничных ресурсов и сайтов , которые представляют небольшие предприятия и компании в глобальной цифровой сети. Особенностью подобного оформления является практическое отсутствие графических элементов, что положительно сказывается на скорости загрузки страницы. Сделать проект привлекательным поможет игра шрифтами, цветами текста и удачным расположением текста.
Полиграфический
Наиболее востребован при разработке корпоративных и маркетинговых ресурсов , где на первом месте стоит эмоциональное наполнение. Дизайнер должен подходить к работе с наибольшей креативностью и творчески выбирать пиксельные изображения для оформления страницы.
Недостатком полиграфического дизайна является понижение скорости загрузки сайта из-за наличия, как правило, обильного количества растровых рисунков, да ещё и в высоком разрешении.
Интерфейсный
Обращаются к нему в основном опытные мастера. Их задача – угодить всем запросам пользователя, как правило методом минимизации программного кода, оптимизации графических элементов и создания удобной навигационной системы с расположением меню в верхней части страницы. Такие ресурсы быстро грузятся, с ними легко работать как с компьютера, так и с мобильных устройств
.Динамический
Наиболее трудоёмкие, сложные варианты оформления веб-страниц. Данный тип дизайна заключается в размещении на странице динамического контента (анимация, скрипты, двигающиеся и изменяющиеся элементы, широкоформатные видео).
Для реализации замыслов придётся изрядно попотеть, а, чтобы посетитель был доволен и всё работало, как задумано, нужны не только мастерство владения графическими редакторами, но и навыки оптимизации, кто же захочет подолгу ожидать появления какой-либо красочной трехмерной кнопки. Зато отлично проработанный ресурс всегда привлекает своей красотой, оригинальностью и художественными решениями, в независимости от наполнения.
Этап третий – выясните, какие программы для веб-дизайна сейчас в тренде
Прежде, чем скачивать книги по тому или иному графическому редактору, нужно ясно себе представлять те элементы, что используются при графическом оформлении сайтов: фигуры, цвета, формы, игра света и тени, линии – это базовые элементы, из которых и создаётся вся композиция.
Как ни крути, знания каскадных таблиц и гипертекстовой разметки нужны едва ли не в первую очередь.
Понадобятся дизайнеру и знания в области компьютерной анимации, популярных , SEO, а может и трехмерного моделирования.
Внимание! Кроме сложности в освоении, приложение придётся ещё и покупать для полноценной эксплуатации, хотя в целях обучения можно и схитрить, обойдя защиту программы.
Последний обрастает функционалом, который востребован в десятках сфер, и преумножению возможностей относительно веб-дизайна ребята с внимания уделяют мало.
Другое дело Sketch – заточена для рисования графических интерфейсов с нуля, не имеет ни единого лишнего элемента, более проста в освоении и легко обгоняет Photoshop по основным показателям.
Обязательно выберите наиболее удобный , поддерживающий синтаксис и подсветку: , Sublime , Axure RP .
Этап четвертый – изучите полезные книги для начинающих веб-дизайнеров
Интернет тем и хорош, что позволяет бесплатно обзавестись книгами, которые ещё десяток лет назад пришлось бы приобретать или искать в единомышленников.
С популяризацией профессии веб-дизайнера и количество книг по теме увеличилось. Без наставника и учителя книга – лучший способ получать знания.
Обучение веб-дизайну с нуля следует начинать с той литературы, где даются основные понятия, теория и небольшие практические задания:
1 Итан Маркотт «Отзывчивый веб-дизайн» – практическое руководство для веб-дизайнеров, после освоения которого новичок избежит сотен типичных для начинающих ошибок, узнает о целесообразности создания мобильной версии сайта. Написано в ней и как верстать страницы, которые будут одинаково отображаться на всех устройствах.
2 Якоб Нильсен «Веб-дизайн» – в книге масса руководств по созданию эффективных интерфейсов, правильному расположению элементов навигации и заполнению ресурса контентом.
3 Ю. Сырых «Современный веб-дизайн» – справочник, описывающий тонкости работы над интерфейсом, начиная с этапа подбора контента в зависимости от тематики ресурса, и заканчивая тестированием и отладкой готового макета. В ней масса информации не только по рисованию интерфейса, но и по его оптимизации и наполнению.
Если вы ищете работу дизайнером, в какой-то момент при проведении собеседования или даже до его начала могут быть произнесены волшебные слова «тестовое задание». Лично мне это кажется чем-то очень странным. Могу понять когда речь идет о человеке с абсолютно пустым резюме, но если у вас есть какой-то опыт, портфолио, работодатель его посмотрел, пригласил вас, вы приехали и тратите свое время на то чтобы ответить на все интересующие вопросы, значит у человека с той стороны стола есть исчерпывающая информация для того чтобы принять решение, подходите вы для работы или нет. Достаточно у вас опыта, или нет. Зачем нужно сдавать еще какие-то «экзамены» на профпригодность вдобавок ко всему - не понятно.
Кто-то скажет, работодатель рискует и хочет подстраховаться. Но ведь для этого у него есть помимо всего прочего испытательный срок. Какой риск, если в течении 3х месяцев (а то и больше) вас могут выкинуть с работы без объяснения причин?
Бред состоит еще в том, что задание обычно является финалом, после тщательного изучения резюме и интервью с кандидатом. При этом я ни разу не встречала ситуацию, когда после выполнения задания например снимается или сокращается испытательный срок. Или за отличное его выполнение предлагается более высокая з/п.
Мне кажется, что этот вопрос чаще всего возникает в 2х случаях:
- Человек с другого конца стола что называется не очень умный. Мало того что он не способен задать правильные вопросы и принять решение исходя из всей полученной информации, он не уважает ваше время, считает вас априори каким-то студентом-нахлебником, который видимо пытается его обмануть и высосать из распрекрасной «компании мечты» все соки.
- Вас просто пытаются использовать. Под видом тестового задания вам дают вполне себе настоящее, но брать на работу вообще не планируют. Причем это может быть как определенный «стиль» работы компании в целом, так и просто изобретательность отдельного сотрудника. Особенно легко втюхивать задания, являясь представителем компании с раскрученным именем.
- Если у вас почти нет опыта и пустое портфолио, вы недавно в этой области, и сомнения работодателя вполне можно понять, но при этом само тестовое задание достаточно абстрактно, не потребует от вас больше 8 часов времени с обедами и перекурами, и точно не связано с желанием вами бесплатно попользоваться.
- Тестовое задание оплачивается. Ведь это по сути такая же работа. Поэтому вы вполне можете сказать, что ок я оценю трудозатраты, поделю з/п, которую я прошу на 160 (рабочих часов в месяце при 40 часовой неделе), умножу одно на другое, и выставлю счет. Если вы готовы его оплатить, возьмусь за задание. Ведь любая работа должна быть оплачена, а вы цените свое время. Пусть его ценят и работодатели, ведь вы именно об этом и пытаетесь договориться - у вас есть опыт и личное время, у работодателя задачи, и деньги.
- Задание просто невероятно интересное и уникальное, а у вас куча свободного неоплачиваемого времени.
Теперь клинические случаи из личной практики. Если вам попалось что-то подобное - это точно не приведет ни к чему хорошему.
- Тестовое задание не оплачивается. Для многих сейчас будет откровение, но вообще-то это работа требующая времени и отвлекающая меня от основных дел, следовательно она должна быть оплачена.
- Присылается задание на нескольких листах (мой рекорд 7 листов А4) мелким шрифтом из пунктов с крайне туманными формулировками.
- Предлагается выполнять тестовое задание онлайн, в скайпе, сидя перед светлыми очами работодателя.
- Тестовое задание не имеет никакого отношения к будущей работе - например мне прислали гору задач для юзабилистов на позицию дизайнера.
- «Вы нам ТОЧНО подходите, НО мы вас возьмем только после тестового задания». (Ну так берите, раз подхожу, и давайте любые задания, не обязательно тестовые.)
- Тестовое задание направлено на решение конкретной задачи компании. Один раз я сделала такое, посидев над решением и хорошо его продумав, в итоге результат был быстро реализован на сайте компании один в один.
- Еще был случай, когда неплохое тестовое задание прислали с кучей исправлений чуть ли не красной ручкой с просьбой поработать еще и прислать итоговый результат.
- Прописан строгий запрет на использование результатов в своем портфолио.
Kern Type, the kerning game
Что проверяет: задатки шрифтовика
Дизайнер интерфейсов Марк МакКей создал игру, которую мы бы не советовали излишне раздражительным людям. Задача - выровнять межбуквенное пространство, максимально точно приблизившись к оригиналу. Позже свой вариант можно сравнить с идеальным и подсчитать, как точно вы справились с заданием по 100-балльной шкале.
Real or Photoshop
Что проверяет: умение отличать обработанные фотографии
К 25-летнему юбилею Photoshop компания Adobe предложила посмотреть на 25 фотографий и определить, обработали их в программе или нет. Таким образом создатели теста продемонстрировали, насколько Photoshop повлиял на наше восприятие мира, отношение к творчеству и к достоверности.
How Well Do You Know Your Logos
Что проверяет: знание логотипов
Интерактивный тест журнала Time - не только на намётанный глаз, но и на умение рисовать. Игроку нужно максимально похоже воспроизвести 10 известных логотипов, среди которых есть Apple, McDonalds, Chanel и Toyota.
KOLOR
Что проверяет: чувство цвета
Если у вас нет проблем со зрением, то вы наверняка отличите зелёный цвет от красного. Но сможете ли вы найти правильный зелёный цвет среди 10 практически идентичных оттенков зелёного? Как выяснил создатель теста KOLOR Хорхе Морено, это куда сложнее, чем кажется на первый взгляд.
Pixactly
Что проверяет: чувство пространства
Pixactly по уровню сложности едва не превосходит Kern Type и проверяет, как хорошо вы соотносите заданные пиксельные параметры с реальным пространством на экране - 30 пикселей могут оказаться в три раза меньше, чем казалось изначально.
The Bezier Game
Что проверяет: владение «Фотошопом»
Игра The Bezier Game проверяет ваше владение инструментом «Перо» (The Pen Tool) в Photoshop и предлагает выделить заданную фигуру, имея в запасе ограниченное количество точек. Простота обманчива: от уровня к уровню фигуры становятся сильно сложнее. Редкий пример теста, который приносит почти немедленную пользу (и который можно, к примеру, рекомендовать в качестве рабочего задания).
Shoot The Serif
Что проверяет: внимательность к шрифтам
Самый простой тест в подборке на поверку оказывается коварным. Кажется, что даже далёкие от работы со шрифтами люди способны отличить шрифт с засечками и без - но когда букв становится больше, а шрифты всё менее привычны, ошибиться очень легко.
