<!-- .slide: class="l-cover" --> # Präsentation # *Puzzle ITC* ## RevealJS Theme John Doe john@mail.com ---- ```md <!-- .slide: class="l-cover" --> # Präsentation # *Puzzle ITC* ## RevealJS Theme John Doe john@mail.com ``` --- <!-- .slide: class="l-agenda" --> # Agenda - Masteransicht - Icons - Content mit/ohne Bullet Points - Bilder ---- ```md <!-- .slide: class="l-agenda" --> # Agenda - Masteransicht - Icons - Content mit/ohne Bullet Points - Bilder ``` --- <!-- .slide: class="l-team l-icons--big" --> # Nice to meet you -  - Martin Gafner - Key Account Manager - gafner@puzzle.ch -  - Simon Fankhauser - Head of Business Division Zürich - fankhauser@puzzle.ch -  - Anna Pfeifhofer - Co-Lead /cicd & /container - pfeifhofer@puzzle.ch ### Alle Puzzlers #### https://www.puzzle.ch/de/team ---- ```md <!-- .slide: class="l-agenda" --> # Agenda - Masteransicht - Icons - Content mit/ohne Bullet Points - Bilder ``` --- <!-- .slide: class="l-title02" --> ## Thema 1 # You are the # *Master!* ---- ```md <!-- .slide: class="l-title02" --> ## Thema 1 # You are the # *Master!* ``` --- # Masteransicht * Um das Corporate Design von Puzzle konsistent zu halten, verwenden wir für Präsentationen diese Folienvorlage. * Dieses Template stellt eine praktische Übersicht dar und hilft dir beim Erstellen deiner Präsentation. * Wenn du nach [unten](#unten) gehst, siehst du bei jeder Folie wie sie aufgebaut wurde. * Du kannst die Folien per «copy and paste» in deine Präsentation integrieren. ---- <!-- .slide: id="unten" --> ```md # Masteransicht * Um das Corporate Design von Puzzle konsistent zu halten, verwenden wir für Präsentationen diese Folienvorlage. * Dieses Template stellt eine praktische Übersicht dar und hilft dir beim Erstellen deiner Präsentation. * Wenn du nach [unten](#unten) gehst, siehst du bei jeder Folie wie sie aufgebaut wurde. * Du kannst die Folien per «copy and paste» in deine Präsentation integrieren. ``` Damit der Link funktioniert wurde auf dieser unteren Folie folgendes definiert: ```md <!-- .slide: id="unten" --> ``` --- <!-- .slide: class="l-title02" --> ## Thema 2 # *Icons* rather # than text ---- ```md <!-- .slide: class="l-title02" --> ## Thema 2 # *Icons* rather # than text ``` --- <!-- .slide: class="l-icons l-icons--big" --> # Titel #### Icons findest du in unserer [Icon-Library](https://files.puzzle.ch/apps/files/?dir=/swe/P14_Kommunikation/08_Brand/_Design_Library/01_Icons/Icons_Library_Streamline/assets&fileid=5633521). -  - Sozialleistungen -  - Lohn -  - Ferien ---- ```md <!-- .slide: class="l-icons l-icons--big" --> # Titel #### Icons findest du in unserer [Icon-Library](https://files.puzzle.ch/apps/files/?dir=/swe/P14_Kommunikation/08_Brand/_Design_Library/01_Icons/Icons_Library_Streamline/assets&fileid=5633521). -  - Sozialleistungen -  - Lohn -  - Ferien ``` --- <!-- .slide: class="l-icons l-icons--big" --> # Titel #### Untertitel -  - Sozialleistungen -  - Lohn -  - Ferien -  - Abos -  - Firmentreue ---- ```md <!-- .slide: class="l-icons l-icons--big" --> # Titel #### Untertitel -  - Sozialleistungen -  - Lohn -  - Ferien -  - Abos -  - Firmentreue ``` --- <!-- .slide: class="l-icons l-icons--list" --> # Titel -  - #### Zwischentitel Hier findest du verschiedene Möglichkeiten, wie du eine verschiedene Anzahl von Icons einsetzt. -  - #### Zwischentitel Icons mit Text oder nur einigen Stichwörtern – du wählst, was für dich und deine Präsentation passt. -  - #### Zwischentitel Auch hier gilt immer: Weniger ist mehr. Vielfach reicht ein Icon und ein Stichwort aus. ---- ```md <!-- .slide: class="l-icons l-icons--list" --> # Titel -  - ### Zwischentitel Hier findest du verschiedene Möglichkeiten, wie du eine verschiedene Anzahl von Icons einsetzt. -  - ### Zwischentitel Icons mit Text oder nur einigen Stichwörtern – du wählst, was für dich und deine Präsentation passt. -  - ### Zwischentitel Auch hier gilt immer: Weniger ist mehr. Vielfach reicht ein Icon und ein Stichwort aus. ``` --- <!-- .slide: class="l-title02" --> ## Thema 3 # rarely use # *Bullet Points* ---- ```md <!-- .slide: class="l-title02" --> ## Thema 3 # rarely use # *Bullet Points* ``` --- ## Aufbau einer leeren Slide - Diese Slide dient als Vorlage für eine Folie mit Bullet Points. - Für mich als Präsentator\*in praktisch, für den/die Zuhörer\*in eher unpraktisch ## Warum? - Weil der/die Zuhörer*in auf dich konzentriert ist. - Und während der Präsentation nur wenig Text wahrnehmen kann. - Deshalb denk daran: Bullet Points nur bedingt einsetzen. --- ## Und falls ich einen Text zeigen muss Dann verwendest du eine solche Folie ohne Bullet Points. Auch hier gilt: Nur wenig einsetzen. Der/Die Zuhörer\*in kann Text während einer Präsentation nur geringfügig wahrnehmen und lesen. Wir wollen während einer Präsentation erzielen, dass sich der/die Zuhörer\*in auf das konzentriert, was du sagst. ### Setze Text in Präsentationsfolien mit Bedacht ein. --- ## Titel ### Untertitel Und falls du Text mit unterschiedlicher Hierarchie einsetzen willst, dann kannst du diese Folie verwenden. #### Zwischentitel So ist die Folie gegliedert in Untertitel und Zwischentitel. Die Hierarchie hilft dem Zuhörer oder der Zuhörerin, die Themen einzuordnen. - Diese Hierarchie hilft dem Verständnis. - Das Gezeigte kann besser eingeordnet... - ...und das Gesagte besser verarbeitet werden. --- <!-- .slide: class="l-title02" --> ## Thema 4 # show # *visuals* ---- ```md <!-- .slide: class="l-title02" --> ## Thema 4 # show # *visuals* ``` --- <!-- .slide: class="l-title" --> ## Bilder wenn möglich ohne Text zeigen # Ein Bild sagt mehr als # tausend *Worte* --- <!-- .slide: data-background-image="_assets/imgs/demo_image.png" --> ---- ```md <!-- .slide: data-background-image="_assets/imgs/demo_image.png" --> ``` --- <!-- .slide: class="l-title" --> ## Falls du doch Text verwenden willst # Bilder unterstreichen # deine *Worte* --- <!-- .slide: class="l-top-head" data-background-image="_assets/imgs/demo_image2.png" --> ### Hallo. Ich bin ein kleiner Blindtext ---- ```md <!-- .slide: class="l-top-head" data-background-image="_assets/imgs/demo_image2.png" --> ### Hallo. Ich bin ein kleiner Blindtext ``` --- ## Bild & Titel  ---- ```md ## Bild & Titel  ``` --- ## Bild & Titel <div style="text-align: center"> <img src="_assets/imgs/demo_image3.png" /> </div> ---- ```md ## Bild & Titel <div style="text-align: center"> <img src="_assets/imgs/demo_image3.png" /> </div> ``` --- <!-- .slide: class="l-title02" --> ## Thema 4 # show # *logos* ---- ```md <!-- .slide: class="l-title02" --> ## Thema 4 # show # *logos* ``` --- <!-- .slide: class="l-logos" --> ## Logos aufführen -  - - - - - - - - - ---- ```md <!-- .slide: class="l-logos" --> ## Logos aufführen -  - - - - - - - - - ``` --- <!-- .slide: class="l-thanks" --> # Merci Mehr Informationen zu Puzzle: www.puzzle.ch <br><br><br><br><br> -  @puzzleitc -  @puzzleitc -  @puzzle_itc -  @puzzleitc -  @puzzle