brunch

You can make anything
by writing

C.S.Lewis

by 유훈식 교수 Jun 09. 2024

AI로 UX리서치와 UI디자인 수행하기

AI는 제품과 시스템을 디자인하는 방식을 바꾸고 있습니다. 회의적인 시각을 가진 사람들도 있지만, 이 거대 트랜드의 변화는 거스리기 어려울 것으로 보입니다. 아이디어 브레인스토밍부터 와이어프레임 초안 작성, 세련된 사용자 인터페이스 제작에 이르기까지 각 측면에 적합한 AI 애플리케이션이 있습니다.


AI로 UI 디자인 생성하기

UX 파일럿(UX Pilot): AI UI 디자인은 이러한 도구의 대표적인 예입니다. AI를 활용하여 디자인 워크플로우를 개선하고 디자인 아이디어를 제시하는 방식을 재정의합니다. UX 파일럿을 사용하면 다음과 같은 간단한 텍스트 프롬프트를 만들 수 있습니다. "공유된 관심사를 기반으로 개인을 연결해주는 중매 플랫폼" 와 같은 간단한 텍스트 프롬프트를 단 몇 초 만에 멋진 디자인으로 바꿀 수 있습니다.

UX 파일럿 AI: Figma의 하이파이 디자인 기능


AI로 와이어프레임 생성하기

디자인 아이디어를 구상하는 단계에서는 처음부터 아이디어를 떠올리는 것이 어려울 때가 많습니다. 따라서 빈 캔버스에서 시작하여 작업을 더욱 어렵게 만드는 대신 AI가 먼저 시작하도록 할 수 있습니다. UX 파일럿 와이어프레머(UX Pilot Wireframer)를 사용하면 다음과 같은 간단한 텍스트 프롬프트를 만들 수 있습니다: "현금이 부족한 개인과 잠재적 대출 기관을 연결해주는 플랫폼입니다." 와 같은 간단한 텍스트 프롬프트를 단 몇 초 만에 와이어프레임으로 만들 수 있습니다.


피그잼(FigJam) AI를 사용한 플로차트

피그잼은 플로차트를 쉽게 생성할 수 있는 방법을 제공합니다. 프롬프트(플로차트 지정)를 작성하고 생성을 클릭합니다.


피그마는 쇼핑 프로세스를 캡처한 깔끔하고 직관적인 순서도를 만들었지만 표면만 훑어보았습니다. 피그잼은 깊이보다는 명확성을 목표로 AI 사용을 단순하게 유지하기로 결정한 것 같습니다.


 UX 파일럿에 동일한 프롬프트를 제공했습니다:

UX 파일럿의 반응은 처음에는 피그잼의 단순함을 반영하는 것처럼 보였습니다. 하지만 자세히 살펴본 결과, UX 파일럿은 피그잼에는 없는 깊이를 보여주었습니다. 쇼핑의 뉘앙스를 정확하게 포착했습니다.

AI로 UX 차트 및 사이트맵을
만드는 방법에 대해 자세히 알아보기

UX와 AI: 현재 상태와 앞으로의 미래

UX 프로세스에의 실제 적용

UX 디자인 프로세스에 AI가 점점 더 많이 적용되고 있으며, 우리 팀도 디자인 프로세스를 가속화하기 위해 AI를 적극적으로 활용하고 있습니다. 이 글에서는 현재 가장 실용적인 AI 도구 몇 가지를 살펴보겠습니다: ChatGPT와 Midjourney입니다.


ChatGPT

ChatGPT는 인공지능과 대화를 나눌 수 있는 도구입니다. 기회는 무한해 보이지만 명심해야 할 몇 가지 제한 사항이 있습니다. 첫째, ChatGPT는 텍스트 기반 결과물만 생성할 수 있습니다(일부 형식이 제한됨). 둘째, 답변의 글자 수에 대한 공식적인 제한은 없지만 답변이 너무 크면 ChatGPT가 결국 끊어집니다. 마지막으로, GPT는 2021년까지 인터넷 정보에 액세스할 수 있습니다. 이러한 제한에도 불구하고 ChatGPT의 기능을 테스트한 결과 다음과 같은 사용 사례를 발견했습니다:


