만화폰트용 말풍선 및 장면편집기… 그냥 그림 생성하는거 가져와서 웹툰에 붙일까 했지만 그것보다 말풍선 자체를 애니메이션하는 기능을 넣기 위해서 작업을 하다가 혹시 다른 툴에 기능이 있지 않았나? 라는 생각을 하고 캔바에 있는 것을 또 만들 필요는 없다 생각해서 여기까지만 하다 그만뒀습니다.
아이들이 스틱맨 + 만화 말풍선 및 효과음 그리고 캐릭터로 만드는 웹툰 에디터를 만들다가 구글에 연동하는게 낫겠다 싶어서 기획을 다시 해보기로 했습니다.
사실 아주 간단하지만 콘티정도만 짤 수 있으면 훨씬 고도화 할 수는 있는 시대라서 그냥 재미로 해보고 있습니다.
그냥 이미 있는 기능은 괜찮은 오픈소스가 있습니다. https://new-sankaku.github.io/manga-editor-desu/ 그런데 제가 만들려고 한 것은 숏츠용 간단한 애니메이션이 되는 정도라서 다른용도로 간단히 처리할 생각으로 만들었는데 말풍선 각도 맞추고 다양한 말풍선 템플릿이랑 말꼬리 모양 등등 처리해야 할 부분이 조금 많아서 내가 지금 뭐하고 있나 그냥 오픈소스 쓰자 ?!?=3=3=33
그래도 어도비익스프레스나 캔바용으로 폰트포함해서 애니메이션 효과를 넣는 정도는 해볼 계획입니다.
만화 폰트는 제가 만든 것으로 쓸 생각이라서 에디터도 있긴 해야합니다. GSAP 가 무료로 풀려서 그 기능을 전부 넣어볼 생각입니다.
레고시리어스플레이 오픈소스 문서는 10년이 지난 문서가 되었습니다. 제가 이 문서를 보고 레고시리어스플레이 자격증을 따야겠다는 생각을 하게 됐는데…
뭔 문서가 뜬구름 잡는 소리밖에 없어서 직접 가서 듣기로 했습니다.
그건 그렇고 어도비 익스프레스의 기능을 활용하는데 잠깐 사용해 보려고 했습니다. PDF를 가져와서 번역을 하거나 문장을 특정 톤으로 유지한다거나 다양한 기능이 추가 되었습니다.
일단 번역은… 약간 모자랍니다. 다시 수정해야하지만 어차피 일정 부분은 윤문이나 교정을 봐야하기 때문에 전체를 이해한다면 큰 문제가 되지 않습니다.
현재 펼침면으로 되어 있기 때문에 카드뉴스나 영상으로 작업을 한다면 어느정도 편집이 필요하기 때문에 큰 문제없습니다. 게다가 사진이나 선, 면 등이 오브젝트로 레이아웃 위에 올라와 있기때문에 편집이 쉽습니다. 즉 원본이 없어도 원본에 해당하는 이미지도 투명화 되어 있습니다.
그러면 카드뉴스를 만든다거나 다른 변환작업을 할 수 있다는 장점이 생깁니다. 이게 왜 중요하냐면 외서 번역하는 출판사에게는 리소스를 활용하기가 쉽지 않아요. 초기에 PDF로 원고를 보내주는데 어도비익스프레스는 이 것을 훌륭한 리소스로 사용할 수 있습니다.
그리고 번역물은 다시 PDF로 생성할 수 있고 오디오를 넣어 영상으로 만들 수 있습니다. 저희 소스를 안쓰고 타회사 소스를 쓴 이유는 문서가 공개되어 있기 때문입니다.
절대 남의 사진이나 데이터를 이용해서 홍보물을 만드거나 할 생각은 없습니다. 레고시리어스플레이 오픈워크샵도 해야겠지만 ^^
포토샵이나 일러스트레이터, 인디자인으로 작업하는 출판사 직원들에게는 아무래도 늘 쓰던게 편하기는 합니다. 그런데 이걸 다시 카드뉴스로 만들거나 동영상으로 제작하려면 애프터이펙트, 프리미어 같은 편집프로그램으로 작업을 생각하거나 아니면 다른 저렴한 캡컷이나 앱으로 편집하는 프로그램을 생각하게 됩니다.
물론 할수는 있지만 디자인요소들을 자유자재로 편집하기에는 쉽지 않습니다. 그래서 그동안 저도 이 문제를 해결하기 위해서 데이터베이스 기반의 영상을 만드는 프로그램을 만들어왔고 3D로 책을 요소로 만들어주거나 실시간 판매데이터를 붙여서 순위가 나오는 구조를 만들었습니다.
다 좋은 아이디어인데 이걸 새로운 요소의 영상으로 제작하기에는 한계가 있어서 Canva, Adobe Express를 사용해서 처리하는 방식으로 전환했습니다.
그러니까 데이터기반의 영상자동화를 만들면서 다시 애드온으로 제작하고 일부는 개발버전으로 저만 쓰기로 했습니다. (?) 하여간 어제 Canva가 죽어서 그 사이에 Adobe Express 를 자세히 보고 아 이렇게 쓰면 되겠네 라는 결론을 얻어서 공개합니다.
일단 어도비 제품은 하나로 통합할 목적으로 만든 스마트 라이브러리 라는게 있는데 이제 이 부분의 기능이 웹으로 연결된 것이 어도비 익스프레스 입니다. 왜 어도비가 XD를 버렸을까? 라는 생각을 하신 분은 Figma 인수 실패로 발생한 개발팀 정리 그리고 Canva의 도전에 대한 응전까지 어도비의 재미있는 이야기는 뒤로 하고 간단하게 말씀드리면 어도비왕국은 웹으로 옮겼습니다. 피그마나 캔바처럼…
다만 전문가 영역은 유지하면서 말이죠 그래서 레이어 그대로 어도비익스프레스로 가져올 수 있습니다.
똑같은 디자인을 포토샵에서 했다면 (포토샵 데이터를 저장할 수 있는 모든 호환프로그램도 지원)
그대로 어도비익스프레스로 가져올 수 있습니다. 가져오면 2가지 모드가 있습니다. 업데이트를 할 수 있는 문서로 제작할 것인지 아니면 연결을 끊고 독립적인 작업으로 할 것인지…
기능에 대해서 설명하는 것이 아니기 때문에 편집을 하고 애니메이션 효과를 넣고 이미지를 연장하고 AI로 확장하고 등등은 프로그램을 한 번 보면 아실 수 있어요. 프로그램이 메뉴얼을 보고 해야한다면? 그건 프로그램 개발회사 잘못입니다.
소셜미디어 사이즈로 변경해서 편집
내보내기하면 영상을 출력할 수 있게 됩니다. 그리고 저는 여기에 마이크로소프트사의 클립챔프를 사용해서 다양한 음성을 넣을 수 있는 기능으로 각 영상을 제작하는 것으로 마무리 했습니다.
미디어에 텍스트 음성 변환이 다양해졌고 몇달 아무것도 안하고 있다가 보면 기능이 확실히 좋아진 것이 느껴질 정도로 리소스가 추가되긴 했습니다. 이 전에 오픈소스 TTS 프로그램이나 아마존 TTS를 사용하기 위해 했던 노력이 그냥 사라졌습니다.
그냥 약간의 사용료를 내고 쓰는게 속편합니다.
하여간 클립챔프는 메타 빼고 다른 곳에 아주 빨리 영상을 내보낼 수 있고 내보내자마자 유튜브 쇼츠 조회수가 늘어나는 알람이 바로 와서 신기하다 싶었는데 해시태그가 영향이 있는거 같기도 합니다.
three.js 를 사용해서 폴리곤 안에 점을 찍어서 새로운 책을 등록할 수 있는 프로그램을 만들고 있습니다. 제가 만드는 것이라기 보다는 AI가 만들겠지만 러프한 정도만 만들거지만 일단 새로운 책을 추가해서 등록하면 저기 빨간점을 클릭하면 등록한 도서 페이지로 이동하게 됩니다.
그런데 메시 부분이 점점 더 늘어나고 자세하게 만들어진다면 더 재미있겠지만 우선은 이정도로 테스트 해보고 있습니다. 사실 흔드는 기능이랑 이것저것 인터페이스를 만들어 보고 싶지만 한계가 있습니다.
아마 AI의 도움을 받아 개발을 마쳐도 배포하려면 서버를 운영해야 합니다. 물론 github 나 vercel 등 무료로 제공하는 공간도 있지만 실제 서비스를 하려면 도메인, 메일, 기타등등 서버의 기능을 활용해야합니다. 그리고 가장 중요한게 DNS, SSL 그리고 비싸서 그렇지 최소 비용으로 동작할 수 있게 하려면 월 1만원 정도는 사용해야 합니다.
여기서 가장 중요한 것은 고정된 IP가 필요하고 인증서를 받으려면 서비스를 받을 수도 있지만 이것저것 합쳐보면 싸게 운영할 수 있습니다. 내 시간은 싸지 않다고 생각하시면 그냥 유료서비스를 받는게 속편합니다.
그런데 홈서버도 쓰고 NAS도 쓰고 내부망에 있는 성능좋은 GPU를 이용해서 LLM을 돌리거나 뭔가 특별한 장비를 운용하면서 외부에서도 접근하게 만들고 싶다면 이쪽이 더 나을수도 있습니다.
PHP, Go, Python, Nodejs 사용해서 만든 다양한 어플리케이션을 누군가에게 보여주고 싶다면 나만의 서버가 있으면 좋습니다. 요즘 AI 개발환경도 많이 좋아졌고 몇일만에 새로운 게임이나 업무용 작은 유틸리티 같은걸 금방금방 만들어 낼 수 있습니다.
사실 요 몇일 Paypal 이나 외국에서 운용하는 결제 플랫폼들을 열심히 보고 있습니다. 국내 서비스외에도 다양한 결제가 달리고 사용할 수 있다면 조그마한 서비스도 소액이라도 아르바이트 정도가 되지 않을까 합니다. (안될수도 있지만)
하여간 만든 서비스의 주요 이점을 요약하면
중앙 집중식 SSL 관리: 모든 Certbot 갱신이 하나의 서버에서 이루어져 관리 부담이 줄어듭니다.
보안 강화: 백엔드 서버들이 인터넷에 직접 노출되지 않아 공격 표면이 줄어듭니다.
유연한 배포: 각 서비스는 독립적인 서버에서 운영되므로, 특정 서비스의 리소스 요구사항에 따라 유연하게 확장할 수 있습니다.
단일 진입점: 모든 도메인을 통해 접근되므로 트래픽 관리 및 모니터링이 용이합니다.
AI 총서를 3900원에 준비중(전자책아님) 각 분야에 AI 사용법을 모으면 사용자별 경험을 판매하는 실무 북웨어시리즈
Canva 캔바 미로글자 Addon 만들기 유명해지려면 유명한 곳에서 무언가를 해야 하더라구요… 그런데 저는 춤도 못추고 응?!? 하여간 캔바에 애드온으로 미로글자를 만들 수 있는 프로그램을 하고 있습니다. 생각보다 쉽지는 않습니다. 1억5천명이 만일 동시접속할 일은 없겠지만 리소스를 감당하지 않으면서 프로그램 아이디어에 제한이 생깁니다.
클라이언트 사이드 처리 최대화
미로 생성 알고리즘을 JavaScript로 브라우저에서 직접 실행
서버는 최소한의 설정 데이터만 주고받도록 설계
WebAssembly 활용해서 복잡한 미로 생성도 빠르게 처리
효율적인 미로 생성 알고리즘
재귀적 백트래킹보다는 Kruskal이나 Prim 알고리즘 활용
글자 형태에 맞는 제약 조건을 미리 계산해서 캐싱
자주 사용되는 글자 패턴은 템플릿으로 저장
리소스 절약 전략
CDN으로 정적 자원 분산
글자별 미로 패턴을 미리 생성해서 데이터베이스에 저장
사용자별 세션 대신 상태 없는(stateless) 설계
대충 이렇게 만들 것이라 생각하고 만든건데 진행된 것은
이렇게 미로찾기가 글자로 생성되는 프로그램이 됩니다. 물론 픽셀 크기가 조금 작게 될거예요. 입구, 출구 그리고 시작, 종료 정답도 함께 나오게 됩니다.
몇달 전에 만다라트 다이어그램을 LLM 을 사용해서 64개의 주제와 소주제를 만드는 간단한 키워드 프로그램으로 워크샵 참석자에게 뭔가 먼저 채워줄 수 있는 기능을 구현해 본 작업을 했습니다.
간단하게 이것저것 실험을 했고 네모박스에 가까운 것이라 한계가 있어 이번에는 조금 그림같은 느낌에 편집기능을 추가한 다이어그램을 생성해보기로 했습니다.
이시카와 다이어그램(Fishbone Diagram)의 개념, 용도 및 관련 기술 개발에 대한 이해를 돕기 위해 작성되었습니다.
이시카와 다이어그램의 정의: 이시카와 다이어그램은 문제의 원인을 분석하기 위한 시각적 도구입니다. 물고기 뼈와 유사한 형태를 가지며, 문제가 중심의 “가시”를 이루고 원인 또는 영향이 “살”처럼 붙어 있는 구조입니다. 카오루 이시카와 박사가 발명했습니다.
먼저 테슬라 관련 뉴스를 하나 복사해서 입력하고 -> 생성 -> 편집 과정을 끝내면 하나의 다이어그램이 완성되며 편집 수정이 가능해서 정리된 글과 그림을 보시는 분에게 도움이 될 거예요
Ollama Gemma3:4b LLM을 사용해서 뉴스기사, 블로그 글 등 각종 프레임워크로 디자인 편집할 수 있는 기능을 만들었습니다.
인포그래픽이나 어떤 그래픽 작업도 가능하게 기본 출력물을 svg, json, 상용 LLM 및 Canva, AdobeExpress 에 보내서 다시 기계가 그리기 쉽게 바꾸고 있습니다.
옵시디언 플러그인으로도 생각은 하고 있으며 디자인 편집이 화면 상에서 가능합니다. (결론은 인디자인이나 편집프로그램으로 보내기 위한 레이아웃 데이터 생성이 목적입니다.) 하루에 하나씩 이런거 만들고 어디에 올려야 하나 지금 고민중입니다. 회사 서버를 줄이고 AI가 빨리 돌아가는 서버로 바꿀까 했는데 비용이 만만치 않네요
원래 공개 안하려고 했는데 인디자인 그리드 관련된 솔루션을 캘린더, 가계부, 다이어리 디자인을 자동화하고 있고 그걸 다시 웹에서 기록하고 편집하는 솔루션, 즉 종이랑 데이터가 결합되는 작업(이건 그냥 자동생성 + 데이터를 손으로 넣었지만 자동화 처리하는 중 반대로 디자인을 한 것을 학습해서 디자인을 만들 수 있습니다.)
만일 캘린더가 있다면 매년 바꿔야 할 것들에 맞춰서 작업해야 합니다. 그리고 미국이나 일본 각기 달력의 시작이 다른 나라마다 맞춰야 하고 전세계 대상으로 행사일이나 다양한 정보를 담은 캘린더를 만든다면 거기에 맞게 데이터를 바인딩할 수 있습니다.
인디자인에서 원하는 형태로 매칭시켜서 작성한 ical 데이터를 가져올 수 있습니다. 그러면 반대로 웹에서 그 내용을 수정하거나 본인 고유의 모든 데이터를 수집해서 캘린더로 넣어줄 수 있어요. 가계부가 될수도 영수증모음이 될수도 모든 것을 가져와서 실제화 할 수 있습니다.
그걸 인스타그램이라고 하는데 인스타는 자랑용이고 이건 온라인의 남겨놓은 모든 템플릿을 연결하는 구조의 책이라고 보시면 됩니다. 노션이 되었건 다이어트 앱이 되었건 자꾸 돈달라고 하니까 그런걸 없애볼 생각입니다. ^^ DuckDB 오픈소스 넘치는데 그걸 어떻게 쓰는지 모르잖아요
그러니까 뭐 문구쪽으로 포커싱해서 내년에 엄청나게 다양하고 복잡한 디자인을 다 수용할 수 있는 시리즈를 프로그램 중입니다.
