UX 관련 지침: App 안내, App 미사용, 그리고 대화 중 행동

1. 왜 지침으로 UX를 제어해야 하는가

ChatGPT의 관점에서 여러분의 App은 단지 추가 도구와 위젯일 뿐입니다. 하지만 사용자에게는 대화 한가운데 갑자기 나타나는 하나의 독립된 인터페이스입니다. 모델의 행동을 제어하지 않으면 두 가지 극단적인 시나리오가 발생할 수 있습니다.

한쪽 경우에는 GPT가 App을 무시하고 “전부 말로 해결”하려 듭니다. 사용자가 선물을 추천해 달라고 요청했는데, 모델은 GiftGenius를 실행하는 대신 “직접” 장문의 텍스트 에세이로 추천을 내놓습니다. 때로는 나쁘지 않을 수도 있지만, 여러분이 App을 만든 이유는 먼지만 쌓이게 하려는 게 아니었을 겁니다.

다른 쪽 경우에는 GPT가 오히려 App을 남용합니다. “여러분의 서비스가 무엇을 할 수 있나요?” 같은 사소한 질문에도 위젯을 실행하고, 흐릿한 폼을 렌더링하니 사용자는 놀라서 이 모든 걸 닫아버립니다. UX 관점에서 매우 집요하게 느껴집니다.

따라서 논리는 간단합니다. JSON 스키마나 React 컴포넌트의 props를 고정하듯, 행동도 명시적으로 고정해야 합니다. 여기서 system‑prompt(및 보조 지침)는 여러분의 “UX 프로토콜”입니다. 여기서 어시스턴트가 언제 어떻게 다음을 수행하는지 서술합니다.

• App 실행을 예고(안내)한다;
• App을 의도적으로 실행하지 않고 텍스트로 답한다;
• 위젯이 이미 결과를 보여준 뒤에 어떻게 행동한다;
• 사용자의 “앱 없이” 요청을 존중한다.

이는 마케팅이나 화법의 문제가 아닙니다. 실제로 여러분의 App 호출 빈도와 사용자의 편안함에 영향을 줍니다.

이제 단계별로 살펴보겠습니다. 어시스턴트가 App 실행을 어떻게 예고해야 하는지, 언제는 위젯을 제안하지 않는 편이 나은지, 앱이 동작한 뒤에는 어떻게 행동해야 하는지, 사용자의 명시적 대화 형식 요청을 어떻게 존중할지, 그리고 이러한 규칙을 system‑prompt에 어떻게 깔끔하게 정리할지를 다룹니다.

2. App 예고: 모델이 위젯을 어떻게 “알려야” 하는가

ChatGPT가 App을 사용하기로 결정하면 인터페이스가 바뀝니다. 채팅에 위젯 카드가 나타나고, 때로는 전체 화면이 되며, 버튼과 기타 UI 요소가 생깁니다. 어시스턴트가 아무 설명 없이 위젯을 보여주면 사용자는 무슨 일이 일어났는지, 이 블록이 어디서 나타났는지조차 이해하지 못할 수 있습니다.

따라서 좋은 방식은 먼저 텍스트로 지금 무슨 일이 일어날지 설명하고, 그 다음에 App을 실행하는 것입니다. 이는 브라우저가 “새 창을 열까요?”라고 묻거나, 모바일 앱이 “지금 카메라 권한을 요청할 거예요”라고 미리 알리는 것과 비슷합니다.

예고(안내)의 유형

예고 방식은 크게 세 가지 스타일로 나눌 수 있습니다.

첫째 — 부드러운 제안. 어시스턴트가 “여러분의 조건에 맞춰 선물을 골라주는 GiftGenius 앱을 열어드릴 수 있어요. 열까요?”처럼 말하고 “예/아니오”를 기다립니다. 서비스에 처음 익숙해지는 단계거나 인터페이스 전환에 민감할 수 있는 상황에 잘 맞습니다.

둘째 — 자신 있는 추천. App이 제품의 주요 인터페이스라면 “지금 GiftGenius 앱을 실행해 카드 형태로 몇 가지 선물 옵션을 보여드릴게요.”처럼 쓸 수 있습니다. 어시스턴트는 여전히 거절을 고려할 수 있지만, 기본적으로 더 단호하게 행동합니다.

