Такой же, но совсем другой
Результат Процесс
Elna
Сибирикс
Elna
Такой же, но совсем другой



Elna
Такой же, но совсем другой
Компания «ЭЛФОРТ» — официальный дистрибьютор двух брендов швейных машин. Для одного из них мы уже делали онлайн-каталог — Janome. Очередь подошла и для второго — Elna.
ELNA — известный европейский бренд, который пользуется признанием среди специалистов швейной отрасли за счёт продуманного дизайна и достойного качества продукции. Дизайнерское бюро ELNA находится в Швейцарии, а сами швейные машины производятся на заводах JANOME в Японии, Таиланде и Тайване.
У нас было четкое понимание структуры проекта и ключевой ориентир — сайт Janome. Заказчику там нравилось всё: структура, лаконичность дизайна, организация каталога. При этом надо было оптимизировать бюджет проекта. Во-первых, за счет отказа от прототипов — структуру страниц решили сохранить от Janome. Во-вторых, за счет частичного использования кодовой базы первого проекта.
Кожевина Анна
Аккаунт-директор

Когда одному заказчику нужны несколько проектов, можно попробовать сократить бюджет на разработку, начиная со второго. Часто нет разницы — задача в редизайне существующего сайта или создании нового «по мотивам» существующего.

За счет чего можно сэкономить:


  1. Прототипы. Если мы сохраняем структуру страниц — можно использовать существующий сайт в качестве готового прототипа. Увы, вариант не подходит, если основная задача редизайна — улучшить юзабилити.
  2. Техническое задание. Если логика работы сильно не меняется — на новом проекте будет достаточно краткого бэклога.
  3. Программирование. Сайт состоит из двух частей — фронтенд и бэкенд. Фронтенд — часть сайта, с которой взаимодействует пользователь. Если мы меняем дизайн, это потребует изменения фронтенда. Бэкенд — это часть сайта, которая работает на сервере и отвечает за логику работы проекта. Если программный код бэкенда хорошо написан и не устарел — его можно использовать в новом проекте (целиком или частично).
Бренды важно было дифференцировать друг от друга. Швейные машинки Janome подходят для бытового использования, Elna — бренд премиального класса, для дизайнеров и ателье. Если структура сайтов идентична — задача решается за счет дизайна.

Надо было найти и использовать визуальные решения, которые не были задействованы в первом проекте. Хотелось каких-то новых фишек для блоков. Мы провели брейншторм и решили, что оптимальный вариант в этом случае — сделать дополнительные мудборды (визуальные брифы) с упором на фишки для каждого из блоков главной страницы.
Мудборд (англ. Mood board — дословно, «доска настроения») — подборка референсов, шрифтов, иконок и т. д., выполненных на одном листе или экране. Необходим, чтобы определиться со стилистикой, направлением и настроением, которые должен передавать будущий продукт.

Мудборд делается дизайнером из тех элементов, стилистику которых действительно можно использовать в конечном продукте. То есть, на выходе у нас получается не нарезка из разрозненных, оторванных от практического применения картинок, а набор образов, подобранных специально для этого проекта.

Чтобы не смущать заказчиков незнакомым словом «мудборд», мы чаще используем термин «визуальный бриф».
Традиционно визуальный бриф мы готовим для всей дизайн-концепции, перед разработкой прототипа, и актуализируем перед стартом дизайна главной страницы. В этом проекте у нас получился набор мудбордов, которые мы соединили воедино.
лето сочи
Результат: на главной странице каждый экран — как отдельный вид искусства :)

Промоблок

Промоблок и некоторые элементы дизайна выполнены в стиле неоморфизм. Стиль стал актуален в 2020 году, и его популярность продолжает расти. В России он часто используется в телевизионной рекламе технологических гигантов.

Неоморфизм задает тон всему сайту — больше белого пространства, «воздуха». Глаза смотрят и видят ровно то, что хотят увидеть. Никакого мусора.

Неоднородные заголовки

Заголовки одного стиля и шрифта, но разного цвета и размера — тоже один из последних трендов в веб-дизайне.
лето сочи

Дизайнерский курсор для блока «Наши достижения»

В этом блоке мы использовали модный прием с изменением внешнего вида курсора при наведении на блок каждого достижения.

Необычный блок для публикаций Клуба шитья

«Клуб шитья» — это, по сути, блог с обзорами определенных моделей швейных машин Elna и полезными мастер-классами по работе с ними. На главной странице выводятся свежие статьи. Когда вы собираетесь выбрать какую-либо из статей — её превью эффектно разворачивается на всю ширину экрана.

Футуристичная пагинация

Кнопки слайдера — словно лейблы одежды. Висят с краю, никому не мешают, радуют глаз. У пагинации свой саксесс-бар.

Блок инстаграм

Вот вам фото для настроения, хэштег и ссылка, как найти официальный аккаунт и вдохновляться чаще :)
лето сочи

Нереально красивый SEO-блок

Как часто вы видите красивые SEO-блоки? Задизайнено!
Кристина
Дизайнер проекта
Понятно, что шитье — это девичья тема. Но бренд Elna — премиальный, а швейные машины Elna рассчитаны на профессионалов. Делать из сайта крафтовый блокнот с пуговицами, строчками и, простигоспади, использовать вензеля — не наш вариант. Поэтому мы ушли в графичные прямые формы: их использовали как в типографике, так и в декоре.

Удобный каталог

Если смотреть на программный код — каталог во многом повторяет каталог Janome. Мы сохранили и удобный фильтр, и предварительный просмотр карточек товаров прямо из списка, и возможность поделиться списком сравнения товаров, и максимально подробную карточку товара с возможностью отметить особенности товара прямо на фотографии. Только завернули все в новый дизайн.
лето сочи
Импорт товаров в каталог организован из csv-файлов. При этом мы сначала проверяем, есть ли в этом файле обязательные столбцы. Если каких-то столбцов нет, записываем в ошибки в лог-файл.

Загрузка файлов выполняется через отдельный интерфейс в админ-панели. При добавлении задачи на импорт файла она встает в очередь. По этой очереди периодически проходится «крон» — системная утилита, которая выполняет задачи по расписанию. Крон сначала проверяет запущенные фоном задачи. Задачи, которые выполняются больше 10 минут, он считает зависшими и помечает их в очереди как ошибки. После этого крон ищет самую старую из добавленных задач и запускает её на выполнение.

Выбор магазина

Выбрали швейную машинку? Выбирайте магазин, в котором будете ее покупать.

Регион при выборе магазина выбирается независимо от местоположения пользователя в шапке сайта. При первом переходе в раздел «Где купить» выводятся магазины из региона в шапке. Но если изменить регион в самом разделе, сайт запомнит, какой регион интересует пользователя, и покажет его и для списка специализированных магазинов, и для торговых сетей, и для сервисных центров. При этом местоположение в шапке не поменяется.
лето сочи
Полина
Руководитель проекта
У нас с заказчиком был четко выстроен контур приемки работ, учитывающий опыт первого проекта. Например, верстку мы показывали с реальным контентом, где это было возможно. Это сильно упростило процесс наполнения контентом и сдачи проекта. Все пожелания к верстке мы учли заранее, и на этапе наполнения уже не приходилось отвлекаться на доработку верстки под неожиданный контент.

Также, благодаря погруженности заказчика в проект, внедрили много улучшений, которые впоследствии забрали и на проект Janome.

На самом деле, мы разрабатываем уже третий проект для этого заказчика. Кроме двух сайтов брендов швейных машин запустили сайт программы лояльности, но об этом в отдельном кейсе :)

Готовый проект