Раздел безопасности Терминал Интерфейс

Создание раздела безопасности на сайте «Киви»

Процесс

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

Решаем исправить ситуацию и рассказать о безопасности. Прикидываем порядок и содержание блоков на странице, думаем над концепцией.

Приступаем к идеям.

Подключаем второго дизайнера.

Дизайнер: Может, неудачливый хакер расскажет, как ему не удалось взломать систему?

Или истории простых людей?

Или деньги, которые превращаются в криптовалюту?

Арт-директор: Не то.

Собираем воедино идеи электронных денег, хакерства и систем безопасности.

Ищем мотивы в фильмах о будущем.

Начинаем с прожженного сайфая.

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

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

Готовим две версии.

Склеиваем «светлую» и «темную» части и презентуем концепцию.

Открываем редактор видеоэффектов и начинаем погружение в волшебный и захватывающий мир.

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

Предпринимаем первые попытки реализовать пролет сквозь логотип «Киви».

Дорабатываем наиболее удачный вариант и примеряем на сайт.

Получаем комментарии от арт-директора.

Параллельно отрабатываем второй эффект — сердце системы безопасности.

Эффект — ОК, теперь пробуем разные цвета.

Временами все красиво выходит из-под контроля.

И у технолога тоже.

Вносим правки, выбираем формат, рендерим.

Рисуем стилистические элементы.

Разбираем ситуации и отрисовываем интерфейсы.

Решаем вопросы со сглаживанием контурных иллюстраций.

Пробуем добавить фишинговые СМС.

Отказываемся от искажений в пользу улучшения читаемости.

Работаем с формой чашки.

Идем в кафе, рисуем с натуры и добавляем ложечку — для широких экранов.

Думаем над пользовательскими сценариями.

Работаем со стилем иконок.

Думаем над концепцией первой фотографии.

Решаем не выдавать секрет и сделать аккуратную руку с телефоном.

Вносим правки.

Прорабатываем интерактивные элементы.

Правим мелочи верстки.

Правим тексты.

Разбираем еще пару мелочей и загружаем сайт на сервер.

Заказать дизайн...