셋째 — 중립적 알림. 이 경우 어시스턴트는 “선물 선정을 위해 GiftGenius 앱을 실행합니다…”처럼 간단히 알립니다. 사용자가 이미 여러 번 여러분의 App을 보았고 그 등장을 예상하는 상황에 어울립니다.

중요한 점은, 이러한 모든 방식을 system‑prompt에 명시적으로 담을 수 있고 또 담아야 한다는 것입니다. 여러분이 골격을 미리 제공하면, 모델이 UX 문구를 제로에서 지어내지 않습니다.

미니 코드 예시: system‑prompt의 예고 섹션

여러분의 Next.js 템플릿에 appDefinition.ts 파일이 있고, 여기서 App을 위한 system‑prompt를 정의한다고 가정해 봅시다.

// app/appDefinition.ts
export const systemPrompt = `
# 역할
당신은 ChatGPT App GiftGenius로서, 선물 고르기를 도와줍니다.

# 대화와 UX — 앱 예고
GiftGenius 위젯을 실행하기로 했다면,
먼저 한두 문장으로 지금 선물 추천 앱이 열릴 것이고
사용자에게 어떤 도움이 되는지 설명하세요.
`;

이것만으로는 완전한 계약은 아니지만, 이런 작은 삽입만으로도 행동의 예측 가능성이 크게 높아집니다.

예고가 특히 중요한 경우

UI가 복잡할수록 실행을 사전에 설명하는 것이 더 중요합니다. 위젯이 선물 카드 세 개만 보여주는 정도라면 비교적 부드러운 맥락 전환입니다. 반면 필터, 예산, 카테고리 등 여러 단계를 가진 마법사 전체를 열어야 한다면, 왜 대화가 갑자기 “채팅 속 작은 웹앱”으로 변했는지 사용자가 이해할 수 있어야 합니다.

공식 UX 가이드라인 역시, 어시스턴트는 텍스트와 UI를 명시적으로 연결해야 하며, 답변에 위젯을 묵묵히 끼워 넣어서는 안 된다고 강조합니다.

3. 언제 App을 의도적으로 제안하지 말아야 하는가

App 초기 개발 단계에서 가장 흔한 실수는 “손에 망치가 있으면 모든 것이 못으로 보인다”는 고전적인 효과입니다. 멋진 GiftGenius가 있으니 모델이 모든 대화에 그걸 끌어오려 합니다. 사용자가 “여러분의 앱이 무엇을 하나요?”라고 물었을 뿐인데 ChatGPT는 벌써 “GiftGenius를 실행합니다…”라고 합니다. 사실 사용자는 두 줄짜리 설명만 원했을 수 있습니다.

이를 피하려면, system‑prompt에 App을 제안하지 말아야 하는 상황을 기술해야 합니다. 아래는 전형적인 시나리오 몇 가지입니다.

• 첫째, 소개성 질문. 사용자가 “GiftGenius가 무엇을 하나요?” 또는 “어떻게 동작하나요?”처럼 쓰면, 우선 UI 실행 없이 짧은 텍스트 설명을 제공하라고 지침이 요구해야 합니다. 여기서 위젯은 오히려 산만합니다.
• 둘째, 너무 일반적이거나 모호한 요청. 사용자가 “새해 선물에 대해 알려줘”라고 쓰면, 이는 구체적 추천이라기보다 교육적 질문에 가깝습니다. 어시스턴트는 일반 원칙을 간단히 설명하고, 추가 질문을 통해 구체화를 유도한 뒤, 예산·수신자·카테고리 같은 명확한 파라미터가 생기면 App을 제안할 수 있습니다.
• 셋째, App의 도메인 밖 요청. 사용자가 “이력서 작성 도움”을 요청하는데 여러분의 App이 선물에 특화됐다면, 올바른 행동은 솔직하게 일반 ChatGPT처럼 답하고 아무것도 실행하지 않는 것입니다. App의 용도를 부드럽게 언급할 수는 있지만, 명백히 무관할 때 강요해서는 안 됩니다.
• 넷째, UI에 대한 명시적 거부. 사용자가 “아무 앱도 열지 말고 텍스트로만 설명해”라고 쓰면, 모델은 App에 완벽히 맞는 시나리오로 보이더라도 반드시 따르도록 합니다.

