ChatGPT로 썸네일 만들기 (이미지 생성)

포스트를 작성할 때마다 썸네일이 항상 문제였습니다.

글을 쓰는 것은 좋아하지만, 적절한 대표 이미지를 찾거나 만드는 것은 너무나도 귀찮은 일이었습니다. 그래서 이번에는 ChatGPT를 사용해서 썸네일을 만들어봤습니다.

 

ChatGPT로 생성한 썸네일

 

ChatGPT로 이미지 생성

ChatGPT (GPT3.5)는 아직까지 모든 입력과 출력을 텍스트로 밖에 처리할 수 없습니다. 향후 GPT4와 DALL·E 2가 융합된 멀티모달 AI가 나타난다면 이미지 또한 입출력이 가능해질 것이라 생각됩니다만, 현재로서는 ChatGPT로 이미지를 직접 생성할 수는 없습니다. 하지만, 이를 우회하는 방법은 있습니다. 아래와 같이 몇 가지 단계를 거치면 이미지를 간접적으로 생성할 수 있습니다. 

 

 

SVG (Scalable Vector Graphics)

 

SVG는 이미지를 표현하는 방식 중 하나입니다. 이미지를 벡터로 표현하는 방식인데, 이미지 상에 있는 요소들의 위치 값을 텍스트(XML)를 사용하여 벡터로 표현합니다. 그렇기 때문에 픽셀로 표현되는 레스터 방식인. jpg나. png 와는 다르게. svg 이미지는 크기를 키워도 해상도가 깨지지 않습니다. 

 

SVG와 GIF, JPEG, PNG의 차이

 

ChatGPT로 썸네일 만들기

 

SVG는 XML(Extensive Markup Language)로 표현이 됩니다. Language니까 언어고 당연히 텍스트겠죠? 그렇게 때문에 ChatGPT로 SVG를 작성하라고 하면 간접적으로 이미지를 생성할 수 있습니다. 저는 다음과 같이 프롬프트를 작성했습니다. 배경색과 글씨색은 HTML의 HEX 코드로 말을 했고, 포스트의 썸네일 이미지 크기는 다음과 같이 확인할 수 있습니다:

 

썸네일 부분 우클릭 -> 새 탭에서 이미지 열기

새 탭 괄호 속 숫자로 확인

 

프롬프트

"ChatGPT로 썸네일 만들기" 라는 제목으로 블로그 포스트 글을 작성할 건데, 
거기에 알맞는 썸네일을 아래의 조건을 사용해서 SVG 코드로 작성해 줘:

- 텍스트는 'ChatGPT로' '썸네일 만들기' 이렇게 두줄로 작성해줘
- 텍스트가 이미지 정중앙에 위치했을 때 위, 아래, 왼쪽, 오른쪽에 10px 정도 여백이 남도록 해줘
- 폰트 크기는 텍스트가 전부 보이도록 여백에 맞춰서 알아서 정해줘
- 배경 색: HEX #FFDD0E
- 글씨 색: HEX #1D1D1D
- 폰트: 나눔 스퀘어
- 이미지 크기: 230px x 140px

ChatGPT 프롬프트 실행결과

 

 

생성된 SVG 코드를 메모장에 복붙하고 .svg 파일을 생성했습니다.

ChatGPT가 생성한 SVG 코드 메모장에 복붙

 

메모장 내용 저장

 

저장된 .svg 파일을 인터넷 브라우저 (에지, 크롬 등)으로 열면 다음과 같이 이미지를 확인할 수 있습니다:

 

.svg 파일을 브라우저로 열기

ChatGPT로 만든 썸네일

해당 썸네일은 스크린샷으로 캡처해서 사용해도 되고, jpg, png 파일로 변환해서 사용해도 됩니다.

 

 

정리하기

ChatGPT의 출시 이후에 업무 능률이 눈에 띄게 좋아졌다는 것을 체감하고 있습니다. 코딩을 할 때 Co-pilot 기능은 매우 편리하고, 눈으로 잘 보이지 않는 에러도 잘 집어내줍니다. 물론 거짓말을 너무나도 능숙하게 한다는 단점도 있지만, 비서로서의 역할은 정말 톡톡히 잘하는 것 같습니다.