Угадай что… правильно, куки!
Настройки куки
Обязательные куки — обязательны (вау). Они нужны чтобы сайт и формы обратной связи работали правильно.
Куки аналитики и плееров можно выключить.
Куки аналитики и плееров можно выключить.
Разработка лендинга и административной панели для AkzoNobel
Название проекта
AkzoNobel является одной из ведущих международных компаний по производству красок и покрытий, обеспечивающая различные отрасли промышленности и потребителей во всем мире надежными и инновационными продуктами. Компания, со штаб-квартирой в Амстердаме (Нидерланды), ведет свою деятельность в более чем 150 странах.
клиент
Описание проекта
Разработать лендинг Мастерских цвета и отдельную страницу магазина. Спроектировать административную панель с гибким управлением акциями.
задача
Первым этапом мы провели интервью с клиентом — обсудили проблемы текущего сайта, цели и задачи нового. Затем, собрав данные по сайту его аудитории и конкурентах, приступили к разработке информационной архитектуры. Она разделена на две части: лендинг и страницу магазина.
Предпроектная работа
анализ
Следующим этапом мы разработали прототипы системы. На этом этапе важно было уделить внимание проработке административной панели.
Она делится на главную панель для клиента и панель для дистрибьютора. Главная панель предназначения для сотрудников AkzoNobel.
В ней можно редактировать данные администраторов, управлять акциями и Мастерскими цвета.
Она делится на главную панель для клиента и панель для дистрибьютора. Главная панель предназначения для сотрудников AkzoNobel.
В ней можно редактировать данные администраторов, управлять акциями и Мастерскими цвета.
Проектирование
разработка логики проекта
После проектирования мы начали разработку дизайна — собрали мудборд с идеями, шрифтами и цветами.
В мудборде клиент выбрал основное направление — брутализм, а также яркие приемы: насыщенные цвета и геометрию. Объединяем всё вместе с фирменным стилем и начинаем работу над концепцией.
В мудборде клиент выбрал основное направление — брутализм, а также яркие приемы: насыщенные цвета и геометрию. Объединяем всё вместе с фирменным стилем и начинаем работу над концепцией.
референсы
Дизайн
В концепции объединили брутализм и фирменный стиль клиента — получился дизайн с акцентом на геометрические гротески и таблицы в сочетании с фирменными цветами Dulux.
Строгую геометрию разбавили ярким акцентом на фигуре с волной — она рифмуется с элементом в логотипе и объединяет сайт с брендом.
Строгую геометрию разбавили ярким акцентом на фигуре с волной — она рифмуется с элементом в логотипе и объединяет сайт с брендом.
Концепция главной страницы
Лендинг включает в себя всю необходимую информацию — список акций, информацию о мастерских цвета и контакты с адресами магазинов.
Благодаря разным пропорциям фотографий и карточек страница выглядит динамично.
Особое внимание уделили блоку с адресами — большие карточки для каждого адреса и табличное представление помогает быстро и легко считывать информацию.
Благодаря разным пропорциям фотографий и карточек страница выглядит динамично.
Особое внимание уделили блоку с адресами — большие карточки для каждого адреса и табличное представление помогает быстро и легко считывать информацию.
список магазинов
Дизайн блока с адресами и картой
Карточки акции имеют три формата: 3:4, 4:4, 16:9, что позволяет клиенту не редактировать дополнительно размеры фотографий перед публикацией. Карточки ведут на страницу с подробной информацией об акции. Страница акции собирается из шаблонных блоков с разными видами контента — фотографии, текста, видео.
карточки акций
Страница магазина Мастерской цвета собрана из разных блоков, которые используются на шаблонной странице. К ним добавляем блоки с галереей и контакты.
страница магазина
Спроектировали и протестировали адаптивы для основных разрешений — ноутбук, планшет, смартфон.
планшеты и мобильная версия
Адаптив
Для самостоятельного управления Клиентом платформой лэндингов мы спроектировали и разработали административную панель сервиса.
Доступ ко всем настройкам есть только у главного администратора платформы. Он может добавлять, редактировать и удалять дистрибьюторов, чтобы уже они могли управлять страницей своих магазинов.
Доступ ко всем настройкам есть только у главного администратора платформы. Он может добавлять, редактировать и удалять дистрибьюторов, чтобы уже они могли управлять страницей своих магазинов.
Разработка административной панели
Также главный администратор может создавать и управлять отображением обязательных акций бренда на страницах дистрибьюторов.
Чтобы упростить наполнение контентом новых страниц, мы разработали шаблон, состоящий из базовых предзаполненных блоков. Таким образом при заведении новой страницы лэндинга о магазинах бренда, она публикуется сразу с контентом. И дальше при необходимости дистрибьютор может через админ. панель самостоятельно добавлять, менять или удалять контент.
В настоящее время PHP используют около 40 млн. сайтов. Версия 7.4 делает код более удобным, читабельным и простым в поддержке.
Для разработки использовали распространенное решение для админок (laravel 8 + vuejs). Обновляется и поддерживается большим количеством специалистов и команд разработчиков, что упрощает поддержку сайта и делает работу с проектом более предсказуемой.
Для разработки использовали распространенное решение для админок (laravel 8 + vuejs). Обновляется и поддерживается большим количеством специалистов и команд разработчиков, что упрощает поддержку сайта и делает работу с проектом более предсказуемой.
Стек технологий
Сделали проектирование, дизайн и разработку сайта и административной панели. Ускорили процесс благодаря тому, что параллельно вели работы и над административной частью, и над дизайном основного сайта.
Сайт и админка — запущены, клиент добавляет туда дистрибьюторов, акции и адреса магазинов самостоятельно, без участия разработчиков.
В результате получился качественный продукт с проработанным интерфейсом. Платформу можно продолжать развивать, добавляя возможности более тонких настроек сайта, публикуя новый контент и подключая новых дистрибьюторов бренда.
Сайт и админка — запущены, клиент добавляет туда дистрибьюторов, акции и адреса магазинов самостоятельно, без участия разработчиков.
В результате получился качественный продукт с проработанным интерфейсом. Платформу можно продолжать развивать, добавляя возможности более тонких настроек сайта, публикуя новый контент и подключая новых дистрибьюторов бренда.