표: 요청 유형과 어시스턴트의 행동

system‑prompt에 App 미사용 규칙 추가

같은 systemPrompt에 App을 실행하지 말아야 하는 경우를 추가해 봅시다.

export const systemPrompt = `
# 역할
당신은 ChatGPT App GiftGenius로서, 선물 고르기를 도와줍니다.

# 위젯을 실행하지 말아야 할 때
사용자가 서비스가 무엇을 하는지 정도만 묻거나
선물에 대한 일반적/이론적 질문을 하는 경우,
우선 텍스트로 답하고 앱을 실행하지 마세요.

요청이 선물 선택과 관련이 없다면,
일반 ChatGPT처럼 답하고 GiftGenius를 제안하지 마세요.

사용자가 앱을 사용하지 말라고 명시적으로 요청한다면,
반드시 이를 존중하고 채팅으로만 도와주세요.
`;

이런 텍스트는 경계 상황에서 모델이 UI 쪽으로 “치우치지” 않도록 구체적인 결정을 내리게 합니다. 이제 App이 필요 없는 경우를 고정했습니다. 다음으로, 위젯이 이미 동작하여 사용자가 결과를 보는 상황에서 어시스턴트가 무엇을 해야 하는지도 기술하는 것이 중요합니다.

4. App 사용 이후의 행동: follow‑up과 시나리오 마무리

위젯 모듈에서 이미 보았듯이, follow‑up 메시지는 UI가 동작한 후에도 대화를 이어가는 데 도움이 됩니다. 위젯이 카드를 보여주고, 그 아래에서 어시스턴트는 “동료에게 줄 최대 $50 예산의 선물 옵션을 찾았어요. 더 저렴한 것들을 보여드릴까요, 아니면 카테고리를 바꿔볼까요?” 같은 문장과 함께 인기 있는 액션 버튼을 제안합니다.

이제 우리의 과제는 이러한 행동을 모델의 “직감”에 맡기지 않고 지침에 고정하는 것입니다.

위젯 이후 어시스턴트가 해야 할 일

이상적인 시나리오에서는 몇 가지가 순차적으로 일어납니다.

• 먼저 어시스턴트가 App의 결과를 간단히 말로 요약합니다. 위젯이 카드 10개를 보여줬더라도 “동료에게 줄 최대 $50 예산의 선물 4가지를 골랐어요. 맞춤 인쇄 머그, 책상용 식물, 좋은 커피 세트, 세련된 노트가 포함되어 있어요.”처럼 적어주는 게 유용합니다.
• 그 다음 다음 단계를 제안합니다. 여기서 미리 생각해 둔 follow‑up 문구가 도움이 됩니다. “더 저렴한 옵션을 보실래요?”, “관심사로 범위를 좁혀볼까요?”, “여러분 지역에서 구매 가능한 것만 볼까요?” 같은 문구입니다. 이런 문구를 위젯에서 sendFollowUpMessage로 사용할 수도 있고, system‑prompt에서 모델에 권장할 수도 있습니다.
• 마지막으로, 사용자가 시나리오를 분명히 마무리할 때(“고마워요, 충분해요”), 어시스턴트는 깔끔하게 주제를 “닫고”: 과제가 해결되었음을 인정하고 다른 도움을 제안합니다.

흐름 다이어그램: 질문 → 위젯 → follow‑up

어시스턴트의 행동을 간단한 상태 기계로 상상해 볼 수 있습니다.

flowchart TD
    U[사용자가 요청을 제시함] --> G[GPT가 결정: App을 실행할까?]
    G -->|예| A[App 실행을 예고함]
    A --> W[GiftGenius 위젯이 옵션을 선별함]
    W --> S[어시스턴트가 결과를 요약함]
    S --> F[어시스턴트가 follow-up 선택지를 제안함]
    F -->|사용자가 동작을 선택함| G
    G -->|아니오, App 실행하지 않음| T[UI 없이 텍스트로 응답]
    F -->|"사용자가 \"감사합니다\"라고 말함"| E[어시스턴트가 시나리오를 마무리하고 다른 도움을 제안함]

이런 흐름을 사실상 system‑prompt에서 말로 서술하는 셈입니다.

코드 예시: 위젯에서의 follow‑up

