Задача:
Редизайн для многостраничного сайта, продумать логику подачи информации на главной странице, чтобы увеличить количество звонков с сайта.
БАБУШКА НА ЧАС
Сайт для обучения и поиска нянь, гувернанток и сиделок.
  • 6 НЕДЕЛЬ
    Полтора месяца на дизайн сайта вместе с правками и переговорами.
    6
  • 4 В ОДНОМ
    Выполняла роль дизайнера, менеджера проекта, копирайтера и иллюстратора.
    4
  • 0 ПРАВОК
    Мой дизайн и логику приняли без правок после первой презентации.
    О
  • 255 СТРАНИЦ
    Было сделано, включая ресайзы для экранов компьютеров и мобильных устройств.
    1
РЕЗУЛЬТАТ/
РЕЗУЛЬТАТ/
РЕЗУЛЬТАТ/
РЕЗУЛЬТАТ/
РЕЗУЛЬТАТ/
РЕЗУЛЬТАТ/
РЕЗУЛЬТАТ/
РЕЗУЛЬТАТ/
РЕЗУЛЬТАТ/
РЕЗУЛЬТАТ/
РЕЗУЛЬТАТ/
РЕЗУЛЬТАТ/
РЕЗУЛЬТАТ/
РЕЗУЛЬТАТ/
Особенности проекта
РУНЫ

Владелец сайта просила, чтобы на сайте была руна — это обязательное условие.
ЦВЕТ

Бирюзовый цвет «Тиффани» был обязателен, потому что это любимый цвет начальства.
КОМАНДА

Члены рабочей команды не умели пользоваться Invision и Figma.
СПОНСОРЫ

Спонсоры требовали разместить их логотипы на каждой странице.
Решение: вписать руны в дизайн сайта, не привлекая на них особого внимания.
Решение: цвет холодноват для такого сервиса, но его можно сочетать с другими цветами.
Решение: научить минимальным функциям, которые необходимы для общения удаленно.
Решение: найти, как вписать логотипы, чтобы они не мешали восприятию сайта.
Способ: визуально отделить логотипы от сайта.
Способ: записать обучающее видео, как оставлять комментарии.
Способ: подобрать теплые, пастельные цвета к цвету «Тиффани».
Способ: сделать частью иллюстрации, вписать в узор одежды.
Что я изменила в новом дизайне
К сожалению, у меня не сохранилось, как сайт выглядел до моего дизайна, но я могу описать проблемы, по которым он не работала так, как заказчик ожидал.
Главная страница
Было
Стало
НЕТ ДОВЕРИЯ

Разработчик стремился минимизировать время загрузки страницы, поэтому главная содержала верхнее меню, небольшое описания сервиса и 4 колоноки с ценами, но он не учел двух факторов:

Няня или сиделка — это близкий к семье человек, поэтому создать доверие — это важно. Без него сделка не состоится.

Конкуренты дают развернутую информацию, получая больше заказов потому, что их услуги расписаны и понятно, за что ты платишь.
СОЗДАНО ДОВЕРИЕ

Я сделала главную страницу длиннее с подробным описанием услуг.

Первый экран отвечал на вопрос «что здесь можно сделать» и сразу предлагалось выбрать услугу. Это должно было сработать для тех, кто не хочет разбираться, или на сайте уже во второй раз, например, перешел с закладки и уже все знает.

А для тех, кто хотел почитать подробнее, сравнить и все взвесить, было достаточно информации к изучению.
НАВЕРНОЕ ЗАБРОСИЛИ

Цвета и шрифты создавали ощущение заброшенного несовременного сайта. Это не вызывало доверие и клиенты не звонили.

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

Я понимаю, что разработчик сделал все, чтобы загрузка была по-настоящему быстрой.
ПРИЯТНОЕ ВПЕЧАТЛЕНИЕ

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

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

Иллюстрации выбраны не случайно, классических иконок нет, это добавляет расслабленной атмосферы, больше плавных линий и дает возможность вписать руны!
Презентация
первой страницы
Это запись, которую я отправила заказчику для утверждения дизайна первой страницы. Дизайн был принят без правок.
Изменила блок
с ценами на услуги
Было
Стало
НЕДОСТАТОЧНО

Описание услуг было кратким и написано сплошным текстом.

