IPython notebook became a very popular tool for programming short scripts in Python, interactive computing, sharing code, teaching or even demonstrations. Its advantage is the possibility to combine Python code with graphics, HTML, videos or even interactive JavaScript objects in one notebook. With this functionality it may also serve as a great presentation tool.

There are two possible ways to give presentations with IPython:

1. In presentation mode which requires running IPython kernel.
2. By converting the notebook in .ipynb format to HTML using nbconvert, which can be opened in any modern browser (Firefox, Chrome). This method does not require a running installation of IPython for giving the presentation.

Since the second method is currently better supported, I will focus on it in this tutorial.

Requirements

To start with presentation with IPython you will need a recent installation of IPython including the notebook > 2.0 (pip install ipython should do the trick on most systems, if this does not work consider installing anaconda).

Preparing the slides

After starting IPython notebook (type ipython notebook in your console) and creating a new notebook, you can start coding. Simply put the code that you want to present on consecutive slides in seperate cells. If you want to show some plots I recommend adding %matplotlib inline on top of the notebook. It will configure matplotlib to embedd the plots into the notebook (in the output cells). In addition you can also insert images from your disk or from the internet:

from IPython.display import Image
Image(filename='my_photo.jpeg', width=600)
Image(url='http://ipython.org/_static/IPy_header.png')

Another useful function is to include the HTML code:

from IPython.display import HTML
HTML("""<table>
        <tr> 
          <td>1</td>
          <td>2</td>
        </tr>
        <tr> 
          <td>3</td>
          <td>4</td>
        </tr>        
        </table>""")

This can be used to add interactive widgets such as an embedded map:

HTML('<iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://www.openstreetmap.org/export/embed.html?bbox=9.55810546875%2C46.66451741754235%2C24.49951171875%2C55.10351605801967&amp;layer=mapquest&amp;marker=51.07591977545679%2C17.02880859375" style="border: 1px solid black"></iframe><br/><small><a href="http://www.openstreetmap.org/?mlat=51.076&amp;mlon=17.029#map=6/51.076/17.029&amp;layers=Q">View Larger Map</a></small>')

For including a simple text (or bullet points) you can switch the cell type to markdown.

Now we need to tell IPython which cells should be shown together on one slide simultaneously, sequentially or appear on different slides. Recent versions of IPython notebook include a toolbar that allows to attach metadata to each cell, which can, for example, define its role in the presentation. To enable it select Slideshows from the dropdown menu Cell Toolbar. Now you can assign a cell type to each cell from the menu appearing in its header:

• Slide – start a new slide
• Sub-slide – reveal.js, which is used for presenting the slides in HTML allows to arange slides into simple hierarchy, this will add a new slide below the main slide
• Fragment – add a new fragment to a slide, which will appear sequentially (step-by-step),
• Skip – do not show the slide in the presentation
• Note – define as presenters notes

Converting to HTML presentation

To create interactive presentations inside your browser, IPython uses a JavaScript library called reveal.js. You won’t need to go into the internals of this library, because IPython will generate a suitable .html file that you can simply open in your browser. In your console type:

ipython nbconvert presentation.ipynb --to slides --post serve

This will open a new window in the browser with the presentation.

If you prefer to generate a static html file for displaying later on a computer possibly without an installation of IPython, you may run nbcovert like this:

ipython nbconvert presentation.ipynb --to slides

This will generate presentation.slides.html in the current directory. In addition you will need a copy of reveal.js in the same directory which you can download from Github. Then you can just open the html file in your browser or, if this does not work, you can run a simple HTTP server (requires plain Python installation available on most systems):

python -m SimpleHTTPServer

and go to http://127.0.0.1:8000/presentation.slides.html with your browser.

Customisation

By default IPython notebook will show both the input and output cells in the presentation, that is the code and its result (figure, table, formula, text). If you only want to show the results of the computation you can add an extra CSS code in one of the notebook cells (usually at the top of the notebook):

<style type="text/css">
.input_prompt, .input_area, .output_prompt {
    display:none !important;
}
</style>

and set the cell type to Raw NBConvert, slide type to Skip and regenerate the html file.

You can also customise other properties like font of the headers:

<style type="text/css">
.reveal h1, .reveal h2 {
    font-family:times
}
</style>

Alternatively, you can put these CSS snippets into custom.css file and save it in the same directory where your html presentation rests.

More interactivity

Imagine that you present simulation results or some complex mathematical formula and you would like to demonstrate the range of behaviours when one of the parameters is varied. IPython 2.0 introduces powerful widgets that control the parameters of the simulation and allow to change them interactively. Unfortunatelly, this functionality relies on the communication between the notebook and computing kernel, so, in other words, needs a running IPython instance.

A simpler replacement that also works in standalone html files is ipywidgets. To use them just install the module from Github add create an interactive plot:

from ipywidgets import StaticInteract, RangeWidget, RadioWidget
%matplotlib inline
from matplotlib import pyplot as plt
import numpy as np

def  quadr_func(a,b):
    fig = plt.figure()
    x = np.linspace(-2,2,20)
    y = a*x**2+b*x
    ax = fig.add_subplot(111)
    ax.plot(x, y)
    return fig

StaticInteract(quadr_func, a=RangeWidget(-1,1,0.55), 
                           b=RangeWidget(-1,1, 0.55))

The drawback of this approach is that the parameters must be specified in advance. This features will also increase the size of the output file, so you have to keep the number of parameter combinations in reasonable range.

Conclusion

IPython notebook is a versatile tool that will help you build presentation in matter of minutes. This is especially useful when demonstrating results of Python simulations or if you want to add some (perhaps limited) interactivity to your presentation. Another advantage is that IPython notebook offers a single source file from which outputs in different formats can be generated (blog post, pdf report, presentation or handouts).

An example notebook is available for download (you can view it as slides with nbviewer).