UI 측면에서는 이미 follow‑up 메시지를 보낼 수 있습니다. 완결성을 위해, 버튼 클릭 후 모델에 “예산을 늘리자”고 요청하는 간단한 컴포넌트 예시를 보겠습니다.

// components/ExpandBudgetButton.tsx
export function ExpandBudgetButton() {
    const onClick = () => {
        window.openai?.sendFollowUpMessage(
            "조금 더 높은 예산의 옵션을 보여줘"
        );
    };

    return <button onClick={onClick}>좀 더 비싼 옵션 보기</button>;
}

이제 이러한 follow‑up 메시지를 모델이 어떻게 처리해야 하는지 힌트를 줄 텍스트를 system‑prompt에 추가해 보겠습니다.

// systemPrompt 계속
const followUps = `
# 앱 실행 이후의 행동
위젯이 선물 목록을 보여준 뒤에는
결과를 간단히 텍스트로 설명하세요.

그 다음 1–3개의 명확한 다음 단계를 제안하세요
(예: 더 저렴한 것 보기, 예산 변경, 카테고리 교체).
위젯이 follow-up 메시지를 보냈다면,
이를 다음 단계에 대한 힌트로 활용하세요.
`;

기술적으로는 그저 문자열일 뿐입니다. 하지만 UX 관점에서는 예측 가능한 시나리오의 핵심입니다.

5. 사용자의 의도를 존중하기

위에서 논의한 모든 것은 App 행동에 대한 제품적 기대입니다. 사용자의 “의사”를 듣지 못한다면 UX 지침은 제대로 작동하지 않습니다. 아무리 완벽하게 설계된 App이라도, 사람이 형식을 바꾸지 말라고 명시하면 양보해야 합니다.

대표적인 상황이 몇 가지 있습니다.

• 사용자가 앱을 원치 않는다고 분명히 말할 때(“UI 말고, 무엇을 사면 될지 텍스트로만 알려줘”), 어시스턴트는 이를 강한 제약으로 받아들이고 우회하려 해서는 안 됩니다. “알겠습니다. 텍스트로만 답하겠습니다.”처럼 정중히 말하고 실제로 약속을 지키면 됩니다.
• 사용자가 무언가가 자동으로 실행될까 봐 걱정할 때, 통제감을 주는 것이 좋습니다. 예를 들어 “선물 선정을 위한 앱을 열 수 있지만, 원하시면 그냥 채팅으로도 논의할 수 있어요. 어떤 방식이 편하신가요?”처럼 선택지를 명확히 제공합니다.
• 사용자가 “지금은 휴대폰이라 복잡한 폼은 열지 마”라고 쓰는 경우도 맥락의 일부입니다. 어시스턴트는 이를 받아들여, 예를 들어 짧은 아이디어 목록과 추가 질문 정도로 제한해야 합니다.

계약에 존중을 내장하기

이 모든 것을 system‑prompt에 간결히 반영할 수 있습니다.

export const respectBlock = `
# 사용자의 의도가 최우선
항상 사용자가 명시한
소통 형식에 대한 요청을 고려하세요.

사용자가 앱이나 위젯 실행을 원치 않으면,
GiftGenius를 제안하거나 실행하지 마세요.
설령 그게 문제 해결에 도움이 되더라도 마찬가지입니다.
대신 텍스트로 도와주세요.
`;

이렇게 하면 대화에서 “누가 주도권을 갖는지”가 분명해집니다. 스포일러: 그건 멋진 UI에 대한 여러분의 자부심이 아니라, 화면 반대편의 실제 사람입니다.

6. system‑prompt와 문서에서 UX 지침을 구성하는 방법

우리는 이미 App 예고부터 follow‑up 메시지, 대화 형식 존중까지 많은 행동 규칙을 정리했습니다. 이제 중요한 것은 모델에게 무엇을 말하느냐뿐만 아니라, system‑prompt와 문서에서 이를 어떻게 구성하느냐입니다.

실제 App에서 system‑prompt는 빠르게 거대해집니다. 이를 한 덩어리의 문학적 텍스트로만 쓰면, 일주일 뒤에는 아무도 찾지 못합니다. 기술 사양이나 README처럼 구조화해서 다루세요.

