(function(m,e,t,r,i,k,a){m[i]=m[i]||function(){(m[i].a=m[i].a||[]).push(arguments)}; m[i].l=1*new Date(); for (var j = 0; j < document.scripts.length; j++) {if (document.scripts[j].src === r) { return; }} k=e.createElement(t),a=e.getElementsByTagName(t)[0],k.async=1,k.src=r,a.parentNode.insertBefore(k,a)}) (window, document, "script", "https://mc.yandex.ru/metrika/tag.js", "ym"); ym(49180180, "init", { defer: true, clickmap:true, trackLinks:true, accurateTrackBounce:true }); ym(49180180, 'hit', window.location.href);

IT изнутри: что скрыто за календарем в приложении

Что такое календарь? Всем известно его изначальное предназначение, но не каждый знает, насколько важным и сложным этот элемент может оказаться в рамках создания сайта или мобильного приложения.

С точки зрения пользователя может показаться, что он не требует большого количества ресурсов и времени для разработки. Но так ли это на самом деле?

Предлагаем разобраться!

Календари встречаются на ресурсах, связанных с арендой, путешествиями, развлечениями. Выделяют несколько основных типов:

1. Простой календарь

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

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

2. Многофункциональный

Подойдет, если задача - автоматизировать процесс бронирования так, чтобы снизить время обработки заказа.

Такой календарь позволяет пользователю заранее указать время, дату и детали бронирования, указать дополнительные опции, количество людей, узнать итоговую сумму. Оператору остается только подтвердить заказ и пожелать счастливого пути. А иногда и подтверждения не требуется.

Подобным пользуются крупные агрегаторы по типу Booking, Airbnb, Aviasales.

3. Календарь-планировщик

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

Подойдет вам, если проект связан с необходимостью планировать задачи и распределять время. Дополнительно он может отправлять уведомления, формировать отчеты и т.д. Один из самых популярных примеров — календарь от Google.

Как выбрать?

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

  • Что должен делать календарь?
  • Для чего будет использоваться?
  • Каким образом будет работать?

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

Разберем на примерах.

1. Приложение для каршеринга.

Во-первых, нужно решить, зачем здесь пригодится календарь.

Каршеринг — сервис, который предлагает на время арендовать автомобиль для собственных нужд. Добавлять в интерфейс календарь? Определенно! Причем не простой, а многофункциональный.

В него можно включить следующие возможности:

  • Отслеживание времени начала и окончания бронирования;
  • Отображение информации о владельце машины;
  • Аналитика потраченного времени и расчет стоимости: если возврат машины задерживается, система будет информировать о дополнительных списаниях
  • Интеграция данных с CRM;
  • Предварительный расчет итоговой суммы на основании выбранной даты, времени и дополнительных опций;

2. Сайт для покупки билетов

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

  • Предупреждать пользователя о количестве оставшихся свободных мест;
  • Указывать стоимость билетов по запросу;
  • Рассчитывать сумму в зависимости от количества купленных билетов;

Подобные функции, например, мы реализовали в приложении сети Киномир. Узнать подробнее о его разработке можно в кейсе на нашем сайте.

Дела программные: как создаются календари

На самом деле имеется два пути: простой и сложный.

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

Но так ли это просто? С какими сложностями можно столкнутся выбрав шаблонный вариант?

Расскажем на примере нашего проекта.

Как мы шаблоны использовали. История Trainet

Trainet – сервис для онлайн тренировок, который предполагает общение тренера и спортсмена по видео связи в процессе выполнения упражнений. А для того чтобы и тренер, и спортсмен могли вовремя прийти на занятие, в приложении предусмотрен календарь, вдохновленный одноименным сервисом Google.

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

Если берем готовое решение, то должны понимать, что жертвуем в первую очередь гибкостью. Часто изменениям поддается только внешний вид шаблона: цвета, шрифты, границы. Работая с Trаinet, пришлось столкнуться с некоторыми сложностями, которые невозможно решить, не переделывая календарь с нуля. Поэтому пришлось идти на уступки и адаптировать только то, что можно адаптировать.

