Кейс по созданию сайта туристического клуба «Верста»
Кратко о проекте
Клиент: Туристический клуб «Верста» ведёт свою деятельность с 2008 года. За это время компания наработала большой опыт в сфере организации интереснейших походов по всем уголкам России.
Задача: создание современного сайта «под ключ» с удобным функционалом для клиентов по подбору и бронированию походов.
Сайт: versta.club
Проектная группа
 |
 |
 |
 |
| Дмитрий Егоров технический директор |
Елена Демакова дизайнер сайтов |
Илья Микшиев интернет-маркетолог |
Максим Морозов верстальщик сайтов |
Этап 1. Подготовительный этап. Техническое задание
Владельцы туристического клуба «Верста», Александр Щербина и Александр Павлюк, - это настоящие профессионалы своего дела, опытные туристы и организаторы походов. Поэтому они имели чёткое представление о том, какой им нужен сайт. Нам были представлены ориентиры западных лидеров в данной сфере и был расписан желаемый функционал сайта.
«Мне, как техническому директору, необходимо было расложить по полочкам всю информацию и составить чёткое Технического Задание на проект. А в данном проекте предполагался большой объем работ по программированию необходимого функционала сайта.
Как у нас тут любят говорить: «Знать путь и пройти его - не одно и то же». Однако знать путь, то есть иметь перед собой чёткий план действий – это уже половина успеха создания сайта. Вторую половину мы оставляем на реализацию плана. А план был не простой :)
Выдержки из Технического Задания:
Этап 2. Прототипирование страниц
«Хотя сегодня прототипирование уже плотно входит в перечень инструментов сайтостроения, некоторые до сих пор им пренебрегают. Да – возможно, без прототипа можно обойтись, если Вы используете готовый шаблон, либо в проекте «и так всё понятно». Но потом не удивляйтесь, если конечный результат не будет соответствовать Вашим ожиданиям.
Короче говоря, в серьезных проектах мы используем прототипирование и очень этим довольны. Довольны этим и наши уважаемые заказчики, ведь вместо десятков слов в техническом задании, прототип позволяет:
- увидеть модель будущего сайта;
- понять расположение элементов на странице;
- попробовать, как работают те или иные элементы (в случае интерактивной версии);
- и своевременно, до начала основных работ по дизайну, вёрстке и программированию, выполнить работу над ошибками.»
Таким образом прототипирование позволяет снизить, практически до нуля, риски несоответствия полученного от задуманного. Ниже мы предлагаем Вашему вниманию прототипы основных страниц сайта versta.club:
Прототип главной страницы:
| Прототип страницы с направлениями: | Прототип страницы маршрута: |
 |
 |
Этап 3. Дизайн
Есть такой древний постулат в медицине: «Не навреди!». Пожалуй, в современном дизайне сайта следует придерживаться тех же принципов. То есть, для начала, нужно хотя бы «не навредить» удобству восприятия информации пользователем, а, в идеале, помочь этому восприятию, расставив акценты должным образом.
Вот несколько слов о визуальном оформлении сайта versta.club от дизайнера проекта Елены Демаковой:
«В данном проекте мы подчеркнули современность и актуальность туризма. Сайт выполнен с применением элементов Flat Design, направления, которое выбирают передовые западные веб-дизайнеры и проектировщики интерфейсов.
Мы использовали много белого цвета, тонкие линии и создали чистый современный образ. Большие красочные фотографии с изображениями тех мест, ради которых туристы едут так далеко от дома, представлены на сайте во всей красе.
На главной странице, для удобства выведены самые популярные туры, в миниатюре можно увидеть и цены и вид туризма. Прорисована и сама карточка маршрута, с удобными вкладками, посредством которых можно найти нужную информацию, узнать о дате ближайшего заезда и наличия мест.
Так же прорисованы удобные фильтры подбора маршрутов по множеству параметров. И в завершение были прорисованы иконки видов тура, чтоб подчеркнуть индивидуальность сайта и помочь посетителю сайта сориентироваться.»
Дизайн-макет главной страницы:
| Дизайн-макет страницы с направлениями: | Дизайн-макет страницы маршрута: |
 |
 |
Этап 4. Вёрстка и программирование
«После того как дизайн нарисован и утверждён Заказчиком, мы переходим к следующему этапу, а именно верстаем макет и проводим все работы по программированию, описанные в Техническом Задании.
Верстается проект на основе какой-либо системы управления. И мы, методом проб, ошибок и успешных кейсов, остановились на CMS Joomla. Почему именно Джумла? Отвечаем:
- это бесплатная система управления сайтом с открытым кодом и широким функционалом – то есть Вам не надо ничего платить за пользование системой, плюс для неё написано множество дополнений и приложений, многие из которых, также находятся в открытом доступе;
- она входит в тройку самых популярных CMS в мире – значит, Вы без труда найдёте разработчика, если вдруг Вашему сайту понадобится апгрейд или доработки.»
Адаптивность вёрстки мы реализуем, исходя из задач проекта. Также возможна разработка отдельной мобильной версии сайта.
Этап 5. Домен и хостинг
Итак, после того как все работы по сайт произведены, Заказчик может протестировать сайт, попользоваться им и всё проверить. После чего происходит финальная оплата и сайт переносится с тестового на основной хостинг. Хостинг-провайдеров много. Мы, например, работаем с Beget.
