디자이너의 AI 프롬프트에서 가장 쓸모 있는 한 줄은 '모르면 모른다고 적어'

이 글에 실린 예시 프롬프트 가운데 제가 밑줄 친 건 화려한 지시가 아니라 끝에 붙은 한 문장입니다. 레퍼런스 조사를 맡기면서 "직접 확인한 내용만 적고, 확인하지 못한 화면은 미확인으로 표시해 줘." 검수용 프로토타입을 맡기면서 "기획에 명시된 내용과 네가 추가로 제안한 내용을 구분해 줘. 결정되지 않았거나 서로 어긋나는 내용은 임의로 확정하지 말고." 둘 다 AI에게 '모른다'고 말할 자리를 만들어 주는 문장이에요.

기획을 바탕으로 화면을 설계하는 한 디자이너가 AI에 일을 넘기는 방식 네 가지를 공유했습니다. 레퍼런스 조사, 디자인 시스템 프리뷰, Figma Make로 시안 만들기, 놓친 흐름을 찾는 검수용 프로토타입. 저는 이 중 첫째와 넷째를 오래 쓸 기술로 꼽고, 둘째에는 조건을 달겠습니다. 셋째는 도구 비교라 몇 달 뒤면 답이 바뀔 얘기로 넘기고요.

하나: 레퍼런스 조사는 맡기되 '미확인'을 허락한다

예전엔 기획을 마무리하고 화면을 그리기 전에 핀터레스트를 떠돌며 서너 시간씩 스크린샷을 모았는데, 수백 장이 쌓여도 정작 Figma 캔버스에 마음에 드는 화면이 하나도 없는 날이 많았던 시절의 이야기입니다. 지금은 이 조사를 상당 부분 AI에 맡깁니다. 서비스를 한두 줄만 설명하고 자유롭게 찾게 하면 생각지 못한 분야의 사례가 와서 사고를 넓히는 데 도움이 되고, 사업자가 정부 지원사업을 찾는 서비스처럼 '정보 입력 → 조건 확인 → 결과 비교 → 신청' 같은 플로우를 특정해서 시키면 서비스명·URL·단계별 흐름·참고할 점을 표로 받아 볼 수 있죠.

Chrome 확장을 쓰면 Claude Code나 Codex가 브라우저로 사이트를 직접 둘러보며 화면을 캡처하고, 로그인 때문에 못 들어간 화면은 따로 표시하고, 결과를 이미지·설명·원문 링크가 붙은 HTML 보고서로 정리해 줍니다. 여기서 핵심은 앞에서 말한 그 한 줄입니다. AI는 확인하지 못한 화면도 그럴듯하게 묘사할 수 있고, 레퍼런스 조사에서 그건 치명적입니다. 존재하지 않는 플로우를 참고해 화면을 설계하게 되니까요. '미확인'이라고 적을 자리를 주면 AI는 그 자리를 씁니다. 저는 이게 디자이너뿐 아니라 AI에 조사를 맡기는 모든 직군이 가져갈 습관이라고 봅니다. 캡처 파일을 ./references 폴더에 '서비스명+화면명'으로 저장하게 한 것도 같은 맥락이에요. 나중에 사람이 원본을 확인할 수 있게 증거를 남기게 한 거죠.

둘: 검수용 프로토타입은 실패하는 화면부터 그린다

넷째 방법이 이 글에서 가장 좋습니다. 필요한 화면을 다 그렸다고 생각했는데 동료가 "그런데 검색 결과가 하나도 없으면 어떻게 보여주죠?"라고 물어 멈칫하는 순간. 지원사업 검색 서비스라면 사업자등록번호를 넣고 결과 목록에서 사업을 골라 상세를 보고 신청하는 흐름은 화면으로 나란히 놓으면 완성된 것처럼 보이지만, 결과가 없거나 조회가 오래 걸리거나 신청 중에 오류가 나면 사용자가 어디서 기다리고 무엇을 확인하고 어떻게 다시 시도할지는 비어 있기 쉽습니다.