Шаблон (конкретно тот, что использовали мы) не позволяет накладывать задачи, идущие в один день и в одно и то же время, друг на друга, как в Google. Иначе календарь не работает как было задумано. Например, были ситуации, когда после попыток поправить этот недочет отображалась только одна задача. Остальные оставались скрытыми. Чтобы решить эту непростую головоломку, мы решили адаптировать уже существующие опции календаря таким образом, чтобы задачи, идущие в одно время, отображались в несколько рядов.

Виктория Старикова (Frontend-разработчик Pyrobyte)

Подытожим. Выбирая шаблон, в преимуществах мы получаем:

  • Снижение стоимости разработки;
  • Уменьшение времени, необходимого для создания сервиса;
  • Уже готовый функционал;

В минусах:

  • К сожалению, постоянно придется бороться с костылями – условностями, которые уже есть в готовом шаблоне;
  • От каких-то идей придется отказываться;
  • Дизайн может не лечь на шаблон так, как было задумано изначально;
  • Проблема с совместимостью. Если у шаблона будет сложная архитектура, его интеграция с другими опциями сайта или приложения скажется на времени и стоимости разработки;

Создаем календарь с нуля. История сайта Yaves

Что делать если вам нужно более совершенное решение с большим функционалом, и шаблоны не для вас? Правильно - создавать календарь с нуля.

Именно такой подход мы реализовали в одном из наших последних проектов.

Yaves – сервис для аренды яхт, который мы создавали, вдохновляясь Booking. Оба сайта объединяет одно: процесс бронирования происходит на странице с интерактивным календарем.

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

Конечно, при таком подходе шаблон выбирать нельзя.

Когда мы делаем что-то уникальное, уже готовые решения могут только помешать реализации задумки. С Yaves это стало понятно еще на первых порах, так как заказчик регулярно докидывал нам новые идеи, которые хотел бы видеть в итоге. Эти идеи были связаны в том числе с внедрением сложных архитектур. И если в написанном с нуля календаре все конфликты удалось решить, с уже готовым шаблоном сделать это безболезненно не выйдет.

Чего мы добились, разрабатывая календарь самостоятельно?

  • Реализовали необходимые для комфортного использования сайта функции. Календарь Yaves предлагает инструменты не только для настройки времени, даты и дополнительных опций аренды, но и отображает когда яхта доступна, когда – нет;
  • Со стороны судовладельца в календаре можно посмотреть информацию о том кто, на сколько и с какими опциями арендует судно, а также статус бронирования;
  • При бронировании судовладельцу автоматически отправляются уведомления;
  • Сделали гибкую систему, которую можно будет в дальнейшем изменить, если заказчик захочет добавить новые опции или убрать старые;
  • Календарь идеально вписывается в дизайн сайта, так как изначально разрабатывался с опорой на него;
  • Оптимизировали скорость обработки информации в календаре без потерь в функционале, используя метод нормализации и денормализации данных;
  • Сделали классный рабочий вариант, который устраивает заказчика;

Подведем итоги

Выбрать шаблонное решение или разрабатывать с нуля? Точного ответа на этот вопрос нет. Все зависит от видения сайта или приложения: кто целевая аудитория, какую функцию несет календарь, как часто будет использоваться.

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

Единственное, что можно однозначно сказать наверняка – какой бы вариант вы ни выбрали, команда Pyrobyte готова помочь с разработкой. Расскажите о проекте, и мы поможем подобрать лучший вариант для его реализации.

Если у вас есть задача разработать сайт или мобильное приложение, то напишите в Телеграм, мы это обсудим: https://t.me/sashadzen

Заказать разработку сайта, веб-сервиса или мобильного приложения на нашем сайте: https://vk.cc/cuglQZ

Партнерская программа, где мы платим от 10 000 до 200 000 рублей за контакты тех, кому нужен дизайн или разработка: https://vk.cc/cuglXT

Телеграм-канал Саши Комбарова про управление агентством, проектами, людьми: https://t.me/sasha_kombarov

Телеграм-бот, который бесплатно выдает чек-листы, памятки и регламенты по управлению, маркетингу, аналитике, дизайну и разработке: https://t.me/regulations_pyro_bot

0
Комментарии
-3 комментариев
Раскрывать всегда