7 задач, которые помогут отточить навыки веб-дизайнера
29 ноября 2017 | Опубликовано в статьюшечки | 2 Комментариев »
Время от времени каждому из нас хочется попробовать что-нибудь новое. Иногда это желание не стоять на месте, иногда — жажда творчества, а иногда просто скука. Может быть много причин для того, чтобы бросить себе дизайнерский вызов. Пользы от этого немало: вы пополните ваше портфолио концептуально новым проектом; вы можете рассказать о вашем опыте в блоге, и таким образом прорекламировать себя как специалиста; вы можете бросить вызов коллегам по цеху и посоревноваться; и конечно вы можете намного лучше и глубже понять технологии, с которыми работаете.
Смысл в том, чтобы сделать нечто кардинально отличное о того, что вы делаете обычно. Так вы будете развиваться и расти как дизайнер. Не стоит, однако, выполнять эти задачи на клиентских сайтах, пока вы не уверены на 100% в своем решении.
1. Постройте что-то новое
Попробуйте построить нечто совершенно новое — что-то, что не делали раньше. Возможно, новое строение макета, которое вы еще не использовали. Пусть это будет эффективный и простой макет с горизонтальной прокруткой, или верстка из трех колонок, а может полностью адаптивный фон с изображением и абсолютным позиционированием.
Вы можете попробовать новые модули CSS или техники, о которых раньше даже не думали. При этом нет необходимости идти дальше и переживать о таких вещах как корректное отображение во всех браузерах.
2. Меняйте цвета
Многие дизайнеры склонны использовать проверенные цветовые схемы, которые (исходя из их опыта) точно работают. Автор статьи, например, любит приглушенные оттенки, серые тона, выцветший зеленый и синий и т. д. Пока не встает задача работать в определенном стиле (например, по брендинг-руководству), дизайнеры чаще всего отдают предпочтение тем самым «своим» цветам.
Давайте выйдем из этой зоны комфорта! Нарисуйте сайт в цветовой схеме, которую в обычной ситуации точно бы не выбрали. Возможно это яркие, сочные тона или в целом намного более насыщенные цветовые схемы. Если вы обычно рисуете в светлых тонах, попробуйте уйти в темные цвета. Используйте спокойные оттенки, если привыкли работать с яркими. Многие дизайнеры грешат недостаточным контрастом. Попробуйте его добавить. Нарисуйте полностью черно-белый проект и сделайте его функциональным.
3. Копируйте сложные макеты
Возможно не стоит копировать один в один. Просто найдите интересный сайт со сложным макетом, и скопируйте его, не заглядывая в код страницы. Воссоздайте сайт с нуля, внимательно изучая основные элементы и решая каким образом воплотить их в жизнь. Не используйте эту задачу для создания реального сайта. Это простое упражнение по HTML/CSS/JS.
Попробуйте скопировать один из модных, экспериментальных сайтов, чтобы проверить хватит ли вам знаний для создания подобного. Пробуйте воссоздать макет крупного онлайн-магазина, чтобы понять как в этом случае строится код HTML и CSS. Скопируйте новостной сайт, чтобы понять как решить вопрос адаптивности на ресурсе с большим количеством текста и изображений.
Помните, ваша цель — не воссоздать идеальную копию, а понять принципы, которые стоят за достойными проектами.
4. Используйте новые инструменты
Если вы используете Foundation, попробуйте Bootstrap или другой, менее популярный фреймворк. Попробуйте другой препроцессор, другую CMS, другой файловый менеджер или текстовый редактор. Отложите вашу любимую JS-библиотеку, и попробуйте новую.
Если вы решите углубиться, выполнение этой задачи займет много времени, но понять принципы работы нового инструмента можно и за короткое время. Ваша задача в этом случае — не изменять полностью рабочий процесс, а открыться новым, потенциально лучшим решениям.
5. Попробуйте новый метод
Потратьте несколько вечеров, чтобы попробовать принципиальной новый метод работы. Посмотрите как работают другие, поковыряйте чужие работы и шаблоны. Посмотрите как другие дизайнеры организуют слои. Приглядитесь чему вы можете у них научиться. Как вариант, изучите полноценную методологию по работе над дизайном, такую как Atomic Design.
В сфере фронтенда это новые методы работы с CSS. Hongkiat описали неплохой обзор нескольких самых популярных способов организации CSS.
6. Улучшите старый дизайн
Если вы растете как специалист, ваши старые работы скорее всего вызывают у вас некоторое разочарование. Попробуйте заняться редизайном. Если вы периодически занимаетесь этим, то вырабатываете привычку строить новые проекты на четких принципах. А позже их нужно только обновлять и улучшать.
Возьмите ваш старый проект и улучшите его, не меняя основных элементов. Сохраните тот же макет, но увеличьте расстояние между элементами. Не меняйте шрифты, но обновите стили текста. Оставьте те же цвета, но измените способ их использования.
Посмотрите что происходит когда вы применяете новые принципы к старому дизайну, вместо того, чтобы переделать все с нуля.
7. Выполняйте уроки
Хороший урок — кладезь полезной информации, даже если вы не новичок в теме. Однако выполнять их нужно осознанно. Просто скопировать код из урока и вставить в проект — не дело. Найдите хороший, длинный урок и перепишите руками каждую строчку кода. Если это урок Photoshop, внимательно повторяйте каждый шаг. Обращайте внимание какой результат имеет каждое действие.
Если вы чего-то не понимаете, открывайте Google и ищите ответы на вопросы. В данном случае задача не творческая, а техническая. Важно понять техники и принципы работы.
Автор статьи Ezequiel Bruni
Перевод — Дежурка
Смотрите также:
5 декабря 2017 в 15:51
Сделайте ПОЖАЛУЙСТА адаптивный новый дизайн, с большим шрифтом.
удачи