Презентация

# Сайты-каталоги

Сайт-каталог
для турагентства
авторских туров

Организация и проведение авторских туров по Шри-Ланке, Мальдивам и Вьетнаму

Организация и проведение авторских туров

Услуги

UX/UI-дизайн,
Веб-разработка

Срок реализации

3 месяца

Год запуска

2026 г.

Особенности проекта:

20+ вариантов концепций проекта

Такой подход помог сформировать дизайн-концепцию, точно отражающую характер бренда.

Подробнее

Удобная административная панель

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

Генерация оригинальных изображений в AI

Использованы авторские фото клиента и дополнительно созданы иллюстрации для блоков сайта.

Интеграция с Битрикс24

Заявки автоматически конвертируются в лиды CRM, что позволяет фиксировать 100 % обращений и сократить время на ручное внесение данных.

О клиенте

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

Этапы
работы над
проектом

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

01

Исследование

Брифинг

Конкурентный анализ

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

02

Концепция

Карта сайта

User flow

Мудборд

Более 20 вариантов концепций для выбора оптимального визуального и смыслового вектора — чтобы найти точное попадание в ценности бренда и ожидания аудитории.

03

Дизайн и адаптив

Ui-kit

Прототип

Макеты

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

04

Вёрстка и программирование

Код

Тесты

Документация

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

Финализация и запуск

05

Код

Тесты

Документация

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

Карта сайта

Мы проработали детальную карту сайта, охватывающую все ключевые разделы и их взаимосвязи.

Цвета проекта

Цветовая гамма проекта — природная, сдержанная и благородная: в её основе — глубокий синий и мягкие землистые оттенки, которые органично вписываются в тревел‑нишу и создают ощущение надёжности и эстетики без излишней яркости.

#546792

Темное небо после шторма

Мы проработали детальную карту сайта, охватывающую все ключевые разделы и их взаимосвязи.

#CCD8E4

Туман в горах

Мы проработали детальную карту сайта, охватывающую все ключевые разделы и их взаимосвязи.

#B1BAC3

Валуны

Не перетягивает внимание, но задаёт ритм и структуру.

#3F4C6E

Глубокое море

В паре с основным синим, применяется в ховер-эффектах.

Дополнительные цвета:
тёплый оливковый, песочно‑бежевый, пыльно‑зелёный и серо‑жёлтый. Они собраны в палитру «земли и дороги» и работают как связующее звено между синим и нейтральными фонами.

Влажный песок

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

Сухой песок

Цвет сухого белого песка, ракушек и лёгкой морской пены. Используется как основной фон сайта, усиливая синий.

шрифты

Для проекта выбрана пара Inter + Caveat: функциональный гротеск для основного текста и рукописный акцент для заголовков. Такое сочетание поддерживает природную, сдержанную эстетику и делает интерфейс одновременно читаемым и эмоциональным

64 px / 40 px / 24 px / 18 px / 16px
Regular / Medium / Bold

— это гротеск с высокой читаемостью даже на мобильных экранах и в плотных блоках текста. В тревел‑проекте, где много описаний туров, дат, условий и цен, это важно. У него нейтральные, «спокойные» пропорции — он не отвлекает от контента, но держит структуру.

64 px / 40 px / 24 px / 18 px / 16px
Regular / Medium / Bold

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

Сетка

Сайт спроектирован на классической
12- колоночной сетке с хорошим воздушным пространством

Главная страница

Концептуальные
поиски

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

AI в процессах разработки

Иллюстрации, прототипы, контент.

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

 

Такой подход даёт больше вариативности на старте, и освобождает ресурс на глубокую проработку деталей и точные решения под задачу клиента

01

Нарисуй минималистичную линейную иллюстрацию (flat line art) в спокойном, «туристическом» настроении. Цвет линий — строго по HEX‑коду #546792. В центре композиции — бутылка для воды с карабином и крышкой; на корпусе бутылки размещён логотип (используй предоставленный файл логотипа, не генерируй текст самостоятельно). Слева от бутылки — лёгкая шляпа с лентой, чуть наклонённая. Справа — две треккинговые палки, лежащие крест‑накрест, с проработанными рукоятками и ремешками. В левом нижнем углу — несколько стилизованных травинок/стеблей. На фоне — условный пейзаж: плавные линии холмов и волнистая линия водоёма.
Все линии — тонкие, чистые, без заливки, цвет линий — строго по HEX‑коду #546792. Фон — чисто белый. Стиль — лаконичный, без лишних деталей, акцент на силуэтах и узнаваемости предметов. Композиция сбалансированная, много «воздуха». Формат — горизонтальный, соотношение сторон 16:9.

prompt

02

Создай фотореалистичное изображение в стиле профессиональной рекламной съёмки. На переднем плане — светло‑бежевый холщовый рюкзак лаконичного дизайна, стоящий на фактурном тёмно‑сером камне. На лицевой стороне рюкзака — логотип. Сбоку — встроенный карман с чёрной бутылкой для воды. Видны детали: тканевые ремни, пряжки цвета хаки, аккуратная строчка, молния на переднем кармане.
Фон — живописный природный пейзаж: зелёные холмы с террасированными плантациями, извилистая река, лёгкая дымка в долинах, дальние горы. Вверху — светлое небо с мягкими рассеянными облаками. Освещение тёплое, «золотой час», мягкие тени, высокая детализация ткани и камня. Глубина резкости: рюкзак в фокусе, фон слегка размыт. Соотношение сторон 4:5, высокое разрешение.

prompt

03

