Как сделать сайт-визитку так, чтобы заявки оставляли Adidas и Swarovski?

Зрелищный кейс от Rocket Business: сайт-портфолио для студии видеографии из Дубая. Делимся нашим первым опытом разработки для клиента, у которого целевая аудитория — мировые бренды.

QVAL Film — известная студия в премиум-сегменте ОАЭ. За 12 лет на рынке команда видеографов успела поработать с именитыми клиентами: Four Seasons, Chopard, Marks&Spencer, Adidas, Swarovski.

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

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

Теперь разберем каждый пункт.

В индустрии видео-продакшена продает визуал, поэтому разработка дизайна в этом проекте — ключевая задача.

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

2. Минимализм в черном цвете. Дополнять интерфейс 3D-анимацией и перегружать его интерактивом было бы неуместно. Мы сделали акцент на работах студии, оставили однотонный лаконичный фон и классические цвета шрифтов: белый и красный.

3. Логичная структура. Только полезные разделы: в каждом из них лучшие фото и видео, разбитые на категории.

4. Имиджевая история. Студия предлагает дорогой продукт без фиксированного прайса. Прежде чем заказать коммерческое видео, лейблы и бренды тщательно изучают подрядчика. Отдельные страницы на сайте позволяют увидеть бекстейдж, оценить рабочий процесс и познакомиться с командой. Целый блок посвящен техническому оборудованию студии.

Контента на сайте много: одни только видеозаписи в полном качестве весят по несколько гигабайт. «Тяжеловесным» оказалось и фото-портфолио.

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

С flat-file CMS:

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

Сначала мы подключили трансляцию всех видео с Youtube. По правилам платформы качество изображения настраивается автоматически и зависит от скорости интернета. А значит — выбирается оптимальное разрешение 720p. Этого для «вау-эффекта» явно недостаточно. Но хуже всего видео выглядели в первые секунды загрузки.

Вот такую пиксельную и заедающую картинку мы наблюдали на стандартной скорости 4G:

А такие показатели выдавал Pagespeed после проверки:

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

Стандартных способов интеграции с сайтом Vimeo не предлагает. Для этого программисты переписали код и добавили новые скрипты.

Работу проверяли по контрольному чек-листу:

Проверьте и вы — сайт доступен по ссылке.

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

Неожиданный бонус: сайт попадает в ТОП-5 выдачи по ключевым запросам на русском и английском без SEO-продвижения.

Задача для нас была непростой: «Rocket Business» знают как одно из лучших SEO-агентств в России. Но отказываться от интересного вызова не стали — программисты и дизайнеры переросли стандартные задачи и решили сделать проект для международного рынка.

Ждем вашей оценки в комментариях!