«Астрасенд» — международная Платежная Система

astrasend.ru
Международная платёжная система, созданная в России и направленная на предоставление качественного, быстрого и доступного сервиса денежных переводов.

1С-Битрикс 1С-Битрикс
Адаптивный дизайн Адаптивный
дизайн
HTML5 анимация HTML-5 анимация
Онлайн оплата Онлайн оплата
Иконографика Иконографика

Проектирование

Перед нами была поставлена цель разработать удобный и понятный для пользователей сайт международной платёжной системы с учётом брендбука и современных трендов в визуализации информации.

Задачи и таймлайн

Проектирование состояло из трех этапов: UX дизайн, UI дизайн, иконографика.

UX дизайн
2 недели
  • Анализ конкурентов
  • Прототипирование
  • Разработка поиска филиалов
UI дизайн
6 недель
  • Подбор референсов
  • Минималистичный дизайн
  • Создание стилей
Иконографика
2 недели
  • Изучение аналогов
  • Разработка вариантов
  • Стилистическое решение
UX дизайн
UI дизайн
Иконографика

Структура сайта

На этапе консультаций с клиентом была выработана простая и информативная структура сайта.

Главная
Как получить перевод
Как отправить перевод
Адреса отделений на карте
Адреса отделений списком
Партнёрам
О компании
Документы ПС
Связаться с нами
Осторожно! Мошенничество
Детальная страница
Новости
Контакты

Прототипирование

Концепции

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

1
2
3

Дизайн

В работу была принята первая концепция после внесения ряда корректировок.

1
Учтена возможность добавления
функционала онлайн-оплаты
2
Разработана инфографика
с учетом фирменных элементов.
3
Внедрена в макет интерактивная
карта из концепции 3

Сайт корректно и полностью отображается на мобильных устройствах.
Это важно, так как трафик с мобильных превышает 95%

Типографика
h0 h1 h2 h3
Астрасенд
Астрасенд
Астрасенд
Астрасенд

На сайте был использован
шрифт из брендбука
TT Astra MT, разработанный
специально для продукта
«Астрасенд».

Цветовая схема
EA4994
222222 FFFFFF
00A75C
F4FAFF

Внутренние страницы

Особенности реализации

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

1 Выбор филиала
2 Отображение списком
3 Карточка филиала

Функционалом удобно пользоваться с мобильного устройства

Отзыв клиента