PART 10의 마무리는 데모 UI입니다. 지금까지 만든 기능은 모두 코드로만 돌았습니다. 하지만 동료나 사용자에게 보여 주려면, 코드를 모르는 사람도 사진을 올려 결과를 볼 수 있는 화면이 필요합니다. Gradio는 그 화면을 단 몇 줄로 만들어 주는 도구입니다.

Gradio란

Gradio는 머신러닝 함수에 웹 화면을 자동으로 붙여 주는 라이브러리입니다. "이 함수에 이미지를 넣으면 이미지가 나온다"고 알려 주면, 업로드 버튼과 결과 화면을 갖춘 웹 페이지를 만들어 줍니다. FastAPI(2장)가 기계 간 통신용 API였다면, Gradio는 사람이 직접 써 보는 데모용 화면입니다.

pip install gradio

가장 단순한 데모

4장의 모자이크 함수에 화면을 붙여 봅니다. gr.Interface에 함수와 입출력 종류만 알려 주면 끝입니다.

# 파일: mosaic_demo.py"""얼굴 모자이크 함수에 Gradio 웹 UI를 붙인다."""import gradio as grimport cv2from face_mosaic import mosaic_faces      # 4장의 함수 재사용def run(image):    # Gradio는 RGB로 주므로 OpenCV(BGR)로 변환해 처리 후 되돌린다    bgr = cv2.cvtColor(image, cv2.COLOR_RGB2BGR)    result = mosaic_faces(bgr)    return cv2.cvtColor(result, cv2.COLOR_BGR2RGB)demo = gr.Interface(    fn=run,    inputs=gr.Image(label="원본 이미지"),    outputs=gr.Image(label="모자이크 결과"),    title="얼굴 모자이크 데모",    description="사진을 올리면 얼굴을 자동으로 가립니다.",)demo.launch()

gr.Interface에 처리 함수(fn), 입력(inputs), 출력(outputs)을 주면 됩니다. demo.launch()를 실행하면 브라우저에서 열 수 있는 웹 페이지가 뜨고, 사진을 끌어다 놓으면 모자이크된 결과가 나옵니다. Gradio가 RGB 배열로 이미지를 주고받으므로, OpenCV(BGR)와 변환만 맞춰 주면 됩니다.

여러 입출력을 갖춘 데모

분석 결과처럼 출력이 여럿일 때는 outputs에 여러 개를 나열합니다. PART 06·08의 분석을 화면으로 만들어 봅니다.

# 파일: analyze_demo.py"""사진을 올리면 표정·나이를 보여 주는 데모."""import gradio as grfrom deepface import DeepFacedef analyze(image_path):    info = DeepFace.analyze(image_path, actions=["emotion", "age"],                            detector_backend="yunet", silent=True)[0]    label = info["dominant_emotion"]    age = f"약 {info['age']}세 (추정)"    return label, agedemo = gr.Interface(    fn=analyze,    inputs=gr.Image(type="filepath", label="얼굴 사진"),    outputs=[gr.Label(label="표정"), gr.Text(label="추정 나이")],    title="표정·나이 분석 데모",    description="표정과 나이는 추정값이며 정확하지 않을 수 있습니다.",)demo.launch()

inputs에 type="filepath"를 주면 DeepFace가 좋아하는 파일 경로로 이미지를 받습니다. outputs에 라벨과 텍스트 두 개를 두어 표정과 나이를 각각 보여 줍니다. description에 "추정값"임을 명시한 것은 PART 08의 주의를 UI에서부터 지키는 것입니다.

공유와 책임

Gradio는 demo.launch(share=True)로 임시 공개 링크를 만들어 다른 사람과 바로 공유할 수 있습니다. 편리하지만 책임이 따릅니다.

실무 팁. 데모는 "기술이 무엇을 할 수 있는가"를 보여 주는 동시에 "무엇을 못 하는가"도 보여 줄 좋은 기회입니다. 감정 분석 데모라면 일부러 애매한 표정 사진도 넣어 보게 하고, 결과가 흔들리는 모습을 함께 보여 주세요. 한계를 숨기지 않고 드러내는 데모가, 기술을 과신하지 않는 건강한 사용 문화를 만듭니다.

이 장에서 기억할 것

Gradio는 처리 함수에 gr.Interface(fn, inputs, outputs)만 붙이면 웹 데모 화면을 만들어 주어, 코드를 모르는 사람도 결과를 써 볼 수 있게 합니다. RGB↔BGR 변환만 맞추면 앞 장들의 함수를 그대로 감쌀 수 있고, 출력이 여럿이면 나열합니다. 공개 링크·업로드 데이터·결과 표현에 책임이 따르며, 한계를 함께 보여 주는 데모가 건강합니다. 이로써 PART 10이 끝납니다. 마지막 PART 11에서는 지금까지 거듭 강조한 평가·배포·운영과 윤리를 종합합니다.