안녕하세요. 라포랩스 Product Designer 홍지연입니다.
스타트업에서 UX라이터 없이 제품을 만드는 건 드문 일이 아닌데요. 하지만 그렇다고 사용자 친화적인 언어가 흔들려서는 안됩니다. 저는 이 고민에서 출발해 Claude와 Figma 플러그인을 활용한 AI 기반 UX라이팅 시스템을 구축했습니다. 오늘은 그 과정을 공유하려 합니다.
같은 제품 안에서 제각각인 문장 스타일
라포랩스에도 역시 전담 UX라이터가 없습니다. 대신 UX라이팅 규칙을 두고 프로덕트 디자이너들이 이를 참고해 문장을 작성했죠. 하지만 규칙만으로 모든 케이스를 커버하기는 어려웠습니다.
디자이너마다 표현 방식이 달라 같은 액션에도 ‘리뷰를 작성하면’과 ‘리뷰 쓰면’처럼 제각각의 단어가 쓰였고, ‘상품 ID’와 ‘상품id’처럼 일관성이 깨지는 사례도 반복됐어요.
한 서비스 안에서는 하나의 목소리를 내야 한다는 데 모두가 공감하고 있었습니다.
특히 서비스가 확장되면서 기존 규칙만으로는 부족한 지점이 드러났어요. 퀸잇이 유저에게 주는 가치가 넓어질수록 새로운 보이스톤 정의가 필요했고, 기존 UX라이팅 가이드로는 커버되지 않는 케이스들이 빠르게 늘어났습니다. 게다가 B2B와 B2C 맥락에서 요구되는 용어와 톤앤매너가 달라, 이를 모두 고려할 수 있는 가이드가 필요했어요.
이 문제를 해결하기 위해 UX Writing TF를 꾸려 가이드라인을 재정비하기로 했습니다. 단순히 보여주기식이나 현실과 동떨어진 가이드라인은 절대 만들고 싶지 않았어요. 문서로만 존재하는 가이드는 결국 시간이 지나면 금세 잊히거나 형식적인 규칙으로 남기 쉽기 때문입니다. 그래서 처음부터 ‘실제로 쓰이고 도움이 되는 가이드’를 만드는 걸 목표로 삼았습니다.
목표는 세 가지였어요.
가이드는 실제 사례를 기반으로 만들어 곧바로 적용할 수 있어야 한다.
문서에 머무르지 말아야 한다. 디자이너가 가이드라인을 아예 안 봤으면 좋겠다.
→ AI로 검수봇을 만들어보자.작업 환경에서 바로 사용할 수 있어야 한다.
→ Figma 플러그인으로 구현해보자.
먼저, 정교한 가이드라인을 만드는 것부터
UX라이팅 가이드라인을 만드는 작업부터 시작했어요. 4명의 프로덕트 디자이너가 모여 UX Writing TF를 꾸려, 4주 동안 가이드라인을 정교하게 다듬었죠. 제품에 쓰인 모든 문장을 수집해 평가하고, 왜 그렇게 생각했는지 논의했습니다. 이 과정을 통해 가이드라인의 뼈대이자 AI 학습 기준을 만들었어요.
우리가 거친 과정은 다섯 단계였습니다.
타겟 유저와 페르소나 재정의
제품에 쓰인 문장 수집 및 분류
평가와 논의를 통한 공통점 도출
주요 원칙, 가이드라인 구축
세부 원칙, 패턴 별 상세 가이드라인 추가
실제 사례를 기반으로 가이드라인을 만들다 보니, 그동안 암묵적으로 지키고 있던 원칙들을 수면 위로 끌어올릴 수 있었습니다. 덕분에 더 빠르고 체계적으로, 그리고 바로 적용 가능한 가이드라인을 만들 수 있었어요.
AI야 문장 검수해줘. 근데 정확하게
정교한 가이드라인을 기반으로 UX라이팅 검수봇을 만들었습니다. 디자이너가 매번 가이드라인을 들춰보지 않아도 일관된 문장을 쓸 수 있도록 하는 것이었죠.
첫 시도는 GPTs였어요. 하지만 프롬프트에 가이드라인과 사례를 입력해도 일부만 지키거나, 아예 없는 가이드라인을 만드는 경우가 많았고, 결과에 대한 신뢰도가 낮았어요.
그래서 검수봇에 두 가지 조건을 걸었습니다.
가이드라인을 엄격히 준수할 것
문장 수정 결과와 함께 ‘왜 그렇게 수정했는지’에 대한 근거를 보여줄 것
위 조건을 충족할 수 있는 모델을 찾아 여러 차례 시도했고, 결국 Claude Sonnet 4를 사용해서 만들었어요.
문장 검수 결과의 정확도를 높이기 위해 사례 DB를 만들어서 모두 넣었어요. 사례 DB에는 제품에서 수집한 문장의 나쁜 문장과 개선된 문장, 가이드라인에 기반한 개선 이유가 정리되어 있어요. 사례 DB는 새로운 룰이 생겨도 누구나 쉽게 추가할 수 있도록 Notion을 이용해 관리하도록 했어요.
작업 환경에서 3초만에 문장 검수하기
디자이너의 작업 환경인 Figma에서 바로 문장을 검수할 수 있도록 하기 위해서 Figma 플러그인을 만들었어요.
처음에 데모 버전은 디자이너가 바이브 코딩을 통해서 만들었어요. Claude를 호출하고, 가이드라인과 사례 DB를 하드코딩으로 추가해서 구현했죠. 이후 누구나 쉽게 사례를 추가할 수 있도록 FE 엔지니어의 도움을 받아 개선했어요.
최종 플러그인은 이렇게 동작합니다.
Figma에서 작업 중인 문장을 선택하면 플러그인이 자동으로 긁어가요.
‘문장 검수하기’를 누르면 Notion에 적재된 가이드라인과 사례 DB를 읽어서 Claude로 전송해요.
Claude가 개선한 문장을 Figma 플러그인에 표시하면서, 어떤 원칙을 기반으로 수정했는지도 함께 보여줘요.
결과를 바로 복사해서 디자인에 반영할 수 있어요.
AI야 문장 만들어줘. 근데 요구사항이 좀 복잡해
문장 검수 기능을 먼저 배포한 후 디자이너 피드백을 받았습니다. 그 과정에서 가장 많이 나온 니즈는 ‘복잡한 요구사항과 가이드라인, 사례 데이터를 반영해 문장 초안을 제안해 주는 기능’이었어요.
문장 생성 기능이 없던 시기에는 디자이너들이 GPT나 Claude에 직접 타겟 유저, 목적, 요구사항 등을 입력해 문장에 대한 아이디어를 구체화하고 있었어요. 하지만 기존 UX라이팅 검수봇의 가이드라인과 사례 DB를 기반으로 프롬프팅한다면 더 좋은 결과를 뽑을 수 있다는 확신이 생겼고, 결국 문장 생성 기능을 추가했습니다.
기존 플러그인에 기능만 추가하면 되었기 때문에, 바이브 코딩으로 디자이너 혼자 1시간 만에 뚝딱 만들 수 있었어요.
생성 기능은 세 가지 입력 요소를 받습니다.
고려해야 하는 것 : 타겟 유저, 목적, 맥락
달성해야 하는 것 : 목표, 전달해야 하는 사항
내가 작성한 초안
이 요구사항을 입력하면, UX라이팅 가이드라인과 사례 DB를 기반으로 문장 5개를 제안합니다. 제안된 문장을 참고해 최종안을 다듬으면서, 문장을 결정하기까지 시간을 크게 단축했어요.
디자인 챕터에서 라포랩스 전체로, 하나의 목소리를 향해
처음엔 제품 안에서 제각각 쓰이는 용어가 눈에 거슬렸고, 매번 가이드라인을 확인하는 것도 귀찮았어요. 그런데 이건 개인적인 불편을 넘어 챕터 단위에서도 반복되는 문제였고, ‘논의를 규격화, 시스템화하면 팀 전체의 생산성이 올라가겠다’는 생각이 들었어요.
회사에서 AI 툴 도입을 적극적으로 지원해 준 덕분에 Cursor로 빠르게 데모를 만들 수 있었고, 피드백을 거쳐 개선을 이어가면서 UX 라이팅 플러그인은 어느새 디자이너들의 작업 과정에 없어서는 안 될 도구가 되었어요.
이제는 디자인 챕터를 넘어, 라포랩스 전체가 한목소리로 사용자에게 일관된 경험을 줄 수 있도록 발전시키고 싶어요.