brunch

AI삼대장으로 프로덕트디자인 생산성 높이는 실무비법

헤엄 스튜디오 김서경 대표 세미나 발표 요약

by 유훈식 교수

이 글은 AI 디자인 세미나에서 헤엄 스튜디오 김서경 대표님이 발표한 내용을 요약 정리한 글입니다. 발표에 대한 전문은 아래의 링크에서 확인하실 수 있습니다. 김서경 대표님에 대한 프로젝트/강연/교육 문의는 이메일(sofie@heyuhm.com)을 통해서 요청해주시기 바랍니다.

https://www.youtube.com/live/UNWF5eQPxFo?si=j8oIet4VSeNXOx1k


김서경 대표의 디자인 철학과 경험

저는 프로덕트 디자이너로 일한 지 10년이 되었습니다. 처음에는 개발자로 커리어를 시작했지만 개발 업무가 잘 맞지 않았고, 서비스를 처음 기획하는 단계부터 참여하고 싶다는 욕심이 생겨 기획자로 방향을 틀었습니다. 시간이 지나면서 자연스럽게 프로덕트 디자인까지 범위를 넓혀 지금은 UX/UI 디자인 전반을 다루고 있습니다.


프로덕트 디자이너로서 항상 마음에 두고 있는 문구가 하나 있습니다. 바로 “어려운 걸 쉽게, 쉬운 걸 논리적으로 만들다”라는 말입니다. 복잡한 문제는 최대한 단순하게 쪼개고, 그렇게 쪼갠 부분들을 탄탄한 논리로 뒷받침하여 서비스를 만들고자 늘 노력합니다. 현실적으로 매번 이상적으로 되지는 않지만, 이 원칙을 지키려 애쓴 덕분에 좋은 결과물을 낸 적이 많았습니다.

b1.png

저는 현재 소규모 팀을 꾸려 여러 외주 프로젝트를 진행하고 있습니다. 프로젝트의 요구 사항을 파악하고 서비스 기획을 잡는 일부터 UX/UI 디자인, 브랜드 아이덴티티를 반영한 디자인 시스템 구축, 그리고 최종 산출물을 개발자에게 인계하는 핸드오프 과정까지 전부 도맡아 진행합니다. 이렇게 폭넓은 업무 범위를 혼자 커버하다 보니, 각 단계마다 생성 AI 도구를 활용해 효율을 높이는 방법을 터득하게 되었습니다.


프로덕트 디자이너에게 AI가 필수인 이유

혼자 프로덕트 디자인을 맡아 프로젝트를 진행하다 보면 AI 도구의 도움이 절실하다는 것을 느낍니. 프리랜서이거나 회사에서 유일한 디자이너인 경우 사실상 모든 업무를 매우 빠르게 소화해야 하기 때문입니다. 클라이언트들은 항상 결과물을 서두르는 편이라 “무리한 부탁인 줄 알지만… 이번 주말까지 가능할까요?” 같은 요청이 빈번합니다. 이런 급박한 일정 속에서 여러 프로젝트를 병행하려면 작업 시간을 획기적으로 줄여줄 도구가 필요했습니다.

b2.png

또 혼자 일하다 보면 아이디어가 막히거나 판단이 흐려지는 순간이 찾아옵니다. 예전 같으면 동료와 머리를 맞대고 고민을 나누거나 피드백을 구했겠지만, 프리랜서로서는 그럴 환경이 부족합니다. 밤이든 새벽이든 내 고민을 받아줄 누군가가 없을 때 AI 챗봇들은 든든한 조언자가 되어줍니다. 어설픈 인턴이나 초보 직원을 쓰는 것보다 100배 낫다고 할 만큼, 나는 AI를 최고의 가상 팀원처럼 활용하고 있습니다. AI는 감정 없이 객관적으로 피드백을 주기에 내 작업의 부족한 점을 빠르게 짚어준다. 이렇게 AI를 통해 마치 보이지 않는 멘토나 선배와 함께 일하는 효과를 얻고 있습니다.


