Всегда приятно работать над проектом, заказчик которого буквально «болеет» им. Carpix — это не просто автомобильное СМИ, это действительно авторская вещь, единичный экземпляр в своем роде.

О проекте

Мы — редакторы крупных российских СМИ, которые устали говорить о машинах XXI века риторикой 90-х и объединились под кодовым названием Carpix. Car — потому что пишем про автомобили и сопутствующую им жизнь, Pix (или Pixel) — потому что доступны исключительно онлайн.

Итак, это будет очень эмоциональный, живой проект. Поехали!

Задачи

Наша задача состоит в разработке сайта, на котором авторы планируют делиться новостями, авторскими материалами, тест-драйвами, HD-фото и видео. Тот редкий случай, когда даже на момент старта проекта нет недостатка в контенте.

Очевидно, что для современной информационной площадки важен отличный дизайн и удобство. Поэтому начинаем первый этап.

Решение

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

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

Отлично, теперь, чтобы получить точную картину того, как проект будет работать и чем будет «цеплять», собираемся на брейншторм — руководитель проекта, дизайнер, аналитик. Чтобы наглядно продемонстрировать, как сайт будет работать, делаем интерактивный прототип в Axure — всех фишек там не показать, зато можно быстро что-то поправить, поменять, отладить. Что позволяет с уверенностью двигаться дальше, к дизайну.

Дизайн

Приступаем к главной. Смелее, больше динамики в линиях!

Нам всё очень нравится: и смелые углы, и навигация, и дерзкие «спортивные» цвета. Время демонстрации, собираем телеконференцию.

Валерия руководитель проекта

Был забавный случай :) У заказчика на тот момент не было технической возможности выйти с нами на связь по скайпу — соответственно, наш отработанный сценарий демонстрации нужно было менять. Договорились так: назначаем время обсуждения, отправляем ссылку на макет в нашем Whoision’е, сразу звоним. Немного страшновато, потому что совсем нет времени на «подведение итогов» предыдущих этапов, обоснования и прочая... Заказчик берет трубку, слышим восторженное: «ДА! Это именно то, что я и представлял! Спасибо, всё круто!»

Дизайн принимается без единой правки и это бодрит! Продолжаем в том же духе, делаем внутренние страницы. Особенно шикарна страница галереи с прелоадером в виде спидометра.

К разработке дизайна подключается Тамара (на тот момент еще стажер Тамара, ныне дизайнер Тамара!). Антон участливо наставляет, подсказывает, советует полезные сервисы и делится своими коронными приемами. Сохраняем темп, заканчиваем оставшиеся страницы — получается на «пятерку».

Антон дизайнер

Делали дизайн вдвоем с Тамарой, она молодец. Быстро разобралась, сохранила первоначально заданный стиль, всё аккуратно. Осторожно, но качественно — так бы я назвал ее манеру. В общем, в случае с Carpix получилось полностью то, что мы и хотели.

Четыреста четвертая по традиции веселит. Дизайн закончен и успешно сдан. Время верстки!

Верстка

Чтобы верстальщики не портили нервы, дизайнер делает UI-кит, где подробно показывает, сколько пикселей откуда отступать, и показывает все состояния интерактивных элементов.

Самая мякотка, конечно, с версткой скошенных углов. Верстальщики поймут, ага :) Стоически преодолеваем, ибо нечего делать задуманное на 95%.

Интерактив и программирование

Распределяем работу между тремя разработчиками — один занимается анимацией, второй — интеграцией с Битриксом, третий — фото- и видео-галереями. Такая команда работает намного производительнее одного программиста.

Особенности:

• Галереи адаптивные — изображения и видео меняют размер в зависимости от монитора, при этом все самое главное остается на экране. Можно взять браузер за уголок, потаскать туда-сюда — увидите эффект.
• Анимированный переход в галерею в виде огромного вращающегося куба!
• Нестандартный поиск (ищет буквально среди всего, что есть на сайте, выводит по категориям).
• «Дворники», приводящие в движение слайдер.

Для нашего нового разработчика Владимира это был первый опыт разработки «конечного продукта».

Владимир разработчик

Очень рад, что результат моей работы можно буквально увидеть, он ощутимый. Для разработчиков очень важно получать осязаемый результат — или это будет рутинным выполнением «бессмысленных» задач.

Пара слов напоследок и на том закончим.

Итого

Строго говоря, «электронный журнал», как мы окрестили проект в заголовке, — не совсем правильное определение. Но Carpix так великолепно оформлен и легко, современно написан — что невольно возникают ассоциации с новеньким, только из типографии, автомобильным журналом.