Bento - 편집·보기·데이터·협업을 HTML 파일 하나에 담은 PowerPoint

2 hours ago 1
  • Bento Slides는 프레젠테이션 자료부터 뷰어, 발표자 모드, 편집기, 자산까지 하나의 HTML 파일에 담아 브라우저에서 바로 열고 편집할 수 있음
  • 슬라이드는 <script> 블록의 JSON으로 저장되고 이미지와 글꼴도 내장되며, ⌘S를 누르면 현재 HTML 파일 자체를 다시 씀
  • 같은 ID를 공유하는 요소는 위치·크기·색상·그라디언트가 Morph 전환되며, 클릭으로만 진입하는 숨겨진 상태를 이용해 여러 장면을 구성할 수 있음
  • 차트는 툴팁과 확대·축소를 지원하고 막대·파이·산점도로 형태를 바꿀 수 있으며, 표를 편집하면 막대와 성장률 선이 즉시 갱신됨
  • 설치·계정·필수 서버 없이 실행되고 런타임도 파일 안에 고정되며, 서명된 매니페스트를 통한 업데이트 확인은 비활성화할 수 있음

하나의 파일로 실행되는 프레젠테이션

  • Bento Slides덱·뷰어·편집기를 하나의 HTML 파일로 제공함
    • Esc를 누르면 내장 편집기가 열리고, ⌘S는 같은 파일을 직접 갱신함
    • 슬라이드는 <script> 블록 안의 읽을 수 있는 JSON이며, 이미지와 글꼴도 파일에 내장됨
    • 별도 설치나 계정 없이 브라우저가 전체 실행 환경이 됨
  • 뷰어에는 발표자 모드, 차트, 전환 효과가 포함되며 런타임도 파일 내부에 고정
  • 실행 시 서명된 매니페스트를 확인해 파일을 업데이트할 수 있고, 이 기능은 끌 수 있음

전환·데이터·상호작용 편집

  • 같은 ID를 가진 요소는 슬라이드 사이의 위치, 크기, 색상, 그라디언트 차이를 Morph 애니메이션으로 연결함
  • 차트는 발표 중에도 실제 인스턴스로 동작함
    • 막대 위 툴팁과 스크롤·핀치 확대를 지원함
    • 동일한 차트를 막대, 파이, 산점도 형태로 전환할 수 있음
    • 표의 분기별 가입자 데이터를 수정하면 막대와 성장률 선이 실시간으로 바뀜
  • 화살표 키로는 건너뛰고 클릭으로만 진입하는 숨겨진 상태를 만들 수 있으며, 버튼으로 일반 슬라이드를 연결해 여러 장면을 구성함
  • 캔버스 경로 편집기에서는 앵커를 끌어 선의 움직임을 조정하고, 카드에 마우스를 올리면 다른 부분을 어둡게 해 초점을 맞춤
  • Markdown 입력으로 굵게, 기울임, 글머리표, 코드, 취소선을 적용할 수 있으며 ⌘B 단축키도 제공함
Read Entire Article