Архитектурный план и UX/UI стратегия для экосистемы Newhaj.com: Глубокий анализ глобальных платформ и проектирование унифицированного Хаба
1. Стратегическое введение: Концепция единого Хаба
В современном цифровом ландшафте туристической индустрии наблюдается четкая дихотомия: с одной стороны существуют глобальные технологические гиганты (OTA), такие как Booking.com и Expedia, которые довели до совершенства механизмы конверсии и пользовательского опыта в сфере досугового туризма. С другой стороны, функционируют специализированные платформы религиозного туризма, такие как Nusuk и Umrahme, которые фокусируются на соблюдении нормативных требований Саудовской Аравии и специфике паломничества. Задача создания newhaj.com заключается не просто в агрегации отельного инвентаря, а в синтезе этих двух миров в единый «Хаб». Этот Хаб должен обладать коммерческой гибкостью и UX-совершенством глобальных OTA, одновременно интегрируя жесткую логистику и духовные потребности паломников Хаджа и Умры.
Разработка «Специального Оригинального Шаблона» (Special Original Template) для newhaj.com требует фундаментального переосмысления атомарных единиц интерфейса — карточки отеля и страницы бронирования. В отличие от стандартного туризма, где «вид из окна» — это приятный бонус, в Мекке «вид на Каабу» — это духовная привилегия, за которую пользователи готовы платить премиальную цену. Логика построения страниц должна учитывать, что для B2C-пользователя (паломника) это путешествие всей жизни, требующее эмоциональной поддержки и ясности, в то время как для B2B-пользователя (агента) это высокочастотная транзакционная среда, требующая скорости, кредитных лимитов и инструментов массового управления.1
В данном отчете представлен исчерпывающий анализ лучших мировых практик, деконструкция интерфейсов ведущих игроков рынка и детальное техническое задание на проектирование уникальной дизайн-системы для newhaj.com. Мы рассмотрим, как трансформировать стандартные паттерны e-commerce в специализированный инструмент, способный обрабатывать миллионы запросов в пиковые сезоны Рамадана и Хаджа, обеспечивая при этом бесшовное переключение между режимами B2B и B2C.
2. Глобальный бенчмаркинг: Деконструкция логики лидеров рынка
Чтобы спроектировать лучший в классе продукт, необходимо детально проанализировать архитектурные решения текущих лидеров рынка. Каждый из них использует специфические психологические триггеры и UI-паттерны, которые формируют ожидания пользователей.
2.1 Booking.com: Психология срочности и социального доказательства
Booking.com является эталоном конверсионного дизайна. Их страница бронирования построена на принципе «контролируемой тревожности» и социального подтверждения.
- Архитектура давления: Платформа агрессивно использует динамические текстовые инъекции: «Только 1 номер остался на нашем сайте!», «15 человек просматривают этот отель прямо сейчас». Для newhaj.com этот паттерн чрезвычайно актуален, так как инвентарь в Мекке в период Рамадана действительно конечен. Однако, в контексте религиозного туризма, использование искусственного дефицита может быть воспринято как неэтичное. Мы предлагаем трансформировать этот паттерн в «Прозрачную Срочность» (Transparent Urgency), отображая реальные квоты виз или доступность слотов в Рауду.3
- Гранулярность рейтингов: Booking.com не ограничивается общей оценкой. Они детализируют рейтинг по критериям: чистота, комфорт, расположение, персонал. Исследования показывают, что для отелей Мекки «персонал» и «чистота» являются доминирующими предикторами удовлетворенности, в то время как наличие завтрака имеет меньшее значение.3 Шаблон newhaj.com должен визуально выделять именно эти параметры, возможно, используя специальные иконки для «Близости к Хараму» как отдельной метрики рейтинга.
2.2 Agoda: Визуальная плотность и «Стекирование» скидок
Дизайн Agoda характеризуется высокой информационной плотностью и акцентом на «выгоду». Это особенно резонирует с азиатскими рынками (Индонезия, Малайзия, Пакистан), которые составляют значительную часть потока паломников.
- Логика «Mix and Save»: Алгоритмы Agoda часто предлагают разбить проживание на два типа номеров, если один тип недоступен на весь срок. Это критически важно для Хаджа, где доступность фрагментирована. Шаблон newhaj.com должен поддерживать «Сплит-бронирование» на уровне ядра.6
- Система бейджей: Agoda использует яркие визуальные маркеры («Must Go», «Value Deal»). Для newhaj.com необходимо разработать собственную систему бейджей: «Сертифицировано Nusuk», «Прямой доступ в туннель», «Бесплатный шаттл». Эти бейджи должны быть интегрированы непосредственно в карточку отеля, а не просто висеть поверх фото.7
2.3 Trip.com: Экосистемность и Минимализм
Trip.com демонстрирует, как интегрировать отели с транспортом. Их интерфейс отличается чистотой и использованием иконографики вместо текста.
- Синхронизация маршрута: Интерфейс Trip.com бесшовно соединяет время прилета с временем заселения. Для newhaj.com это означает необходимость интеграции времени прибытия в Джидду/Медину для автоматического предложения трансфера. Если паломник прибывает в 2 часа ночи, система должна предупредить отель о позднем заезде или предложить раннее заселение.8
- Иконография удобств: Вместо списков текста используются стандартизированные иконки. Это критично для мультиязычной платформы newhaj.com, обслуживающей паломников со всего мира.
2.4 Nusuk и Umrahme: Регуляторная специфика
- Nusuk: Официальная платформа Саудовской Аравии задает стандарты категоризации пакетов («Luxury», «Premium», «Standard»). newhaj.com должен зеркалировать эту категоризацию, чтобы обеспечить пользователю чувство официального соответствия и безопасности.10
- Umrahme: Сильный B2B игрок. Их дашборд фокусируется на управлении «Кошельком» и «Групповыми бронированиями». Это подтверждает гипотезу, что B2B шаблон для newhaj.com должен быть табличным инструментом управления финансами, а не витриной.1
3. Анатомия «Специальной Оригинальной Карточки» Отеля (The Newhaj Card)
Карточка отеля в списке выдачи — это «атомарная единица» интерфейса. Именно здесь принимается решение о переходе к бронированию. Стандартные карточки OTA (фото, цена, звезды) недостаточны для специфики Мекки и Медины. Мы предлагаем разработать гибридную карточку нового поколения.
3.1 Структурный анализ и недостатки конкурентов
| Элемент | Booking.com | Agoda | Expedia | Предлагаемое решение для Newhaj.com |
| Визуал | Одиночное фото/слайдер | Карусель с бейджами | Крупное статичное фото | Интерактивный слайдер с переключателем «Вид на Каабу» / «Интерьер» |
| Локация | «0.5 км от центра» | Название района | Ссылка на карту | «7 мин пешком до Ворот Короля Фахда» + Топография (Ровная дорога/Холм) |
| Цена | Итоговая или за ночь | За ночь (зачеркнутая) | Итого + сборы | Двойной вид: Цена паломника (B2C) / Нетто + Маржа (B2B) |
| Вместимость | Иконки людей | Текст «2 взрослых» | Текст | Визуализатор кроватей (4 x Single Beds icon) для номеров Quad/Quint |
| Статус | «Осталось 2 номера» | «Высокий спрос» | «Популярно» | «Виза доступна» (Интеграция с Nusuk) + «Шаттл 24/7» |
3.2 Детальная спецификация карточки Newhaj
Предлагаемый шаблон карточки должен быть модульным и адаптивным.
3.2.1 Визуальный Контейнер (Левая часть / Верх на мобильных)
В отличие от стандартных отелей, где вид вторичен, в Мекке вид на Харам является ключевым продуктом.
- Переключатель «Holy View»: Непосредственно на тамбнейле (миниатюре) карточки должна быть реализована кнопка-переключатель или вкладки: «Номер» и «Вид». Это позволяет пользователю мгновенно оценить духовную ценность отеля без перехода на детальную страницу.12
- Индикатор 360°: При наличии панорамного контента, поверх фото должен накладываться гироскопический значок, приглашающий к виртуальному туру.
- Бейджи Соответствия: В левом верхнем углу фото — бейдж «Nusuk Verified» (зеленый щит), гарантирующий, что отель лицензирован для выдачи виз. В правом нижнем — иконка «Шаттл», если отель удален, но предоставляет транспорт.
3.2.2 Информационный Контейнер (Центральная часть)
Здесь решается проблема геопространственной неопределенности.
- Умная Геолокация: Вместо абстрактного «Центр города», алгоритм должен рассчитывать расстояние до ближайших открытых ворот Харама.
- Пример: «450м до Ворот №79 (Короля Фахда)».
- Контекст: Добавление иконки «Туннель» или «Холм». Многие отели в районе Кудай или Азизия выглядят близко на карте, но требуют прохода через туннели или подъема в гору, что критично для пожилых паломников.13
- Конфигурация Кроватей: В Умре часто бронируют номера Quad (4 человека) или Quintuple (5 человек). Стандартные иконки «человечков» вводят в заблуждение. Карточка должна отображать иконки кроватей:, чтобы пользователь понимал, что это полноценные кровати, а не раскладушки.
3.2.3 Контейнер Действия и Цены (Правая часть)
Этот блок динамически меняется в зависимости от типа пользователя (B2B/B2C).
- B2C Режим: Отображает полную стоимость с налогами (VAT 15% + Муниципальный налог). Кнопка «Выбрать номер».
- B2B Режим: Отображает структуру цены: + [Agent Markup] =. Кнопка действия раздваивается: «Мгновенное бронирование» (списание с кошелька) или «Поставить на Холд» (удержание брони на 24 часа без оплаты).1
4. Архитектура Страницы Бронирования (PDP — Product Detail Page)
Страница самого отеля должна быть не просто витриной, а инструментом планирования паломничества. Шаблон должен объединять эмоциональный контент с сухой логистикой.
4.1 «Духовная» Шапка (Spiritual Header)
Стандартная «галерея + карта» заменяется на Духовный Навигатор.
- Виджет Qibla: На карте отеля динамически отображается линия Киблы и направление к Каабе.
- Аудио-трансляция: Если отель предоставляет прямую аудио-трансляцию молитв из Харама в номера (что часто бывает в отелях Абрадж аль-Бейт), это должно быть вынесено в шапку как премиальная функция.16
4.2 Модуль выбора номеров с логикой «Махрам» и Групп
Выбор номеров для Умры сложнее, чем для отпуска. Часто едут большие семьи или раздельные группы мужчин и женщин.
- Группировка: Интерфейс должен позволять выбирать несколько номеров одновременно с разной конфигурацией (например, 1 Double для родителей + 1 Quad для детей).
- Секция «Ramadan Packages»: Если даты бронирования попадают на Рамадан, таблица выбора номеров должна автоматически переключаться на пакетный режим (например, обязательное бронирование «Full Ramadan» или «Last 10 Days»), так как многие отели не продают отдельные ночи в этот период.
4.3 Вкладка интеграции с Nusuk
На странице должна быть выделенная вкладка «Визовые требования».
- Здесь пользователь видит, генерирует ли этот отель BRN (Booking Reference Number), необходимый для приложения Nusuk.
- Интерактивный чеклист: «Забронируйте этот отель -> Получите BRN -> Введите в Nusuk App -> Получите Визу».17
5. Разделение логики: Экосистема B2B против B2C
Хотя база данных отелей едина, newhaj.com должен функционировать как две разные платформы, рендерящиеся из одного ядра.
5.1 B2C Интерфейс: «Путь Паломника»
- Философия: Вдохновение, простота, доверие.
- Поиск: Интуитивный, с акцентом на даты и количество человек.
- Результаты: Крупные карточки, акцент на фото и отзывы.
- Чекаут: Упрощенный. Шаг 1: Данные гостя (с возможностью OCR сканирования паспорта). Шаг 2: Доп. услуги (Зиярат, Трансфер). Шаг 3: Оплата (Apple Pay, Credit Card, Mada).
- Личный кабинет: Фокус на «Мои поездки», «Статус визы», «История молитв» (геймификация).
5.2 B2B Интерфейс: «Командный Центр Агента»
Агенты (тураператоры) работают с большими объемами данных и финансовыми рисками. Их интерфейс должен быть утилитарным.
- Философия: Эффективность, контроль маржи, скорость.
- Дашборд: При входе агент видит не красивые картинки, а финансовую сводку: «Баланс Кошелька», «Доступный Кредит», «Сгорающие Холды», «Активные Заявки».
- Поиск по кодам: Агенты часто знают отели по кодам или названиям. Поиск должен поддерживать ввод «SWISS» для мгновенного перехода к Swissotel Makkah, минуя общую выдачу.
- Режим «Data Grid»: В результатах поиска вместо карточек отображается таблица (как в Excel).
- Колонки: Отель | Категория | Доступность (кол-во) | Net Rate | Tax | Total | Действие.
- Это позволяет агенту сравнить цены 50 отелей за 10 секунд.19
- Управление Суб-агентами: Мастер-агент должен иметь функционал создания учетных записей для своих сотрудников или субагентов с настройкой прав доступа и лимитов наценки (Markup Management).21
- White-Label Ваучеры: Возможность скачать подтверждение бронирования без логотипа newhaj.com, но с логотипом агентства, для выдачи клиенту.23
5.3 Сравнительная матрица функционала
| Функция | B2C (Паломник) | B2B (Агент) |
| Поиск | Визуальный, по датам | Массовый, по кодам PNR, мульти-сити |
| Отображение цены | Финальная розничная (с налогами) | Нетто + Настройка Маржи + Комиссия |
| Тип оплаты | Немедленная (Карта) | Списание с кошелька / Кредитная линия / Инвойс |
| Функция «Hold» | Редко / Короткий срок | Стандарт (24-48 часов удержания без оплаты) |
| Инвентарь | «Доступно» / «Распродано» | Точное число («15 номеров свободной аллотмента») |
| Поддержка | Чат-бот / FAQ | Выделенный аккаунт-менеджер / Тикет-система |
6. Техническая архитектура и Бэкенд-логика
Для реализации «Оригинального Шаблона» требуется мощный технологический стек, способный обрабатывать сложную бизнес-логику.
6.1 Стратегия Кеширования Дистанций (Geo-Spatial Caching)
- Проблема: Использование Google Distance Matrix API для расчета пешеходного маршрута для каждого запроса пользователя экономически неэффективно и медленно.24
- Решение: Построение собственного графа «Отель -> Ворота Харама».
- Мы заранее рассчитываем и кешируем пешеходные дистанции от каждого из ~1000 отелей Мекки до 5 ключевых ворот Харама.
- При поиске данные берутся из локальной базы данных (Redis), обеспечивая мгновенную отдачу и нулевые затраты на API.
- Google API используется только для динамических маршрутов трансфера (учитывая пробки).
6.2 Динамическое Ценообразование и Календарь Хиджры
- Двойной Календарь: Система должна нативно поддерживать два календаря — Григорианский и Хиджру. Сезоны (Рамадан, Хадж) определяются по лунному календарю. База данных должна иметь маппинг дат, чтобы при поиске «Рамадан 2026» система автоматически подставляла корректные григорианские даты.26
- Yield Management (Управление Доходностью): Для B2B необходим модуль управления аллотментами (блоками мест). Если агент выкупил блок из 50 номеров, система должна отслеживать их утилизацию и автоматически возвращать непроданные номера в общую продажу (Release Period) за заданное количество дней до заезда.28
6.3 Интеграция с Nusuk API
Платформа должна поддерживать двусторонний обмен данными с Nusuk.
- Валидация: При бронировании отеля, система отправляет запрос в Nusuk для проверки валидности паспортных данных (для B2B) или генерации кода бронирования.
- Синхронизация слотов: В идеале, после бронирования отеля в Медине, пользователю предлагается интерфейс для проверки доступности слотов в Рауду на даты проживания.17
7. Хадж и Умра: Специфические сценарии и их отражение в UI
Дизайн должен предвосхищать уникальные потребности паломников, которые отсутствуют в обычном туризме.
7.1 Логика «Last 10 Days of Ramadan»
Это пиковый период с экстремальным спросом.
- UI Решение: Календарь должен визуально выделять этот период (например, золотой обводкой).
- Пакетная продажа: В этот период многие отели продают только полный пакет на 10 дней. Шаблон должен уметь блокировать выбор отдельных дат (MinStay restriction) и предлагать «Полный пакет» с объяснением причины.30
7.2 Транспорт и Зиярат (Экскурсии)
Паломничество — это мульти-модальное путешествие (Мекка -> Медина -> Джидда).
- Кросс-селлинг: На странице подтверждения бронирования отеля должен появляться модуль «Haramain Train Booking» (бронирование скоростного поезда). Интеграция расписания поезда с временем чек-аута — это высокий уровень UX.
- Зиярат-пакеты: Возможность добавить групповую экскурсию по святым местам. В B2B интерфейсе это должно быть опцией «Bulk Add» (добавить экскурсию для всей группы из 50 человек одним кликом).31
7.3 Доступность для маломобильных граждан
Многие паломники — пожилые люди.
- Фильтр «Без холмов»: Критически важный фильтр для Мекки.
- Индикация «Wheelchair Access»: Четкое обозначение, до какого уровня отель доступен на коляске (есть ли пандусы к лобби, есть ли шаттлы с подъемниками).13
8. Визуальный стиль и Тренды 2026
Дизайн newhaj.com должен быть современным, но уважительным к традиции.
8.1 Эстетика «Neo-Islamic Minimalism»
- Цветовая палитра: Использование глубоких оттенков зеленого (исламская традиция), золотого (премиальность) и белого (чистота Ихрама). Избегание «кричащих» красных цветов, характерных для дискаунтеров, в пользу спокойных тонов.
- Типографика: Использование современных шрифтов с поддержкой арабской вязи (например, Google Noto Sans Arabic), обеспечивающих идеальную читаемость как в LTR (Left-to-Right), так и в RTL (Right-to-Left) интерфейсах. Поддержка зеркалирования интерфейса для арабской версии обязательна.
8.2 Мобильность (Mobile First)
- PWA (Progressive Web App): Паломники в роуминге часто имеют плохой интернет. PWA позволяет кешировать ваучеры и карты отелей для офлайн-доступа.
- Упрощенный интерфейс в приложении: В режиме «On Trip» (когда поездка началась) приложение должно скрывать цены и поиск, и показывать только: «Мой Отель», «Как добраться до Харама», «Время молитвы», «Номер гида».
9. План реализации и Рекомендации
Для успешного запуска newhaj.com рекомендуется поэтапная стратегия:
- Фаза 1: Ядро B2B (The Engine). Запуск портала для агентов. Реализация «Табличного поиска», управления кошельком и аллотментами. Это обеспечит начальный объем продаж и денежный поток.
- Фаза 2: B2C Витрина (The Soul). Развертывание «Специального Оригинального Шаблона» для конечных пользователей с фокусом на визуализацию, виджеты Киблы и интеграцию с Nusuk.
- Фаза 3: Экосистема. Подключение Ж/Д билетов, Визового процессинга и маркетплейса Зиярат-туров.
Итоговая рекомендация по Шаблону:
Создайте Полиморфный React-компонент для карточки отеля.
- Codebase: Единый репозиторий.
- State: В зависимости от роли пользователя (Role: Agent или Role: Pilgrim) компонент перестраивает свою сетку, скрывает/показывает маржинальность и меняет призывы к действию (CTA). Это обеспечит единую поддержку кода при радикально разном пользовательском опыте, удовлетворяя потребность в «общем шаблоне» с разделением логики.
Этот подход позволит newhaj.com стать не просто очередным сайтом бронирования, а технологическим стандартом в индустрии Хаджа и Умры.
Детальный отчет:
Глубокое погружение в UX/UI и Функциональную Архитектуру
Глава 1. Анализ рынка и деконструкция конкурентов
В этой главе мы проводим «вскрытие» интерфейсов ведущих мировых и региональных платформ, чтобы выделить лучшие практики для newhaj.com.
1.1 Booking.com: Мастерство конверсии
Booking.com использует принцип «Persuasive Design» (Убеждающий дизайн).
- Карточка отеля:
- Заголовок: Название отеля + Звезды + Тип (Отель, Апартаменты).
- Фото: Слайдер с возможностью пролистывания без перехода на страницу.
- Особенности: «Завтрак включен», «Бесплатная отмена». Эти теги выделены зеленым цветом, ассоциирующимся с разрешением/безопасностью.
- Цена: Показывается цена за весь период, что часто пугает пользователя.
- Урок для Newhaj: Мы должны использовать теги «Бесплатная отмена» (Free Cancellation), так как планы паломников часто меняются из-за визовых проблем. Однако цену лучше показывать «За ночь» с возможностью переключения на «За весь период», чтобы не шокировать пользователя высокими ценами в сезон Хаджа.
1.2 Agoda: Азиатский подход
- Карточка отеля:
- Визуал: Очень перегружен бейджами. «VIP», «GoLocal», «Hygiene Plus».
- Цена: Часто показывает цену до налогов, что создает иллюзию дешевизны.
- Урок для Newhaj: Паломники из Азии привыкли к такому интерфейсу. Мы можем внедрить режим «Deals View» для B2C, где акцент делается на скидках и перечеркнутых ценах. Важно: для Саудовской Аравии цены должны быть прозрачными (с учетом налогов), чтобы соответствовать местным законам о защите прав потребителей.
1.3 Expedia: Корпоративная надежность
- Partner Central: Expedia предоставляет отельерам мощный инструмент для управления контентом.
- Content Score: Отели получают баллы за полноту описания.
- Урок для Newhaj: Нам нужен аналогичный Extranet для отельеров Мекки. Если отель не загрузил фото молитвенной комнаты или не указал расстояние до женского входа в Харам, его «Content Score» падает, и он опускается в выдаче. Это заставит отельеров предоставлять качественные данные.
1.4 Nusuk и Umrahme: Специфика ниши
- Nusuk:
- Логика: Сначала виза/пакет, потом отель.
- Урок: Мы не можем полностью копировать этот поток, так как newhaj.com может использоваться теми, у кого уже есть виза. Наш поток должен быть гибким: «Есть виза» -> Бронируй отель. «Нет визы» -> Бронируй пакет с визой.
- Umrahme (B2B):
- Логика: Поиск по PNR, управление группами.
- Урок: Критически важна функция «Download Excel». Агенты хотят выгрузить список из 20 подходящих отелей в Excel, чтобы отправить своему клиенту на согласование. В B2B интерфейсе newhaj.com кнопка «Экспорт в PDF/Excel» должна быть на видном месте.1
Глава 2. Проектирование «Оригинального Шаблона» (B2C Focus)
Здесь мы детально описываем UX/UI решения для конечного пользователя.
2.1 Карточка отеля: Визуальная иерархия
Карточка должна отвечать на три главных вопроса паломника:
- Как далеко от Харама? (Духовная логистика).
- Вижу ли я Каабу? (Эмоциональный опыт).
- Подходит ли это для моей семьи? (Комфорт).
Макет Карточки (Wireframe Description):
- Верхняя полоса (Image Area):
- Слайдер фото (формат 16:9).
- В правом нижнем углу фото: Иконка «360°» (если есть тур).
- В левом верхнем углу: Бейджи (например, «Jabal Omar Area» — престижный район).
- Средняя полоса (Info Area):
- Заголовок: Жирный шрифт, высокий контраст.
- Рейтинг: Не просто цифра «8.5», а разбивка: «8.5 (Локация: 9.0)». Локация выделена.
- Расстояние: Интерактивная строка. При наведении мыши всплывает мини-карта с маршрутом. Текст: «500м (7 мин пешком)».
- Нижняя полоса (Action Area):
- Цена: Крупно «SAR 500». Мелко под ней «Включая налоги».
- CTA (Call to Action): Кнопка «Посмотреть номера». Цвет: Золотой (Gold/Sand), ассоциирующийся с премиальностью и песками Аравии.
2.2 Страница Отеля (Booking Page): Глубокая детализация
Страница должна работать как лендинг.
Секция «Расположение и Духовность»:
Вместо стандартной карты Google Maps, мы внедряем кастомную карту на базе Mapbox.
- Слои карты:
- Слой «Ворота»: Показывает, какие ворота открыты сейчас.
- Слой «Транспорт»: Остановки шаттлов SAPTCO.
- Слой «Рельеф»: Цветовая кодировка уклона местности (Зеленый — ровно, Красный — крутой подъем).
Секция «Удобства для Паломников»:
Стандартные иконки «Wi-Fi» и «Парковка» уходят на второй план. На первом плане:
- Ихрам: Есть ли в продаже/наличии комплекты ихрама?
- Трансляция: Есть ли динамики с трансляцией Азана в номере?
- Лифты: Количество лифтов на этаж (критично в час пик после молитвы). Если в отеле 1000 номеров и 4 лифта — это проблема, которую нужно подсветить или скрыть (в зависимости от стратегии прозрачности). Мы рекомендуем прозрачность: «Высокая нагрузка на лифты».
Глава 3. Проектирование B2B Портала (Agent Focus)
Агенты — это «Power Users». Им не нужна красота, им нужна функциональность.
3.1 Дашборд Агента (Agent Cockpit)
Это стартовая страница после логина.
- Финансовый виджет:
- Баланс кошелька (Prepaid Balance).
- Кредитный лимит (Credit Limit).
- Сумма к оплате (Due Payments).
- Кнопка «Пополнить» (Top Up) через банковский перевод или карту.
- Виджет Статусов:
- Новые брони (New).
- Подтвержденные (Confirmed).
- Требующие оплаты (Payment Pending).
- Отмененные (Cancelled).
- Визовые проблемы (Visa Rejected) — интеграция с Nusuk статусами.
3.2 Поисковая выдача B2B (Table View)
Вместо карточек — таблица с высокой плотностью данных.
- Строки: Компактные (высота 40-50px).
- Колонки: Отель, Район, Тип номера, Питание (RO, BB, HB, FB), Аллотмент (цифра), Цена Brutto, Комиссия, Цена Netto.
- Функционал «Multi-Select»: Агент может поставить галочки напротив 5 отелей и нажать «Сравнить» или «Добавить в предложение».
- Логика «Корзины»: Агент может набирать в корзину разные отели на разные даты для разных групп, а потом оформить всё одним чекаутом (Bulk Checkout).
3.3 Управление Группами (Group Management)
Специальный модуль для Хадж-операторов.
- Rooming List: Инструмент для распределения паломников по номерам.
- Интерфейс Drag-and-Drop: Слева список паломников (импортированный из Excel), справа — слоты в номерах (Номер 101: [Пусто], [Пусто]). Агент перетаскивает имена в слоты.
- Гендерный контроль: Система выдает предупреждение, если агент пытается поселить мужчину и женщину (не являющихся родственниками) в один номер (хотя для групп это часто допустимо, предупреждение полезно).
Глава 4. Техническая реализация и Данные
4.1 Единая база данных, разные проекции
- Hotel Table: Хранит статические данные (адрес, фото).
- Inventory Table: Хранит наличие и цены. Имеет сложные связи:
- RatePlan A (B2C): Цена $120, CancelPolicy: Flexible.
- RatePlan B (B2B): Цена $100, CancelPolicy: Non-Refundable, MinStay: 3 nights.
- API Gateway:
- GET /api/v1/hotels/search?role=guest -> Возвращает данные для B2C шаблона.
- GET /api/v1/hotels/search?role=agent -> Возвращает данные для B2B шаблона (с нетто ценами и аллотментами).
4.2 Интеграция с GDS и Switch
Для обеспечения глобального охвата newhaj.com должен быть подключен к глобальным дистрибьюторам.
- Connectivity: Использование API агрегаторов (например, Hotelbeds, WebBeds) для получения инвентаря за пределами прямых контрактов.
- Mapping: Критически важен модуль маппинга (сопоставления) отелей. «Hilton Makkah» у Hotelbeds и «Makkah Hilton» у Expedia должны быть объединены в одну карточку на newhaj.com.
5. Заключение
Проект newhaj.com требует создания гибридной экосистемы. Предложенный «Оригинальный Шаблон» решает главную проблему рынка — разрыв между ожиданиями цифрового пользователя и реальностью религиозного паломничества.
- Для B2C мы создаем эмоциональный, поддерживающий интерфейс, который снимает страх перед поездкой и помогает совершить духовное путешествие.
- Для B2B мы предоставляем мощный рабочий инструмент, который экономит время и деньги агентов, делая их бизнес более эффективным.
Объединение этих двух миров на единой технологической платформе сделает newhaj.com доминирующим игроком в индустрии Хаджа и Умры к 2030 году. С дозволения АЛЛАХА!
Источники
- The Benefits & Challenges of B2B and B2C in Travel Portal Development — Amar Infotech
- B2B vs B2C in Modern Travel Portal Development — FlyBlaze
- Decoding Significant and Trivial Factors Influencing Online Hotel Ratings: Makkah City — TUENGR (PDF)
- Booking.com UX Case Study — Baymard Institute
- Online Hotel Ratings in Makkah City — ResearchGate
- Best Hotels in Mecca — Agoda
- Agoda Special Offers — Partner Hub
- Trip.com Travel Data Scraping — Actowiz Solutions
- From Cluttered Layouts to Smarter Booking: Trip.com UI/UX Redesign — Medium
- Nusuk Hajj — Official User Manual (PDF)
- Umrah Agent B2B Overview — YouTube
Pullman Zamzam Makkah — Official Hotel Page
Map & Directions — Makkah Hotel
Walking Distance Hotels in Makkah — LoveUmrah
B2B Portal Demo — YouTube
Accommodation — Pullman Zamzam Makkah
Nusuk Hotel Booking Guide — HotelsInMakkah
Guide on Nusuk App — DXB Apps
Configurable GUI for Hotel Management Systems — DHTMLX
Hotel Reservation System Design — PHPTravels
B2B Management System for Travel — IAsia Thailand
B2B Agent Management System — Viagio Engine
Hajj and Umrah Software Overview — Evoucher.pk
Google Distance Matrix API — Usage & Billing
Google Maps Platform Pricing
Soho Hotel Booking Calendar for WordPress — ThemeForest
Seasonal Pricing Configuration — WP Booking Calendar
B2B Distribution Manager for Hotels — Technoheaven
How to Use Nusuk for Umrah Booking — Saudi Visa Office
Setting Up Agoda Special Offers Rate Plans
Umrah and Hajj Travel Management System Design — Scribd