한편, AI를 활용한다고 해서 거창한 기술을 구사하는 것은 아닙니다. 한때 GPT-4 API를 연동하거나 복잡한 프롬프트 기법을 익혀보려 한 적도 있었지만 제겐 잘 맞지 않았습니다. 결국 중요한 것은 쉽고 빠르게, 내 상황에 맞게 도구를 적용하는 일이라고 느꼈습니다. 지금부터 실제 프로젝트의 각 단계에서 내가 어떻게 AI를 활용하고 있는지 솔직하게 공유해보려 합니다.


요구사항 정의 단계에서의 AI 활용

1) 레퍼런스 분석 및 IA 도출

새로운 웹사이트나 앱을 디자인할 때 나는 우선 참고 레퍼런스를 분석하는 작업을 합니다. 예를 들어 프랜차이즈 음식점의 웹사이트 제작을 의뢰받았다고 해보겠습니다. 클라이언트가 참고하라고 준 경쟁사 사이트 링크가 두 개 있다면, 나는 그 URL들을 퍼플렉시티(Perplexity) AI 검색 엔진에 넣고 “이 사이트의 페이지 구조와 주요 내용을 분석해줘”라고 요청합니다. 퍼플렉시티는 해당 웹사이트의 페이지들을 읽고 각 페이지에 어떤 정보와 기능이 있는지 요약해줍니다. 이렇게 얻은 인사이트를 바탕으로 신규 사이트의 정보구조(IA)를 빠르게 잡아낼 수 있습니다. 원래는 일일이 사이트를 탐색하며 구조를 파악해야 했지만, 이제는 AI 덕분에 한두 시간 걸릴 일을 10분 내로 끝낼 수 있습니다. 이렇게 뽑아낸 IA를 토대로 프로젝트의 견적을 산출하거나 초기 설계를 시작하곤 합니다.

b4.png


2) 유사 서비스 조사

완전히 새로운 유형의 서비스라면 비슷한 선례를 찾기가 어려울 때가 있습니다. 이럴 때 나는 클로드(Claude) 같은 AI에게 “지금 기획 중인 OO 서비스와 유사한 사례가 있을까?” 하고 물어봅니다. AI가 내가 설명한 서비스와 비슷한 다른 앱이나 웹사이트를 찾아주면, 그 중 유용해 보이는 것을 골라 직접 분석합니다. 사람이 미처 찾아내지 못한 레퍼런스를 AI가 제시해주는 경우가 꽤 많아서 아이디어 발굴 단계에 큰 도움이 됩니다.

b6.png


3) 기획 스토리 초안 작성

특히 홈페이지를 디자인할 때는 전체적인 스토리텔링이 중요합니다. 그러나 정작 클라이언트가 콘텐츠를 충분히 제공하지 않아서 난감한 경우도 많습니다. 예전에는 제로베이스에서 회사 소개나 서비스 소개 글을 만들어내느라 고생했지만, 이제는 AI와 함께 초안을 작성합니다. 클라이언트로부터 받은 자료나 간략한 정보를 클로드에 입력하고 “이 브랜드의 배경과 강점을 잘 드러내는 이야기 형식의 소개 글을 써줘”라고 요청하면, AI가 여러 자료를 참고해 그럴듯한 서사를 만들어냅니다. 물론 결과물을 바로 사용하는 것은 아니지만, 이 초안 덕분에 클라이언트와 초기 방향을 논의하기가 훨씬 수월해집니다. 일단 눈에 보이는 스토리 틀이 있으니 피드백도 구체적으로 받을 수 있기 때문입니다.

b8.png


4) 요구사항 명세서 작성 및 검토

화면이 많고 기능이 복잡한 서비스를 설계할 때는 요구사항 정의서나 기능 명세서를 작성해야 합니다. 이 작업에도 AI를 활용합니다. 제가 초기에 기능 목록이나 화면 구성을 텍스트로 정리해두면, 그 자료를 클로드에 입력하고 “누락된 기능이 있는지 확인해줘” 혹은 “각 화면에 필요한 상세 기능을 정리해줘”라고 명령합니다. 그러면 AI가 화면별로 필요한 요소나 기능들을 주욱 제시해줍니다. 물론 완벽하지 않아서 제가 다시 검토하고 보충하지만, 가끔 내가 빠뜨린 기능을 집어내 주기도 합니다. 이렇게 AI와 일종의 교차 검증을 거치면 내 정리가 올바른지 한 번 더 확인받는 효과가 있습니다.

