이 기사는 이 글을 읽는 분들이 「사진의 트리밍 안을 TopN으로 보여주는 사이트」를 통해, 사이트 제작의 발상력(아이디어를 내는 힘)을 기르는 데 도움이 되는 것을 목적으로 작성되었습니다.

「여러 패턴을 목록으로 표시하는 편리함」, 「AI를 활용한 사이트는 단일 HTML로 재현 가능하다」와 같은 점을 전달할 수 있다면 좋겠다고 생각합니다.

사진을 보고,

「이 사진, 프로필용이라면 어디까지 잘라내는 것이 좋을까?」

라고 고민할 때가 있습니다.

그래서, ChatGPT에게 추천하는 트리밍 위치를 여러 개 제안받고, 그 결과를 브라우저 상에서 실제로 잘라내는 Web 앱을 만들어 보았습니다.

브라우저에서 바로 이용할 수 있습니다.

소스 코드는 여기 있습니다.

대략적인 흐름은 다음과 같습니다.

• 「프로필 사진」, 「손주 사진」 등 사진의 용도를 지정
• ChatGPT에게 전달할 프롬프트 (Prompt)를 자동 생성
• 원본 이미지를 ChatGPT에 첨부
• ChatGPT로부터 트리밍 후보를 JSON 형식으로 받음
• JSON과 원본 이미지를 Web 앱으로 불러옴
• 여러 가지 트리밍 결과를 자동 생성
• 마음에 드는 이미지를 다운로드

트리밍 위치는,

왼쪽에서 3%
위에서 0%
오른쪽에서 3%
...

와 같이, 이미지의 사방에서 깎아내는 비율로서 ChatGPT가 생각하도록 하고 있습니다.

브라우저 측에서는 그 수치를 사용하여 실제 이미지를 잘라냅니다.

나아가, 여러 후보를 한꺼번에 ZIP으로 다운로드할 수도 있습니다.

실용적인 도구로도 사용할 수 있지만, 개인적으로는 그 이상으로,

「생성 AI와 일반적인 HTML / JavaScript를 조합하면 어떤 앱을 만들 수 있는가」

라는 발상의 예시로서 만들고 있습니다.

생성 AI를 사용한 앱이라고 하면,

• API를 계약한다
• 서버를 준비한다
• API 키를 관리한다
• 백엔드 (Backend)를 작성한다

와 같은 구성을 상상하기 쉽습니다.

하지만 이번 앱에서는, 이미지를 판단하는 부분은 평소 사용하는 ChatGPT에 맡기고, 브라우저 측은 그 결과만을 이용한다는 형태로 만들었습니다.

즉,

인간
↓
Web 앱에서 프롬프트 생성
...

라는 역할 분담입니다.

약간의 수작업은 들어가지만, 그 대신 상당히 작은 구성으로 실험할 수 있습니다.

이번에 만들면서 재미있다고 느낀 점은,

AI 그 자체를 앱에 내장하지 않더라도, AI를 처리 공정의 일부로서 이용할 수 있다

는 점입니다.

예를 들어 같은 방식이라면,

사진
→ AI에게 분석을 맡긴다
→ JSON화
...

뿐만 아니라,

문장
→ AI에게 분류를 맡긴다
→ JSON화
...

나,

데이터
→ AI에게 평가를 맡긴다
→ JSON화
...

와 같은 앱도 생각할 수 있습니다.

AI에게 「정답」을 만들어 달라고 하는 것뿐만 아니라,

AI에게 구조화된 중간 데이터를 만들게 하고, 그 이후를 프로그램으로 처리한다

라고 생각하면, 만들 수 있는 것의 폭이 상당히 넓어집니다.

이번 사이트 자체는 사진의 추천 트리밍 후보를 만드는 심플한 도구입니다.

다만, 정말로 시도해 보길 바라는 것은 기능 그 자체보다,

「ChatGPT에게 JSON을 만들게 하고, 그 결과를 브라우저에서 처리한다면 그 외에 무엇을 만들 수 있을까?」

라는 부분입니다.

작은 HTML 도구라도 생성 AI를 중간에 끼워 넣는 것만으로, 지금까지와는 조금 다른 앱을 만들 수 있습니다.

Web 앱의 소재를 생각하는 연습으로서, 이런 방식도 재미있을 것이라고 생각합니다.

👇 접속하는 것만으로 사용할 수 있는 공개처

👇 GitHub

GitHub의 URL은 악의적인 코드가 포함되어 있지 않은지 직접 눈으로 확인하고 싶은 분들을 위해 공개하고 있습니다.

GitHub Pages 버전에서 바로 이용할 수 있지만, 개인적으로는 HTML 파일을 다운로드하여 로컬 환경에서 사용하는 것을 권장합니다.

망라적인 확인은 불가능하지만, ChatGPT에 코드를 첨부하여 악의적인 코드가 포함되어 있지 않은지 확인해 달라고 하는 방법도 유효합니다.

본인이 사용하기 편하도록 ChatGPT 등을 활용하여 튜닝하여 이용하는 것도 권장합니다.

더 사용하기 편한 사이트를 제작하셨다면, 저도 이용하고 싶으니 공개해 주시면 기쁘겠습니다.

또한, 전면적으로 다시 만든 것이 아니라 본 리포지토리(Repository)를 개조하여 작성한 것을 공개할 경우에는 MIT 라이선스 조건에 따라 공개해 주세요. (저작권 표시와 MIT 라이선스 문구를 포함해 주세요)