Когда-то давно Kodland была детской школой программирования. И тогда мы сделали ей брендинг и сайт. А в начале этого года Kodland привлекла инвестиций на $9 млн — и заодно вернулась к нам для обновления, подходящего для выросшей компании.
Мы много работали с разными эдтехами, в прошлом году даже был дайджест, посвященный исключительно им. Особенно приятно, когда к нам возвращаются на новом этапе развития.
Здесь расскажем, как помогли школе вырасти.
Продукт
Когда Kodland впервые пришла к нам, она была детской школой, работающей глобально и выходящей на рынки Азии. Дети учились программировать, только с парой курсов на другие темы.
Сейчас дети продолжают учиться кодить в Kodland, но теперь они еще и учат дизайн, 3D модели, создание сайтов, и многие другие вещи. Сложному продукту стало тесно в старой айдентике.
Задачи
Старая айдентика отлично подходила для узкого продукта — школы программирования. Однако, платформа сильно поменялась: появилось множество новых курсов и новых конкурентов. Также была задача найти язык общения, подходящей для разношерстной ЦА: дети от 6 до 17, и их родители.
Вместе с Kodland мы с первого дня решили, что с детьми не будем сюсюкаться. Никакой снисходительности. Диджитал навыки можно освоить сравнительно быстро и войти в профессию в раннем возрасте — вот окажетесь на работе с пятнадцатилетнем тимлидом, спросите, может он в Kodland успел поучиться.
Концепция
Ребрендинг это всегда сложная задача — создать что-то новое, сохраняя преемственность образа продукта. Концепцию искали долго, через множество итераций — и свою оригинальную айдентику было почти больно отбрасывать.
В старой айдентике ребенок через фонарик открывал мир кода. Этот ребячески-приключенческий фонарик, ленточка кода, добрые иллюстрации — с легким сердцем от всего избавились. Старая концепция не решала новые задачи, вовремя отпустили на покой. Это был кропотливый, итеративный процесс — вместе с дизайнерами Kodland препарировали каждый элемент старой айдентики, и отказывались от того, что платформа переросла.
В итоге, фокусируемся на самих детях — к этому решению привело понимание категории и позиционирования клиента. Новая концепция строится на том, что они будущие создатели — даже пока учатся, уже создают проекты. Дети сами превращают свои мечты в реальность.
Без натянутых улыбок
Чтобы такая концепция работала, нужно показать самих детей. Не стоковые фотки с натянутыми улыбками, а ученики Kodland, с энтузиазмом рассказывающие о своих проектах.
Ушли от иллюстраций — проект про реальных людей и их реальные проекты. Упор на человечность, на самих детей и их интересы. В отличии от многих других эдтехов, не выделяем отдельно детей и родителей. Копирайт разговаривает со всеми равно уважительно, без какой-то снисходительности — разговариваем с детьми также, как и со взрослыми. Мы их слушаем, и показываем чего добились такие же дети. Вместе с прозрачным описанием процессов и устройства платформы этот подход помогает родителям понять, что ребенку будет интересно и безопасно.
Детали
Изначально думали использовать много градиентов, но оставили только немного волн на салатном — сочном и нестандартном цвете для сегмента, градиенты были бы только лишними. Этот свежий цвет называется Arctic Lime, но в гайдлайнах мы зовем его Кермитом (что не только мило и забавно, но помогает в работе запоминать цвета).
Также в палитре используем голубой и розовый, цвета все вместе образуют яркий и энергичный образ.
Для акцентов добавили множество псевдо-3D элементов, исходя из цифрового контекста, в котором живут современные дети. Сделали их объемными, потому что для современного ребенка они почти реальные. Плоские выглядели бы совсем неживыми и виртуальными.
Также одной из задач ребрендинга было обеспечить легкую масштабируемость стиля. Такую псевдо-3D графику куда проще сделать, чем реальные модели. Стиль легко распространить на всю коммуникацию.
Интересная задача, подобрать шрифт для концепции связанной с созиданием. “Креатив должен быть креативным”. Изначально даже думали о чем-то акцидентном, в духе нового логотипа ВкусВилл. Но все-таки важнее, чтобы текст можно было прочитать. Умеренно используем контрастные шрифты, но больше выделяем за счет бабблов и разных цветов.
Выводы
Этот проект показал нам, как подходить к большим и сложносоставным эдтехам более систематизировано. Мы почти как дети — тоже научились в Kodland.
Хочется отдельно выделить дизайнеров Kodland — на всех проектах мы глубоко вливаемся в продукт, но тут временно почти срослись с командой. Всем респекты.
Поддерживаю! Молодцы)
Комментарий недоступен
Делали явно не профессионалы, а "креативщики". Как результат, самый важный элемент конверсии - кнопка записи просто уехала вниз и ее не видно
У меня она там, где должна быть. Другое дело, что она в таком виде не отличается от некликабельного текста выше
об этом и речь, что сайт не адаптирован под разные разрешения. А оно у меня стандартное 1600 x 900
Это не стандартное
Ну слава богу, а то одни позитивные комментарии! Думал что виси уже сломался))
Мы сделали под 200 сайтов и к нам только однажды пришли с претензией, что у него низкая конверсия.
Уверен, что у этого сайта будет все збс. А если и придут с претензией - мы отсмотрим вебвизор и все починим :)
Еще раз, вы можете придумывать любую легенду, но сайт говно! Категорически вас нельзя допускать к созданию сайтов. Там просто концептуальные ошибки, которые может допустить только человек, который никогда не делал сайты и не в курсе их задачи.
а ты эксперт в дизайне и вебе? какие там концептуальные ошибки? пока говно только твой комментарий
Урыл так урыл.
Я круче - я потребитель :-) Сайт дерьмовый, чуть не стошнило. А какие ошибки, написано выше.
На вскидку:
1. В качестве "отказа от иллюстраций" в иллюстрацию тупо напихали фоток. Уже сам этот способ грубая ошибка.
2. Просто так использовать детей НЕЛЬЗЯ если вы не супер художник. Они СТРАШНЫЕ. Растущие неравномерно лица, тела, прыщи, кривые зубы. Получится на ваш взгляд мило, но для многих - отвратительно. У них получилось, я так подозреваю, отвратительно для всех.
Достаточно?
Часто нажимаете на кнопку «Заказать», «Зарегистрироваться» сразу после того как зашли на сайт?)
Классно)
Комментарий недоступен
Отличная работа, ребята
Комментарий недоступен
Крутая и важная работа! Браво, коллеги!
Ну куда без ложки дегтя от эспердов
Взрослые оценивают как взрослые. ASSпертов, как всегда волнует цвет, кнопки и прочая лабуди-лабуда. Один даже назвал себя потребителем, хотя продукт для детей. Не сходится
До цвета не понимаю доебки. Я например когда был ребенком вечно бился со своей мамой, которая пыталась натянуть на меня черную кофту. Я до дыр заносил свою кислотную толстовку и не снимал ее просто потому что она яркая. Мамкин-бунтарь в истинном проявлении. Тут история такая же - дети это жуткие истероиды(истероидный тип личности). Они тянутся ко всему яркому и необычному, как например этот сайт. Доебался до цветов человек, у которого скорее всего одна палитра: белый, черный, синий.
Докопаться до кнопки в самом начале это конечно сильно. Ее даже назвали "Главным элементом конверсии". Текст, позиционирование и качество услуги вышли из чата.Я лично кнопку увидел без проблем, но кого я не видел, так это человека, который покупал по принципу: "О, КНОПКА ВИДНЕЕ. ТУТ И БЕРУ". Чтобы купили услугу или продукт не нужно делать яркую кнопку. Если человеку продать идею, то он захочет купить и в лепешку разобьется, чтобы найти эту кнопку. (Не надо так делать)
Товарищи же по цеху сделали все, чтобы повысить лояльность к kodland:
1. Поместили живые лица и видеоотзывы. Приятно было смотреть за прогрессом детей и тому, как они рассказывают о своих мини-проектах. Выглядит живо.(Был коммент, где обосрали детей за их непривлекательность. Мне даже смешно такое читать. Сразу представляешь, как человек выходит на улицу и блюет от обилия непривлекательности. Темболее автор написал, что решили отказаться от идеи натянутой улыбки)
2. Яркие цвета и необычные иллюстрации. Писал в начале почему это работает. Потому что ЦА - дети
3. Копирайтер. Не видел, чтобы кто-то хвалил копирайтера в Embacy, а зря. Он/а умело прошлась по болям детей без сусюканья. Им объясняют как взрослым, но видно, что для детей.
Выгода: "Индивидуальные занятие по 25 минут, чтобы ты не успел заскучать" это просто лучшее. Будь я ребенком, то немедленно отдал бы все деньги родителей
4. Малая величина сайта. Многие подумают: "Что? То что они схалтурили и сделали маленький сайт это еще и плюс? Нихерасе". Да это плюс, но и минус одновременно.
В 3 пункте я сказал, что дети быстро начинают скучать, поэтому яркий и короткий сайт тут идеально подойдет. Детей не грузят инфой которая им не нужна - они довольны
Но не обошлось без минусов:
1. Малая величина сайта. Это прекрасно, что сайт сделан для детей, но не для взрослых... Копирайтер прекрасно отработал на детей, но взрослых волнует вопрос оплаты. Я копался на сайте в поисках цены, но ничего не нашел. Прекрасно, что есть пробное занятие, где всё объяснят, но со стороны взрослых есть болезненная ситуация с оплатой. Вдруг цена будет не такой как ожидали, а ребенку все понравилось и он в восторге, как ему потом отказать?
Я могу предположить, что это маркетинговый ход, но он нечестный по отношению к покупателю и портит все восприятие. Вы как агентство должны продумывать все даже до таких мелочей. Ничего не мешает сделать вкладку на хэдере "Курсы", куда поместите всю инфу вместе с ценой.
2. Мало интерактива. Вроде как для детей, но не учли тот факт, что дети балдеют от интерактивов. Что-то потрогать, потыкать - их тема. Не нужно делать что-то чересчур. Прекрасный пример - Яндекс.Практикум. Их курсы сопровождаются скриптовым диалогом. Это очень приятно, особенно потому что создается ощущение, что с тобой говорят лично. Если хотели коммуникацию с детьми, то вот она
3. Ваши спринты. Я понимаю что от этого не уйти, но из-за спринтов некоторые продукты выходят сыроватыми, как и этот. При первом заходе на сайт я хотел сразу узнать подробнее про курсы, но этой вкладки не было. Оставили 3 плашки, в которых ничего не понятно. Также и с методикой работы. Вроде что-то объяснили, а понятнее не стало. Непорядок
Итог: Сайт работает? Продает? Ну и заебись
P.S. *?№"!# Сел искать вакансии, а уже час пишу комментарий на 1 лайк. Тайм менеджмент - хуле
Вижу, что цвета поменяли. Что еще сделано - непонятно.
Дизайнер явно припысывает себе заслуги бизнеса
Комментарий недоступен
Молодцы!
Отличный кейс
Комментарий недоступен
Абажжыте, школа учит в т.ч. и дизайну, но себе дизайн они сделать не смогли? Ну штош.
Если честно, было прошлый вариант был лучше. А больше 2 курсов у них стало ещё и до прошлой версии. Дизайн в этом никак не помог.
Ужасно. Прям пример как делать не надо. У вас там хоть кто-то есть с образованием?
1. Нельзя "уйти от иллюстраций" путём запихивания в иллюстрации фоток. Чаще всего эта полумера приведёт к сильно диссонансу "растрвектр-живоемёртвое" вызывающему рвотный рефлекс. Нужен человек с прямым глазом и навыками в живопись, что бы проверить итог на баланс. В вашем случаи даже без такого человека понятно, что результат отвратительный. Можно попробовать исправить добавлением рамок и каких-то отдельных зон для разделения. Но проще так не делать вообще. Это колхоз.
2. С детьми надо работать очень осторожно и крайне деликатно. Кривыми руками как у вас лучше не лезть. Дети бывают страшные. По временным естественным причинам: нелинейный бурный рост вызывающий диспропорции форм лица и тела, кривые зубы, прыщи, жирная кожа и т.д. Вероятно, кто-то у вас там беременный или с нарушением гормонов, что такой стрём ему кажется милым 😁
Это основное. По мелочам вроде кислотных сочетаний цветов, разных по качеству фотографий, использование на сайте сканов этого же сайта и т.д. я уж не буду.. Нельзя вам в дизайнеры..
Красивое
хороший кейс!
Мне одному этот зелёный выжигает глаза? Посмотрел на разных мониторах.
мдэ, делаем для пользователей, только пользователей нет в одном месте, клепают как получится, а если чо то "вебвизор посмотрим и ок" — НИХЕРА НЕ ОК
Уволены