Showing posts with label presentation. Show all posts
Showing posts with label presentation. Show all posts

Nov 23, 2021

Presentation from Command Line

Today, I'm going to share my view on those command line presentation tools that I tried. 

Good and bad with command line presentation tools.

- Cannot never win any design award.
- fonts might be too small.
+ help to FOCUS.

 

mdp - Markdown Presentation

  • uses single markdown text file.
  • can be converted to HTML and PDF (with additional tools).


tpp - Text Presentation Program

  • uses own formatting (instead of markdown).
  • colorful

 

vimdeck - VIM as a presentation tool

  • uses makrdown + ruby + SyntaxRange
  • supports H1/H2/Images (to ascii), and fenced code blocks.
  • supports highlighting syntax.


vtmc - Video Terminal Master of Ceremonies

 

tkn - Terminal Keynote

  • uses ruby and png files.
  • supports code, center, block, image, section.
  • can be converted to PDF.

 

tiptip - Terminal Plain-text Presentations

  • uses CoffeeScript.

 

patat - Presentation Atop The ANSI Terminal

  • uses pandoc (markdown/LaTeX) to parse the slides.
  • largely based upon MDP and VTMC
  • support different running options.
  • support YAML configuration (at 2 places).

 

 lookatme - LookAtMe

  • uses markdown notation.
  • supports live code, images, 
  • live terminal.
  • options for different types of rendering. 

 

Links:

  • mdp - https://github.com/visit1985/mdp
  • tpp - https://synflood.at/tpp.html
  • vimdeck - https://github.com/tybenz/vimdeck
  • vtmc - https://github.com/jclulow/vtmc
  • vtmc_box - https://github.com/justin2004/vtmc_box
  • tkn - https://github.com/fxn/tkn
  • tiptip - https://github.com/felixrabe-attic/mcrio--tiptip
  • patat - https://github.com/jaspervdj/patat
  • lookatme - https://github.com/d0c-s4vage/lookatme

Jun 9, 2014

Learning Impress.js

Here I'll show you how to create the 1st presentation that use Javascript (impress.js).

Setup the 1st template.html

<!doctype html> 
<html> 
    <head> 
        <title>Impress Tutorial</title> 
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
    </head> 
    <body>

        <div class="step"> My 1st slide </div>

    <script type="text/javascript" src="impress.js"></script>
    <script>impress().init()</script>
    </body> 
</html> 

From the template.html, copy and make your own the 1st impress.js's presentation.

The very 1st slide is always at the position (0,0,0) for x,y,z. Usually you only start add in the animation from slide 2 onward. Below are the only commands that you need to learn how to animate the slide transition.

  • data-x="800" - Positive (move-to-right), Negative (move-to-left)
  • data-y="500" - Positive (move-down), Negative (move-to-up)
  • data-z="1200" - Positive (come-close), Negative (go-far)
  • data-scale="5" - Scale X times (1: original; x: bigger; 0.x: smaller)
  • data-rotate-x="90" - 3D sliding. Positive (rotate-to-up-degree), Negative (rotate-to-down-degree)
  • data-rotate-y="180" - 3D sliding. Positive (rotate-to-left-degree), Negative (rotate-to-right-degree)
  • data-rotate-z="270" - 3D sliding. Rotated about the z-axis.


Example, I'm creating 4 slides, and wish them to rotate to right like a cube.

<div class="step"> My 1st slide </div>
<div class="step" data-rotate-y="90"> My 2nd slide </div>
<div class="step" data-rotate-y="180"> My 3rd slide </div>
<div class="step" data-rotate-y="270"> My 4th slide </div>