Что: разработка сайта и элементов айдентики.
Для кого: Modern Talking.
Задача: придумать название, разработать логотип и сайт для онлайн-школы английского языка. Конечно же, все должно быть креативно и современно.
Часть первая: название и логотип
Нам хотелось уйти от клише и вместе с тем остановиться на чем-то очень броском и запоминающемся. Поток мыслей был широкий: easy easy и real talk с отсылкой на Versus battle, speak easy из времен сухого закона. Последний вариант был принят, однако домен был занят. Поехали дальше. Думали о песнях на английском языке «йо ма ха, й ома со», «мушвикитон бак тайм». Включили, послушали, посмеялись, вдохновились. Бинго! В голову пришла отличная идея: Modern Talking. Идеальное название для занятий по Skype: современно, звучит, домен свободен. Арт-директор говорит да, маркетолог очень за, заказчик в восторге.
О создании логотипа мы писали ранее здесь https://mlk.by/modern-talking-logo-case/
Собрали все в одно целое — получилось «Modern Talking. С нами заговорят даже королевские гвардейцы». Но чего-то не хватает. Поэтому решили дополнить: «Modern Talking. С нами заговорят даже королевские гвардейцы. Speak easy!»
Часть вторая: сайт
У заказчика требования к сайту были совершенно прозрачные: наличие онлайн-теста, трех программ, 12 курсов, блока с дополнительными услугами, блока с отзывами, спецмодуля Expemo и на этом все. Expemo – это специальное приложение, которое направлено на дополнительное повторение уже пройденных тем и изучение новой лексики.
Мы начали разбираться с визуальной составляющей и поняли, что все сайты с курсами английского языка и курсами занятий по Skype очень однотипные и устаревшие. Это подогрело наш интерес к созданию яркого и запоминающегося сайта, ведь название и логотип у нас ого-го.
Мы сразу представили этот сайт у себя в голове и то, как круто он будет выглядеть. Взяли листы А4 и начали прототипировать. В итоге получилось 19 вариантов страниц.
Затем начали создавать внутреннюю часть сайта и, конечно же, контент. Большая часть времени ушла на подготовку понятного и логичного онлайн-теста: пришлось перебрать порядка 5 виджетов. Вместо всех изображений на сайте у нас красовался логотип — немного рябит в глазах, но дизайнер пока занят. Согласовав с заказчиком все нюансы по курсам и программам, мы написали понятный и нестандартный текст. Добавили преимущества онлайн-школы, которые точно не похожи на типичные клише «быстро, качественно, недорого». Поэтому получили: «говорим до свидания йо ма ха йо ма со», «лондонский туман сидя в кресле», «подготовка к Hogwarts и не только» и т.д.
Больше всего проблем возникло с адаптацией мобильной версии сайта: либо картинки огромные, либо хедер закрывает меню, а еще футер криво выглядит. Мы взяли iPhone, Samsung, Nokia разных поколений, посмотрели, что не так и начали исправлять. Готово.
Протестировали все формы обратной связи, тесты, кликабельность, проверили тексты и снова мобильную версию. А еще посмотрели на свою работу с разных компьютеров и браузеров. Вроде отлично, берёмся за графику.
Часть третья: графика
С готовым логотипом, названием и схемой сайта мы приступили к созданию визуальной части сайта – красочных иллюстраций.
Начали с программ обучения и решили, что все будем делать в виде букв. Заказчик прислал нам референсы.
Нарисовали три изображения, но показалось, что слишком детские.
Подумали и видоизменили. От дизайнера и маркетолога 10 баллов, а заказчик ликует. Работаем!
1) General English: взяли за основу одинаковое написание и произношение слова «general», как генерал и общий курс. Вольно!
2) Business English: деловая буква в костюме ведет очень важную презентацию, но знания английского у нее на уровне «blah-blah».
3) IELTS Preparation: здесь мы решили подумать об успешно сданном экзамене по рейтингу БРС. И обязательно шапочку!
Далее изображали отдельные курсы каждой программы обучения.
General English
Под каждый курс была своя классная идея.
Vocabulary to Go – школьные словари и транскрипции.
Elementary English – алфавит и кубики.
English for Life – журнал Life и Уолтер Митти.
Grammar Reference – игра слов.
TED English – говорящая буква с логотипа.
Speaking and Conversation – говорим, не стесняясь публики — слоган онлайн-школы.
После иллюстрации курсов дизайнер решил переделать тени на всех изображениях. Да, этим мы занимались три раза даже после того, как все было загружено на сайт.
Business English
Схожие тематики для разных программ немного упростили задачу, поэтому основная работа шла по другим курсам.
English for IT – выбрали код, кнопки и компьютерную тематику, которая строилась на буквах.
English for HR – проводить собеседования — работа не из легких, поэтому взяли уровни температуры и отобразили трудолюбие.
Приступаем к блоку с дополнительными услугами: деловая переписка и перевод документов. Сразу вспомнили нашу идею с электронной почтой, а перевод отобразили одной буквой, которая состоит из русской и английской «Л».
А теперь одна из самых важных частей – иллюстрации на главную страницу. Самую сложную работу мы оставили, конечно же, на конец. Лайфхак: лучше не давать заказчику смотреть, что там происходит, так как изначально там летает перекати-поле.
Сначала на большом изображении хотели оставить только текст. Скучно. Немного цвета? Веселее, но тоже «нет ВАУ эффекта». Поставим логотип? Не очень — три логотипа смотрятся еще хуже, чем просто название. Поставили гвардейца, потом второго, затем третьего. Замечательно!
Последний рывок – блок с преимуществами. Изначально мы придумали три, но потом решили взять четыре. Смотрится на сайте не читабельно, поэтому по традиции делаем шесть.
Говорим до свидания йо ма ха, йо ма со – тестовое задание и выбор правильного ответа, акцент на грамотное произношение.
Лондонский туман сидя в кресле – английский язык напрямую ассоциируется с Лондоном, а он с туманом, акцент на том, что занятия удаленные.
Keep calm and uchi angliyskiy – просто классический случай, акцент на юмор.
Мы обучаем постоянно 24/7 – изначально хотели изобразить Open 24/7, однако поняли, что звонки в три часа ночи преподавателям вряд ли нужны. Зато в рабочее время он вам всегда поможет, так как курирование процесса ведется постоянно.
Не льем воды на занятиях – акцент на отсутствие типичных тем для изучения. Это напомнило нам знаменитое выражение со школы «London is a capital of Great Britain».
Подготовка к Hogwarts и не только – тут и подготовка к собеседованию, и к экзамену, и к деловой поездке, поэтому взяли за основу всем известную школу магии и чародейства.
Часть четвертая: финальная
Загружаем все наши изображения на сайт и все едет. Что может быть лучше? На ходу переделываем тексты, немного меняем местами иконки и расположения страниц. Смотрим мобильную версию, снова корректируем. Забыли про фавикон – срочно на сайт! Последний раз тестируем и все работает прекрасно. Отдаем заказчику.
1 разработка концепта, 3 человека в команде, 15 дней, 25 сочных иллюстраций и более 50 скетчей – мы превзошли все ожидания заказчика. Готово!
Отзыв о нашей работе
Ни разу не пожалела, что обратилась в креативное агентство «Молоко» для создания сайта моей онлайн-школы английского языка. Ребята взялись за работу с самого нуля: разработали концепцию, придумали логотип. В итоге у меня самый нестандартный и креативный сайт на свете, и такого нет ни у кого))) Большое спасибо!
Элина Стерина
Посмотри нашу историю