feature: finished slide building process
This commit is contained in:
Prof. Dr. Matthias Jung DL9MJ
@@ -0,0 +1,112 @@
|
||||
<section>
|
||||
<h3>Navigationshilfe</h3>
|
||||
<p>Diese Navigationshilfe zeigt die ersten Schritte zur Verwendung der Präsention. Sie kann mit ⟶ (Pfeiltaste
|
||||
rechts) übersprungen werden.</p>
|
||||
</section>
|
||||
<section style="font-size: smaller;">
|
||||
<h4>Navigation</h4>
|
||||
<div id="left">
|
||||
<p>Zwischen den Folien und Abschnitten kann man mittels der Pfeiltasten hin- und herspringen, dazu kann man auch
|
||||
die Pfeiltasten am Computer nutzen.</p>
|
||||
<img src="assets/images/slides/navigation.png" alt="Navigationspfeile für die Präsentation" />
|
||||
</div>
|
||||
<div id="right">
|
||||
<ul class="list">
|
||||
<li>Pfeil runter und hoch: Nächste / Vorherige Folie</li>
|
||||
<li>Pfeil rechts und links: Nächster / Vorheriger Abschnitt</li>
|
||||
<li>Leertaste oder „n“: Der Reihe nach alle Elemente in Folien aufdecken oder zur nächsten Folie blättern
|
||||
</li>
|
||||
<li>Shift-Leertaste oder „p“: Der Reihe nach Elemente rückwärts zudecken oder zur vorherigen Folie blättern
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
<section style="font-size: smaller;">
|
||||
<h4>Weitere Funktionen</h4>
|
||||
<p>Mit ein paar Tastenkürzeln können weitere Funktionen aufgerufen werden. Die wichtigsten sind:</p>
|
||||
<dl>
|
||||
<dt>F1</dt>
|
||||
<dd>Help / Hilfe</dd>
|
||||
<dt>o</dt>
|
||||
<dd>Overview / Übersicht aller Folien</dd>
|
||||
<dt>s</dt>
|
||||
<dd>Speaker View / Referentenansicht</dd>
|
||||
<dt>f</dt>
|
||||
<dd>Full Screen / Vollbildmodus</dd>
|
||||
<dt>b</dt>
|
||||
<dd>Break, Black, Pause / Ausblenden der Präsentation</dd>
|
||||
<dt>Alt-Click</dt>
|
||||
<dd>In die Folie hin- oder herauszoomen</dd>
|
||||
</dl>
|
||||
</section>
|
||||
<section style="font-size: smaller;">
|
||||
<h4>Übersicht</h4>
|
||||
<div id="left">
|
||||
<p>Die Präsentation ist zweidimensional aufgebaut. Dadurch sind in Spalten die einzelnen Abschnitte eines
|
||||
Kapitels und in den Reihen die Folien zu den Abschnitten.</p>
|
||||
<p>Tippt man ein „o“ ein, bekommt man eine Übersicht über alle Folien des jeweiligen Kapitels. Das hilft
|
||||
sich zunächst einen Überblick zu verschaffen oder sich zu orientieren, wenn man das Gefühlt hat sich
|
||||
„verlaufen“ zu haben. Die Navigation erfolgt über die Pfeiltasten.</p>
|
||||
</div>
|
||||
<div id="right">
|
||||
<img src="assets/images/slides/overview.png" alt="Übersicht aller Folien" />
|
||||
<p>Durch Anklicken einer Folie wird diese präsentiert.</p>
|
||||
</div>
|
||||
</section>
|
||||
<section style="font-size: smaller;">
|
||||
<h4>Referentenansicht</h4>
|
||||
<div id="left">
|
||||
<img src="assets/images/slides/notes.png" alt="Referentenansicht" />
|
||||
<p>Tippt man ein „s“ ein, bekommt man ein neues Fenster, die Referentenansicht.</p>
|
||||
<p>Indem man „Layout“ auswählt, kann man zwischen verschieden Anordnungen der Elemente auswählen.</p>
|
||||
</div>
|
||||
<div id="right">
|
||||
<p>Die Referentenansicht bietet folgende Elemente:</p>
|
||||
<ul class="list">
|
||||
<li>Links sieht man die aktuelle Folie</li>
|
||||
<li>Rechts oben sieht man die nächste Folie</li>
|
||||
<li>Rechts in der Mitte Hilfsmittel zur Zeiteinteilung</li>
|
||||
<li>Rechts unten, die „Notizen für den Vortragenden“</li>
|
||||
<li>Unten die Pfeile zur Navigation</li>
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
<section style="font-size: smaller;">
|
||||
<h3>Praxistipps zur Referentenansicht</h3>
|
||||
<ul class="list">
|
||||
<li>Wenn man mit einem Projektor arbeitet, stellt man im Betriebssystem die Nutzung von 2 Monitoren ein: Die
|
||||
Referentenansicht wird dann zum Beispiel auf dem Laptop angezeigt, während die Teilnehmer die
|
||||
Präsentation angezeigt bekommen.</li>
|
||||
<li>Bei einer Online-Präsentation, wie beispielsweise auf <a href="https://treff.darc.de/">TREFF.darc.de</a>
|
||||
präsentiert man den Browser-Tab und navigiert im „Speaker View“ Fenster.</li>
|
||||
<li>Die Referentenansicht bezieht sich immer auf ein Kapitel. Am Ende des Kapitels muss sie geschlossen
|
||||
werden, um im neuen Kapitel eine neue Referentenansicht zu öffnen.</li>
|
||||
<li>Um mit dem Mauszeiger etwas zu markieren oder den Zoom zu verwenden, muss mit der Maus auf den
|
||||
Bildschirm mit der Präsentation gewechselt werden.</li>
|
||||
</ul>
|
||||
</section>
|
||||
<section style="font-size: smaller;">
|
||||
<h4>Vollbild</h4>
|
||||
<p>Tippt man ein „f“ ein, wird die aktuelle Folie im Vollbild angezeigt. Mit „Esc“ kann man diesen wieder
|
||||
verlassen.</p>
|
||||
<p>Das ist insbesondere für den Bildschirm mit der Präsentation für das Publikum praktisch.</li>
|
||||
</section>
|
||||
<section style="font-size: smaller;">
|
||||
<h4>Ausblenden</h4>
|
||||
<p>Tippt man ein „b“ ein, wird die Präsentation ausgeblendet.</p>
|
||||
<p>Sie kann wie folgte wieder eingeblendet werden:</p>
|
||||
<ul class="list">
|
||||
<li>Durch klicken in das Fenster.</li>
|
||||
<li>Durch nochmaliges Drücken von „b“.</li>
|
||||
<li>Durch klicken der Schaltfläche „Resume presentation:</li>
|
||||
</ul>
|
||||
<img src="assets/images/slides/resume.png" alt="Schaltfläche für Resume Presentation" />
|
||||
</section>
|
||||
<section style="font-size: smaller;">
|
||||
<h4>Zoom</h4>
|
||||
<p>Bei gedrückter Alt-Taste und einem Mausklick in der Präsentation wird in diesen Teil hineingezoomt. Das ist
|
||||
praktisch, um Details von Schaltungen hervorzuheben. Durh einen nochmaligen Mausklick zusammen mit Alt wird
|
||||
wieder herausgezoomt.</p>
|
||||
<p>Das Zoomen funktioniert nur im ausgewählten Fenster. Die Referentenansicht ist hier nicht mit dem
|
||||
Präsenationsansicht gesynct.</p>
|
||||
</section>
|
||||
@@ -7,7 +7,7 @@
|
||||
{% endif -%}
|
||||
<div class="question-text">{{ number }}: {{ question }}</div>
|
||||
{% if picture_question -%}
|
||||
<div class="question-picture"><img class="r-stretch" src="picture/{{ picture_question }}.svg"></div>
|
||||
<div class="question-picture"><img class="r-stretch" src="pictures/{{ picture_question }}.svg"></div>
|
||||
{% endif -%}
|
||||
<div class="answers">
|
||||
{% if answers[0] -%}
|
||||
@@ -17,7 +17,7 @@
|
||||
{% endif -%}
|
||||
{% if answer_pictures[0] -%}
|
||||
{% for answer in answer_pictures|shuffle_answers -%}
|
||||
<div class="question-picture{% if not answer.correct %} fragment semi-fade-out{% endif -%}" {% if not answer.correct -%} data-fragment-index="1" {% endif -%}><b>{{ answer_label[loop.index - 1] }}:</b><img class="r-stretch" src="picture/{{ answer.content }}.svg"></div>
|
||||
<div class="question-picture{% if not answer.correct %} fragment semi-fade-out{% endif -%}" {% if not answer.correct -%} data-fragment-index="1" {% endif -%}><b>{{ answer_label[loop.index - 1] }}:</b><img class="r-stretch" src="pictures/{{ answer.content }}.svg"></div>
|
||||
{% endfor -%}
|
||||
{% endif -%}
|
||||
</div>
|
||||
|
||||
@@ -0,0 +1,56 @@
|
||||
<!doctype html>
|
||||
<html lang="de">
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>DARC Ausbildungsplattform</title>
|
||||
<meta name="description" content="">
|
||||
<meta name="author" content="">
|
||||
<meta name="apple-mobile-web-app-capable" content="yes">
|
||||
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="stylesheet" href="assets/reveal.js/dist/reset.css">
|
||||
<link rel="stylesheet" href="assets/reveal.js/dist/reveal.css">
|
||||
<link rel="stylesheet" href="assets/style-slide.css">
|
||||
<!-- Theme used for syntax highlighting of code -->
|
||||
<link rel="stylesheet" href="assets/reveal.js/plugin/highlight/monokai.css">
|
||||
<!-- Chart plugin -->
|
||||
<script src="assets/reveal.js-plugins/chart/plugin.js"></script>
|
||||
<script src="assets/chartjs/4.4.1/chart.min.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="reveal">
|
||||
<!-- Any section element inside of this container is displayed as a slide -->
|
||||
<div class="slides">
|
||||
{{ content }}
|
||||
</div>
|
||||
|
||||
<script src="assets/reveal.js/dist/reveal.js"></script>
|
||||
<script src="assets/reveal.js/plugin/zoom/zoom.js"></script>
|
||||
<script src="assets/reveal.js/plugin/notes/notes.js"></script>
|
||||
<script src="assets/reveal.js/plugin/search/search.js"></script>
|
||||
<script src="assets/reveal.js/plugin/markdown/markdown.js"></script>
|
||||
<script src="assets/reveal.js/plugin/highlight/highlight.js"></script>
|
||||
<script src="assets/reveal.js/plugin/math/math.js"></script>
|
||||
<script>
|
||||
|
||||
// Also available as an ES module, see:
|
||||
// https://revealjs.com/initialization/
|
||||
Reveal.initialize({
|
||||
controls: true,
|
||||
progress: true,
|
||||
slideNumber: 'c/t',
|
||||
showSlideNumber: 'speaker',
|
||||
center: true,
|
||||
hash: true,
|
||||
transition: 'slide',
|
||||
showNotes: false,
|
||||
pdfSeparateFragments: false,
|
||||
|
||||
// Learn about plugins: https://revealjs.com/plugins/
|
||||
plugins: [ RevealZoom, RevealNotes, RevealSearch, RevealMarkdown, RevealHighlight, RevealMath.KaTeX, RevealChart ]
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user