Ayazshabutdinov. ru
Посмотреть сайт

Аяз Шабутдинов — молодой предприниматель и основатель холдинга Like, в который входят 22 бренда, среди которых: Like Фотошкола, LinguaLike и, конечно же, самый масштабный проект — сеть кофеен CoffeeLike, общее количество которых насчитывает более 200 точек по всей России Задача: Разработка персонального сайта, который описывал различные стороны жизни Аяза, все чем он живет и занимается.

Всекорпоративные сайты

Coffee-like.rupremiumgun.ru
alt
Начало. Брифинг.
Наше знакомство с Аязом произошло во время прохождения премиальной тренинг программы likebz.ru,
где мы, после достаточно непродолжительного общения договорились принять вызов и разработать персональный сайт за рекордно короткие сроки, а именно: за 7 дней!
alt
Прежде чем приступить к первому этапу мы провели краткий очный брифинг и зафиксировали основные пожелания к будущему сайту и сделали первые наброски в виде прототипа.
https://vk.com/ayazshabutdinov?w=wall-47696395_58143
alt
1й этап «Проектирование и ТЗ».
"
На основании устной информации, полученной на брифинге днем ранее был подготовлен детальный электронный прототип с описанием навигации и функционала сайта, а также разработано Техническое задание (ТЗ), с указанием основных требований к будущему сайту.
"
https://vk.com/ayazshabutdinov?w=wall-47696395_58148
alt
alt
alt
2й этап — Разработка дизайн-концепции
Благодаря достаточно подробному и детализированному ТЗ мы быстро миновали процедуру традиционно длительных согласований и утверждений и приступили к разработке дизайна.

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

alt
2 вариант дизайна.
Футуристический
alt
Прокрутка страниц по горизонтали.
Мы предложилигоризонтальную прокрутку содержимого на сайте. Фон сделали градиентным, причем при прокрутке предполагалось изменение фонового цвета, но не резкое, а плавное, перетекающее постепенно от одного блока к другому. Футуристический дизайн обычно представляет из себе более темные решения, но мы остановились на светлом ярком дизайне.
d
Нестандартные решения.
Такой дизайн достаточно непривычен для современного пользователя, и он сложен в реализайции, особенно если мы говорим про адаптивный дизайн, так
alt
В итоге, по результатам голосования многочисленных подписчиков группы Аяза Вконтакте почти с двукратным преимуществом победил первый вариант.
Элементы дизайна.
Утвержденный дизайн - что то между флэтом метро-дизайном. Мы предложили яркую графику и нестандартные шрифты шрифты, которые сами по себя являются элементами графики.
alt
Цветовые решения.
Долго выбирали цветовую гамму между красной и желтой. Несмотря на то что логотип LIKE выполнен в красном цвете, Аязу больше понравился желтые сечетания.
alt
Всплывающие окна.
Пользователю сайта предоставлена возможность связаться с автором посредством формы по интересующему вопросу.
alt
Главная страница.
Содержит самые главные смысловые блоки и элементы навигации по сайту.
alt
Страница “Обо мне”.
Все что важно знать об Аязе на одной странице.
alt
Страница Like холдинг.
Наглядная информация о главном проекте Аяза -Like холдинге.
alt
Страница мероприятий.
Удобно отслеживать ленту мероприятий, проводимых командой Аяза и им лично.
alt
Страница пресс-центр.
Все посты и интервью Аяза собраны в одном месте.
alt
3й этап — Часть 1
Front-end программирование (верстка дизайн-макета главной страницы) и адаптивизация под мобильные устройства»

После того как были отрисованы и согласованы дизайн-макеты всех страниц мы приступили в их верстке, а также адаптации под разрешения экранов мобильных гаджетов, так как для любого современного сайта это must have.

alt
Недостаточно просто сверстать сайт в HTML, важно скурпулензно проверить насколько корректно он будет отображаться на различных типах устройств и версиях браузеров. Зачастую тестирование сайта на кроссбраузерность и кроссплатформенность и отлов возможных багов и их правка занимает не меньше времени чем сама верстка.
alt
3й этап — Часть 2
Back-end программирование, проведение сторонних интеграции, тестирование, пуско-наладочные работы и подготовка к релизу проекта»

Завершающим этапом была интеграция сверстанных макетов с системой управления содержимым сайта (CMS) и реализация заложенного в ТЗ функционала, а именно:

  • 1) Редактирование контента по средством CMS
  • 2) Формирование базы подписчиков и её выгрузка ( формы подписки )
  • 3) Отправка уведомлений с сайта ( формы обратной связи )
  • 4) Блог:
    • - Перенос публикаций из VK.COM группы на сайт ( написан уникальный скрипт/программа )
    • - Меню с фильтрацией для блога ( управляется по средством фильтрации по#хэштегам )
    • - Вывод данных статей на другие страницы сайта
    • - Подписка на блог
  • 5) Запись на мероприятия
Резюме:

Итого на проект было потрачено:

7 дней / 108 рабочих часов ( без учета часов на согласования и правки ) + часы менеджера проекта и аналитика на ежедневные проверки и правки ~40 часов = 148 часов за 7 дней … мы обогнали время ))) и сделали крутой сайт!

P.S Однако, внимание, attention, atención, achtung !!! Как говорится «все трюки выполнены профессиональными каскадерами - не повторять в домашних условиях» )) Не стоит требовать от других разработчиков выполнения подобных работ с такими сроками))) В погоне за сроками скорей всего (в 95 % случаев) получите не самый приятный и ожидаемый результат ;)

https://vk.com/ayazshabutdinov?w=wall-47696395_58168
alt
Хотите такой же сайт?
Напишите ваши данные и мы свяжемся с Вами в ближайшее время.
Ваше имя
Телефон