Виджет на сайт, который понравится всем: как мы определили внешность голосового ассистента Ellectra

Виджет на сайт, который понравится всем

Когда мы слышим слово «дизайн», первое, что приходит в голову — эстетика. Красиво или некрасиво. Современно или устарело. Но если мы говорим о продукте, который должен вовлекать, вызывать доверие и побуждать к действию, то дизайн — это, прежде всего, поведение.

В случае с голосовым ассистентом Ellectra, поведение начинается с первого визуального контакта. От того, как выглядит ассистент, зависит, заметит ли его пользователь, захочет ли с ним взаимодействовать, поймет ли, что перед ним — «живой» помощник, а не очередная кнопка чата.

Мы провели собственное исследование и сопоставили его с глобальными данными от Stanford, Google, Apple, Microsoft и других источников. В результате появился виджет, который намного больше, чем просто “приметный”.

Доверие начинается с формы

Первое, что видит пользователь на сайте — это не функции ассистента, не интеллект и не возможности. Это форма. И от её визуального кода зависит то, что произойдет дальше: клик, игнор или закрытие сайта.

Мы начали с вопроса: какой форме пользователь доверяет больше всего?

Сфера

Сфера — это не просто симпатичный объект. Это форма, которая воспринимается как безопасная, завершенная и “человеческая”. 

Исследование Stanford «Aesthetics and Trust» (2010) показало, что 74% пользователей доверяют округлым формам больше, чем угловатым — на интуитивном уровне.

Исследование Interaction Design Foundation (2019) дополняет: в интерфейсах с округлыми формами вовлеченность выше на 22%, а первичное доверие — на 15%.

Сфера визуально проста и понятна — она не требует расшифровки, выделяется, но не давит. К тому же, она уже встроена в пользовательскую память как сигнал “голосовой помощник”. Примерами тому служат уже знакомые всем Google Assistant, Siri или Алиса.

Прямоугольник с закругленными углами

Мы используем скругленные прямоугольники в виджете и интерфейсе Ellectra, в том числе в карточках предложений, переходах между состояниями, промо-блоках. Это второй важный визуальный маркер, который:

1. создает структуру и рамку для сложного содержимого,
2. помогает выделить подсказки и ответы ассистента,
3. остается визуально комфортным — без агрессии.

Почему не обычный острый прямоугольник?

Исследование UC San Diego (2013) показало, что остроугольные формы в 28% случаев вызывают подсознательную ассоциацию с опасностью, а 82% пользователей предпочитают элементы с закругленными углами.

Эти принципы закреплены и в гайдах крупнейших технологических платформ:

1. Google Material Design рекомендует скругления как стандарт UX-комфорта.
2. Apple Human Interface Guidelines делают мягкие формы нормой с 2013 года.

И сфера, и скругленный прямоугольник — это не просто формы, а язык визуального доверия, который работает до первого слова Ellectra. Они понятны, привычны и вызывают готовность взаимодействовать — а значит, делают первый шаг к разговору возможным.

Персонификация в UX

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

Ellectra с "глазками"

Персонифицированный ассистент вызывает внимание, интерес, а главное — желание начать контакт. Мы наделяем интерфейс “лицом” — и пользователь подсознательно начинает вести себя иначе: с большей вовлеченностью, доверием и готовностью к диалогу.

Глазки — это не стилистический ход. Это интерфейсный триггер, проверенный десятилетиями. В Tamagotchi именно глаза делали цифрового питомца “живым”.А в Duolingo совенок с глазами стал не просто логотипом, а напарником.

Что показало наше исследование

Мы не стали полагаться только на примеры из истории. Мы проверили эффект персонификации на своей аудитории — 300 респондентов, активные пользователи цифровых продуктов, из которых:

1. 96% предпочли сферу с глазками стандартной кнопке чата,
2. 65% отметили, что «глазки сразу дают понять, что это ИИ, с которым можно поговорить»,
3. 87% назвали виджет с глазками более “живым” и современным.

Таким образом, глазки не просто “украшают” Ellectra — они формируют первое эмоциональное касание и помогают перейти от «вижу» к «взаимодействую».

Liquid Glass — фокус и уместность

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

Поэтому третий уровень дизайна Ellectra — это визуальная среда виджета. Мы выбрали стиль Liquid Glass, или стеклянный интерфейс, чтобы создать эффект выделения без навязчивости.

Что такое Liquid Glass

Это стиль, в котором интерфейсные элементы выглядят как полупрозрачное стекло: с размытым фоном, лёгким свечением и глубиной. Он активно используется в macOS Big Sur, Windows 11 и One UI от Samsung. Liquid Glass — это не просто модный тренд. Это инструмент:

1. визуального фокусирования: пользователь замечает элемент на фоне, но он не кричит;
2. успокоения интерфейса: прозрачность снижает визуальный шум;
3. премиального восприятия: стеклянные слои выглядят «технологично» и дорого.

Microsoft, 2021 г.

Исследования Microsoft по интерфейсам Windows 11 показали, что:

1. 68% пользователей отметили улучшенное визуальное восприятие интерфейсов со стеклянными эффектами,
2. 47% назвали их «более современными»,
3. 61% сказали, что прозрачные слои лучше фокусируют внимание на активных элементах.

Когда мы протестировали разные визуальные стили в рамках Ellectra, результаты были однозначны: 73% респондентов назвали Liquid Glass более современным и визуально привлекательным, а 70% отметили, что такой стиль не теряется на фоне интерфейса, в отличие от обычных плашек.

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

Ellectra — концентрация положительного пользовательского опыта

Виджет Ellectra — это не дизайнерский эксперимент и не набор субъективных решений. Это результат системной работы: мы исследовали, тестировали, сравнивали и выбирали не то, что «красивее», а то, что работает лучше.

1. Сфера как базовая форма — потому что вызывает доверие и быстро ассоциируется с голосовым ассистентом.
2. Скругленные прямоугольники — потому что они структурируют информацию, сохраняя визуальный комфорт.
3. Глазки — потому что персонификация снижает барьер и вызывает симпатию.
4. Liquid Glass — потому что современная визуальная среда помогает выделиться без давления.
5. Собственное исследование — чтобы не просто следовать трендам, а проверить всё на реальных пользователях.

Мы сделали Ellectra такой, потому что хотим, чтобы пользователь не просто увидел, а понял и захотел взаимодействовать. 

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