최근 블로그 포스팅이나 콘텐츠 기획을 위해 AI를 활용하는 빈도가 크게 늘었습니다. 저 역시 제미나이(Gemini)와 대화하며 아이디어를 구체화하고 초안을 작성하는 경우가 많은데, 이 과정에서 한 가지 큰 불편함을 마주하게 되었습니다.
바로 AI가 깔끔하게 작성해 준 마크다운(Markdown) 형식의 글을 네이버 블로그(스마트에디터 ONE)에 그대로 복사해서 붙여넣으면, 들여쓰기나 줄 간격, 굵기 등의 서식이 엉망이 되어버린다는 점이었습니다.
💡 문제 해결: 반복 작업 자동화하기
매번 에디터에서 수동으로 엔터를 치고, 볼드() 표시를 지운 뒤 다시 글씨를 굵게 만드는 단순 반복 작업에 지쳤습니다. 그래서 이 과정을 클릭 한 번에 해결해 줄 웹 기반의 텍스트 변환 유틸리티를 직접 개발하게 되었습니다. HTML과 JavaScript를 활용해 웹 브라우저상에서 가볍고 빠르게 동작하도록 구성했습니다.
⚙️ 핵심 개발 포인트 및 로직
제미나이와 코드 로직에 대해 이야기를 나누며, AI의 출력 텍스트가 네이버 블로그 에디터와 완벽하게 호환되도록 파싱(Parsing)하는 데 집중했습니다.
-
서식 맞춤 변환: AI 텍스트의 핵심인 마크다운 기호들을 정규식을 통해 잡아내고, 이를 네이버 스마트에디터 ONE이 인식할 수 있는 최적의 HTML 태그(줄 간격, 들여쓰기, 굵기 등)로 치환하는 로직을 구현했습니다.
-
직관적인 UI/UX: 복잡한 과정 없이, 사용자가 글을 붙여넣고 [변환 및 복사하기] 버튼만 누르면 즉시 클립보드에 변환된 HTML 데이터가 담기도록 설계했습니다. 이후 블로그 에디터에
Ctrl+V만 하면 서식이 유지된 채 포스팅이 가능합니다. -
모달(팝업) 안내창 적용: 초기 접속 시 사용 방법과 현재 지원 상태를 명확히 알 수 있도록 모달 창을 띄워 직관성을 높였습니다.
🐎 보너스 개발: 더욱 쫄깃한 내기를 위한 ‘경마 제비뽑기’ 미니 게임
단순한 도구 개발을 넘어, 팀원들과의 점심 내기나 친구들과의 술자리 벌칙 정하기 등 일상적인 ‘제비뽑기’ 상황을 더 재미있게 만들어 줄 미니 게임도 함께 개발했습니다. 이름하여 ‘경마 제비뽑기’입니다.
이 게임은 단순한 사다리 타기나 가위바위보에서 벗어나, 박진감 넘치는 경마 경기를 시각적으로 연출하여 결과 발표의 쫄깃함을 극대화했습니다.
⚙️ ‘경마 제비뽑기’ 핵심 기능
-
경주마 이름 정하기: (image_1.png 왼쪽 패널 참조) 사용자는 원하는 만큼 경주마를 추가하고, 각 말의 이름을 직접 설정할 수 있습니다. (예: 밥 쏠 사람 이름, 팀원 이름 등)
-
컨디션 설정: 각 말마다 컨디션 수치를 부여할 수 있습니다. (image_1.png의 74, 94 등) 설명에도 있듯이 “컨디션이 높으면 조금 더 빠릅니다.” 하지만 핵심은 “운이 크게 작용하므로 누구나 이길 수 있습니다!“라는 점입니다. 단순한 운빨 게임이 아닌, 전략적(?)인 컨디션 조절로 재미 요소를 더했습니다.
-
경기 설정: “바퀴 수”를 조절하여 경기 시간을 조절할 수 있습니다. (현재 10으로 설정됨)
-
박진감 넘치는 레이스: (image_1.png 오른쪽 패널 참조) [경기 시작!] 버튼을 누르면 타원형 트랙을 따라 말들이 달립니다. 중앙의 LAP 표시(예: LAP 10/10)와 오른쪽 결승선의 말들의 실시간 순위를 통해 경기의 긴장감을 더합니다.
-
결과 확인: 하단에 “현재 선두: 골드쉽!“과 같이 실시간 선두를 표시하며, 경기가 끝나면 최종 순위가 명확하게 표시됩니다.
🚀 사용 방법 및 활용 예시
사용 방법은 매우 간단합니다.
-
말 추가: [경주마 추가] 버튼을 눌러 원하는 만큼 말을 늘립니다.
-
이름 & 컨디션 입력: 각 말의 이름과 컨디션을 입력합니다. (예: 점심 메뉴, 술자리 벌칙, 팀 프로젝트 역할 등)
-
바퀴 수 설정: 원하는 바퀴 수를 입력합니다.
-
경기 시작!: 버튼을 눌러 레이스를 관람합니다.
-
결과 확인: 최종 순위를 통해 결과를 확정합니다.
이 미니 게임은 친구들과의 모임이나 팀 빌딩 활동, 또는 단순한 재미를 위한 다양한 상황에서 활용될 수 있습니다.
🚀 향후 업데이트 계획
경마 게임은 더 다양한 말 스킨이나 이펙트, 더 많은 사용자 정의 옵션을 추가할 계획입니다. 개발 과정에서 제미나이와 나눈 이야기들이 큰 도움이 되었고, 앞으로도 더 유용한 도구들을 만들어 나갈 것입니다.
많은 참여 부탁드립니다.