좋은 방법은 프롬프트를 여러 논리 섹션과 제목으로 나누는 것입니다. 예를 들어 “역할과 책임 범위”, “App을 사용할 때”, “App을 사용하지 않을 때”, “대화와 UX”, “보안과 제한”처럼요. 각 섹션 내부는 간단하고 모호하지 않은 문장으로 작성합니다.

더 나아가, system‑prompt를 컴포넌트 한가운데의 문자열 리터럴로 넣지 말고 코드 근처의 별도 파일로 분리하세요. 그러면 리뷰·변경 비교·제품/법무와의 논의가 쉬워집니다.

코드에서 system‑prompt를 구성하는 예

한 가지 방법은 프롬프트 일부를 개별 문자열로 보관하고, 하나로 결합하는 것입니다.

// app/prompt/role.ts
export const roleSection = `
# 역할
당신은 ChatGPT App GiftGenius입니다.
사용자의 과제와 예산에 맞춰 선물을 고르도록 돕습니다.
`;

// app/prompt/ux.ts
export const uxSection = `
# 대화와 UX
GiftGenius 위젯을 실행하기 전에
지금 선물 카드가 있는 앱이 열릴 것임을 간단히 설명하세요.
일반적이거나 이론적인 질문에는 앱을 실행하지 말고,
사용자가 명시적으로 선물 선정을 요청하지 않는 한 텍스트로 답하세요.
위젯 동작 후에는 결과를 요약하고
1–3개의 다음 단계를 제안하세요.
`;

// app/appDefinition.ts
import { roleSection } from "./prompt/role";
import { uxSection } from "./prompt/ux";

export const systemPrompt = `
${roleSection}
${uxSection}
`;

이런 분할은 지침을 별도 모듈(UX, 보안, 도구 사용 등)로 생각하게 도와줍니다. 새로운 기능을 추가하고 여러 팀과 행동을 합의해야 할 때 특히 유용합니다.

또한 App 관련 문서(내부 README, Confluence, Notion)도 이러한 섹션과 동기화하는 것이 좋습니다. 왜 App을 그렇게 예고하는지, 왜 탐색적 요청에는 실행하지 않는지를 사람의 언어로 설명하세요. follow‑up 멘트가 어떻게 되어야 하는지도 별도로 고정하세요. 그러면 팀의 신규 인원이 여러분의 의도를 모른 채 프롬프트를 “고치려” 들지 않습니다.

7. 실습: 우리 GiftGenius의 UX 섹션 다시 쓰기

이제 모두 모아 어느 정도 완성된 system‑prompt 예시를 만들어 봅시다. 예전에는 아주 소박한 system‑prompt가 있었다고 가정합시다.

export const systemPrompt = `
당신은 GiftGenius 앱입니다.
사용자에게 선물을 골라주세요.
`;

이 텍스트는 App을 언제 실행할지, 어떻게 예고할지, 위젯 이후 무엇을 할지에 대해 아무 것도 말해주지 않습니다. UX 지침을 단계적으로 추가해 봅시다.

먼저 책임 범위와 작업 형식을 명확히 합니다.

const role = `
# 역할
당신은 ChatGPT App GiftGenius입니다.
당신의 임무는 사용자에게 3–7개의 관련 선물을
예산, 수신자, 계기에 맞춰 추천하는 것입니다.
시각적 선정을 위해 GiftGenius 위젯을 사용할 수 있습니다.
`;

그 다음 실행 예고 방식을 기술합니다.

const announce = `
# 앱 예고
GiftGenius 위젯이 더 도움이 된다고 판단되면,
한두 문장으로 지금 선물 카드 앱이 열릴 것이고
사용자가 이를 살펴보고 필터링할 수 있음을 설명하세요.
그 다음에 앱을 실행하세요.
`;

App을 실행하지 말아야 할 규칙을 추가합니다.

const noApp = `
# 앱을 사용하지 말아야 할 때
사용자가 서비스가 무엇을 하는지만 묻거나
선물에 대한 일반적/이론적 정보를 원한다면,
텍스트로 답하고 GiftGenius를 실행하지 마세요.

요청이 선물과 무관하다면(예: 이력서나 코드),
일반 ChatGPT처럼 답하고 앱을 제안하지 마세요.

사용자가 앱 사용 금지를 요청했다면,
이를 필수 제약으로 간주하세요.
`;

