A menudo es necesario generar una presentación para un congreso o curso en poco tiempo, pero que cumpla estas características

• Que sea visualmente atractiva
• Que incluya matemáticas facilmente (en LaTeX, a ser posible)
• Que esté "en la nube"
• Que pueda incluir películas

Aquí cuento una opción muy sencilla, que utiliza:

• El entorno reveal.js
• El lenguaje markdown
• El servicio github para subir cosas a un host fácil y rápidamente

El resultado puede verse en las transparencias para el curso Métodos Numéricos en Mecánica de fluidos o la presentación sobre el artículo … phase separation kinetics for … two-dimensional membranes. 

---

 

reveal.js

Este entorno fue creado por el sueco Hakim El Hattab para generar presentaciones que pueden verse con un navegador. Se puede usar de forma local, abriendo las páginas, que están en nuestro ordenador, con un navegador, o subir las páginas a algún host (como explico más abajo).

Lo más sencillo es "clonar" reveal.js a nuestro disco local y modificar los ficheros index.html o demo.html que vienen con la distribución

markdown

Cuando editamos estos ficheros nos encontramos con html bastante fácil de entender:

                <section>
                    <h2>Touch Optimized</h2>
                    <p>
                        Presentations look great on touch devices, like mobile phones and tablets. Simply swipe through your slides.
                    </p>
                </section>

Por ejemplo, cada transparencia está delimitada por "<section>". Podemos entonces introducir texto html directamente, pero para los impacientes como yo es muy interesante usar markdown:

                        <section data-markdown>
                          ## Markdown support

                          Write content using inline or external Markdown.
                          Instructions and more info available in the [readme](https://github.com/hakimel/reveal.js#markdown).
                        </section>

La transparencia empieza con "<section data-markdown> <script type="text/template">  " , y lo que contiene es texto en formato markdown. Sin entrar en detalles, es una manera facilísima de maquetar texto para las tareas habituales (listas, encabecamientos, enlaces url, LaTeX). Por ejemplo:

 

                <section data-markdown>
                  <script type="text/template">
                    ####  Discretization : steady 1D diffusion
        
                    To illustrate how the conservation equations used in CFD can be discretized, we will look the diffusion of a chemical species
                    (constant density, incompressible flow), given by: 

                    $$
                    \frac{d}{{dx}}\left( {D\frac{{dc}}{{dx}}} \right) + S = 0
                    $$

       
                    Here $c$ is the concentration of the chemical species, $D$ is the diffusion coefficient, and $S$ is a source term
                  </script>
                </section>

Markdown es tambiénmuy conocido porque se usa para generar los ficheros de ayuda README.md en github y otros sitios. En todo caso, mucho más fácil que html. El único pero es que algunas ecuaciones LaTeX no se compilan bien; para ello hay que escribir “ antes de la ecuación. Por ejemplo:

 

                <section data-markdown>
                  <script type="text/template">
                    ####  Discretization : steady 1D diffusion
                    <img src="FVM_1D_cells.png"  style="background:white" width="40%">
                    “$$
                    \left( DA\frac{dc}{dx} \right)_e  \doteq D_e A_e \frac{c_E  – c_P }{\delta x_{PE}}
                    $$“

                    
                    $
                    D_e  \doteq \frac{{D_E  + D_P }}{2}
                    $        
                    $
                    \overline S \Delta V: = S_u + S_P c_P 
                    $
                  </script>
                </section>

 

(también se incluye una imagen, mediante html)

 

github 

 

Ojo: Este proceso es para un sistema linux y con un github ya configurado para subidas y bajadas automáticas (por ssh). Eso es otra historia, pero no es difícil y está bien explicado en muchos sitios, p.e. en la página oficial (en inglés, eso sí).

 

 

Ya hemos mencionado el servicio github porque reveal.js está albergado en él. Se trata de un servicio extremadamente interesante para proyectos colaborativos. Es muy conocido para programación, pero se puede usar perfectamente para transparencias, documentos, etc. Además no es necesario que los proyectos sean colaborativos, incluso para un solo usuario es interesante al ser un servicio de nube gratuito y muy optimizado. Eso sí, sólo para proyectos abiertos, si no hay que pagar, o se puede usar otro servicio, como bitbucket.

Lo interesante es que github ofrece un servicio web hosting gratuito y muy sencillo. Si nuestro usuario se llama ddcampayo, e inicia un repositorio llamado ddcampayo.github.io, el dominio https://ddcampayo.github.io/ automáticamente muestra los contenidos del repositorio. Esto es enormemente cómodo. El proceso típico sería así:

• En nuestro ordenador tenemos un directorio llamado igual que el proyecto, p.e. ddcampayo.github.io. En él editamos los ficheros que queramos (ficheros html para reveal.js, por ejemplo) y colocamos gráficos, gifs animados, películas, pdfs…
• Vamos visualizando los cambios con un navegador que abre los ficheros locales ("file://" en el campo url, en vez de "http://")
• Cuando nos guste, subimos los cambios con git commit -m 'descripcion de mis cambios'  seguido de git push
• Ya está, al cabo de unos segundos los archivos aparecen en la página web, por ejemplo, https://ddcampayo.github.io, y todo el mundo puede verlos

También podemos usar otro ordenador para hacer cambios, o la interfaz web de github, pero hay que acordarse de hacer "git pull" en los ordenadores que no están actualizados a la última versión.