[ UI/Chat ] Cursor-style이 맞을까? Chatbox 맞을까?

결론적으로 말하면 공간의 제약을 이해하는 게 좋을 거 같다.
나의 홈페이지 경우 Desktop 사용자에게 더 친화적으로 적용했다.

 

하지마 최초의 시작 이러하다.
왜냐하면 특별한 고민을 하지 않았다.

상담형 챗박스(Chatbox) -> Cursor-style 대형 패널

 

더불어, 여전히 mobile size에서는 상담형 챗박스(Chatbox)를 사용하고 있다.

 

 

분명 크기는 다른 경험을 만들어 낸다.

하나는 화면의 30-50%를 차지하는 큰 채팅창(Cursor나 ChatGPT 같은)이고,
다른 하나는 웹사이트 구석에 있는 작은 고객서비스 채팅창이다.

 

일관성+ 멀티태스킹

Cursor-style은 텍스트가 덜 줄바꿈되고 전체 대화가 한눈에 보여서, 긴 답변과 복잡한 설명을 따라가기 쉽다.
채팅 외 다른 화면과도 상호 관계를 맺기 쉽다.

Chatbox는 좁은 공간 때문에 계속 스크롤해야하는 필요성이 있다.
채팅 외 정보를 더 쉽게 접할 수 있다.

 

인지

Cursor-style은 넓은 화면으로 인해 텍스트 밀도가 낮아져서,
복잡하거나 감정적으로 민감한 내용(의료 조언, 정신건강 상담 등)을 이해하기 더 쉽다.

Chatbox는 지속적인 크기 조정과 스크롤이 읽기 흐름을 방해할 수 있다.
다만, 텍스트의 밀도를 선호하는 사람이 있기 때문에 꼭 인지부분에서 나쁘다고할 수 없다.

 

 

최적화 여부

Cursor-style

- 복잡한 문제 해결이나 멀티테스킹이 필요한 경우
- 긴 설명이나 단계별 안내가 필요한 경우

Chatbox

- 간단한 FAQ나 빠른 지원
- 모바일 환경에서 화면 공간이 제한적인 경우

번외

- 창 크기: 400-600px 너비, 최소 300px 높이

- 위치: 우측 하단 또는 사이드 패널 형태

- 텍스트 라인 길이 : 80자 이하로

 

 

참조:

https://www.researchgate.net/publication/373362436_Website_Traffic_Patterns_and_User_Behavior_A_Comprehensive_Study_of_Visitor_Interactions_and_Engagement_Metrics

https://userpilot.com/blog/user-behavior-patterns/

https://onlinelibrary.wiley.com/doi/10.1155/2018/2056290

https://baymard.com/blog/line-length-readability