마지막으로 위젯 사용 이후의 행동을 완성합니다.

const afterWidget = `
# 위젯 이후의 행동
위젯이 선물 옵션을 보여준 뒤에는
결과를 간단히 당신의 말로 설명하세요.
사용자에게 1–3개의 다음 단계를 제안하세요
(예: 예산 변경, 관심사로 필터링,
더 저렴한 옵션만 보기).

위젯이 follow-up 메시지를 보냈다면,
이를 다음 단계의 주요 신호로 사용하세요.
`;

최종 system‑prompt는 다음과 같을 수 있습니다.

export const systemPrompt = `
${role}
${announce}
${noApp}
${afterWidget}
`;

이제 “우주에 비는 소원”이 아니라 행동 명세에 가까워졌습니다. 다음 모듈에서는 보안, 환각 방지, 커머스 등 성숙한 App 운영을 위한 지침을 추가하겠지만, UX 부분은 이미 토대가 마련되었습니다.

8. UX 지침 설정 시 흔한 실수

실수 1: “App이 텍스트보다 항상 더 낫다”.
어떤 개발자는 자신들의 위젯이 너무 자랑스러워서 모델에게 틈만 나면 호출하라고 요구합니다. 결과적으로 사용자는 “이게 대체 뭐예요?”라고 묻는 자리에서도 App을 받게 됩니다. 모델은 집요해지고, 사람들은 앱을 무시하기 시작합니다. 올바른 접근은 App이 불필요한 시나리오를 명확히 규정하고, 그러한 케이스를 존중하는 것입니다.

실수 2: App 실행 전의 명시적 예고 부재.
어시스턴트가 말 없이 위젯을 실행하면, 사용자는 UI 블록이 왜 생겼는지, 무엇을 하면 되는지 알지 못합니다. OpenAI 가이드라인과 실전 경험 모두, “지금 X를 해주는 앱을 열게요” 같은 한두 문장이 UX를 크게 개선하고 당황을 줄인다고 말합니다.

실수 3: 지나치게 공격적인 App 재제안.
가끔 App이 매 응답 후 “앱을 다시 열까요? 지금은요? 이번에는요?”처럼 위젯 실행을 반복 제안합니다. 금세 스팸이 됩니다. 첫 사용 이후에는 맥락을 보도록 지침에 고정하세요. 사용자가 과제 파라미터를 명확히 바꾸거나 “더 보여줘”라고 직접 요청할 때만 재제안하도록 합니다.

실수 4: 앱에 대한 명시적 거부를 무시.
“앱은 말고요, 제발” 또는 “휴대폰이라 폼 작업이 불편해요” 같은 문장은 강한 제약으로 받아들여야 합니다. 모델이 계속 App을 강요하면 사용자는 어시스턴트와 제품 모두에 대한 신뢰를 잃습니다. system‑prompt에서 두세 문장으로 쉽게 고정할 수 있는데도 많은 이들이 잊습니다.

실수 5: 위젯 이후 요약과 follow‑up 메시지 부재.
가끔 위젯은 성실히 옵션을 보여주지만, 어시스턴트는 그 뒤에 침묵합니다. 사용자는 UI를 보지만 다음이 무엇인지 알지 못합니다. 텍스트도, 질문도, 인기 있는 액션 버튼도 없습니다. 이런 시나리오는 미완처럼 보이고 대화의 연속성을 깨뜨립니다. 위젯 이후에는 항상 짧은 텍스트 요약과 1–3개의 명확한 다음 단계를 지침에 명시하세요.

실수 6: 제품 UX와 “일반 ChatGPT 화법”을 한 문단에 뒤섞기.
가끔 system‑prompt가 “친절하게, 이모지 사용, 적절하면 가끔 농담. 그리고 언젠가 App도 실행해” 같은 긴 문학적 텍스트가 됩니다. 이런 텍스트에서는 실제 UX 규칙을 알아보기 어렵습니다. “역할”, “대화와 UX”, “App을 사용할 때”, “App을 사용하지 않을 때” 같은 명확한 제목의 섹션으로 나누는 편이 좋습니다. 이는 모델에도, 이후 이 프롬프트로 작업할 사람들에게도 도움이 됩니다.