Топ 10 сайтов от веб-студии Молния за 2022

Менеджеры, копирайтеры, дизайнеры и иллюстраторы студии потратили пару дней на пересмотр 160 сайтов, запущенных нами в этом году, и выбрали лучшие на внутреннем голосовании. Оценивали, как визуал и текст решают задачи бизнеса. Про 10 самых ярких кейсов этого года рассказали в статье.

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

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

1. Экспресс-лендинг для Palette Dessert — торты на заказ. Попал на #madeontilda

Заказчики до начала разработки сразили нас фотографиями кейсов. Торты можно отправлять на выставку в картинные галереи, и нас не покидало чувство, что такие шедевры жалко разрезать. А наш дизайнер был невероятно рад такому масштабному и качественному визуалу. Естественно, вся дальнейшая концепция сайта отталкивалась от фотоконтента.

У Pallete Desert есть фирменная карточка — торт Волосатик. Он вызывает эмоции даже у серьёзных взрослых, поэтому стал героем сайта, который сопровождает пользователя до финального блока. Волосатик в сочетании с мимимишным ToV создал бы слащаво-приторное ощущение, а это в нашу задачу не входило. Бренд говорит умеренно игриво, что даже в сочетании с героем создаёт образ кондитерской со вкусом. А объёмная крупная типографика вносит немного брутальности для баланса сладости и стиля.

На сайте предстояло донести много информации: 10 описаний начинок, 6 видов оформления, 5 вариантов мини-десертов. Копирайтер вместе с дизайнером продумывали структуру и формат блоков, чтобы не перегрузить лендинг. В этом помогли горизонтальный скролл и анимация между блоками. Так сайт воспринимается легко и даже немного залипательно.

2. Лендинг для Виталия Ивлева — онлайн-курс по иллюстрации. Попал на #madeontilda

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

Мы стремились сделать лендинг максимально персональным, чтобы он стал отражением преподавателя. До иллюстрации Виталий занимался уличным граффити. Так в концепции появились кирпичные стены и подтёки от краски.

Автор курса отлично понимает боли и проблемы совсем начинающих иллюстраторов. Этими секретами он поделился и с командой. Нашему копирайтеру пришла идея добавить на сайт персонажей — парня, усердно пытающегося рисовать, и чёртика, усердно пытающегося ему помешать. Эти ребята показали, что курс заточен под все сложности, связанные с рисованием, и что автору можно доверять. Персонажей Виталий отрисовал сам специально для проекта и сделал лендинг ещё более личным.

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

3. Многостраничник для Института Итальянской культуры — курсы итальянского языка. Попал на #madeontilda

Нашей задачей было донести пользователю, что это не просто изучение языка, а целое погружение в культуру. Чтобы пользователь прочувствовал дух Италии, мы собрали главные ассоциации: искусство, кино, мода, достопримечательности и старые улочки. Эти образы в дальнейшем использовали и в тексте, и в дизайне.

Заразить идеей освоить новый язык, но не показать его — impossibile (невозможно) ! Наш копирайтер использовал в заголовках итальянские фразы, которые по наведению можно перевести. Это одновременно и интерактив, и изучение. Притягательность итальянских слов усиливает шрифтовая пара: вытянутый гротеск и антиква в начертании Italic.

На обсуждении заказчик оценил референсы с креативными коллажами, и дизайнер приступил к поиску нужных образов и форм. Вдохновившись арками Колизея, создал окна в Италию, через которые видны местные локации и кадры из итальянских фильмов. А яркая отсылка — рука Адама в браслете Gucci — стала запоминающимся элементом на каждой странице сайта.

4. Экспресс-лендинг для Кто круче — онлайн-тимбилдинг для компаний

«Кто круче» — забавная викторина в Zoom, где нужно раньше коллег написать правильный ответ в чат. Тем, кто впервые слышит про игру, сразу на ум приходит привычный Квиз. Поэтому нашей задачей было максимально отстроить бренд от таких сравнений, донести инновационность игры. А, самое главное, передать эмоции, чтобы потенциальный клиент понимал — запоминающийся корпоратив может быть и онлайн.

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

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