Путаница возникала тогда, когда клиент хотел купить услугу «Консультация специалиста», но получить ее без доступа к базе с соискателями было невозможно. Сама услуга стоила 1500 р., а база 2500 р.

Клиент, который хотел попробовать сервис выбирал самую недорогую услугу и сталкивался с тем, что ему нужно было докупать базу. Это вызывало недовольство, так как разъяснений о покупке базы до оплаты услуги не было.
ЯСНО И ПОНЯТНО

Я разбила все офферы на буллиты — так их легче воспринимать.

Соединила услугу консультации и покупки базы, так как это помогает избежать путаницы.

Расположила офферы слева направо по возрастанию, а в конце то, что можно получить бесплатно, чтобы клиент сначала увидел все, что есть перед тем, как дойти до того, что бесплатно.
Изменила
анкету соискателя
Было
Стало
ТРУДНО ВОСПРИНЯТЬ

Анкету соискателя было трудно воспринять, так как текст не был выстроен по иерархии или разбит на абзацы.

Заказ дополнительных платных услуг — просмотр аналитики и психологического заключения по соискателю — был оформлен иконкой «глаз». Так как иконка была маленькой, в общем потоке страницы в тексте ее было сразу не заметно.
ЛОГИКА И ПОРЯДОК

Разбила информацию на главную и второстепенную.

Главная — это фото, цена, локация, опыт — крупные мазки, на основе которых принимается общее решение — да/нет.

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

Так же получение платной услуги оформила кнопками — так понятнее и заметнее.
Я сделала первую страницу и видео с объяснениями, почему я приняла то или иное решение. После этого видео правок по логике или дизайну не было.
О ГЛАВНОЙ
Конверсия выросла, а это именно то, для чего меня звали в проект. Я рада и горда, что мне удалось решить задачу.
ЗВОНКИ ПОШЛИ!
ОТНОШЕНИЯ
Выстроить отношение так, чтобы работать было всем комфортно, чтобы даже сотрудники с характером могли найти с тобой общий язык.
ДОВЕРИЕ
После того, как я сдала макет и сайт запустили в работу, ко мне обращались доделывать страницы для других услуг компании.
ОТЗЫВ
Когда понимаешь, что твое дизайнерское решение не просто работает, но и радует людей — это класс =)
Мнение
заказчиков
Скрины прямо из WhatsApp
СДЕЛАНО/
СДЕЛАНО/
СДЕЛАНО/
СДЕЛАНО/
СДЕЛАНО/
СДЕЛАНО/
СДЕЛАНО/
СДЕЛАНО/
СДЕЛАНО/
СДЕЛАНО/
СДЕЛАНО/
СДЕЛАНО/
СДЕЛАНО/
СДЕЛАНО/
Реализация
Мой дизайн не был реализован на 100%, есть отличия как в предоставлении информации, так и в типографике, но он работает, приносит пользу и как дополнительная гордость — это социальный проект, который реально помогает людям.
Задумано
Реализовано
Как сейчас выглядит сайт "Бабушка на час"
ВЫВОДЫ /
ВЫВОДЫ /
ВЫВОДЫ /
ВЫВОДЫ /
ВЫВОДЫ /
ВЫВОДЫ /
ВЫВОДЫ /
ВЫВОДЫ /
ВЫВОДЫ /
ВЫВОДЫ /
ВЫВОДЫ /
ВЫВОДЫ /
ВЫВОДЫ /
ВЫВОДЫ /
Чему я научилась
Это был мой первый проект полностью на Figma, до этого я пользовалась Sketch. На тот момент я не знала, как работать со стилями, компонентами и библиотеками. Сейчас я понимаю, что работа могла бы быть гораздо легче и структурированнее.
ТАЙМИНГ

Сдала проект точно в срок. Как фрилансеру мне важна репутация и если я подведу, ко мне не обратятся в следующий раз.

Поэтому по срокам у меня всегда четко.
ЭМОЦИИ

Иногда комментарии разработчика были резки, я понимала, что он реагирует так, потому что я переделываю его дизайн.

Самое главное — это результат, поэтому я была вежлива и настроена на работу, а не на споры.
ОБЩЕНИЕ

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

Когда клиент вкладывается в работу дизайнера, скорее всего, он ее примет быстрее и без правок.
УВАЖЕНИЕ

Я могла бы рассмеяться про руны и сказать, что невозможно расставить столько лого на каждой странице, что цвет «Тиффани» не подходит сервису.

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