소개
건강 관련 블로그 인스타 릴스 쇼츠 운영 자동화 구현
목표
건강·성형미용 분야의 콘텐츠 제작 과정을 다음 흐름으로 자동화하는 것이 목표다.
1. 네이버·구글 트렌드를 참고한 블로그 주제 발굴
2. 의료광고성 과장 표현을 피한 건강 블로그 원고 작성
3. 네이버 블로그 복사·붙여넣기용 미리보기 제공
4. 블로그 내용을 기반으로 인스타그램 카드뉴 스 제작
5. 카드뉴스 내용을 활용한 나레이션 릴스 제작
6. 결과물을 웹에 배포하고 우측 인앱 브라우저에서 확인
진행 방법
어떤 도구를 사용했고, 어떻게 활용하셨나요?
codex사용
-첨부된 건강 블로그 미리보기 제작 스킬을 활용하고 싶다고 요청했다.
- 이후 작업 내용을 스킬에 저장해 다음 작업에도 적용해 달라고 요청했다.
Codex 대응
- health-blog-preview-builder 스킬을 프로젝트 작업 기준으로 사용했다.
- 건강정보 작성, 실제 이미지 생성, 네이버 복사 기능, 정적 미리보기, 인앱 브라우저 검증을 하나의 반복 워크플로로 구성했다.
- 프로젝트의 기존 파일과 기능을 보존하면서 필요한 기능을 추가하는 방식을 사용했다.
<문제점>
미리보기 페이지의 글을 네이버 블로그에 복사하면 이미지가 보이지 않는다고 알렸다.
문제 원인
- file://, localhost 또는 상대경로 이미지가 포함된 HTML을 한 번에 복사하면 네이버 편집기가 해당 이미지 주소를 외부에서 불러오지 못할 수 있다.
- 브라우저가 로컬 이미지 주소만 복사하고 실제 이미지 바이너리를 클립보드에 넣지 않는 경우가 있다.
Codex 대응
- 글과 이미지를 분리해서 복사하는 방식으로 변경했다.
- 각 이미지에 이미지 N 복사 버튼을 제공했다.
- 버튼을 누르면 이미지를 Canvas에 그린 뒤 PNG 바이너리를 ClipboardItem으로 복사하도록 구현했다.
- 사용자가 블로그 본문을 먼저 붙여넣고, 각 이미지를 원하는 위치에 별도로 붙여넣도록 안내했다.
앞으로의 처리 원칙
- 네이버 블로그에서는 본문과 로컬 이미지를 한 번에 안정적으로 붙여넣을 수 있다고 보장하지 않는다.
- 모든 블로그 이미지에 개별 복사 기능을 유지한다.
<요청내용>
블로그 내용을 바탕으로 인스타그램 카드뉴스를 만들고 싶다고 요청했다.
- 카드 전체 복사와 전체 다운로드 버튼도 요청했다.
Codex 대응
- 블로그 핵심 내용을 짧은 문장과 시각적 흐름으로 재구성했다.
- 인스타그램 게시 규격에 맞는 세로형 카드 이미지를 만들었다.
- 카드 개별 PNG 다운로드와 전체 ZIP 다운로드 기능을 제공했다.
- 카드뉴스를 미리보기 페이지에서 한눈에 확인하도록 갤러리 형태로 배치했다.< >
<카드뉴스를 활용한 릴스 제작 검토 >
카드뉴스 첫 두 장을 영상화해 릴스로 만들고 싶다고 요청했다.
- 글이 많기 때문에 어떤 도구와 방식이 적절한지 문의했다.
Codex 대응
- 긴 카드 문장을 그대로 영상에 넣기보다 핵심 메시지를 짧은 나레이션과 장면으로 나누는 방식을 제안했다.
- 두 개의 짧은 세로형 영상을 각각 독립적인 메시지로 구성했다.
- 영상 원본, 나레이션, 결과물을 한 페이지에서 검토할 수 있는 릴스 자료 미리보기를 만들었다.
<영상제작 요청>
3.8 Grok 및 Sora 영상 API 검토
- 처음에는 Grok API를 사용한 영상 제작을 요청했다.
- 이후 Codex 자체 영상 제작 가능 여부와 Sora 영상 API 사용도 문의했다.
- 최종적으로 앞으로 영상은 Grok으로 진행하기로 결정했다.(생성속도및 품질비교로 grok이 좀더 낫게보였다.
Codex 대응*
- xAI API 키를 .env 파일의 XAI_API_KEY 환경변수로 관리하도록 구성했다.
- 키 입력칸이 비활성화된 문제를 파일 기반 환경변수 설정으로 해결했다.
- API 키의 실제 값은 콘텐츠나 소스에 노출하지 않도록 관리했다.
현재 영상 운영 원칙
- 기본 영상 생성 엔진: Grok
- Sora 사용: 사용자가 해당 작업에서 명시적으로 요청하는 경우만 사용
- 완성 영상: 반드시 미리보기 페이지에 연결
- 최종 미리보기: 우측 인앱 브라우저에 표시
<대시보드 제작 요청>
키워드 추천 대시보드
사용자 요청
- 네이버 키워드와 구글 트렌드를 분석해 건강 블로그 주제를 추천하는 대시보드를 요청했다.
- 화면은 핵심 키워드 3개와 실시간 트렌드 글감 10개를 보여주는 구조를 원했다.
- 주제 범위는 성형미용 및 건강 분야로 지정했다.
Codex 대응
- 참고 이미지의 정보 구조를 분석해 아침 블로그 글감 보드 형태의 대시보드를 구성했다.
- 상단에는 핵심 키워드 3개, 하단에는 트렌드 글감 10개를 배치했다.
- 각 글감을 후속 블로그 제작 작업으로 연결할 수 있는 기반을 마련했다.
사용자 요청
- 대시보드의 03번 주제인 ‘혈당 스파이크를 줄이는 식사 순서’를 선택했다.
- 네이버 블로그 글, 인스타 카드뉴스 8장, Grok 나레이션 릴스 2개를 포함한 전체 콘텐츠 패키지를 요청했다.
- 의료광고성 과장 표현을 피하고 결과물을 우측 인앱 브라우저에 표시해 달라고 요청했다.
한국 웹사이트의 홈페이지
- 네이버 블로그용 장문 글과 FAQ 6개를 작성했다.
- 썸네일 1장과 본문 이미지 2장을 생성했다.
- 인스타그램 카드뉴스 PNG 8장과 전체 ZIP 파일을 제작했다.
- Grok 세로형 8초 영상 2개와 한국어 나레이션을 제작했다.
- 블로그, 카드뉴스, 릴스를 한 페이지에서 확인하고 다운로드할 수 있는 콘텐츠 패키지를 만들었다.
- 정적 빌드와 영상 해상도·길이·오디오 포함 여부를 확인한 뒤 웹에 배포했다.
완성 페이지**
- <https://health-note-korea.ihmkp.chatgpt.site/glucose-spike-package>
블로그와 인스타그램 콘텐츠의 마지막에 상담 문의전화번호을 항상 넣어 달라고 요청했다.
Codex 대응
- 블로그 글 맨 아래에 클릭 가능한 상담 문의 영역을 추가했다.
- 인스타그램 카드뉴스 8번 장에 상담 문의 문구를 추가했다.
- 두 릴스 영상의 마지막 약 1.7초에 읽기 쉬운 전화번호 오버레이를 삽입했다.
결과와 배운 점
네이버에서 이미지가 붙여넣어지지 않음 | 로컬 URL만 복사되고 이미지 바이너리가 포함되지 않음 | Canvas와 ClipboardItem을 이용한 이미지 개별 복사 |
API 키 입력칸이 비활성화됨 | UI 입력 방식보다 서버 환경변수가 필요한 구조 | .env의 XAI_API_KEY로 설정 |
| 로컬 결과물을 찾기 어려움 | 파일과 미리보기 위치가 분리됨 | 미리보기 페이지에 결과물을 모으고 인앱 브라우저에서 표시
## 다음 작업 시 권장 진행 순서
1. 키워드 대시보드에서 주제를 선택한다.
2. 공식자료와 최신 연구를 확인한다.
3. 의료광고성 과장 표현을 제거한 블로그 글을 작성한다.
4. 썸네일과 본문 이미지를 생성한다.
5. 네이버용 본문·이미지 복사 기능을 연결한다.
6. 카드뉴스 8장을 제작하고 ZIP으로 묶는다.
7. Grok 릴스 2개와 나레이션을 제작한다.
8. 블로그, 카드뉴스 마지막 장, 릴스 엔딩에 상담 전화번호가 있는지 확인한다.
9. 정적 사이트를 빌드하고 웹에 배포한다.
10. 최종 페이지를 우측 인앱 브라우저에 열어 검수한다.
앞으로의 계획이 있다면 들려주세요.
-유튜브 쇼츠제작과 자동업로드
작업 Note
한국 웹사이트의 홈페이지
한식 앱 - 한식 앱 한식 앱 한식 앱 한식