Комиксовая тема идеально подружилась с контентом из реального мира: скринкаст из чата команды, фрагмент игры, видео-отзывы. Так удалось наглядно продемонстрировать, как технически проходит игра и насколько это весело.

5. Лендинг для Grace — сервис по подбору сиделок

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

Чаще всего на лендинг попадают люди, столкнувшиеся с болезнью близких, поэтому их эмоциональное состояние подавлено. Мы подобрали заботливый поддерживающий ToV и максимально прозрачно раскрыли условия, которые предлагает сервис.

Главная ценность бренда — это люди, которые готовы предоставлять профессиональный уход за больными и неравнодушны к чужой боли. Наш иллюстратор разработал стилизованные 2D-иллюстрации с собирательным образом сиделок Grace. Ею стала женщина, образованная, находчивая, терпимая, но при этом добрая, располагающая к себе и изящная. Соединить все качества в одном персонаже было довольно сложно, а особенно — подобрать нужный возраст Grace: предстояло создать образ женщины средних лет, чтобы вызывать доверие и у старшего поколения, и у более молодого.

Заботливость текста и персонажа подкрепляет общая дизайн-концепция сайта. Лёгкий небесно-голубой в сочетании с глубоким синим оттенком помогают создать стильный воздушный лендинг.

6. Экспресс-лендинг для TravCave — YouTube-проект о жизни цифровых кочевников

Заказчик пришёл к нам, чтобы собрать 5 парней и 5 девушек для нового YouTube-проекта о жизни профессионалов из сферы digital. Ребята из TravCave приглашают отправится вместе с ними на Бали и показать, как можно продуктивно работать на удалёнке, и при этом путешествовать и тусить.

Нашей задачей было на языке мира digital донести до целевой аудитории, что это не реалити-шоу или TikTok-дом, а экологичный проект без скандалов и выбываний. Наш копирайтер разработал блок, в котором закрыл основные страхи и опасения о формате проекта. А также отсеил нецелевой сегмент, подробно рассказав, кто разыскивается и чем ему предстоит заниматься на проекте.

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

Дух и свободу острова соединили с рабочими digital-буднями в креативных коллажах. Получились расслабленные и безмятежные образы, которые погружают в атмосферу проекта о развитии и work-life балансе. Анимация по скроллу добавляет плавности лендингу и не даёт заскучать.

7. Многостраничник для Альпина PRO — издательская платформа для бизнеса

Альпина Pro предлагает для компаний и авторов внушительный список продуктов: от издательства самых разных форматов книг до их продвижения. К нам платформа обратилась за новым сайтом, который подробно проинформирует о предложениях бренда и повысит лидогенерацию. Заказчик поставил задачу создать современный деловой образ бренда, без налёта книжной пыли и бюрократии.

Чтобы подробно презентовать все предложения издательства и не запутать пользователя, мы продумали многостраничную структуру. Под каждый продукт сделали отдельную страницу, придерживаясь принципа «одна страница — одна мысль», и последовательно донесли все преимущества и условия. Сайт должен работать одновременно с двумя сегментами аудитории: компании и авторы. Мы сделали внутренние страницы «Кейсы» и «Авторы», на которых закрыли вопросы доверия и показали, с кем издательство сотрудничает и какие книги выпускает.

Дизайнеру предстояло разработать яркую сочную концепцию, придерживаясь фирменных цветов бренда. Оранжевый и серый преподнесли в размытых динамичных фигурах, которые помогли уйти от излишней крикливости активных цветов. Для каждой страницы подобрана своя форма. Это позволяет добавить уникальности страницам, но при этом сохранить единство на всём сайте.

На страницах размещено довольно много текстового контента, поэтому стояла задача добавить воздуха и не отвлекать от смыслов лишним визуалом. Для этого продумали нестандартную вёрстку и расставили акценты с помощью анимации. В них можно заметить отсылки к издательской теме: пункты блока открываются, как разворот книги, а плашки сходятся в стопку на полке. Также динамика и лёгкая воздушная вёрстка помогли добавить штрихи в образ прогрессивной компании и создать запоминающийся сайт.

8. Лендинг для Rise — студия интернет-рекламы