b7.png


5) 복잡한 데이터 흐름 도식화

서비스 기획 단계에서 데이터 구조나 처리 흐름이 복잡하면 그림으로 정리하는 것이 이해에 도움이 됩니다. 이때 저는 머릿속에 있는 데이터 관계를 우선 글로 풀어쓴 뒤 그것을 클로드에 전달합니다. 예를 들어 “A 역할 사용자가 정보를 입력하면 B 역할에서는 그 데이터를 확인할 수 있고, 그 정보는 C 테이블에 저장된다”처럼 서비스의 흐름을 서술합니다. 그리고 “이 흐름을 Mermaid 다이어그램 코드로 작성해줘”라고 부탁하면, AI가 텍스트 기반 다이어그램 표기법(Mermaid)으로 흐름도를 생성해줍니다. 내가 직접 그런 다이어그램 코드를 처음부터 작성하려면 엄두가 안 나지만, AI가 뼈대를 만들어주니 잘못된 부분만 살짝 고쳐서 완성하면 됩니다. 이렇게 얻은 다이어그램은 개발자와 소통할 때도 요긴하고, 복잡한 정책을 스스로 정리하는 데에도 큰 도움이 됩니다.

b9.png


UX 설계 단계에서의 AI 활용

1) 아이디어 막힘을 뚫을 때

UX 구상이나 와이어프레임 작업을 하다 보면 가끔 아이디어가 막히는 지점이 생깁니다. 이럴 때 나는 해당 화면의 사용자 시나리오나 현재까지 그린 와이어프레임을 클로드에게 설명해주고 “여기에서 다른 해결책이나 UI 배치는 없을까?” 하고 물어봅니다. 가끔 AI가 텍스트로 와이어프레임을 묘사해주거나 새로운 접근법을 제시하는데, 솔직히 그 퀄리티가 아주 높진 않습니다. 하지만 내가 미처 생각 못한 방향을 콕 집어줄 때가 있어 막힌 부분을 풀어가는 데 꽤 도움이 됩니다. 예전에는 동료와 머리를 맞대야 가능했던 브레인스토밍을 이제 AI와 실시간으로 할 수 있게 된 셈입니다.

b10.png


2) 와이어프레임에 실제 데이터 채우기

가능하면 와이어프레임 단계에서 가상의 데이터라도 실제처럼 채워 넣으려 합니다. 그래야 UI에서 빠뜨린 요소는 없는지 발견하기 쉽고, 클라이언트에게도 디자인 의도가 더 효과적으로 전달됩니다. 문제는 익숙하지 않은 분야의 내용일 경우 무엇을 채워야 할지 몰라 막막하다는 점입니다. 예를 들어 의대 입시 학원의 ERP 시스템을 디자인할 때 “상담 내용” 같은 입력란에 어떤 문구를 넣어야 할지 난처했던 적이 있습니다. 지금은 클로드에 이렇게 부탁한다. “MCAT 시험 과목을 가르치는 선생님이 학생에게 피드백하는 내용을 예시로 만들어줘”처럼 프롬프트를 주면 AI가 그럴듯한 문장을 빠르게 작성해줍니다. 저는 그 문장을 그대로 와이어프레임 화면에 집어넣어 마치 실제 데이터인 것처럼 보이게 만듭니다. 이렇게 현실감 있게 꾸민 시안을 보여주면 클라이언트는 “우리 서비스가 실제로 이런 모습이겠구나” 하고 한눈에 이해합니다. 실제 데이터를 넣은 듯한 생생함 덕분에 클라이언트 만족도도 훨씬 올라갔습니다. 예전에는 이런 더미 데이터를 일일이 상상해서 채우느라 시간이 많이 들었지만, 이제는 AI 도움으로 단숨에 처리하니 작업 효율이 한결 높아졌습니다.

b12.png


UI 디자인 단계에서의 AI 활용

1) 새로운 스타일 가이드 탐색

