QuizPlayer

Player de vídeo com quizzes embutidos: o vídeo pausa, apita e pergunta. Feito aqui no Café com Circuito!

O que é

O QuizPlayer é um projeto open source (MIT) do Irving Samuel, do Café com Circuito: um player HTML5 com quizzes no meio do vídeo. O núcleo não tem dependências (~14 kB gzip), tem componentes para React e Vue e SDKs de servidor para PHP/Laravel, Go e Node.js.

Pra que serve

• Criar videoaulas interativas para cursos e plataformas EAD
• Validar as respostas no servidor (o gabarito nunca vai para o navegador)
• Impedir que o aluno pule perguntas e retomar de onde parou

Qual problema resolve

Vídeo interativo costuma ser SaaS pago e preso a um framework; o QuizPlayer funciona com qualquer frontend e qualquer backend, de graça.

Como instalar — Instalação

Para testar, veja a demo ao vivo em irvingsamuel.github.io/quizplayer. Para usar no seu site, inclua o script pelo CDN (funciona até em Blade/Twig) ou instale o pacote do seu framework:

<div id="player"></div>
<script src="https://cdn.jsdelivr.net/npm/@quizplayer/core@0/dist/quizplayer.min.js"></script>
<script>
  QuizPlayer.create('#player', { src: '/videos/aula-1.mp4', quizzes: [/* ... */] });
</script>

No backend, use o SDK oficial (Laravel, Go ou Node) para validar e salvar as respostas.

npm i @quizplayer/core

npm i @quizplayer/react

composer require quizplayer/quizplayer

go get github.com/IrvingSamuel/quizplayer/go

Acessar QuizPlayer