Что хочет клиент
Изменение оформления может быть разделено по уровням сложности.
- Первый, лёгкий – предполагается трансформация какой-либо определённой части. Так заказчики просят разработать новую шапку, изменить элементы фирменного стиля или организовать дизайн перспективного раздела.
- Второй сценарий определяем для случаев, когда это продиктовано неудовлетворительной работой веб-ресурса из-за, например, плохого юзабилити. Здесь уже простой заменой картинок не обойтись, а нужно анализировать ошибки прошлой версии и создавать новую концепцию комфортного взаимодействия.
- Третий, самый сложный – перелицовка сайта начиная от кода и верстки и заканчивая графикой и текстами. Кстати, вопреки расхожему мнению, работа со статьями не может отделяться от самого редизайна – типографика (оформление текста) тоже воспринимается в качестве декоративного визуального элемента. Перекрывающие друг друга буквы, неформатированные абзацы и прочие подобные огрехи способны убить самую гениальную обложку-картинку.
В нашем случае о последнем пункте речь не идёт – клиенту требуется заменить цветовую гамму и разработать новую стилистику изображений. Достаточно распространённая просьба, чтобы на её примере показать редизайн и его особенности.
Техническое задание
О брифах ТЗ чаще говорят в контексте реализации новых проектов, хотя техзадание касается любого раздела. Его наличие приветствуется и при заказе статей (от ключевой семантики до структуры), и для оптимизации трафика (в области намеченных задач), и в брендинге. Только инициатор работ знает их конечную цель и хорошо, если способен выразить её на бумаге – деятельность веб-студии в таком случае будет продуктивнее.
В нашем кейсе так и произошло – владелец портала для женщин womanisv.ru смог точно сформулировать требования.
- Во-первых, проработать элементы интерфейса, сделав их более строгими и выдержанными.
- Во-вторых, заменить цветовую гамму. Актуальная версия использовала серо-розовую колористику с густым растительным орнаментом в бэкграунде. Новая палитра должна базироваться на сочных оттенках тёмно-красного и бордового.
- В элементах оформления использовать восточную символику и атрибуты (ковры, вазы, столики).
Таким образом – вплоть до описания сцен для отдельных страниц – заказчик представил собственную визуальную фантазию.
Воплощение редизайна
Хотя лучшая возможность создать по-настоящему уникальный графический контент заключается в организации фотосессий, но в нашем случае этот способ неприемлем – бенгальские тигры и полуобнажённая натура потребовали бы приличного финансового бюджета, которым наш клиент не располагает. Поэтому обращается к бесплатным фотостокам и ищем подходящие компоненты – вазы, фрукты, орнаменты, животных и людей. Чем больше материала попадает на стол дизайнера, тем легче собрать нужный тематический пазл и поместить его на цветной задник.
- Для разграничения блоков используем линии и рамки в стиле тёмного золота с ориентальным тиснёным рисунком.
- Убираем шрифтовой курсив из хедера, заменив его прямым начертанием, украсив заголовок декоративными вставками.
- В шапку помещаем продающие СТА в акцентировано-золотом исполнении.
- Узкий слайдер перелистывает коммерческие предложения, актуальные в настоящее время.
- Центральное место отводим для представления основной фигуры – личный бренд владельца объединяет всю композицию.
На этом завершаем первый этап и готовим материал для боковых панелей. Поскольку верстка выдержана в формате одного экрана (скроллинг двигает лишь центральную контентную часть окна), наша картинка предполагает статичность и сюжетную законченность. Для примера возьмем только изображение девушки, которое помещаем в пространство левого среза страницы.
Получить окончательный уникальный материал с обработкой доступных в сети исходников – это отдельная тема. По ней можно подготовить целый кейс с использованием инструментов какого-нибудь профессионального графического редактора (например, Adobe Photoshop), но мы остановимся только на основных пунктах, при помощи которых формируется новая концепция.
- Добавляем индивидуальные детали. В нашем случае у девушки изменяем длину и цвет волос, одеваем прозрачные элементы восточной одежды, прикрываем часть изображения воздушным газовым шарфом.
- Вырезаем фигуру на новый слой, удалив характерный для студийной съёмки задник.
- Композицию размещаем на подготовленном дизайнерском фоне, с использованием определённой клиентом бордово-красной гаммы, восточных орнаментов в стиле тёмного золота, архитектурных и декоративных объектов. Здесь пригодились цветы, ваза, фрукты и сласти.
Таким образом, из дюжины тиражированных в сети картинок, которые – без сомнения – можно увидеть на многих сайтах, мы получили уникальную коллажную композицию, где изменения центральной фигуры и окружающего её антуража создают новую визуальную концепцию. Таким же образом, но с использованием других компонентов, готовим и остальную графику. Редизайн сайта продолжается.