AI 공부

3. Gradio 활용해보기_회사 소개 브로셔 제작 챗봇

kdb1248 2026. 1. 25. 17:45

목차

1. Day 6 - 다양한 프런티어 모델 API 활용해 보기 (GPT, Claude, Gemini, Deepseek) 

2. Day 7 - Gradio 사용해보기, Gradio 활용 회사 브로셔 제작 챗봇 만들기 

 


1. Day 6 - 다양한 프론티어 모델 API 활용해 보기 (GPT, Claude, Gemini, Deepseek) 

Day 6 (2주차 첫 번째)에서 가장 먼저 해본 것은 GPT 외에도 다양한 프런티어 모델 API를 이용해 본 것이었다. 

모델 API를 이용하기 위한 사전세팅 부터, 모델 API 호출 시 각 모델의 표준규격은 어떤지 볼 수 있었다.

 

추가로 각 모델별 표준 규격과 상관없이 OpenAI 공통 규격(client)을 활용하는 법과,

모델 응답을 통으로 출력하는 것이 아닌 스트리밍, 마크다운 출력까지 해볼 수 있었다. 

 

1) 모델 API를 호출하기 위해 필요한 사전 세팅  (SDK, 클라이언트 객체 설정) 

- API 호출 전 각 모델 별로 사전 세팅 필요한 사항 설정 (구글의 경우엔 SDK 활용)

 

2) 각 모델별 API 표준 규격 이용

- Gemini, GPT, Claude 각각에서 요구하는 표준 형식으로 API call을 쏴봤다

- 각 모델사별 표준규격 및 프롬프트 요구 형식이 조금씩 다른 부분을 보는 것이 인상적이었다

각 모델의 표준형식 이용

 

3) OpenAI 클라이언트 공동이용/ 스트리밍&마크다운 출력 

- Deepseek, Gemini API에 대해 각 모델사의 표준 규격 형식을 이용하는 것이 아니라 OpenAI사 제공 Client를 공통 이용해 봤다
- 모델의 답변 출력을 통으로 받는 것이 아닌 Streaming 출력도 해보고, 출력형식을 마크다운으로 바꿔서도 출력해 봤다

 

 

2. Day 7 - Gradio 사용해 보기, Gradio 활용 회사 브로셔 제작 챗봇 만들기 

Python 코드 몇 줄만으로 손쉽게 프론트엔드 UI를 만들어주는 tool인 Gradio를 처음 써봤다. 

이를 활용해서 1주 차(Day 3~5)에 구현해 봤던 회사 브로셔 제작 기능
(웹사이트 url 기반으로 회사 마케팅 브로셔를 제작)

을 실제 눈에 보이는 프론트엔드 UI와 함께 만들어볼 수 있었다. 

 

Gradio

 

개인적으로 이전에 회사에서 AI 스타트업 들과 협력 미팅 등을 할 때.

해당 스타트업 개발자 분이 본인이 만든 AI 기능들을 Gradio를 활용해 UI형태로 보여줬었던 적이 있었다. 

 

그때는 Gradio가 뭔지 잘 모른 상태였기 때문에, 제대로 잘 이해하지 못하고 넘어갔던 Gradio를

내가 직접 코드로 활용해 보는 경험 자체가 의미가 있던 순간이었다. 

 

또한 직접 Gradio를 써보며, 뒷단의 AI 로직만 내가 잘 만들어놓으면 이를 화면단으로 구현해서 간단한 챗봇 프로토타이핑

정도는 나도 쉽게 만들 수 있겠구나 느꼈다. 
(Gradio 쪽 로직만 바이브 코딩으로 AI 한테 짜달라고 하는 방법도 있으니)

 

 1) Gradio 사용법 익혀보기

- public 공유 url 만들기, 다크모드 UI, input/output 텍스트 박스 형식 지정 등의 다양한 기능을 활용해 봄

- 이전에 썼던 마크다운/스트리밍 출력도 활용 

(스트리밍 출력을 활용하기 위해 함수 출력으로 "return"이 아닌,
하나씩 값을 돌려주는 제너레이터 함수 "yield"의 원리도 간략히 나마 공부해 볼 수 있었다.)

 

(좌) 다크모드 UI (가운데) 스트리밍 출력 (우) 텍스트박스 형식 지정/마크다운 output

 

2) 응답 Tone, 모델 지정해서 응답받기 

- 유저가 단순히 정해진 특정 모델에 질의하는 게 아니라

[모델 종류]와 [Tone(formal, freindly, Teacher모드 등)] 을 드롭다운 통해 선택 후 응답받을 수 있게 만들어봤다. 

(좌) Tone 지정 (우) Teacher Tone 및 한국어 응답을 받을 수 있게 지정

 

3) Gradio 활용 마케팅 브로셔 제작 챗봇 구축

- [회사명], [회사 웹사이트 Main page]를 유저가 넣으면

LLM이 자동으로 해당 웹사이트 내 텍스트 및 링크들을 바탕으로 회사 소개 마케팅 브로셔를 제작해 주는 간단한 챗봇을 만들었다 

 

- 구체적 flow는 아래와 같다. 

1) 웹사이트 내 HTML을 파싱해와 "타이틀", "(본문 속 불필요 태그 제거 후) 텍스트/링크(a태그 활용)" 수집

2) 수집한 웹 페이지 내 contents를 프롬프트용 문자열로 포맷팅

3) 수집한 링크들 중 유용할 것 같은 것을 LLM 이 명칭을 보고 판별 후 추리기 요청 (ex. 이용약관 등 제외) 

4) "Main page 내 텍스트" + "LLM 이 골라준 링크들도 돌면서 각 페이지별 텍스트 추출" 해 result 변수에 저장 & 이어 붙임

5) "회사명" + "(메인페이지+ 관련페이지) 텍스트" 포함한 최종 프롬프트 텍스트 LLM 전달 (5000자 제한)

6) LLM에게 해당 내용 바탕으로, 유저가 입력한 회사의 소개 마케팅 브로셔 제작 요청 

상세 flow

 

실행 결과 예시 (Artificial Analysis 소개서)

 


공부는 지속적으로 했지만, 작년 하반기 이직 준비로 인해 공부내용에 대한 블로그화가 많이 밀렸었다. 

조금은 더 꾸준히 공부해 온 내용들에 대해 블로그화 해나가려 한다. 

 

다음 AI 공부 글 내용은, 아래 적은 2주 차의 남은 3일 치 공부 내용을 적어보려 한다.  

- Day 8 - Gradio 활용 쇼핑몰 챗봇

- Day 9 - Tool Calling, Gradio 활용 항공권 예약 챗봇

- Day 10 - 항공권 예약 챗봇에 멀티모달 기능 추가 (이미지 생성, Speech 등) 

 

(꾸준히 공부하고, 적을 테니 많은 관심 부탁드립니다.)

 

Profile:

Linkedin