Результат Процесс
Танец маленьких треугольников на Гарс Ритейл
Сибирикс
свежий кейс

Танец маленьких треугольников на Гарс Ритейл

Мы очень любим работать с Гарс Телеком. А показывать, какую красоту сделали вместе — ещё больше.
О Гарс Телеком вы уже знаете, если читаете наши кейсы. Напомним, что это крупный телеком-оператор, в жизни которого, кстати, недавно произошло несколько изменений. Теперь он — важная часть империи Мегафона (с самым клёвым сайтом в ней, мы считаем :). И у него появился второй сайт в нашем исполнении — Гарс Ритейл для частных клиентов.
Дизайн
Сайт, который мы делали для Гарс Телеком ранее, предлагал услуги только для корпоративных клиентов. Но всему своё время. И сейчас — время обычных потребителей.

Специально для частных клиентов Гарс Телеком мы сделали небольшой сайт, выдержанный в стиле основного. Полигональный движущийся фон, который нежно любим мы и сотрудники Гарса, перекинулся на новую страничку и заполнил собой всё пространство.
С Гарс Телекомом очень приятно работать — команда заказчика всегда открыта новым идеям и нестандартным решениям. Ритейл хотели сделать ярким и необычным, придумали идею для презентации услуг с экранов связанных устройств.

Дина
Руководитель проекта
Однако такой вариант показался заказчику слишком клишированным — в итоге мы отошли от образности и пошли по технологичному пути с использованием полигональной анимации и иконографики, в духе корпоративного сайта. Полигоны у нас везде, и на главной, и на внутренних, и даже в футере.
Заказчику очень понравился эффект, который получился на главной корпоративного сайта. На нём хотели сделать основной акцент. Я решил расширить эту идею, и так родилась цветовая кодировка экранов.

Полигональное полотно растянулось на весь экран, поэтому было важно вписать каждую услугу в один стейт. Для этого мы систематизировали и полностью перегруппировали контент, который был у Гарса.

Даниил
Дизайнер
Кроме лениво переливающихся многоугольников, Гарс корпоративный и Гарс частный объединяет шапка. Она сделана по одному типу и выполняет функцию переключателя между сайтами. На них различается минимальными деталями: например, номера телефонов разные, и у частных клиентов кнопка для обратной связи выглядит более требовательной.

В Гарсе, несмотря на серьёзную и немного чопорную сферу бизнеса, работают веселые ребята. В первый раз они дали нам немного пошалить на 404. На новом сайте места для творчества было меньше, поэтому заказчик оторвался в бодрых и неформальных текстах.
Разработка
В сайте из особенностей — уже упомянутый анимированный фон, который шевелится, переливается и мягко меняет цвета при скролле.
Главная фишка сайта — это анимация, где крутятся SVG-треугольнички. Пришлось помучиться с её отладкой под разные системы. На Safari есть проблемы производительности при отображении анимации на SVG. Из-за этих проблем пришлось именно для этого браузера анимацию строить на CANVAS , а также уменьшать FPS и количество сегментов и деталей в анимации.

Алексей
Разработчик
Чтобы пользователь, засмотревшись на это полигональное нечто, не пропустил информацию об услугах, при пролистывании каждый экран чётко фиксируется.
На десктопах сайт слайдится строго постранично. Если слайд не входит в экран — от начала он скроллится до конца, и только потом — на следующую страницу.

Ещё на десктопах вместе со скроллированием выплывают сбоку и меняются иконки.

Алексей
Разработчик
И этот сайт для частных клиентов не был бы полноценным разделом Гарса, если бы не адаптировался под любые экраны быстро и красиво. Вот так.
Готовый проект