Сгенерируй фотореалистичное изображение в стиле профессиональной рекламной съёмки. В центре — ретро‑кабриолет светло‑бежевого цвета, вид сзади и немного сбоку (3/4). В машине — молодая пара: мужчина за рулём (вид со спины, короткая стрижка, светлая футболка), женщина на пассажирском сиденье — в соломенной шляпе, с распущенными волосами, энергично подняла правую руку вверх в приветственном жесте.
Композиция сбалансированная, акцент на силуэтах и эмоциях пары, на деталях кузова авто. Освещение тёплое, мягкое, без резких теней, создающее ощущение солнечного дня. Фон полностью прозрачный. Высокое разрешение, 8K, детализация текстуры ткани, кожи, хрома, лакокрасочного покрытия. Соотношение сторон 16:9.

prompt

04

Нарисуй минималистичную векторную иллюстрацию в стиле лаконичной печати (postage stamp). В центре — круг тёмно‑синего цвета (оттенок близок к navy), по контуру — тонкая равномерная обводка. В верхней части круга по дуге — надпись из логотипа заглавными буквами простым шрифтом без засечек, в нижней части по дуге — слово «JOURNEY» тем же шрифтом. В центре круга — стилизованная восьмиконечная звезда тёмно‑синего цвета. По бокам от звезды — две маленькие точки. Справа от круга — три плавные волнистые линии, имитирующие эффект движения или штемпеля.
Палитра — монохромная, один оттенок синего на белом фоне. Стиль — чистый, плоский (flat design), без градиентов, теней и текстур. Высокая чёткость линий, векторная гладкость. Формат — горизонтальный, много свободного пространства вокруг композиции.

prompt

05

Сгенерируй фотореалистичное изображение в стиле профессиональной туристической рекламы. На переднем плане — мужчина со спины и в профиль (3/4), смотрит вправо с лёгкой улыбкой. На нём тёмно‑синяя футболка, бежевая панама с фактурной тканью, светлые брюки. На спине — вместительный рюкзак из плотного бежевого текстиля с бежевыми ремнями и фурнитурой цвета хаки. На лицевой стороне рюкзака — логотип: тёмно‑синяя восьмиконечная звезда, под ней надпись «TOPSTER» жирным шрифтом без засечек и слово «tour» изящным курсивом. В боковом кармане рюкзака — чёрная бутылка для воды.
Фон — живописный прибрежный треккинговый маршрут: каменистая тропа уходит вдаль, по ней идут несколько туристов (фигуры на среднем плане, слегка размыты). Справа — крутые зелёные склоны с кустарником и скалами. Слева — лазурное море, на горизонте — небольшой лесистый остров. Небо — светло‑голубое с лёгкими белыми кучевыми облаками.
Освещение — яркий солнечный день, тёплый свет, мягкие тени, эффект «золотого часа». Глубина резкости: мужчина в резком фокусе, фон мягко размыт. Высокая детализация: фактура ткани панамы и рюкзака, плетение ремней, отдельные травинки и камни на тропе. Соотношение сторон 16:9, разрешение 8K.
Вариант 2. Чуть более художественный (полуреализм, акцент на атмосферу

prompt

06

Сгенерируй минималистичный линейный рисунок чайки в полёте. Композиция — вид сбоку, крылья широко расправлены вверх и вперёд, силуэт лаконичный. Контур тонкий, однородный, светло‑серого цвета. Стиль — чистый лайн‑арт без штриховки, градиентов, теней и текстур. Фон полностью прозрачный (transparent background). Высокая чёткость линий, векторная гладкость. Соотношение сторон 1:1, много свободного пространства вокруг силуэта.

prompt

Страница Тура

Маршрут

Коломбо → Пиннвелла → Дамбулла → Сигирия → Полоннарува → Канди → Амбулавава → Китулгала → Рамбода → Нувара → Элия → Элл → Ял → Галле

Другие страницы

Направления
Блог
Выбранная статья
Контакты
404
Спасибо
Технические страницы

Мобильный адаптив

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

UI-Kit

Мы разработали атомарную структуру компонентов проекта. Благодаря ей проще поддерживать единый визуальный язык на всех этапах развития продукта.

Результат

Мы создали современный адаптивный сайт, который передаёт атмосферу авторских путешествий и делает акцент на визуальных впечатлениях.

 

Интерфейс построен с учётом актуальных UI/UX-практик, обеспечивая удобную навигацию на любых устройствах.

 

Для команды проекта реализована удобная административная панель, позволяющая самостоятельно управлять турами, контентом и публикациями.

Отзыв клиента

Еще проектов?

Корпоративные сайты, Строительство

Корпоративный сайт для национального строительного агентства

Корпоративные сайты, Медицина

Корпоративный сайт для премиальной стоматологии

Мобильные приложения, Образование

Мобильное приложение онлайн-тренажера для изучения португальского языка

  • UX/UI дизайн
  • Разработка
Корпоративные сайты, Другое

Корпоративный сайт для кредитного брокера

  • UX/UI дизайн
  • Разработка
Продукт WEB.DO
Сервисы, Онлайн - школы, Продукты Web Do, Образование

Онлайн-платформа по изучению английского языка

  • Исследования
  • UX/UI дизайн
  • Разработка
  • Продвижение
Корпоративные сайты, Другое

Корпоративный сайт для агрегатора такси

  • UX/UI дизайн
  • Разработка

Вы готовы?

Давайте создадим и запустим Ваш digital продукт вместе?

Всё ещё не уверены? Взгляните, как мы будем создавать Ваш продукт.
Смотреть кейсы

Простой интерактив