[AI/Python] 프롬프트 엔지니어링 기초 & Gradio로 나만의 번역 앱 만들기

생성형 AI를 더 잘 활용하기 위한 프롬프트 엔지니어링(Prompt Engineering)의 핵심 개념과, OpenAI API와 Gradio를 활용해 웹 기반 번역기를 만드는 과정을 정리한 학습 메모입니다.

---

1. 프롬프트 엔지니어링 (Prompt Engineering)

개념

인공지능 모델(GPT 등)이 최적의 결과물을 낼 수 있도록 입력값(프롬프트)을 설계하고 최적화하는 기술. AI의 한계를 이해하고, 구체적인 지시와 맥락을 제공하여 원하는 답변을 유도하는 것이 핵심이다.

주요 역할 (Role)

API 통신 시 메시지의 주체를 정의하는 중요한 개념.

• User (사용자): 질문이나 요청을 하는 주체.
• Assistant (어시스턴트): AI 모델. 사용자의 요청에 응답하는 역할.
• System (시스템): AI의 **페르소나(성격, 역할)**를 부여하는 설정값. (예: "너는 친절한 비서야", "너는 파이썬 전문가야")

---

2. 좋은 프롬프팅 vs 나쁜 프롬프팅

❌ 나쁜 프롬프팅 예시

"이 코드 설명해줘"

• 문제점: 사용자의 수준, 설명의 깊이, 목적(학습용/실무용)이 불분명하여 AI가 모호한 답변을 내놓을 수 있음.

⭕ 좋은 프롬프팅 예시

"아래 파이썬 코드를 비전공자 기준으로, 1. 한 줄 요약 -> 2. 줄 단위 설명 -> 3. 실행 예제 순서로 자세하게 설명해줘."

• 장점: 대상, 형식, 순서가 명확하여 원하는 포맷의 고품질 답변을 얻을 수 있음.

프롬프팅 공식

원하는 결과를 얻기 위해 아래 구조를 활용하자.

역할 + 상황 + 목표 + 조건 + 출력 형식

너는 [전문가 역할]이고, 나는 지금 [상황]이야.
내 목표는 [목표]이며, 아래 조건을 반드시 지켜줘.
1. ...
2. ...
결과는 [표/코드/단계별 설명] 형식으로 출력해줘.

---

3. OpenAI API 이해하기

API Platform

개발자가 자신의 서비스에 GPT 모델을 연동할 수 있게 해주는 클라우드 인터페이스. (유료, 토큰 단위 과금)

토큰 (Tokens)

GPT는 텍스트를 단어가 아닌 토큰(Token) 단위로 인식한다.

• 영어: 1단어 ≈ 1~2토큰
• 한글: 1글자 ≈ 2~3토큰 (한글이 토큰 소모가 더 큼)
• 요금 계산: (입력 토큰 + 출력 토큰) × 모델별 단가

API 요청 구조 (JSON)

대화의 흐름(History)을 리스트 형태로 전달해야 문맥을 이해한다.

{
  "model": "gpt-4",
  "messages": [
    { "role": "system", "content": "너는 파이썬 튜터야." },
    { "role": "user", "content": "리스트와 튜플의 차이는?" }
  ]
}

---

4. Gradio (그라디오)

개념

머신러닝 모델이나 파이썬 함수를 웹 인터페이스(UI)로 쉽게 만들어주는 라이브러리. HTML/CSS를 몰라도 직관적인 UI 제작 가능.

기본 사용법

1. 설치

pip install gradio

 

2. 기본 입출력 예제

import gradio as gr

def handle_input(text):
    return "입력하신 내용: " + text

with gr.Blocks() as demo:
    # UI 컴포넌트 정의
    text_input = gr.Textbox(label="문자 입력", lines=1)
    output_text = gr.Textbox(label="출력 결과")
    
    # 이벤트 연결 (입력 -> 함수 -> 출력)
    text_input.submit(handle_input, inputs=text_input, outputs=output_text)

demo.launch()

 

3. 다양한 컴포넌트 (Checkbox, Dropdown)

def handle_fruit(fruit):
    return f'선택한 과일: {fruit}'

