Разработка
для швейной
фабрики
сайта
Задача
Сделать лендинг для швейной фабрики с 0. Не было ни фотографий, ни логотипа, ни текстов. Сайт нужен для того, чтобы компания могла заявить о себе в онлайн-пространстве, и с фабрикой, ее услугами и ценностями можно было познакомиться дистанционно. Дальнейшее продвижение сайта с помощью маркетологов не планировалось
О проекте
Балакиревская мануфактура — крупнейшая швейная фабрика Владимирской области. Работает с крупными заказами в B2B, B2C и B2G секторах
Что было сделано
- Провела интервью с клиентом, сделала анализ целевой аудитории и конкурентов
- Предложила структуру сайта
- Написала тексты и оформила прототип согласно структуре
- Подобрала визуальные решения для дизайна и офоромила в мудборд
- Составила тз для съемки фотографий и видео на сайт с референсами и видео-инструкцией, как стоит снимать
- Обработала фотографии и смонтировала видео на выкладку
- Нарисовала иллюстрации на тему шитья для сайта
- Задизайнила сайт с использованием иллюстраций, фото и видео
- Привлекла к сотрудничеству графического дизайнера для создания логотипа в стилистике сайта, помогла составить ТЗ и проконтролировать работу над лого
- Сверстала сайт с адаптивными версиями и настроила SEO
Исследование ца и конкурентов
Сайты конкурентов несильно отличались друг от друга — использовалась стандартная композиция как из шаблона, все сайты были белыми или серыми с небольшими цветными акцентами красного или зеленых цветов. Плохо проработан текст — либо это статья на всю страницу, либо общие шаблонные фразы, которые путешествуют с одного сайта на другой. Важно было выделиться среди обилия одинаковых сайтов и добавить эмоций
С помощью анализа целевой аудитории также выявили, какая информация важна потенциальным покупателям, и отразили ее в текстах и фотографиях на сайте (какие услуги предоставляют, заключают ли договор, качество пошива)
После презентации выводов маркетингового исследования, я предложила структуру, которая будет закрывать основные запросы ца
После презентации выводов маркетингового исследования, я предложила структуру, которая будет закрывать основные запросы ца
Написание текстов и прототипирование
С помощью текстов на сайте мы хотели создать впечатление, что этой фабрике можно доверять. Поэтому сформировали взрослый, но заботливый, голос бренда, который не боится заявить о себе. Что и отражают заголовки «Швейная фабрика, на которую можно положиться», «Что мы умеем» и «мы заботимся об условиях труда наших сотрудников…»
Также важно было закрыть все потенциальные вопросы клиентов и рассказать, как выстраивается сотрудничество, какие сопутствующие услуги может оказать фабрика.
Также клиентка попросила добавить блок с вакансиями на фабрику.
Мудборд и референсы для фото и видео
После согласования прототипа я подготовила презентацию с идеями для дизайна сайта — мудборд. Помимо фотографий на сайте мы решили использовать атрибуты для шитья: ножницы, иглы, нитки и выкройки, которые можно вписать в дизайн. На этом этапе я предложила шрифты и цвета для сайта, объяснила, какое настроение они будут передавать и как будут сочетаться с фотографиями фабрики, и заказчица выбрала подходящие на ее взгляд варианты
Для обложки сайта я предложила использовать короткие видео, показывающие фабрику. Этот прием повысит удержание пользователя на сайте, потому что движущиеся элементы цепляют взгляд и хочется их рассмотреть. Я приложила референсы для видео и фото и объяснила заказчице ключевые моменты при съемке (как строится кадр и какой ракурс лучше выбирать в той или иной ситуации). Так как заказчица планировала сделать съемку своими силами без привлечения фотографа
Мудборд
ТЗ для фотографий
Подготовка к дизайну сайта
Прежде чем приступать к дизайну я смонтировала видео для обложки и обработала фотографии — на некоторых фотографиях было достаточно сделать базовую цветокоррекцию и обрезать кадр. На фотографиях с примерами работ фабрики нужно было добиться студийной картинки. Клиентка сделала фотографии на фоне белой ткани, так как я попросила сделать фон однотонным
Однако было видно складки и помятости на фоне, отчего сами изделия казались мятыми и неаккуратными. Поэтому я заменила фон фотографий, чтобы повысить качество отшитой одежды
До обработки
После обработки
Дизайн
Клиентка выбрала тариф без анимаций, поэтому надо было сделать красивую статичную картинку. Основным акцентом сайта выступила сложная сетка — линии, вдоль которых расположен контент на сайте. Сайты с контентом по левой границе сайта выглядели скучно и шаблонно, а этого нужно было избегать, чтобы выделиться среди конкурентов.
Сложную сетку дополняла крупная типографика. Клиентка отдала предпочтение шрифту с засечками, чтобы подчеркнуть серьезность бренда и добавить нотку элегантности с использованием курсивного начертания
Сложную сетку дополняла крупная типографика. Клиентка отдала предпочтение шрифту с засечками, чтобы подчеркнуть серьезность бренда и добавить нотку элегантности с использованием курсивного начертания
Основной цвет сайта — серо-синий. Во-первых, он выделяется на фоне белых сайтов у конкурентов. Во-вторых, синий цвет ассоциируется с надежностью и стабильностью, которую мы хотели донести до клиентов.
Основную тематику сайта подчеркивают фотографии фабрики. Для потенциальных клиентов важно понимать, что они сотрудничают с организацией, работающей «в белую». Также важно, чтобы сама фабрика отвечала стандартам организации рабочего места — чтобы оборудование было современным, на фабрике было безопасно и светло.
Основную тематику сайта подчеркивают фотографии фабрики. Для потенциальных клиентов важно понимать, что они сотрудничают с организацией, работающей «в белую». Также важно, чтобы сама фабрика отвечала стандартам организации рабочего места — чтобы оборудование было современным, на фабрике было безопасно и светло.
Чтобы подчеркнуть, что это сайт швейной фабрики, я использовала иллюстрации и визуальные элементы из сферы шитья. Поэтому в блоках присутствуют пуговки, иголки и нитки.
Пунктирная линия на сайте — отсылка к швейной строчке. А еще на сайте есть блок с выкройками — деталями будущего изделия. Сам блок темно-синего цвета, как аллегория полотна ткани, на котором сделаны разметки для выкроек
Верстка и передача проекта
После согласования дизайна я сверстала сайт на Тильде. Мобильная версия прорабатывалась на этапе верстки. В конце работы клиентка оставила положительный отзыв:
“
Прекрасные впечатления от работы с Кариной. Быстро, профессионально, креативно, человечно, чётко, эффективно и комфортно. Спасибо большое, Карина. То, что казалось сложным и не понятным — на деле было быстро и качественно создано и внедрено. арина — отличный специалист! Быстро вникла в задачу, оперативно и креативно выполнила её! Спасибо, были рады сотрудничать :) Все четко, по срокам тормозили только мы, со своей стороны. Передача, посыл и формализация поставленной задачи, на 5 👌 Все сделано в срок, в лучшем виде!
Хочу рекомендовать Карину как профессионала своего дела. Обратилась к ней уже не в первый раз, а это значит, что мне нравится работать с ней над проектами. Работа проходит в комфортном режиме, все четко, оперативно, по делу, в установленные сроки. Оригинальный подход к решению поставленной задачи. Результат работы превзошел заявленные ожидания. Если потребуется ещё одна работа над сайтом, обязательно к Карине!
Хочу рекомендовать Карину как профессионала своего дела. Обратилась к ней уже не в первый раз, а это значит, что мне нравится работать с ней над проектами. Работа проходит в комфортном режиме, все четко, оперативно, по делу, в установленные сроки. Оригинальный подход к решению поставленной задачи. Результат работы превзошел заявленные ожидания. Если потребуется ещё одна работа над сайтом, обязательно к Карине!
Как вам проект?
