Создание сайта Центра международного обмена

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

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

Ищем настроение дизайн-концепции. Разные типы программ в духе современных ситкомов. Сезон 2013, набор открыт.

Дневник путешественника: характерные артефакты разных стран и туристические штампы иллюстрируют особенности программ.

Или красочный гид по культурному обмену, с выжимкой фактов и интерактивными социальными плагинами.

Откладываем метафоры на потом, они еще пригодятся. Фокусируемся на функциональности.

Рождается дизайн-концепция в духе современных мобильных приложений: обзорник программ с простой структурой.

А в качестве обложек программ — лихие коллажи.

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

Льем больше красок, вспоминаем про дневник путешественника и раскидываем по сайту заметки, корешки билетов и фотокарточки из поездок.

Клиент принимает дизайн. Доводим концепцию до ума. Собираем все страницы и отдаем на верстку.

Параллельно занимаемся мелочами. Демонстрируем различные состояния интерактивных элементов.

Рисуем иконки файлов и кнопки.

Наконец проводим фотосессию в духе ситкомов. Ребята оживят страницы сайта.

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

Продолжаем.

Клиент просит добавить на сайт свой талисман — говорящего робота Рендела. Оказывается, Рендел весит 200 кг и находится в библиотеке МГУ, где с профессиональным оборудованием снимать запрещено. Тем не менее договариваемся с библиотекой о съемке и фотографируем робота.

Отрисовываем и ставим на сайт.

Продолжаем верстать, ловим баги и вносим правки.