UI 디자인을 마무리할 때 종종 색다른 스타일 변형이 필요해질 때가 있습니다. 얼마 전 나는 키오스크 앱을 디자인하면서 고대비 모드용 UI를 추가로 만들어야 했습니다. 고대비 모드는 시력이 좋지 않은 분들을 위해 강한 명암 대비로 정보를 표시하는 테마인데, 한 번도 만들어본 적 없는지라 어디서부터 손대야 할지 난감했습니다. 이때 기존 디자인 시안을 클로드에 보여주고 “이 디자인을 시각장애인을 위한 고대비 테마로 바꾸려면 색상과 레이아웃에 어떤 변화가 필요할까?”라고 물어봤습니다. 그러자 AI는 배경과 텍스트의 대비를 크게 높이고, 중요 정보는 더 굵게 키워서 잘 보이게 하는 등 몇 가지 개선 아이디어를 제시해주었습니다. 저는 그 조언을 참고해 컬러 팔레트를 수정하고 시각적 요소들을 조정하여 비교적 짧은 시간에 고대비 버전 UI를 완성할 수 있었습니다.

b13.png


2) 커스텀 이미지 에셋 제작

디자인 시안에 넣을 이미지를 구하는 데도 AI를 활용합니다. 특히 상업용 이미지를 함부로 쓸 수 없을 때 유용합니다. 예를 들어 키오스크 사용법을 알려주는 교육용 앱 프로젝트에서는 실제 패스트푸드점의 메뉴 사진을 사용할 수 없었습니다. 이럴 때 미드저니(Midjourney) 같은 이미지 생성 AI로 햄버거나 음료 이미지를 직접 만들어 활용했습니다. 미드저니를 쓰면 저작권에 걸릴 염려 없이 필요한 이미지를 얻을 수 있습니다. 물론 생성 AI 이미지도 100% 안전하다고 단언할 수는 없지만, 적어도 실존 브랜드의 로고나 제품이 노출되지 않으니 문제 소지를 피할 수 있었습니다. 이처럼 그래픽 디자이너의 도움 없이도 원하는 이미지를 뚝딱 확보할 수 있다는 점에서 시간과 비용을 상당히 절약했습니다.

b14.png


AI를 통한 디자인 검증과 피드백

1) 시안 비교 분석

하나의 프로젝트에 서로 다른 콘셉트로 디자인 시안을 두 가지 만들었을 때, 각 시안의 특징을 객관적으로 정리하고 싶다면 AI의 힘을 빌립니다. 예를 들어 밝고 귀여운 느낌의 A안과 심플하고 전문적인 B안을 준비해 클로드에게 물어본 적이 있습니다. “첫 번째 시안은 어떤 느낌이고, 어떤 사용자층을 겨냥한 것 같아? 두 번째 시안의 강점은 무엇일까?” 하고 질문하니, AI가 마치 디자인 평론가처럼 답변을 내놓았습니다. A안에 대해서는 “게이미피케이션 요소와 친근한 인터랙션이 돋보이며, 자기계발에 동기 부여를 원하는 젊은 층에 어필할 것”이라고 평했고, B안에 대해서는 “미니멀한 레이아웃과 차분한 색상으로 신뢰감을 주며, 효율과 실용성을 중시하는 비즈니스 사용자에게 적합”하다고 평가해주었습니다. 제 의도와 정확히 일치하는 분석이었습니다. 나는 이 내용을 클라이언트에게 각 시안의 개성을 설명할 때 그대로 인용했습니다. 덕분에 디자인 의도를 더욱 설득력 있게 전달할 수 있었습니다.


2) 디자인 근거 보완

클라이언트는 종종 “왜 이렇게 UX를 설계했나요?”라고 묻습니다. 과거에는 “대부분의 사용자들이 익숙해하는 패턴이고, 대형 서비스들도 이렇게 하니까요”라고 얼버무린 적도 있었지만, 이제는 AI를 활용해 한층 논리적인 근거를 마련합니다. 내가 적용한 UX 패턴이나 UI 구성 요소를 클로드에게 설명하고 “이 방식의 장점이나 이유를 알려줘”라고 하면, AI가 사용성 원칙에 입각해 그 디자인 선택의 이점을 짚어줍니다. 예를 들어 “하단에 주요 버튼을 고정 배치하면 사용자가 언제든 핵심 액션을 쉽게 수행할 수 있어 편의성이 높아진다”와 같은 식입니다. 이렇게 얻은 일반론이지만 타당한 근거들을 정리해두었다가 클라이언트에게 설명하면 보다 체계적이고 프로답게 들립니다. 작은 차이지만 신뢰를 주는 데에 효과가 큽니다.