사용자 페르소나

유용한 해킹 방법은 ChatGPT에 특정 산업 분야의 특정 사용자 유형에 대한 UX 페르소나를 생성하도록 요청하는 것입니다.

{산업}의 {사용자 유형}에 대한 UX 페르소나 만들기

물론 더 많은 정보를 제공할수록 좋지만 좋은 시작입니다. 더 나은 정보를 얻으려면 관심 있는 특정 사항에 대해 질문할 수 있습니다. 예를 들어 "{사용자 유형}에 대해 내가 UX 연구원이라면 어떻게 설명해 주세요"와 같은 질문으로 좋은 결과를 얻었습니다.


몇 초 안에 페르소나 파일을 얻을 수 있습니다. 하지만 문제는 좋은 품질인지 여부입니다. ChatGPT 페르소나의 품질을 테스트하기 위해 기존에 개발했던 페르소나와 비교했습니다. 그 결과는 다음과 같습니다:

일반적인 업계 지식에 관한 질문의 경우 ChatGPT의 답변은 이해관계자가 제공하는 답변과 80~90% 정도 일치했습니다.

사용자가 특정 제품에 대해 필요로 할 수 있는 핵심 기능에 대해서도 마찬가지입니다.

ChatGPT의 출력은 프로토 페르소나에 가장 적합합니다. 페르소나에 더 많은 반복을 할수록, 그리고 더 자세한 정보가 필요할수록 ChatGPT의 성능은 떨어집니다.

이 경우 ChatGPT를 사용하는 최적의 방법은 제품 개발의 초기 단계에서 기본 프로토 페르소나로 사용하는 것입니다.

그럼에도 불구하고 결과를 항상 다시 확인해야 하며, 간혹 문제가 발생할 수 있습니다.


경쟁사 분석

경쟁사에 어떤 기능이 있고 어떤 기능이 없는지 아는 것은 도움이 될 수 있지만, 온라인에서 수십 개의 도구를 검색하고 문서화하는 데 많은 시간이 소요될 수 있습니다. ChatGPT는 빠른 솔루션을 제공할 수 있지만 AI 도구는 기능, 기능 그룹, 기능은 동일하지만 이름이 다른 기능 간의 차이를 구분할 수 없습니다. 따라서 기능 표준화를 확립해야 합니다. getapp.com과 같은 리소스를 사용하면 기능 이름 표준화를 통해 시간을 절약할 수 있습니다.

getapp에서 찾은 정보를 바탕으로 경쟁사 조사를 수행하는 데 가장 효율적인 프롬프트는 다음과 같습니다:

"이 목록에 있는 {목록 붙여넣기} 기능은 무엇인가요? 이 목록에 없는 기능은 무엇입니까? {다른 목록 붙여넣기}?"

비교는 기능 그 이상입니다. SWOT 분석을 요청할 수도 있습니다. 또는 USP. 또는 여러분이 생각할 수 있는 다른 모든 것을 요청할 수 있습니다.

이 프롬프트는 많은 시간을 절약해 주며, 친절하게 요청하면 ChatGPT가 결과를 표로 표시할 수도 있습니다.

요구 사항 문서

초기 고객 요구사항을 채팅에 입력하고 이를 중심으로 요구사항 문서를 작성하도록 요청했지만, 결과물은 항상 너무 일반적이어서 아무 소용이 없었습니다. 이 결과물은 고객이 직접 작성하는 것이 더 낫다고 생각했습니다.


효과적인 인터뷰를 위한 AI 활용

