<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Moodle para Professores — Instituto Maris Celis</title>
<style>
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body {
font-family: Arial, Helvetica, sans-serif;
background: #f0f4fa;
color: #222;
padding: 32px 16px 48px;
line-height: 1.6;
}
.container {
max-width: 820px;
margin: 0 auto;
}
/* ── HERO ── */
.hero {
background: #1F3864;
border-radius: 12px;
padding: 36px 36px 28px;
margin-bottom: 28px;
position: relative;
overflow: hidden;
}
.hero::after {
content: '';
position: absolute;
bottom: 0; left: 0; right: 0;
height: 4px;
background: #00B0A0;
}
.hero-badge {
display: inline-block;
background: #00B0A0;
color: #04342C;
font-size: 11px;
font-weight: bold;
padding: 4px 12px;
border-radius: 20px;
letter-spacing: 0.05em;
text-transform: uppercase;
margin-bottom: 14px;
}
.hero h1 {
font-size: 28px;
font-weight: bold;
color: #ffffff;
line-height: 1.25;
margin-bottom: 10px;
}
.hero h1 span { color: #00B0A0; }
.hero p {
font-size: 15px;
color: #9DC3E6;
max-width: 600px;
margin-bottom: 24px;
}
.pills {
display: flex;
flex-wrap: wrap;
gap: 8px;
}
.pill {
background: rgba(255,255,255,0.09);
border: 1px solid rgba(255,255,255,0.18);
border-radius: 20px;
padding: 5px 14px;
font-size: 12px;
color: #E8F0FE;
}
/* ── SEÇÕES ── */
.section { margin-bottom: 28px; }
.section-label {
font-size: 11px;
font-weight: bold;
color: #888;
letter-spacing: 0.08em;
text-transform: uppercase;
border-bottom: 1px solid #dde3f0;
padding-bottom: 8px;
margin-bottom: 16px;
}
/* ── DESCRIÇÃO ── */
.desc-box {
background: #fff;
border: 1px solid #dde3f0;
border-radius: 12px;
padding: 22px 24px;
font-size: 14px;
color: #444;
line-height: 1.8;
}
.desc-box p + p { margin-top: 12px; }
.desc-box strong { color: #1F3864; }
/* ── OBJETIVOS ── */
.obj-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
gap: 10px;
}
.obj-item {
background: #fff;
border: 1px solid #dde3f0;
border-left: 4px solid #00B0A0;
border-radius: 0 8px 8px 0;
padding: 11px 14px;
font-size: 13px;
color: #444;
line-height: 1.5;
display: flex;
align-items: center;
gap: 8px;
}
.obj-item::before {
content: '✓';
color: #00B0A0;
font-weight: bold;
font-size: 14px;
flex-shrink: 0;
}
/* ── MÓDULOS ── */
.module-list {
background: #fff;
border: 1px solid #dde3f0;
border-radius: 12px;
overflow: hidden;
}
.module-item {
display: flex;
gap: 16px;
align-items: flex-start;
padding: 18px 20px;
border-bottom: 1px solid #eef1f8;
transition: background 0.15s;
}
.module-item:last-child { border-bottom: none; }
.module-item:hover { background: #f7f9fe; }
.mod-num {
flex-shrink: 0;
width: 36px;
height: 36px;
border-radius: 8px;
background: #1F3864;
color: #9DC3E6;
font-size: 12px;
font-weight: bold;
display: flex;
align-items: center;
justify-content: center;
}
.mod-num.destaque { background: #00B0A0; color: #04342C; }
.mod-info { flex: 1; }
.mod-title {
font-size: 14px;
font-weight: bold;
color: #1F3864;
margin-bottom: 4px;
}
.mod-desc {
font-size: 13px;
color: #666;
line-height: 1.55;
margin-bottom: 8px;
}
.mod-topics {
list-style: none;
padding: 0;
display: flex;
flex-direction: column;
gap: 3px;
}
.mod-topics li {
font-size: 12px;
color: #777;
padding-left: 14px;
position: relative;
}
.mod-topics li::before {
content: '▸';
position: absolute;
left: 0;
color: #00B0A0;
}
.mod-tags {
display: flex;
flex-wrap: wrap;
gap: 5px;
margin-top: 8px;
}
.mod-tag {
font-size: 11px;
border-radius: 4px;
padding: 2px 8px;
font-weight: bold;
}
.tag-pratica { background: #E1F5EE; color: #0F6E56; }
.tag-teoria { background: #E8F0FE; color: #185FA5; }
.tag-entrega { background: #FFF3E8; color: #8B4500; }
.tag-destaque{ background: #1F3864; color: #9DC3E6; }
.mod-ch {
flex-shrink: 0;
font-size: 13px;
font-weight: bold;
color: #888;
padding-top: 4px;
min-width: 28px;
text-align: right;
}
/* ── RODAPÉ ── */
.footer-bar {
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
gap: 8px;
background: #fff;
border: 1px solid #dde3f0;
border-radius: 8px;
padding: 14px 20px;
font-size: 13px;
color: #888;
margin-top: 28px;
}
.footer-bar strong { color: #1F3864; }
.footer-bar .total { color: #00B0A0; font-weight: bold; font-size: 15px; }
/* ── METODOLOGIA ── */
.met-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 10px;
}
.met-item {
background: #fff;
border: 1px solid #dde3f0;
border-radius: 10px;
padding: 14px 16px;
}
.met-icon { font-size: 20px; margin-bottom: 6px; }
.met-title { font-size: 13px; font-weight: bold; color: #1F3864; margin-bottom: 4px; }
.met-desc { font-size: 12px; color: #666; line-height: 1.5; }
@media (max-width: 600px) {
.hero { padding: 24px 20px 20px; }
.hero h1 { font-size: 22px; }
.module-item { flex-wrap: wrap; }
}
</style>
</head>
<body>
<div class="container">
<!-- HERO -->
<div class="hero">
<div class="hero-badge">🎓 Capacitação Docente</div>
<h1>Moodle para Professores<br><span>Do Zero ao Domínio da Plataforma</span></h1>
<p>Curso completo para professores do Instituto Maris Celis aprenderem a criar, organizar e gerenciar suas turmas no ambiente virtual de ensino da escola.</p>
<div class="pills">
<div class="pill">🕐 20 horas</div>
<div class="pill">📋 8 módulos</div>
<div class="pill">👤 Professores iniciantes</div>
<div class="pill">💻 Presencial ou online</div>
<div class="pill">🏛 Passos — MG</div>
<div class="pill">🌐 moodle.institutomariscelis.com.br</div>
</div>
</div>
<!-- DESCRIÇÃO -->
<div class="section">
<div class="section-label">Descrição do curso</div>
<div class="desc-box">
<p>
Este curso foi desenvolvido especialmente para professores que nunca utilizaram o Moodle ou que tiveram apenas contato superficial com a plataforma. De forma progressiva, prática e objetiva, você aprenderá a criar e organizar seus cursos virtuais, aplicar atividades e avaliações, acompanhar o desempenho dos alunos e se comunicar com suas turmas — tudo em um único ambiente digital acessível de qualquer computador ou celular.
</p>
<p>
O Moodle já está no ar aqui no <strong>Instituto Maris Celis</strong>. Além de complementar as aulas presenciais, a plataforma será o principal canal para atender alunos em <strong>regime especial</strong> — garantindo que nenhum estudante fique para trás, independentemente de poder comparecer à escola.
</p>
<p>
Ao final do curso, você terá criado um curso real, pronto para usar imediatamente com seus alunos. Não é teoria: é prática do começo ao fim. Cada módulo traz demonstração ao vivo seguida de exercício prático, para que você aprenda fazendo.
</p>
</div>
</div>
<!-- OBJETIVOS -->
<div class="section">
<div class="section-label">O que você vai aprender</div>
<div class="obj-grid">
<div class="obj-item">Navegar e configurar seu perfil no Moodle</div>
<div class="obj-item">Criar e organizar cursos com seções e materiais</div>
<div class="obj-item">Publicar arquivos, vídeos e páginas de conteúdo</div>
<div class="obj-item">Aplicar tarefas e quizzes com correção automática</div>
<div class="obj-item">Criar fóruns e se comunicar com os alunos</div>
<div class="obj-item">Acompanhar acesso, progresso e notas de cada aluno</div>
<div class="obj-item">Gerenciar grupos, inscrições e backup do curso</div>
<div class="obj-item">Usar o Moodle para atender alunos em regime especial</div>
</div>
</div>
<!-- SUMÁRIO -->
<div class="section">
<div class="section-label">Sumário do curso</div>
<div class="module-list">
<div class="module-item">
<div class="mod-num destaque">M1</div>
<div class="mod-info">
<div class="mod-title">Introdução ao Moodle</div>
<div class="mod-desc">O que é o Moodle, como surgiu e por que usá-lo. Primeiros passos na plataforma.</div>
<ul class="mod-topics">
<li>O que é o Moodle e por que utilizá-lo</li>
<li>Diferença entre professor, aluno e administrador</li>
<li>Navegando pela interface: painel, barra lateral e blocos</li>
<li>Configurando seu perfil: foto, biografia e preferências</li>
</ul>
<div class="mod-tags">
<span class="mod-tag tag-teoria">Teoria</span>
<span class="mod-tag tag-pratica">Prática</span>
</div>
</div>
<div class="mod-ch">2h</div>
</div>
<div class="module-item">
<div class="mod-num">M2</div>
<div class="mod-info">
<div class="mod-title">Criando e estruturando cursos</div>
<div class="mod-desc">Criar e configurar um curso, definir formatos e organizar o conteúdo em seções.</div>
<ul class="mod-topics">
<li>Configurações gerais: nome, descrição, formato e visibilidade</li>
<li>Formatos disponíveis: Tópicos, Semanal e Social</li>
<li>Criando seções e organizando o conteúdo</li>
<li>Adicionando, movendo e renomeando atividades</li>
</ul>
<div class="mod-tags">
<span class="mod-tag tag-pratica">Prática</span>
</div>
</div>
<div class="mod-ch">3h</div>
</div>
<div class="module-item">
<div class="mod-num">M3</div>
<div class="mod-info">
<div class="mod-title">Recursos de conteúdo</div>
<div class="mod-desc">Publicar materiais de diferentes tipos para enriquecer o curso.</div>
<ul class="mod-topics">
<li>Adicionando arquivos: PDF, Word e PowerPoint</li>
<li>Criando páginas de texto e conteúdo HTML</li>
<li>Inserindo vídeos do YouTube e links externos</li>
<li>Usando rótulos para organizar visualmente o curso</li>
</ul>
<div class="mod-tags">
<span class="mod-tag tag-pratica">Prática</span>
</div>
</div>
<div class="mod-ch">2h</div>
</div>
<div class="module-item">
<div class="mod-num">M4</div>
<div class="mod-info">
<div class="mod-title">Ferramentas de avaliação</div>
<div class="mod-desc">O módulo mais extenso: tudo sobre avaliação de alunos no Moodle.</div>
<ul class="mod-topics">
<li>Criando tarefas: tipos, prazos e critérios de envio</li>
<li>Corrigindo tarefas e dando feedback individualizado</li>
<li>Quizzes: banco de questões e tipos de perguntas</li>
<li>Livro de notas: pesos, categorias e exportação</li>
</ul>
<div class="mod-tags">
<span class="mod-tag tag-pratica">Prática</span>
<span class="mod-tag tag-destaque">Módulo principal</span>
</div>
</div>
<div class="mod-ch">4h</div>
</div>
<div class="module-item">
<div class="mod-num">M5</div>
<div class="mod-info">
<div class="mod-title">Comunicação e engajamento</div>
<div class="mod-desc">Ferramentas para manter os alunos conectados e motivados.</div>
<ul class="mod-topics">
<li>Fóruns de discussão e boas práticas de moderação</li>
<li>Mensagens individuais e avisos para a turma</li>
<li>Notificações automáticas por e-mail</li>
<li>Badges e conclusão de atividades</li>
</ul>
<div class="mod-tags">
<span class="mod-tag tag-pratica">Prática</span>
</div>
</div>
<div class="mod-ch">3h</div>
</div>
<div class="module-item">
<div class="mod-num">M6</div>
<div class="mod-info">
<div class="mod-title">Acompanhamento e relatórios</div>
<div class="mod-desc">Monitorar o progresso e identificar alunos que precisam de atenção.</div>
<ul class="mod-topics">
<li>Verificando log de acesso e atividades realizadas</li>
<li>Relatório de progresso individual do aluno</li>
<li>Identificando alunos em risco de evasão</li>
<li>Exportando dados para Excel</li>
</ul>
<div class="mod-tags">
<span class="mod-tag tag-pratica">Prática</span>
</div>
</div>
<div class="mod-ch">3h</div>
</div>
<div class="module-item">
<div class="mod-num">M7</div>
<div class="mod-info">
<div class="mod-title">Administração do curso</div>
<div class="mod-desc">Gerenciar alunos, grupos e a estrutura do curso com segurança.</div>
<ul class="mod-topics">
<li>Inscrevendo alunos manualmente e por auto-inscrição</li>
<li>Criando grupos e agrupamentos por turma</li>
<li>Backup, restauração e duplicação de cursos</li>
<li>Configurando restrições de acesso a atividades</li>
</ul>
<div class="mod-tags">
<span class="mod-tag tag-pratica">Prática</span>
</div>
</div>
<div class="mod-ch">2h</div>
</div>
<div class="module-item">
<div class="mod-num">M8</div>
<div class="mod-info">
<div class="mod-title">Prática supervisionada</div>
<div class="mod-desc">Cada professor cria um mini-curso completo e apresenta ao grupo.</div>
<ul class="mod-topics">
<li>Criar curso com pelo menos 3 seções temáticas</li>
<li>Incluir tarefa, quiz com 5 questões e fórum</li>
<li>Apresentação guiada para os colegas</li>
<li>Feedback do instrutor e encerramento</li>
</ul>
<div class="mod-tags">
<span class="mod-tag tag-entrega">Entrega final</span>
</div>
</div>
<div class="mod-ch">1h</div>
</div>
</div>
</div>
<!-- METODOLOGIA -->
<div class="section">
<div class="section-label">Metodologia</div>
<div class="met-grid">
<div class="met-item">
<div class="met-icon">👁</div>
<div class="met-title">Exposição ao vivo</div>
<div class="met-desc">Demonstração em tela com acesso direto à plataforma real da escola.</div>
</div>
<div class="met-item">
<div class="met-icon">✋</div>
<div class="met-title">Prática imediata</div>
<div class="met-desc">Exercício prático logo após cada conceito apresentado.</div>
</div>
<div class="met-item">
<div class="met-icon">📄</div>
<div class="met-title">Estudo de caso</div>
<div class="met-desc">Análise de cursos reais para identificar boas práticas.</div>
</div>
<div class="met-item">
<div class="met-icon">🏗</div>
<div class="met-title">Projeto guiado</div>
<div class="met-desc">Criação de um curso completo ao longo do treinamento.</div>
</div>
</div>
</div>
<!-- RODAPÉ -->
<div class="footer-bar">
<div>
<strong>Instituto Educacional Máris Célis</strong> · Passos, MG<br>
<a href="https://moodle.institutomariscelis.com.br/" style="color:#2E75B6; font-size:12px;">moodle.institutomariscelis.com.br</a>
</div>
<div style="text-align:right;">
Carga horária total<br>
<span class="total">20 horas | 8 módulos</span>
</div>
</div>
</div>
</body>
</html>