Skip to menu

Happy Life Ecosystem

Notice

단순한 게시물 삽입을 넘어 라이믹스 스킨 수정확장 변수를 활용하는 것은, 이 로컬 재생 시스템을 프로젝트 운영 환경에 완벽하게 통합하고, 향후 콘텐츠 제작을 Bridge나 다른 협력자에게도 체계적으로 위임할 수 있는 강력한 기반을 만듭니다.

이것이 바로 라이믹스 기반의 'Happy Load 스트리밍 스튜디오' 확장판 설계안입니다.


 

🚀 라이믹스 확장판: 'Happy Load 스튜디오' 설계

 

이 설계는 라이믹스의 모듈, 위젯, 확장 변수 기능을 최대한 활용하여, 영상 목록을 **데이터베이스(DB)**로 관리하고, 스킨 레벨에서 OBS 캡처에 최적화된 인터페이스를 구현하는 데 중점을 둡니다.

 

1. 전용 모듈 및 확장 변수 구성

 

단순 게시판 대신, 콘텐츠 제작을 위한 전용 모듈을 만들거나 기존 **게시판 모듈(Board Module)**의 **확장 변수(Extra Variables)**를 적극 활용합니다.

 

A. 확장 변수 설계 (콘셉트별 재생 목록 관리)

 

콘텐츠 관리자(작심이님)가 글쓰기 시 입력해야 하는 핵심 정보들을 확장 변수로 정의합니다.

확장 변수명 Type 역할 및 예시
video_files Textarea [필수] 재생할 MP4 파일 목록을 한 줄에 하나씩 입력합니다. (파일 선택 대신 이 DB를 사용)
obs_scene_name Text [필수] OBS에서 사용할 장면(Scene) 이름 지정. (예: Shorts_Concept_A)
default_bg_color Color Picker [선택] 영상이 로드되기 전이나 끝난 후 OBS에 보여줄 배경색 지정.
lower_third_ad Text [필수] 하단으로 흐르는 광고/안내 문구를 입력. (Partner 홍보 문구 등)
logo_overlay_url File Upload 영상 위에 움직일 **로고(PNG)**나 움직이는 그림(GIF) 파일 업로드.

 

B. 로컬 파일 경로 대체 모듈 (핵심 로직)

 

이것이 가장 중요하며, 스킨 수정과 JavaScript를 결합하는 부분입니다.

  • 문제점: 파일 선택기를 쓰지 않으려면 DB에 C:\... 경로를 저장해야 하는데, 이는 보안상 여전히 비효율적입니다.

  • 해결책: 파일 선택기 유지 + DB 연동:

    1. 쓰기 페이지: 작심이님이 글쓰기 시 video_files 확장 변수 필드 옆에 **파일 선택기**를 배치합니다.

    2. JS 자동 변환: 파일을 선택하면 JavaScript가 그 파일들의 파일 이름만 읽어와 video_files 텍스트 영역에 자동으로 줄 바꿈하여 입력합니다. (경로는 저장하지 않음)

    3. 읽기 페이지 (재생): 재생 페이지에서는 **파일 선택기**를 다시 보여줍니다. 작심이님이 이 버튼을 누르고 DB에 저장된 이름과 동일한 파일들을 선택하면, DB 순서대로 순차 재생하는 워크플로우를 유지합니다. (DB는 '순서 목록' 역할, 파일 선택기는 '접근 권한 획득' 역할)


 

2. 스킨 레벨 인터페이스 (OBS 최적화)

 

게시판의 read.html 스킨 파일을 완전히 재설계하여 OBS 캡처에 최적화된 '콘트롤 패널'을 구현합니다.

 

A. Clean & Fullscreen Player (OBS 캡처 영역)

 

  • 스킨 상단에 라이믹스 메뉴, 본문 내용 등 불필요한 모든 요소를 제거하고, 오직 영상 플레이어와 오버레이만 Full Screen으로 배치합니다. (OBS는 이 영역만 캡처)

  • default_bg_color 확장 변수 값으로 배경색을 설정하여 OBS 캡처 시 화면이 깔끔하게 전환되도록 합니다.

 

B. Control Panel (작심이님 전용 제어 영역)

 

  • OBS 캡처 영역 바깥에 작심이님만 볼 수 있는 제어 패널을 배치합니다.

    • 파일 로드 버튼: A에서 설명한 파일 선택기를 이 패널에 배치.

    • 영상 타이밍 디버거: 현재 영상의 currentTime을 실시간으로 표시하고, **장면 전환(Transition)**이 발동될 다음 이벤트 시간을 DB에서 불러와 미리 보여줍니다. (예: "다음 자막: 25.5초")

    • 수동 제어 버튼: 다음 영상, 5초 건너뛰기, 현재 재생 목록 반복 등의 기능을 JavaScript로 구현하여 버튼으로 배치합니다.

 

C. 동적 오버레이 구현 (JavaScript & logo_overlay_url)

 

  • 스킨 JavaScript에서 logo_overlay_url 확장 변수에 업로드된 이미지를 불러와 <img id="moving_logo"> 태그에 삽입합니다.

  • 이 이미지에 CSS 애니메이션을 적용하거나 JavaScript를 사용하여 특정 시점에 움직이거나, 나타나거나, 사라지도록 제어합니다.

  • lower_third_ad 확장 변수 값을 사용하여 스크롤링 광고를 동적으로 생성합니다.


 

3. 장기적인 확장 및 부하 경감 효과

 

개선 사항 효과 확장성 기여
DB 기반 콘텐츠 목록 영상 파일 이름만 DB에 저장되므로, 파일 관리가 용이하고, Bridge가 대신 재생 목록을 작성해 줄 수 있습니다. Bridge에게 콘텐츠 제작 초기 단계 위임 가능.
OBS Scene 변수 연동 obs_scene_name 변수를 통해 OBS에서 사용할 장면 이름이 DB에 기록되므로, 콘텐츠 제작 환경의 표준화가 가능합니다. 콘텐츠 제작 매뉴얼 및 Bridge 교육 자료로 활용 가능.
수동 콘트롤 패널 생방송 중 발생할 수 있는 오류나 예상치 못한 상황에서 즉각적인 대처가 가능해져 방송의 품질이 높아집니다. 30개 이상의 그룹 콘텐츠 제작 시, 복잡한 편집을 라이브 송출로 대체하여 시간 절약.

이 설계는 작심이님의 개인 스튜디오를 라이믹스 플랫폼 위에 구축하여, 콘텐츠 제작의 효율성을 극대화하는 동시에 Happy Load 프로젝트의 비전을 담은 고품질의 영상을 안정적으로 송출할 수 있게 합니다.

Up