Разработка сайта для фотостудии

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

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

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

Далее была немного изменена структура главной секции и получен следующий результат

Собрали сетку фотографий из горизонтальных и вертикальных изображений. В настройки на WordPress вынесли возможность настройки позиционирования изображения в каждом отдельно взятом квадрате. Если не вдаваться в подробности — то теперь каждая фотография обрезается для сетки индивидуально, теперь нет возможности что кому-то на фотографии отрежет половину руки и миниатюра будет смотреться крипово. Всё чётко и красиво. Как мы любим.

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

Такое разделение на направления не показалось нам очевидным и было решено его доработать. Получилась следующая версия

После завершения работы над внешним видом воссоздали всё имеющееся в коде с использованием CSS Grid. Сделали анимации, постепенную загрузку картинок по мере их появления на экране пользователя, сделали мобильную версию.

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

Вот цифры из синтетического теста Google Page Speed

Десктоп:

Мобильные:

Понравился проект?

Хотите такой же?

Contact us!