AI 제품에서 UX 패턴 확인하는 ‘Shape of AI’

기존에 사용하던 서비스는 물론, 새롭게 등장하는 서비스에서 빼놓을 수 없는 기능이자 주제는 바로 AI입니다. 그만큼 거대한 흐름이 되었고 이를 잘 활용하지 못하는 서비스는 뒤처진다는 인상을 줄 수 있죠. 또한 사용자 경험에도 중요한 영향을 끼칩니다. 그러나 너무 많은 서비스와 기능이 쏟아져 나오면서, 최근에는 AI가 적용된 서비스에서 UX 패턴을 어떻게 적용하면 좋을지에 대한 논의도 활발한데요.

오늘 소개할 ‘Shape of AI’는 AI의 성장에 따라 사용자 경험은 어떤 영향을 받고 있으며, 어떻게 대응하면 좋을지 살펴볼 수 있는 서비스입니다.

7가지 종류에 따라 UX 패턴 확인하기

‘Shape of AI’는 회원가입을 필요로 하는 곳이 아니라, 매우 간단하게 구성되어 있습니다. 왼쪽에는 패턴에 해당하는 카테고리 7개를 확인할 수 있으며, 오른쪽으로는 선택한 카테고리에 따른 패턴 리스트와 간단한 설명을 확인할 수 있습니다. 기본 선택된 패턴은 ‘Wayfinders’로 인공지능이 포함된 기능을 처음 사용할 때, 상호 작용을 어떻게 하면 좋을지에 대한 내용을 사용자한테 제공하는 방법을 담고 있죠. 제공되는 7개 패턴은 아래와 같습니다.

• Wayfinders
• Inputs
• Tuners
• Governors
• Trust indicators
• Dark matter
• Identifiers

패턴 리스트 중 하나를 선택하면, 상세 화면을 통해 보다 자세한 내용을 확인할 수 있습니다. 저는 넛지를 선택했는데 기본적으로 패턴에 대한 이미지를 커버로 먼저 볼 수 있으며, 패턴에 대한 설명, 사용할 수 있는 상황, 관련 패턴, 사용 사례, 변형 가능한 모습, 고려 사항, 사례 등을 차례로 살펴볼 수 있습니다.

넛지의 경우 서비스 내 적용된 인공지능에 익숙하지 않은 사용자에게 언제 사용해 보면 좋을지, 가장 도움이 될 만한 순간은 언제인지를 파악, 적용해 기능을 사용할 수 있도록 돕습니다.

또한 패턴에 대한 설명은 물론 서로 다른 활용 방법에 관한 내용도 자세히 살펴볼 수 있습니다. 넛지 활용 사례를 보면, 문서 등에 작성한 내용 하단에 인공지능으로 요약하기 버튼을 넣어준다거나, 기존에 자주 사용하던 버튼에 인공지능 활용해 보기 버튼 등을 삽입해 자연스러운 사용을 유도하는 방법 등이 소개되어 있습니다. 실제 적용된 모습과 설명을 같이 볼 수 있어 더 활용도가 높다고 생각합니다.

더불어 단순 소개로만 구성된 것이 아니라, 고려해야 하는 내용을 긍정적인 부분과 잠재적 이슈로 나눠 확인할 수 있다는 점도 큰 매력입니다. 넛지와 관련해 고려해야 할 내용 중 일부를 소개하면, 사용자가 서비스를 통해 달성하고자 하는 목표가 무엇인지 확인하고 이를 도와줄 수 있을 때 새로운 기술(인공지능)을 제안해야 한다는 점을 확인할 수 있습니다. 아무래도 모든 과정에 새로운 기능을 제안하면 오히려 거부감을 가질 수 있고, 학습에 대한 의지를 떨어뜨릴 수 있기 때문이라고 생각합니다.

또 사용자와의 첫 상호작용에서 기능에 대한 모든 내용을 보여줄 필요가 없다는 점도 기억해야 하는데요. 노션에 일정한 내용을 작성한 뒤 사용자에게 내용을 가다듬어 보라는 기능을 제안하는 것, 인공지능을 활용한 모든 기능 살펴보기를 제안하는 것에는 분명한 차이가 있기 때문입니다. 중요한 순간에 사용자에게 가장 필요한 제안이 무엇인지를 따져봐야 한다는 것으로, 이는 사용자 경험에도 꼭 필요한 고려 사항이 아닐까 싶습니다.

마지막으로 패턴에 해당하는 실제 사례를 확인할 수 있습니다. 사례를 확대해서 볼 수 없다는 점은 아쉽지만, 마우스를 가져다 대면 ‘Writer.com is full of small, contextual cues for how to use AI to complete basic tasks’와 같이 어떤 맥락에서 살펴보면 좋은지에 대한 내용을 빠르게 확인할 수 있습니다.

한 가지 패턴을 더 살펴보면, 이번에는 ‘inputs’ 패턴 중 ‘inline action’에 대한 내용입니다. 인라인 액션은 페이지에 이미 존재하는 내용을 바탕으로 상황에 맞게 AI에 질문하는 등의 상호 작용을 의미하는데요.

앞서 입력한 프롬프트를 바탕으로 답변한 내용 중 일부가 될 수도 있고, 특정 아티클의 일부 내용이 될 수도 있습니다. 일반적으로 사용자가 텍스트 일부를 선택할 때 답장이나 작업 버튼을 표시하게 되며, 노션과 같은 서비스는 톤을 변경하거나 내용을 요약하는 등 프롬프트를 섞어 다음 행동을 쉽게 진행할 수 있는 방법을 활용하기도 합니다. 

텍스트를 선택하면 인라인 프롬프트를 제안한다든지, 상황에 맞는 대화 상자를 사용한다든지 텍스트를 변경, 수정하기 전 사용자에게 다시 한번 확인을 요청하는 등 우리가 고려해야 하는 내용도 앞서 확인한 패턴과 같이 살펴볼 수 있습니다. 

노션의 경우 AI를 통해 작성한 내용을 기존 내용에 덮어씌우거나, 아래로 입력하는 방법 등을 사용자에게 제안하는데요. 이러한 사례와 고려 사항을 모든 패턴에서 확인할 수 있어, 실제 적용하는 과정에 많은 도움을 받을 수 있습니다.

한 번은 꼭 써봐야 하는 이유

디자인 패턴을 살펴볼 수 있는 서비스는 기존에도 자주 등장했습니다. 다만 인공지능과 관련된 패턴을 다루면서, 내용까지 잘 구성된 곳은 쉽게 보지 못했는데요. 이곳은 패턴에 따른 상세 내용을 자세히 정리해 놨을 뿐만 아니라, 실제 적용 사례를 함께 확인할 수 있다는 점이 가장 큰 장점입니다.

그리고 현재는 7가지 패턴을 중심으로 내용을 확인할 수 있지만, 인공지능 기술이 적용된 기능 사례를 확인하는 페이지도 준비하고 있습니다. 이러한 라이브러리까지 업데이트된다면, 패턴에 관한 내용과 함께 다양한 사례를 확인할 수 있어, 더 많은 도움을 받을 수 있지 않을까 싶습니다. (메일 주소를 등록하면 오픈 시 바로 확인할 수 있다고 합니다.)

<참고> 

https://www.shapeof.ai/

©️요즘IT의 모든 콘텐츠는 저작권법의 보호를 받는 바, 무단 전재와 복사, 배포 등을 금합니다.