Interfejs widgetu dla czat - bota na stronie

Opisz projekt, dla którego trzeba opracować projekt interfejsu:

Czat - bot, widget na stronie

Krótki scenariusz interakcji interfejsu z użytkownikiem: 

Ból użytkownika: Uzyskać odpowiedź na swoje pytanie

Użytkownik wchodzi na stronę i otwiera widget czat - bota, zadaje swoje pytanie i wybiera najbardziej odpowiednią odpowiedź z listy.
Po zapoznaniu się z artykułem może wysłać skargę, naciskając przycisk “nie”, lub zostawić swoje dane kontaktowe w czacie po naciśnięciu przycisku “Skontaktuj się ze mną”.
Użytkownik może wysłać swoje pytanie za pomocą wiadomości audio, naciskając przycisk “Mikrofon”, który włączy nagrywanie audio.
Użytkownik może nacisnąć przycisk i odsłuchać dowolną wiadomość (na przykład artykuł)

Podczas wprowadzania wiadomości użytkownikowi wyświetlane są podpowiedzi do wprowadzenia z możliwymi pytaniami.

Główne elementy interfejsu:

Dostępne teraz:

1. Zachowywana jest historia wiadomości bota i użytkownika

2. Przyciski wyboru artykułów (od 1 do 5) oraz przyciski akcji "Tak", "Nie", "Skontaktuj się ze mną", "Nie znalazłem swojej odpowiedzi" (przykład można zobaczyć na stronie - zadaj pytanie botowi)

3. Podświetlane linki i e-mail w tekście

4. Obrazek (awatar) bota, operatora i użytkownika

5. Wprowadzanie wiadomości audio 

6. Podpowiedzi przy wprowadzaniu wiadomości w celu wyboru najbardziej odpowiedniego artykułu

7. Odtwarzanie audio “odpowiedzi” i proponowanych przez bota pytań

8. Ikona widgetu czat - bota, po naciśnięciu której otwiera się okno dialogowe. 

Dla dalszej realizacji:

1. Bot może przełączyć na operatora, bez działań ze strony użytkownika (możliwa zmiana obrazka bota, powiadomienie, że teraz rozmawia z Tobą operator wsparcia technicznego)

2. Wyświetlanie w dialogu obrazków i wideo (zarówno ze strony użytkownika, jak i ze strony bota) 

3. Wysyłanie plików

Czy trzeba używać wizualnych obrazów, postaci w projekcie interfejsu?

Postacie: Bot, Użytkownik, Operator wsparcia technicznego

Język interfejsu:

Język rosyjski

Czy masz stronę internetową i identyfikację wizualną?

https://xn--80aaj5aiiy2b.xn--p1ai/index.html?system=faqsamozanyatie - PRZYKŁAD tego, jak obecnie wygląda CZAT-BOT na stronie

https://asknpd.ru/ - landing page

Aplikacja asknpd.ru dla IOS i Android

Czy interfejs powinien być w identyfikacji wizualnej?

Nie (potrzebne świeże pomysły)

Określ główne i dodatkowe kolory, które należy użyć w projekcie interfejsu:
Kolory - według Twojego uznania. Kolory będą zmieniać się automatycznie z panelu użytkownika. W pierwszej kolejności interesuje UX.

Czy istnieje prototyp interfejsu?

W załączniku zrzuty ekranu widgetu czatu, wymagana jest całkowita przebudowa mechanizmu działania widgetu.

Co oczekujemy od Ciebie:
Nieszablonowej przeróbki istniejącego widgetu z uwzględnieniem wdrożenia dodatkowej funkcjonalności oraz stylistycznego ukierunkowania.
Kolory, czcionki i ikony będą zmienne w panelu użytkownika.

Опишите проект, для которого нужно разработать дизайн интерфейса:

Чат - бот, виджет на сайте

Краткий сценарий взаимодействия интерфейса с пользователем: 

Боль пользователя: Получить ответ на свой вопрос

Пользователь заходит на сайт и открывает виджет чат - бота, он задаёт свой вопрос и выбирает наиболее подходящий ответ из списка.
После ознакомления со статьёй он может отправить жалобу, нажав кнопку“нет”, либо оставить свои контакты в чате после нажатия кнопки“Связаться со мной”.
Пользователь может отправить свой вопрос при помощи аудио сообщения, нажав на кнопку “Микрофон”, которая включит запись аудио.
Пользователь может нажать на кнопку и прослушать любое сообщение (например, статью)

При вводе сообщения пользователю показываются подсказки для ввода с возможными вопросами.

Основные элементы интерфейса:

Доступные сейчас:

1. Сохраняется история сообщений бота и пользователя

2. Кнопки выбора статей (от 1 до 5) и кнопки действий "Да"," Нет", "Связаться со мной", "Не нашёл свой ответ"(пример можно посмотреть на сайте - задайте вопрос боту)

3. Подсвечиваемые ссылки и email в тексте

4. Изображение (аватарка) бота, оператора и пользователя

5. Аудиоввод сообщения  

6. Подсказки при вводе сообщения для выбора наиболее подходящей статьи

7. Аудио воспроизведение “ответа” и предлагаемых ботом вопросов

8. Иконка виджета чат - бота, по нажатию на которую открывается окно диалога. 

Для дальнейшей реализации:

1. Бот может переключить на оператора, без действий со стороны пользователя (возможно замена картинки бота, уведомление о том, что сейчас с Вами общается оператор технической поддержки)

2. Отображение в диалоге картинок и видео (как со стороны пользователя, так и со стороны бота) 

3. Отправка файлов

Нужно ли использовать визуальные образы, персонажи в дизайне интерфейса?

Персонажи: Бот, Пользователь, Оператор технической поддержки

Язык интерфейса:

Русский язык

Есть ли у вас сайт и фирменный стиль?

https://xn--80aaj5aiiy2b.xn--p1ai/index.html?system=faqsamozanyatie - ПРИМЕР того, как выглядит сейчас ЧАТ-БОТ на сайте

https://asknpd.ru/ - лендинг

Приложение asknpd.ru для IOS и Android

Должен ли быть интерфейс в фирменном стиле?

Нет (нужны свежие идеи)

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

Есть ли прототип интерфейса?

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

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