Star&Mlad

Лаконичный и динамичный сайт для сети
кинотеатров - простой в навигации и
удобный для бронирования и заказа
билетов.

“Star&Mlad” - крупный, инфраструктурно
развитый, современный кинотеатр,
с высоким уровнем обслуживания и
следующий технологическим трендам, за 5
лет завоевавший доверие сотен тысяч
кинозрителей.
У кинотеатра “Star&Mlad” не было собственного сайта, а расписание и система
бронирования билетов были встроены в основной сайт Сити-парка “Град”,
где располагается кинотеатр. С открытием нового кинотеатра с первым
и единственным в Воронеже залом, оснащенным системой звука Dolby Atmos,
потребовалась разработка отдельного сайта уже для сети кинотеатров.
Будучи крупной и современной организацией,
предъявляющей высокие требования как к своей
собственной работе, так и работе партнеров и подрядчиков,
компания обратилась в 5 ведущих воронежских веб-студий.
Мы хотим, чтобы новый сайт стал киллер-преимуществом. Нам
нужен сайт, который будет более продвинутым, эффективным
и креативным по сравнению со всеми существующими на
рынке.
Екатерина Никитина
marketing manager кинотеатра
Star&Mlad

Аналитика -

наша сильная сторона
Целью проведения исследования в этом проекте было выявление основных предпочтений целевой аудитории кинотеатра и проверка некоторых гипотез относительно элементов сайта.
Для проверки гипотез проекта мы составили анкету для представителей целевой аудитории и опросили порядка
240 человек.
ЦА:
социально активные молодые люди в
возрасте 18-25 лет, проживающие в
районе кинотеатров.
ПРОЕКТИРОВАНИЕ
И ДИЗАЙН
Мы составили список ключевых
моментов:
Очевидная навигация
Наглядное расписание
Удобство покупки билетов
Более 50% пользователей предпочитают
использовать мобильные устройства для покупки и
бронирования билетов.
Все разделы мобильной версии сайта мы решили разбить на
3 основных блока, навигация между которыми
осуществляется с помощью горизонтального меню в лучших
традициях мобильных приложений.
Первый раздел выводит список фильмов идущих в прокате,
второй наглядное расписание. Третий блок содержит ссылки
на остальные страницы сайта и представляет из себя
классическое меню.
Такое решение позволяет сфокусировать внимание
пользователей на главной функции сайта - продаже
и бронировании билетов.
Десктопная версия сайта имеет более
классическую структуру, но также
концентрирует внимание на ключевых разделах
с фильмами и расписанием.
Объединение расписания
двух кинотеатров стало
одной из главных задач,
решаемых на этапе
проектирования.
Продумывая структуру, мы
выбирали из следующих
вариантов:
Сайт переключается с кинотеатра на кинотеатр целиком. При этом меняется список фильмов и расписание в соответствии с кинотеатром
Каждый фильм содержит расписание сразу на все кинотеатры.
Так как между кинотеатрами всего 15 минут езды мы остановились на втором варианте.
Также мы добавили фильтры по которым можно сортировать фильмы по формату. Для большей наглядности плитки с фильмами соответсвуют по ширине продолжительности фильма.
Отталкиваясь от нового брендбука компании и соблюдая баланс между функциональностью и минималистичностью, мы разработали актуальный и чистый дизайн.
Разнообразие моделей мобильных устройств с разными характеристиками накладывают жесткие рамки. Особенно это касается юзабилити и быстродействия.
В данном проекте эти ограничения скорее помогли нам, и существенно повлияли на формирование визуального стиля.
Михаил Болдырев
Арт-директор
Чтобы обеспечить быстродействие, мы взяли за основу библиотеку React в связке с Redux, получив на выходе живой и отзывчивый интерфейс, создающий у пользователя ощущение целостности.
Нам была нужна технология, которая сможет воплотить идеи интерфейса. Мы выбрали React из-за его легковесности и скорости. В итоге, несмотря на объемность проекта, получили функциональный и одновременно быстрый интерфейс
Вадим Евдокимов
front-end developer
Переходы между страницами мы обозначили плавной анимацией, которая хорошо передает ощущение лёгкости и в целом дополняет дизайн.
2D
Театр Маяковского. Таланты и поклонники
18+
7.6
РОССИЯ
Комедия
190 мин
МОСКОВСКИЙ ПРОСПЕКТ ГРАД
09.20 120
11.00 200
15.50 250
17.20 220
19.45 320
2D 3D
Затерянный город Z
18+
7.6
РОССИЯ
Комедия
120 мин
МОСКОВСКИЙ ПРОСПЕКТ ГРАД
09.20 120
10.45 220
12.20 220
14.00 320
18.20 320
Список фильмов представляет из себя плитки с названием и основной информацией о фильме. При наведении курсора (или по тапу для мобильной версии) появляются ближайшие сеансы и выбор между кинотеатрами.
ИНТЕГРАЦИЯ
ПРОЕКТА
Перед командой back-end стояла задача — обеспечить быструю передачу и надежное хранение данных с серверов UCS-Премьеры, подготовить платформу для слаженной совместной работы RAILS- и NodeJS-серверов, и грамотно построить инфраструктуру.
В процессе разработки зародилось наше собственное API, позволяющее нажатием одной кнопки собрать всю информацию о фильмах и сеансах сразу в двух кинотеатрах, и сразу же подготовить данные в нужном виде.
Владимир Алёхин
back-end developer
Интеграция с сервисом Rambler-Касса помогает вести учет и продажу билетов, синхронизируясь с сайтом и автоматически обновляемой базой кинотеатра.
Автоматическая система отсылает смс всем, кто забронировал билет или ждет выхода любимого фильма.
Скорость работы обеспечивают высоко оптимизированные запросы к базе данных Postgresql, производительный сервер Unicorn, а так же выполняющий роли прокси-сервера nginx. Все постеры и картинки обрабатываются процессором изображений ImageMagick, который уменьшает размер файлов не влияя на качество.
404 error
За время работы над проектом профессиональный уровень команды значительно вырос. Благодаря высокой самоотдаче каждого сотрудника удалось преодолеть все трудности и выполнить бизнес-задачи клиента.
Мы постоянно искали лучшие пути упрощения пользовательского интерфейса, меняли детали и даже целые блоки. Как и в любом проекте мы с большим вниманием относились к мелочам. Сайт для сети кинотеатров “Star&Mlad” послужил трамплином для каждого члена нашей команды.
Команда
Евгений Тырнов
Дмитрий Балашов
Юлиан Тырнов
Михаил Болдырев
Владимир Алёхин
Вадим Евдокимов
технологии
Ruby on Rails
React
Redux
Node
PostgreSQL
срок
реализации
подобного проекта
3
Хотите подобный сайт?
Давайте поговорим о вашем проекте:
  • Ru
  • en
  • Ru
  • en