Комментарии
Интерактивный сайт с личным кабинетом для человечных юристов «Амулекс»
Результат Процесс
Амулет против несправедливости
Интерактивный сайт с личным кабинетом для человечных юристов «Амулекс»
В России принято полагаться «на авось», поэтому о юридической защищенности мало кто задумывается. А когда дело запахнет жареным (соседи затопят, застройщики обманут, мошенники автоподставу подстроят), вот тогда нужно срочно искать юриста. Да не простого, а чтобы дело выиграл и денежку небольшую за работу взял. Бывает ли так? Увы — нет. При форс-мажоре не до выбора, поэтому люди соглашаются на огромные ставки непонятным юристам и сомнительный успех дела в суде.

А вот те, кто купил волшебную карту от проверенных юристов «Амулекс», спят спокойно: в случае чего, они всегда смогут написать в чат или позвонить специалистам компании, которые проконсультируют по-человечески, а потом и все сопутствующие услуги окажут: и документы посмотрят, и в суде защитят. У заказчика за годы работы сложилось доброе имя и накопилась внушительная юридическая практика, а вот сайт подустарел и требовал обновления.
Задачи
1
Разработать свежий и современный дизайн с учётом трендов и потребностей целевой аудитории.
2
Уделить внимание структуре — пользователям должно быть легко находить нужную информацию.
3
Отразить преимущества «Амулекс»: экспертизу, круглосуточность работы, удобство и доступность.
4
Предусмотреть несколько способов обратной связи (в том числе — удобную форму обратной связи).
5
Мотивировать посетителей сайта к покупке карты «Амулекс».
6
Адаптировать сайт под различные устройства.
Аналитика
Целевая аудитория «Амулекса» разнообразна: это и физические лица, и юридические. И постоянные клиенты, и потенциальные. И СМИ, и партнёры. Частным клиентам важно понять, чем занимается компания, какая может быть польза от её услуг — причём, информация нужна без юридической зауми и сложного канцелярского языка (к которому все привыкли, читая законодательство). Корпоративным клиентам частенько приходится решать вопросы с контрагентами в суде, поэтому им интересны успешные кейсы, новости и перечень оказываемых услуг. Партнёрам важны условия сотрудничества, а постоянным клиентам — своё пространство, где они могут получать консультации и знакомиться с новостями.
На прототипе после интерактивного промоблока (о нём чуточку позже) с преимуществами «Амулекса» предложили блок с достижениями компании, ключевыми цифрами и отзывами. Далее — блоки с тестом и сравнением услуг обычного юриста и специалистов «Амулекс», которые формируют потребность заказать карту юридической помощи.
Ниже — вызываем доверие, показывая ключевых лиц компании и простоту покупки карты в 4 шага. А далее — простая таблица со сравнением условий у разных тарифов.
«Амулекс» славится своим креативным подходом к оказанию юридических услуг — юристы консультируют на простом понятном языке, круглосуточно и оперативно. За счёт этого о компании знают и упоминают крупные медиа вроде телеканала «Пятница» или новостной интернет-площадки Meduza. Мы отразили это на прототипе, создав особый блок MEDIA.
Одна из важных составляющих сайта — личный кабинет, где пользователи, купившие карту, могут консультироваться с юристами, хранить документацию, пользоваться шаблонами для оформления нужных документов и не только. На главной мы показали ключевые преимущества кабинета, чтобы создать эффект присутствия — как будто карта уже ваша. И конечно, оставили место под блок с вопросами, где удачно вписалась форма обратной связи.
Дизайн
Клиенту нравились референсы с анимацией текстов, крупными цифрами, акцентными фотографиями и цепляющие заголовки. За основу цветовой гаммы мы взяли цвета из логотипа, дополнив цветовую схему нейтральными темно-серыми и светло-серыми оттенками.
Мы предложили яркий и динамичный дизайн — заказчик очень хотел, чтобы на сайте были интерактивные элементы навигации. В промо — ёмкий интерактивный блок, где разыгрываются несколько типичных ситуаций, когда может понадобиться помощь юриста, а рядышком — смартфон с появляющимися сообщениями внутри чата. Клиенты «Амулекс» могут переписываться с юристом компании в любое время и в любом месте.
Заказчик изначально хотел для проекта больше динамики, поэтому почти для каждого блока на главной мы продумали свои фишки и анимации, чтобы на этапе разработки разделы буквально ожили :)

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

Татьяна
Руководитель проекта
На текстовых страницах у заказчика есть возможность использовать классные нестандартные блоки, чтобы разнообразить повествование: например, плашки с отзывами и цитатами или фото и видео необычной формы.
На странице о компании отдельно отрисовали прикольный таймлайн для блока с историей
В разделе с исследованиями мы продумали особый визуал. А если пользователь случайно попадёт на 404-й страницу, там появится суровый самурай в деловом костюме с катаной. Этот образ очень нравился заказчику, и он хотел его использовать — в итоге мы сделали его фишкой на странице с ошибкой.
Разработка
Сайт «Амулекс» привлекает внимание пользователя с первого экрана — в слайдере промоблока появляются крутые анимированные сценки с популярными жизненными ситуациями, в которых требуется помощь юриста. Параллельно в смартфоне рядом оживает чат с перепиской героев :)
Фишка «Амулекса» — в принципе работы их сервиса. У пользователя есть возможность переписываться напрямую с «личным юристом», который пришлет документы, запишет аудиосообщение и разберет конкретный вопрос. А ещё — даст номер, по которому можно будет связаться в экстренной ситуации. И вместо длинных описаний этого процесса мы показали его просто и доступно в промоблоке с помощью классных анимированных «мультфильмов».

Татьяна
Руководитель проекта
Чтобы реализовать анимацию для каждой ситуации, дизайнеры отрисовали мини-сценарии, расписав для кодеров, что и в какой последовательности должно происходить.
Тема с ДТП повторяется в копирайте — слоны иногда тоже попадают в аварию :)
Главная пронизана анимациями: практически все блоки как-то шевелятся или меняются от взаимодействия с пользователем: строчка выбранного тарифа подсвечивается на ховере, элементы при пролистывании горизонтальных слайдеров в блоках аккуратно подгружаются, а форма для обратной связи эффектно появляется слева. А чтобы рассказать больше фактов о компании, внизу выводится плашка с тремя ключевыми цифрами: при скролле от экрана к экрану они меняются.
В блоке с преимуществами личного кабинета заказчик может менять изображения в слайдере и устанавливать пины в любых местах на скринах в админ-панели. Там же можно редактировать крупные цифры из блока ниже и менять фотографии ключевых персон компании.
Особенность проекта в том, что он сделан не на Битриксе: в качестве фреймворка здесь использован Laravel, а админку мы реализовали с помощью Laravel Voyager: внутри она выглядит опрятно и пронизана морской тематикой — всюду море и якоря.

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

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

Татьяна
Руководитель проекта
В разделе «Бизнесу» заказчик может афишировать будущие мероприятия, добавлять обзоры или размещать ответы на вопросы клиентов в разделе с аналитикой, а также статьи и комментарии в блоке с публикациями.
И конечно, чтобы пользователям было легко найти нужную информацию на сайте и быстро связаться с юристами «Амулекс» с любого устройства, мы реализовали адаптивную версию. Здесь мы сохранили крутую анимацию в промоблоке и перекомпоновали ключевые разделы на главной так, чтобы они не потеряли своей фишки.