Rise помогает увеличивать трафик и повышать продажи. Это опытная компания, которая понимает в качественном сервисе и выстроила все процессы прозрачными, чтобы заказчики знали, куда ушёл бюджет. Rise предлагает много ценностей для своей аудитории, однако создать уникальный лендинг было непростой задачей.

У компании не было фирменного стиля и лого, и в целом никакого фото- или видеоконтента. С одной стороны, это усложняет работу, а с другой — развязывает руки. Дизайнер разработал единый фирменный элемент, который используется на протяжении всего сайта и создаёт мини-композиции в каждом блоке. Это неправильный круг, поделённый на 4 сектора. Для элементов выбрали яркий фиолетовый и дополнили контрастными зелёным и оранжевым, чтобы создать digital-образ компании.

Главным на лендинге остаётся копирайтинг с фокусом на крупных заголовках с ценностями, а разноцветные элементы помогают преподнести их и расставить запоминающиеся акценты. Одна из основных ценностей компании — открытость. Команда стремиться максимально общаться с клиентами, предоставлять огромное количество отчётов и оставлять контакты своих бывших клиентов для рекомендаций. Эту подчеркнули не только в тексте, но и в типографике: использовали только строчные буквы. Это создаёт близость с пользователем на сайте.

Чтобы подчеркнуть стремление к развитию компании и создать динамичный образ, использовали обилие анимации на лендинге. В одном из заголовков заанимировали небольшой интерактив с переключателем, тем самым вовлекая дальше скроллить и изучать предложение.

9. Экспресс-лендинг для Urban Medic — телемедицинский сервис. Кейс попал на #madeontilda

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

Копирайтер разработал последовательную структуру с постепенным знакомством с сервисом и стилизовал подачу под инструкцию от лекарственных средств. Это помогло креативно и структурировано сформировать потребность у целевой аудитории и донести преимущества.

Медицинскую тему в копирайтинге поддержал дизайн. Мы разработали концепцию в фирменных цветах сервиса, а также разместили текстовую информацию на плашках. Всё это перекликается с оформлением самого сервиса и образует единство. На лендинге разместили нестандартные фигуры с эффектом матового стекла, который слегка отсылает к современному врачебному кабинету. А яркие оттенки позволяют уравновесить лишнюю серьёзность и создать френдли-атмосферу.

10. Экспресс-лендинг для FillCamp — детский языковой лагерь. Кейс попал на #madeontilda

У организаторов лагеря уже был лендинг. Он был довольно длинный и тяжёлый для скролла. Заявок приходило очень мало, потому что сайт выглядел слишком сервисно для атмосферы весёлых каникул и не отражал ценности лагеря. Это довольно распространённая проблема сайтов с детскими поездками или путешествиями, об этом мы писали в статье. Решения о покупке путёвок принимают родители, и разработчики слишком концентрируются на серьёзной подаче, совершенно забывая, что у ребёнка тоже должно возникнуть желания отправится в лагерь.

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

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

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

Так прошёл наш 2022. Было много интересных проектов и необычных задач, вместе с ними и продуктивные брейштормы в креативных парах «копирайтер-дизайнер». В результате 16 проектов Молнии попали в галерею #madeontilda .

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

Другие кейсы Молнии этого года можно найти в портфолио на сайте: flashfamily. ru.

Также мы снимаем видео-кейсы. Их, а также забавные клипы ищите в группе Вконтакте: vk. com/flashfamily.

За внутренней кухней и полезностями можно следить в тг-канале: t. me/flash_family.

3636
17 комментариев

Спасибо за подборку таких хороших сайтов

6
Ответить

Спасибо, очень приятно)

1
Ответить

Сайты — супер, и вы — супер! 💛⚡️

3
Ответить

Круто и приятно слышать!

Ответить

Очень красиво. Это выставочные экземпляры или необходимость? У вас есть утилитарные варианты? Как они с точки зрения конверсии, наверно также?

1
Ответить

а как также?
чья необходимость?
куда выставляли то?
но вы правы, оочееень красиво!

5
Ответить

Все сайты из подборки решают свою задачу — приводят клиентов нашим заказчикам. Мы делаем и красиво, и функционально)

2
Ответить