Создание шаблонов сайта Московского кредитного банка
Смотрим на действующий сайт, собираем на доске знания и гипотезы по проекту.
Старший дизайнер предлагает концепцию. Сайт делится на две части: контентную — справа и обложку — слева. Лицом банка становятся москвичи и сам город, а градиент от синего к красному связывает все воедино.
Принято. Начинаем отрисовку чистовых макетов — типовой страницы, разводящих и страниц основных продуктов.
Додумываем состав главной страницы и ее анимацию.
Хочется сделать еще интереснее. Пусть персонаж на переднем плане двигается и взаимодействует со зрителем. Прикидываем жизнеспособность на верстке.
Эффектно, но слишком тяжело по загрузке и трудоемко в подготовке. Пока отказываемся от идеи. Параллельно готовим для заказчика гайдлайн по фото- и видеосъемке.
Рисуем страницы отделений и банкоматов, платежей и переводов, а также пакетов услуг. Сразу думаем о мобильной версии.
Банк придерживается концепции одного продукта с настраиваемыми параметрами. Для общей страницы карты придумываем подборщик и удобную таблицу сравнения.
Собираем все в прототип, тестируем на людях, вносим корректировки и отдаем технологу.
Пока идет верстка, заказчик решает использовать вместо фотографий видео и отказаться от красно-синего фильтра. Для съемки нужно подобрать конкретные образы продуктов. Начинаем поиски.
Думаем над деталями и анимацией.
Заказчик просит предложить другой ховер на кубах второго слоя для главной страницы.
Получаем от заказчика отснятые видеоролики, переводим их в нужный формат и ставим на верстку. Окончательно отказываемся от градиента. Думаем об эффектном появлении видео при первом открытии.
Собираем шаблоны, правим баги, тестируем, вносим правки и передаем прототип заказчику.