이해관계자와 사용자로부터 특종을 얻는 것은 퍼즐을 맞추는 것과 같습니다. 모든 조각, 모든 인사이트를 원할 것입니다. AI가 이를 쉽게 도와줄 수 있습니다.


l  질문 공식화하기. 사용자에 대해 아는 것이 적을수록 좋은 질문을 만들어 내기가 더 어려워집니다. 좋은 소식은 항상 그럴 필요는 없다는 것입니다. 초기 사용자 인터뷰는 대개 매우 개방적인 방식으로 진행되며, 대화가 진행될 때마다 사용자가 자유롭게 이야기하도록 유도합니다. 하지만 대화를 이끌어갈 몇 가지 방향을 미리 준비하는 것이 도움이 될 때도 있습니다. 사용자 인터뷰 UX 파일럿 모듈을 사용하면 다음과 같이 할 수 있습니다.

l  인터뷰 녹화: Zoom은 여러분의 동반자입니다. 한 순간도 놓치지 않는 디지털 녹음기를 사용하는 것과 같습니다. 세션을 녹화하면 모든 단어와 반응을 바로 확인할 수 있습니다.

l  인터뷰 트랜스크립션: 다음으로 Otter.ai 또는 이와 유사한 AI 트랜스크립션 도구를 사용해 보겠습니다. 마치 초고속 타이피스트가 내가 말한 말을 텍스트로 바꿔주는 것과 같습니다. 더 이상 정신없이 메모할 필요가 없습니다!

l  ChatGPT에서 트랜스크립트 작업하기: 트랜스크립트가 완성되었다면 이제 ChatGPT로 AI 마법을 부릴 차례입니다. 대화 내용을 PDF로 변환하고 AskYourPDF 플러그인을 사용하여 업로드하세요. 이제 문서를 직접 쿼리하고 주요 인용문을 추출하여 많은 시간을 절약할 수 있습니다. 마치 개인 비서가 세부 정보를 샅샅이 훑어주는 것과 같습니다.


AI로 산업 조사 수행하기

AI로 산업 조사에 뛰어든다는 것은 실제로 작동하는 수정 구슬을 손에 쥐는 것과 같습니다. 더 깊이 있는 인사이트를 얻고 제품 개발을 위한 탄탄한 기반을 구축하는 것이 중요합니다.


l  업계 분석에 AI 프롬프트 활용하기: AI에게 올바른 질문을 던지면 단순한 답변 이상의 관점을 얻을 수 있습니다. 예를 들어, AI에게 업계의 특정 프로세스에 대해 설명해 달라고 요청해 보세요. 마치 전문가가 곁에서 복잡한 과정을 안내해주는 것과 같습니다.


l  예비 가설 수립: AI를 사용하면 단순히 데이터를 수집하는 데 그치지 않고 패턴을 파악할 수 있습니다. 제품에 문제가 있다고 가정해 봅시다. AI에게 해결책을 물어보세요. 이는 마치 제품 목표에 집중하고 있는 전문가들로 가득 찬 회의실에서 브레인스토밍을 하는 것과 같습니다.


통찰력 있는 쿼리를 위한 AI 활용

업계 트렌드와 프로세스를 이해하기 위해 AI를 활용하는 것은 인사이트의 보물창고를 여는 열쇠를 얻는 것과 같습니다. 단순히 질문만 하는 것이 아니라 올바른 질문을 하는 것이 중요합니다.


l  완벽한 프롬프트 만들기: 가장 똑똑한 업계 애널리스트와 한 방에 있다고 상상해 보세요. 무엇을 물어볼까요? 이것이 바로 인공지능을 위한 프롬프트입니다. 질문은 구체적이면서도 포괄적인 답변을 유도할 수 있을 만큼 개방적인 것이 중요합니다. 예를 들어 핀테크 업계에 종사하는 경우 "모바일 결제 보안의 새로운 트렌드는 무엇인가요?"라고 질문할 수 있습니다. 이는 정확히 알아야 할 사항에 대해 스포트라이트를 비추는 것과 같습니다.