이 디자이너는 개발자가 아닌 기획자와 디자이너가 대개 사용자가 목적을 이루는 흐름에 집중하고, 예시 데이터도 적당한 길이와 개수로 넣다 보니 잘되는 화면은 구체적이고 잘 안 될 때의 화면은 빈칸으로 남는다고 짚습니다. 개발자 출신으로서 저는 이 관찰이 정확하다고 봅니다. 개발 단계에서 가장 많이 나오는 질문이 바로 이 빈칸이고, 그게 디자인 리뷰가 아니라 QA에서 발견되면 비용이 몇 배가 됩니다.

그래서 AI에게 기획을 읽히고 입력값, 로그인·권한, 데이터의 양, 처리 중·성공·실패에 따라 달라질 상황을 먼저 정리하게 한 뒤, 그 조건을 직접 바꿔 볼 수 있는 검수용 프로토타입을 만들게 합니다. 여기서도 같은 장치가 붙습니다. 기획에 명시된 것과 AI가 제안한 것을 구분하고, 결정되지 않았거나 어긋나는 내용은 임의로 확정하지 말 것. 저는 이 지시가 이 프롬프트의 진짜 본체라고 생각해요. AI가 빈칸을 그럴듯하게 메워 버리면 결정되지 않은 정책이 결정된 것처럼 프로토타입에 박히고, 그 프로토타입을 본 개발자는 그게 기획 의도라고 믿습니다. 빈칸을 빈칸으로 드러내는 게 검수의 목적이니까요.

조건을 달 하나: 화면보다 먼저 만드는 디자인 시스템

이 디자이너는 방향이 잡히면 화면 작업 전에 AI로 디자인 시스템 프리뷰를 만듭니다. 색상·타이포그래피·간격·모서리·그림자, 버튼과 입력창의 상태별 모습, 다크모드까지 한 번에 두 벌. 원래는 화면이 어느 정도 만들어진 뒤 정돈하는 단계에서 만들던 걸 AI 덕에 미리 볼 수 있다는 거죠.

탐색용으로는 좋습니다. 원하는 테마로 주요 요소를 한눈에 보며 전체 톤앤매너를 상상하고, 필요한 컴포넌트를 미리 짐작해 볼 수 있으니까요. 다만 저는 이걸 '시스템'이라고 부르기엔 이르다고 봅니다. 글에 흥미로운 일화가 하나 있어요. '신뢰할 수 있고, 학술 리포트에 어울리면서 동시에 따듯한' 색을 원해서 chatGPT, Claude, Gemini에 모두 시켰더니 셋 다 딥 블루나 딥 그린을 메인으로, 코랄을 포인트로 제안했다는 것. 흔히 알려진 색과 느낌의 짝을 그대로 따른 제안으로 보여, 결국 색은 직접 베리에이션을 해 가며 다듬었고요. 프리뷰는 평균으로 모입니다. 그리고 실제 화면 없이 정한 토큰은 실제 화면을 만나면 깨지기 마련이에요. 표 안의 긴 숫자, 에러 문구가 두 줄로 넘어가는 입력창, 데이터가 비어 있는 상태 같은 걸 만나기 전의 간격과 크기는 짐작일 뿐이니까요. 그래서 프리뷰는 버릴 각오로 만드는 초안으로 쓰고, 토큰을 확정하는 건 넷째 방법의 검수용 프로토타입으로 실패하는 화면까지 그려 본 뒤가 맞다고 생각합니다.

셋째 방법, Figma Make로 대화하며 시안을 수십 번 다듬고 'Copy design'으로 편집 가능한 레이어로 옮기는 흐름은 실용적이지만 Claude Design이나 Google Stitch보다 레이아웃을 잘 뽑는다는 비교는 개인의 인상이고 도구는 빨리 바뀌니 넘어가겠습니다.

손목은 쉬게 됐지만 눈과 머리는 여전히 바쁘다는 게 이 글의 맺음말입니다. 저는 그 바쁜 눈과 머리가 할 일 중 가장 중요한 게 AI의 빈칸을 보는 일이라고 생각합니다. 그러니 내일 AI에게 일을 줄 때 프롬프트 끝에 두 줄만 붙여 보세요. 확인하지 못한 건 미확인으로 적을 것, 내가 준 정보와 네가 추정한 걸 구분할 것. 결과물의 양은 조금 줄겠지만, 믿고 쓸 수 있는 부분은 훨씬 늘어날 겁니다.