3) 냉정한 사전 피드백

최종 결과물을 클라이언트에게 전달하기 전에 내 디자인을 한 번 객관적으로 점검하고 싶다면, AI에게 가상의 악플을 부탁해봅니다. 완성된 UX 플로우나 UI 시안을 클로드에 보여주고 “여기에서 문제점이나 부족한 부분을 모조리 지적해줘”라고 요청하는 것입니다. 그러면 AI는 작은 UX 불편부터 디자인 일관성 문제까지 상당히 날카롭게 지적합니다. 물론 모든 지적을 다 수용하는 것은 아니지만, 내가 놓친 사소한 개선점들을 꽤 많이 발견하게 됩니다. 이렇게 AI로부터 독한 리뷰를 한 차례 받고 나면 클라이언트에게 넘길 최종 산출물의 완성도를 한층 끌어올릴 수 있습니다. 혼자 일하면 자기 작품에 스스로 관대해지기 쉬운데, AI라는 가상의 혹독한 동료 덕분에 냉정한 피드백을 얻어내 개선할 수 있었습니다.


AI 시대, 디자이너의 역할과 가치

AI를 적극 활용하고 있지만, 저는 디자인의 시작과 끝은 결국 사람에게 달렸다고 생각한다. 아무리 똑똑한 도구라도 클라이언트의 비즈니스 맥락을 완벽히 이해하고 사용자의 숨은 니즈를 공감하며 문제의 본질을 정의해주진 않습니다. 디자인 산출물의 최종 완성도 역시 디자이너의 손길에 달려 있습니다. AI가 초안을 만들어줄 순 있어도, 그 결과물을 매끄럽게 다듬고 실제 사용 가능한 형태로 끌어올리는 책임은 결국 제 몫입니다.


일각에서는 AI 때문에 디자이너의 일이 사라지는 것 아니냐는 걱정도 나옵니다. 분명 반복적이고 단순한 작업 일부는 자동화되겠지만, 저는 오히려 AI를 잘 활용하는 디자이너야말로 더 큰 경쟁력을 갖출 것이라고 믿습니다. 핵심은 사람이 해야 할 일에 집중하는 것입니다. AI가 거친 밑그림을 그려주면, 디자이너는 그 안에서 진짜 문제를 찾아내고 최적의 해결책을 고민해야 합니다. 또한 클라이언트나 팀과 효과적으로 소통하며 프로젝트를 이끌어가는 역할은 결국 사람이 맡습니다. 사용자의 근본적인 요구를 포착하고, 전략적으로 무엇을 우선할지 결정하는 능력은 인간 디자이너만이 발휘할 수 있습니다. 이런 본질적인 역량을 갖춘 디자이너가 AI의 도움까지 곁들인다면 금상첨화의 시너지를 낼 수 있다고 봅니다.


저 역시 요즘 디자인의 본질적인 역량을 키우는 데 더 집중하려고 노력하고 있습니다. 동시에 새로운 AI 활용법도 끊임없이 실험 중입니다. 목표는 결국 하나입니다. “적게 일하고도 더 많이 벌자”, 즉 적은 노력으로 더 큰 성과를 얻자는 것입니다. AI는 이 목표를 이루게 해주는 훌륭한 도구입니다. 다만 어디까지나 도구일 뿐이므로, 내가 주도권을 쥐고 현명하게 활용해야 진정한 의미가 있습니다. 이 글을 읽는 다른 디자인 업계 분들도 각자의 방식으로 AI를 활용해 보시길 제안 드립니다. 혹시 제가 미처 몰랐던 기발한 활용 팁이 있다면 함께 공유하며 다 같이 성장할 수 있으면 좋겠습니다.


AI-UXDTQ.png

AI를 활용한 UX/UI 디자인 방법에 대해서 체계적으로 학습하고 자격증도 취득하고 싶다면?

https://onoffmix.com/event/324137

AI 디자이너들과 소통하며 함께 성장하고 싶다면?

https://litt.ly/aidesign


keyword
매거진의 이전글커서AI/클로드/피그마로 프로덕트 디자인&개발하기