Сайт для ГрандТВ

Недавно в студийном твиттере нас спросили о том, почему Студия ничего не постит в ЖЖ, ведь интересно знать как идет работа в молодой компании. Исправляемся.

Тем более и повод есть — мы доделали очередной проект. Это сайт Светодиодного видеоэкрана «ГрандТВ» (да, и у телевизионных экранов тоже бывают сайты). О процессе его создания я и расскажу.

Концепция

Работать над этим проектом мы начали еще летом. Немного поштормили мозгами и решили делать в формате одностраничного «промо-сайта», но при этом с максимальной функциональностью. Кроме достаточно небольшого количества текстовой информации нам нужно было разместить:

1. форму заказа услуг
2. форму обратной связи
3. контактную информацию
4. калькулятор расчета стоимости услуг
5. логотипы партнеров
6. портфолио видеороликов
7. фотографии видеоэкрана на фасаде здания

И все это на одной странице высотой с ноутбучный монитор. Вот такая вот задача.

И справились мы с ней очень просто: запроектировали в интерфейсе два вспомогательных экрана для информации слева и справа от основного. Переход (в нашем случае плавный переезд) на них осуществляется с помощью навигационных стрелок-подсказок. А все формы поубирали в выезжалки, чтобы они не занимали место.

Дизайн

Здание, на котором висит экран, расположено в самом центре Симферополя и визуально знакомо каждому. Поэтому на главной решили показать часть его фасада вместе с экраном.

Рисуем первую версию макета дизайна.

Дополнительная страница:

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

Второй вариант делаем максимально строгим, ярким и космическим:

Общая графическая схема всех трех экранов:

Рисуем телевизионные заставки в слайдер на экран:

Прорисовываем элементы форм в выпадашках:

Верстка

Верстка проекта была непростой (но мы и не ищем легких путей). Ездилка между экранами, выпадающие формы заказа, форма контактов, калькулятор, слайдер на главной, аккордеоны на дополнительных страницах, карусели видеороликов и фотографий, «плавающий» эффект для селектов и «живые» кнопки — это далеко не полный перечень интерактива, с которым пришлось повозиться. Но мы днями и ночами занимались этим, чтобы вам понравилось

Контент

Наполнение — это отдельная история, требующая от веб-студии выдержки и настойчивости (коллеги по цеху меня поймут). Должность выбивальщика контента должна стать обязательной, наравне с дизайнером и менеджером. Но и с этой задачей мы справились — контент выбили и забили. Получилось симпатично. А вам как?

На сайт можно посмотреть здесь — http://grand-tv.com.ua

PS Почему не выложили в портфолио? Да чо-то руки никак не доходят…

У вас есть вопросы или интересные мысли по этой теме? Пишите все в камменты, обсудим.

Следите за новыми публикациями через RSS, Твиттер, Фейсбук или Гуглоплюс.

Предыдущая запись: Канва бизнес-модели

Следующая запись: Итоги – 2010