대부분 그렇지만 진작 개발해 놓고 제대로 써먹지도, 런칭도 못 한 솔루션이 대부분이다. 연휴기간 하나하나 정리해서 제대로 세상에 내 놓으려니 잔 손이 많이 간다. xMaker도 필요에 의해 개발하게 된 솔루션 꾸러미다. 슬라이더 메이커, 비디오메이커, 로고메이커, 플로우 문서 편집기가 묶음으로 들어간 경우다.

웹 개발 하다보면 슬라이드 관리도 틀에 밖힌 것이 좀 자유롭게 편집해서 어디든 붙여넣으면 되도록 하면 어떨까에서 나온 첫 뭉치가 바로 슬라이드메이커다. 전에 워드프레스 플러그인을 쓰면서 얻은 것이 동기가 되었다. 좀 더 다듬고 손 봐야 활용이 되는, 아직은 부실한 편이다.

로고메이커도 많은 우여곡절 끝에 어정쩡하게 된 케이스다. 영상 편집을 하다보면 인트로나 아웃트로에 로고를 넣어야 할 경우가 생긴다. 대부분 AE나 모션을 사용해야하는 버거로운 작업이라 간단히 SVG 로고를 넣고 텍스트 타이틀을 적절한 애니메이션 효과를 주어 만들어지는 짧은 영상인데, 처음 개별 요소별로 타임라인에서 애니메이션이나 모션을 주는 것으로 시작했다가 원하는 결과가 나오지 않아 전 과정을 템플릿 형식으로 고정시키고 로고나 텍스트 변경만으로 영상이 제작되도록.. 이것도 틀만 잡아둔 상태다. 앞으로 어떻게 각각 특색있는 템플릿을 만들어 내느냐가 과제이다.

로고메이커에서 구현된 타임라인 편집기를 확장시킨 것이 비디오메이커다. 의도는 간단한 쇼츠 정도는 프리미어나 파이널컷 사용하지 않아도 사운드, 효과음까지 넣어 영상 한 편을 만들어내자는 시도였다. 기존 슬라이드 편집기에 타임라인 편집기까지 붙이니 그럴듯한 영상편집기가 되었다. 이것도 밋밋한 css 애니메이션 수준에 머물러 방치 해 것을 이번에 펜툴 기능 추가로 라인드로잉까지 넣고 GSAP도 최신 버전 적용하니 이제 쓸만한 편집기가 되었다. 앞으로 이 툴 만으로 쇼츠영상 정도는 제작이 가능할거다. 부지런히 쓰면서 좀 더 다듬의 정식 런칭할 계획.

플로우 문서 편집기는 그야말로 잡동사니를 모아놓은 것으로 앞으로도 소품들을 넣을 계획으로 만든 뭉치다. 웹에서 표작업은 은근히 신경쓰이는 부분이다. 더우기 반응형에서는 쥐약이다. 셀 편집도 html 코드에서 colspan, rowspan 갯수가 늘어나면 이것도 맞추가 번거롭고.. 편집기에서 표 틀을 만들고 소르를 가져다가 어디서든 내용만 채워넣으면 반응형으로 되도록.. 그다음 글쓰는 중간에 버튼을 끼워넣을 때도 코드를 열어 style을 하드코딩해 주는 번거로움을 기억하고 있다. 이것도 편집기에서 버튼을 추가하고 링크를 걸고 색상, 크기 등을 조절해서 소스코드를 원하는 곳에 붙여넣으면 되도록 했다. 문제는 그리드다. 반응형 구현을 위해 col, row로 나누고 이미지나 요소를 배치하다보면 거의 날코딩이 되는 경우가 많다. 이것도 그리드를 만들고 원하는 요소를 넣어 소스코드를 원하는 곳에 붙여넣기 하면 반응형의 그리드가 된다.

플로우 문서 편집기는 나중에 꾸러미 이름도 바꾸어야겠지만, 몇가기 추가할 것이 네비게이션 제작기를 넣을거냐이다. 메뉴 네비게이션도 틀에 밖힌 경우가 많고 메뉴 DB와 연동된 경우 코딩으로 처리되는 경우가 대부분이지만, 그래서 몇가지 틀을 벗어나지 못하는 경우가 대부분이다. 사이트 스타일은 대부분 네비게이션 형식으로 부터 시작하는 것이 사실인데도.. 고민해 볼 일이다. 그 다음 이미지 슬라이드다. 이미지 파일은 서버에 저장되어야 하고 로그인 연동 등의 해결과제가 있지만 이 또한 게시판 원하는 곳에 이미지 갤러리를 포함시키면 좋겠다는 생각..

대부분 필요에 의해 만들어지는 것들이지만 과거 워드프레스 플러그인에서 많은 힌트를 얻은 것들이다. 하나하나 잘 다듬으면 많은 쓰임새가 있을 것이다.