l  상황에 맞는 맞춤 설정: 모든 산업에는 뉘앙스가 있습니다. 업계의 고유한 상황에 맞게 프롬프트를 맞춤 설정하세요. 의료 업계에서는 "AI가 환자 데이터 관리에 미치는 영향을 설명하세요"와 같은 프롬프트를 통해 의료 데이터 보안 및 관리의 복잡성에 맞는 인사이트를 얻을 수 있습니다.


l  예측 분석에 프롬프트 사용하기: 현재를 넘어서세요. AI를 사용하여 현재를 보고하는 데 그치지 않고 미래를 예측하세요. 미래의 트렌드, 잠재적 혼란 또는 새로운 기술에 대해 물어보세요. 예를 들어, "코로나19 이후 이커머스의 미래를 예측하세요."라고 질문하세요. 이는 미래를 내다볼 수 있는 창을 확보하여 전략적 우위를 점할 수 있는 것과 같습니다.


Midjourney

언뜻 보기에 Midjourney는 일러스트레이터를 대체하는 도구처럼 보일 수 있으며, UX 디자인과는 아무런 관련이 없습니다. 하지만 저희는 이 앱을 활용하는 두 가지 실용적인 방법을 발견했습니다:


무드보드

앱에 원하는 분위기를 전달하는 것은 어려운 일이며, 모두가 좋아하는 솔루션을 찾는 데 시간이 오래 걸릴 수 있습니다. Midjourney를 사용하면 그 시간을 크게 단축할 수 있습니다. 디자이너, 클라이언트 및 기타 팀원들은 몇 분 안에 다양한 솔루션을 생성할 수 있습니다.

간단한 노드 기반 인터페이스를 Midjourney에 업로드하고 새로운 아이디어를 생성하도록 요청했습니다. Midjourney를 사용하면 특정 프롬프트(참조용으로 UI를 업로드할 수도 있음)를 입력하기만 하면 됩니다. 클라이언트가 좋아하는 것과 싫어하는 것을 조기에 명확하게 표현하도록 도울 수 있습니다.


아이콘 세트

이 사용 사례는 아주 예기치 않게 발견했습니다. 무드보드 외에 Midjourney의 다른 용도에 대해 브레인스토밍을 하던 중, 독특한 아이콘을 매우 빠르게 생성할 수 있다는 사실을 깨달았습니다. 필요한 아이콘과 원하는 스타일을 지정하는 프롬프트에 입력하기만 하면 됩니다.

그런 다음 배경을 제거하고 원하는 도구(예: Adobe Illustrator, vectorizer.com 또는 Figma 플러그인)를 사용하여 PNG를 벡터화하기만 하면 됩니다.

AI가 생성한 결과물을 제어하기 어려울 수 있지만, 매우 상세한 프롬프트를 포함하면 더 많은 제어가 가능합니다.

짜잔, 완벽한 고유 아이콘 세트가 완성되었습니다. 다음은 저희가 만든 결과물의 예시입니다.

마지막으로, 시스템 아이콘뿐만 아니라 앱 아이콘도 생성할 수 있습니다. 다음은 저희가 생성한 몇 가지 예시입니다.


� AI 디자이너 커뮤니티 오픈 채팅방

https://litt.ly/aidesign


AI-Powered UXUIDesign Lab 유튜브 채널

https://www.youtube.com/@aidesigntv/featured


인공지능 디자인협회 AI x UX/UI Design (무료) 세미나 뉴스레터 신청

* 확인 메일이 안 보이면 스팸함을 확인해주세요.

https://aidesign.stibee.com 


#AI #생성AI #디자인 #디자이너 #UX #UI #사용자경험디자인




* 위의 글은 아래의 아티클을 번역한 글입니다.

https://adamfard.com/blog/ai-ux-design

브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari