BigBlueButton 인터페이스 및 로고를 사용자 지정 브랜딩하는 방법

BigBlueButton 브랜딩은 세 가지 의미를 가질 수 있습니다. 서버의 기본 웹 페이지에 로고를 변경하거나, 회의 화면에 로고를 표시하거나, 회의 클라이언트 자체를 재설계하는 것입니다. 목표에 맞는 가장 작은 변경 사항을 선택하세요. 처음 두 가지는 문서화된 구성 또는 자산 변경으로 해결되지만, 색 구성표, 문구 또는 클라이언트 레이아웃을 변경하려면 일반적으로 맞춤형 HTML5 클라이언트를 구축해야 합니다.

이 가이드는 2026년 10월 6일에 공개된 BigBlueButton 4.0 관리 문서를 기준으로 작성되었습니다. 경로 및 배포 패키징은 릴리스 또는 호스팅 제공업체에 따라 다를 수 있습니다. 파일을 변경하기 전에 서버에 설치된 버전을 확인하고, 변경 전에 먼저 백업을 생성하십시오.

필요한 브랜드 변경 사항을 선택하세요.

서버 랜딩 페이지 로고와 회의 중 로고는 별개입니다. 하나를 교체해도 다른 하나는 자동으로 교체되지 않습니다.

서버를 편집하기 전에

BigBlueButton 서버를 변경하려면 셸 액세스 권한이 필요하며, 호스트를 직접 관리하는지 아니면 관리형 서비스 업체에서 관리하는지 알아야 합니다. 서비스 제공업체에서 서버를 관리하는 경우, 사용자 지정 브랜딩을 지원하는지, 그리고 유지보수 중에 변경 사항을 유지하는지 문의하십시오.

• 설치된 버전을 확인하고 해당 BigBlueButton 서버 사용자 지정 가이드 와 비교하십시오 .
• 현재 로고와 편집할 설정 파일의 사본을 저장해 두세요.
• 웹사이트나 회의에서 보여지는 크기에서도 알아볼 수 있도록 깔끔한 로고 파일을 준비하세요. 문서에는 표준 픽셀 크기가 명시되어 있지 않으므로, 추정된 크기에 의존하기보다는 실제 표시 영역을 확인하십시오.
• 회의 참가자들이 로그인 없이 접속할 수 있는 이미지 URL을 사용하세요. 가급적 HTTPS를 사용하고, 사용하기 전에 서버 외부에서 URL의 유효성을 확인하세요.

웹페이지 기본 로고를 변경하세요

BigBlueButton 4.0의 관리자 가이드에서는 기본 로고 위치를 로 명시하고 있습니다 /var/www/bigbluebutton-default/assets/images/logo.png. 이는 서버에서 제공하는 기본 웹사이트에 영향을 미치지만, HTML5 회의 클라이언트 내부에 표시되는 로고는 설정하지 않습니다.

1. 서버에 연결하여 문서에 명시된 경로에 파일이 있는지 확인하십시오. 경로가 다르면 파일을 추측한 디렉터리에 복사하지 말고, 설치한 버전의 설명서를 참조하여 확인하십시오.
2. 기존 자산을 백업하십시오. 예를 들어, 관리자는 교체하기 전에 기존 자산을 동일한 디렉터리에 있는 날짜별 백업 파일로 복사할 수 있습니다. 교체할 자산을 설치할 때는 원래 권한과 소유권을 기억해 두십시오.
3. 지정된 위치에 파일 이름을 사용하여 새 로고를 배치하세요 logo.png. 이미지 파일이 PNG 데이터인지, 페이지 배경과 충분한 대비를 이루는지 확인하세요.
4. 공개된 BigBlueButton 랜딩 페이지를 개인 브라우저 창에서 열거나 브라우저 캐시를 삭제하세요. 새 마크가 늘어나거나 잘리거나 흐려지지 않고 제대로 표시되는지 확인하세요.

공식 가이드에는 자산 위치가 나와 있지만, 로컬에 저장된 대체 파일이 모든 패키지 업데이트 후에도 유지된다는 보장은 없습니다. 원본 파일과 대체 파일을 배포 기록에 보관하고, 업그레이드 후 랜딩 페이지를 다시 확인하세요. 업데이트 후 로고가 사라지면 설치된 파일과 저장된 자산을 비교하고, 최신 릴리스 지침을 확인한 후에만 변경 사항을 다시 적용하세요.

회의 중에 로고를 보여주세요

BigBlueButton의 회의별 브랜딩 옵션은 참가자 목록 위의 브랜딩 영역에 로고를 표시합니다. 이를 위해서는 두 가지 조건이 충족되어야 합니다. HTML5 클라이언트 displayBrandingArea설정이 활성화되어 있어야 하고, 회의를 생성할 때 logo이미지 URL을 포함해야 합니다. 로고 매개변수만으로는 숨겨진 브랜딩 영역이 나타나지 않습니다.

1. HTML5 클라이언트 구성에서 를 활성화하십시오 displayBrandingArea. 현재 문서화된 설치 환경에서는 /etc/bigbluebutton/bbb-html5.yml이 로컬 재정의 파일이 권장됩니다. 이 파일의 구성 항목은 해당 패키지 클라이언트 설정을 재정의합니다. 파일을 편집할 때 기존의 다른 YAML 값은 유지하십시오.
2. BigBlueButton을 재시작하여 구성 변경 사항을 적용하십시오 sudo bbb-conf --restart. 재시작으로 인해 진행 중인 회의가 중단될 수 있으므로 적절한 유지 관리 시간대에 재시작 작업을 예약하십시오.
3. 애플리케이션 또는 API 클라이언트가 회의를 생성할 때 양식에 사용자 지정 매개변수를 포함하세요 logo=https://your-domain.example/brand.png. 사용자 지정 매개변수를 입력하는 정확한 위치는 BigBlueButton /create요청을 보내는 통합 방식에 따라 다릅니다. 해당 통합 방식의 지침을 따르고 클라이언트 측 코드에 서버의 공유 암호를 노출하지 마세요.
4. 새로운 테스트 회의를 생성하고 참여하세요. 참가자 목록 위에 로고가 표시되는지, 그리고 이미지 호스트에 로그인하지 않은 참가자에게도 이미지가 제대로 로드되는지 확인하세요.

권장되는 재정의 위치는 공식 구성 파일 참조를 , 회의 생성 매개변수는 API 참조를 확인하세요 . 서버 버전이 4.0이 아닌 경우, 해당 버전에 맞는 문서를 참조하십시오.

전체적인 인터페이스 리브랜딩이 필요할 때

회의 브랜딩 영역에 로고를 넣는다고 해서 화이트 라벨 회의 애플리케이션을 사용하는 것과 같은 의미는 아닙니다. 인터페이스 색상, 레이블 또는 기타 내장 클라이언트 요소를 변경해야 하는 경우, BigBlueButton의 FAQ에서는 관리자가 개발 환경을 설정하고 HTML5 클라이언트의 자체 버전을 만들도록 안내하고 있습니다. 프로젝트의 브랜딩 FAQ 및 개발 가이드가 시작점입니다.

이 경로는 개발 및 배포 작업이 필요합니다. 간단한 서버 설정이 아니며, BigBlueButton이 발전함에 따라 변경 사항을 유지 관리해야 할 수도 있습니다. 사용자 지정 빌드에 투자하기 전에 변경해야 하는 화면이나 요소를 정확하게 기록하고 내장된 랜딩 페이지 또는 회의 로고 옵션이 충분한지 확인하십시오. 진행하기로 결정했다면 사용자 지정 코드를 소스 코드 관리 시스템에 저장하고, 재빌드 방법을 문서화하고, 프로덕션 환경에 업데이트하기 전에 스테이징 환경에서 업그레이드를 테스트하십시오.

결과를 확인하고 증상별로 문제를 해결하세요.

• 랜딩 페이지 로고가 변경되지 않았습니다. 활성 서버의 bigbluebutton-defaultassets 디렉터리에 있는 파일을 교체했는지 확인한 후 브라우저 캐싱을 무시하세요. 프록시 또는 별도의 포털에서 공개 페이지를 제공하는 경우 해당 페이지의 소유권을 가진 시스템을 확인하십시오.
• 회의 로고가 표시되지 않습니다. 브랜딩 영역 설정이 활성화되어 있는지, 서버가 재시작되었는지, 새 회의가 logo매개변수를 사용하여 생성되었는지, 그리고 인증되지 않은 브라우저에서 이미지 URL이 제대로 작동하는지 확인하십시오.
• 로고는 나타나지만 제대로 보이지 않는 경우: 원본 이미지의 비율, 투명 영역 및 대비를 확인하십시오. 인터페이스에서 이미지를 늘리는 대신 원본 이미지를 조정하십시오.
• 일부 참가자에게 빈 화면이 표시될 수 있습니다. 다른 네트워크 및 장치에서 이미지 URL을 테스트해 보세요. 방화벽, 접근 제한, 유효하지 않은 TLS 인증서 또는 만료된 URL로 인해 참가자의 브라우저에서 이미지가 로드되지 않을 수 있습니다.
• 색상이나 문구는 변경되지 않습니다. 서버 로고를 교체해도 회의 클라이언트의 디자인은 바뀌지 않습니다. 인터페이스 요소를 변경해야 하는 경우 사용자 지정 클라이언트 개발 방식을 사용하십시오.

성공 여부는 결과의 위치와 일관성을 통해 판단하세요. 랜딩 페이지에 대체 로고가 표시되는지, 새로 생성된 테스트 회의의 브랜딩 영역에 회의 로고가 표시되는지, 그리고 맞춤형 클라이언트를 구축한 경우 요청된 인터페이스 변경 사항이 전체 회의 참여 과정에서 유지되는지 확인해야 합니다. 소규모 테스트 회의는 캐시된 브라우저 탭 하나만 확인하는 것보다 더 안전한 검증 방법입니다.

BigBlueButton의 브랜딩 옵션은 설정 수준에서 의도적으로 제한되어 있습니다. 내장된 로고 경로는 일반적인 아이덴티티 요구 사항을 충족하지만, 전체 인터페이스 재설계를 위해서는 맞춤형 클라이언트를 소유하고 지속적으로 관리해야 합니다.