Автор кейса
WemakefabЛоготип компании
18 Мар 2021

Брендинг и разработка сайта для инвестиционного сервиса

Заказчик
Golden Suisse, частная компания из Швейцарии.
Задача
Нам предстояло полностью переупаковать проект: разработать новый логотип, фирменные элементы, гайдлайны, предложить новую версию сайта и обновить дизайн приложения.

Golden Suisse – многофункциональное мобильное приложение от одноименнои? швеи?царскои? компании. Это единыи? центр, предоставляющии? возможность безопасного приобретения, хранения или обмена золота и серебра. Всего в несколько кликов любои? желающии? может открыть банковскии? счет и начать осуществление операции?.

До начала сотрудничества, у заказчика был продукт, но не было единого дизайн-кода. Сайт не выполнял задач по презентации продукта, имел большое количество багов и очень сложную навигацию.

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

Брендинг

Фактически, продукт компании – многофункциональный центр в кармане пользователя. Отсюда в логотипе компании появились лучи (многофункциональность) и объединяющая точка в центре, на которой сходится движение. Также в знаке легко читается буква G.

Компания работает с Англии?ским и Швеи?царским золотом, что также нашло свое отражение в логотипе. Есть прямые ассоциации с Швеи?царским крестом и флагом Великобритании.

Надежность, профессионализм и высочайшие стандарты сервиса – базовые ценности компании, которые мы передали с помощью визуальных образов в аи?дентике компании.

Строгость линии?, минимализм и сдержанная цветовая гамма подчеркивает премиальность и качество предлагаемого продукта.

Приложение

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

Новый интерфейс должен был не только улучшить пользовательский опыт с существующим функционалом приложения, но и расширить его, внедрив ряд новых компонентов.

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

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

Дизайн сайта

Обновленная дизайн-концепция должна не только подчеркнуть премиальность продукта, но и предоставить исчерпывающую информацию о нем в доступном формате.

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

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

В данном проекте мы были серьезно ограничены в контенте, поэтому вся дизайн-концепция базируется на продуманной композиции и внимательной работе с типографикой.

Базовые анимации добавляют сайту дорогого лоска и облегчают навигацию, расставляя необходимые акценты.

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

База знаний

Отдельная сущность проекта – база знаний, к которой обращаются пользователи прямиком из мобильного приложения.

Главным требованием к ней являлась организация удобного поиска нужного материала и понятная структура страницы вне зависимости от содержащихся на ней элементов: просто текста, графики, пошаговой инструкции, видео или PDF-документов.

При этом работы по заполнению базы знаний оставались в зоне ответственности заказчика – на этой стадии большое количество проектов начинают испытывать проблемы. Очевидно, что человек, не обладающий знаниями в области веб-дизайна и простейшей верстки, рискует сильно ухудшить внешний вид сайта при заполнении его контентом.

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

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

Разработка

Frontend-разработка велась на базе фреймворка Vue.js, который позволяет наиболее полно реализовать заложенные в проект анимации и плавные переходы между страницами. Также в рамках проекта мы использовали Nuxt.js для оптимизации процесса разработки и упрощения внутренней архитектуры проекта.

Система управления сайтом разрабатывалась нами с нуля на PHP с использованием фреймворка Laravel. Это позволило нам уменьшить время разработки, применяя стандартные решения, и создать более гибкую систему взаимодействия между административной и клиентской частями сайта, заложив возможность дальнейшего масштабирования проекта.

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

В рамках проекта мы реализовали интеграцию со сторонними и внутренними системами заказчика, работу которых обеспечивала другая команда: система личных кабинетов, e-mail рассылка, автоматическая актуализация прайс-листов.

Несмотря на сложность в коммуникации, обусловленную языковым барьером, мы легко интегрировались в in-house команду заказчика и успешно выполняли задачи, находящиеся в нашей зоне ответственности.

Результат

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

Проект был отмечен вниманием коллег и профессионального сообщества, получив ряд престижных наград: лучший пользовательский интерфейс Behance, включение в галерею лучших работ профессионального сообщества AIGA. Завоевали сразу 4 награды от Awwwards: Site of the Day, Honorable Mention, Developer Site, Mobile Excellence.

В настоящее время, заслужив глубокую лояльность клиента, мы продолжаем сотрудничество и помогаем реализовать идеи проекта в веб-плоскости.


Перейти на сайт

В карточку агентства
Пользуйтесь реальным опытом в IT и следите за успехами потенциальных подрядчиков и конкурентов

Кейсы по этой теме

Не трать деньги на ошибки —
используй чужой опыт

Разработка и продвижение сайтов, SEO, SMM, брендинг и многое другое – вооружайтесь свежими IT — решениями из рассылки кейсов Рейтинга Рунета

Подписаться на кейсы