with gr.Blocks() as demo:
    fruit_dropdown = gr.Dropdown(
        label='과일 선택', 
        choices=['사과', '바나나', '오렌지']
    )
    output_fruit = gr.Textbox(label="결과")
    
    # 값이 바뀔 때(change) 함수 실행
    fruit_dropdown.change(handle_fruit, inputs=fruit_dropdown, outputs=output_fruit)

demo.launch()

---

5. [실습] 초간단 AI 번역 앱 만들기

OpenAI API의 지능과 Gradio의 UI를 결합하여 다국어 번역기를 구현.

 

주요 기능

1. System Prompt: AI에게 "번역 앱"이라는 역할을 부여.
2. Few-shot Prompting: 예제 데이터(example)를 미리 제공하여 번역 톤앤매너를 학습시킴.
3. UI: 언어 선택(Dropdown) 및 실시간 번역 결과 출력.

전체 코드

import os
import gradio as gr
from openai import OpenAI
from dotenv import load_dotenv

# .env 파일에서 API KEY 로드
load_dotenv()
client = OpenAI(api_key=os.getenv("API_KEY"))

# 1. Few-shot 예제 데이터 (AI에게 번역 스타일 가이드 제공)
example = {
    "한국어": ["오늘 날씨 어때?", "최근 멀티모달 AI 기술이 인기다."],
    "영어": ["How is the weather today?", "Recently, multimodal AI technology has become popular."],
    "일본어": ["今日の天気はどう？", "最近、マルチモーダルAI技術が人気を集めている。"]
}

# 2. 번역 로직 함수 (OpenAI API 호출)
def translate_text_chatgpt(text, src_lang, trg_lang):
    
    # Few-shot 메시지 구성 함수
    def build_fewshot(src, trg):
        src_ex = example[src]
        trg_ex = example[trg]
        messages = []
        for s, t in zip(src_ex, trg_ex):
            messages.append({"role": "user", "content": s})
            messages.append({"role": "assistant", "content": t})
        return messages

    # 시스템 프롬프트 설정
    system_instruction = f'assistant는 번역 앱이다. {src_lang}를 {trg_lang}로 적절하게 번역된 텍스트만 출력해라.'
    
    # 메시지 리스트 조립 (시스템 + 퓨샷 예제 + 사용자 입력)
    fewshot_messages = build_fewshot(src_lang, trg_lang)
    final_messages = [{'role': 'system', 'content': system_instruction}] + fewshot_messages + [{'role': 'user', 'content': text}]

    # API 호출
    response = client.chat.completions.create(
        model='gpt-4o', # 또는 gpt-3.5-turbo 등 사용 가능한 모델
        messages=final_messages
    )
    return response.choices[0].message.content

# 3. Gradio 핸들러 함수 (예외 처리 포함)
def gradio_translate(text, src_lang, trg_lang):
    if not text.strip():
        return "번역할 내용을 입력하세요."
    if src_lang == trg_lang:
        return "원본 언어와 번역 언어가 같습니다."
    
    return translate_text_chatgpt(text, src_lang, trg_lang)

# 4. Gradio UI 구성
with gr.Blocks() as demo:
    gr.Markdown("# 🤖 초간단 AI 번역기")
    
    with gr.Row():
        src_lang_dropdown = gr.Dropdown(['한국어', '영어', '일본어'], value='영어', label='원본 언어')
        trg_lang_dropdown = gr.Dropdown(['영어', '한국어', '일본어'], value='한국어', label='타겟 언어')
    
    text_input = gr.Textbox(label='번역할 내용', placeholder='텍스트를 입력하세요', lines=2)
    translate_button = gr.Button("번역하기", variant="primary")
    output_text = gr.Textbox(label='번역 결과', interactive=False)

    # 버튼 클릭 이벤트
    translate_button.click(
        gradio_translate, 
        inputs=[text_input, src_lang_dropdown, trg_lang_dropdown], 
        outputs=output_text
    )

demo.launch()

마무리

 

• Role 활용: System 프롬프트로 AI의 역할을 고정하는 것이 중요함.
• Few-shot: 단순히 "번역해줘"라고 하는 것보다, 예시(example)를 몇 개 던져주면(Few-shot) 훨씬 더 정확하고 일관된 스타일로 번역함.
• Gradio: gr.Blocks()를 사용하면 컴포넌트 배치를 자유롭게 할 수 있음.