\documentclass{article}
\usepackage[T1]{fontenc}
\usepackage{tgheros}
\renewcommand{\familydefault}{\sfdefault}
\usepackage[letterpaper,margin=0pt]{geometry}
\usepackage{xcolor}
\usepackage{tikz}
\pagestyle{empty}
\definecolor{bgblue}{rgb}{0,0.082,0.639}
\definecolor{mutedgrey}{rgb}{0.612,0.639,0.686}
\definecolor{skyblue}{rgb}{0.22,0.741,0.973}
\definecolor{ink}{rgb}{0.043,0.059,0.098}
\begin{document}
\begin{tikzpicture}[remember picture,overlay,x=1bp,y=1bp]
\begin{scope}[shift={(current page.south west)}]
\fill[bgblue] (0,0) rectangle (612,792);
\foreach \txt/\y in {We are/549.8, rethinking/460.2,
scientific/370.5, presentation/280.8}
\node[anchor=base east, inner sep=0, text=white,
font=\fontsize{81.6}{89.7}\selectfont] at (553,\y) {\txt};
\node[anchor=base west, inner sep=0, text=mutedgrey,
font=\fontsize{9.07}{11}\selectfont] at (74.5,62.6)
{Featuring keynote analysis by};
\node[anchor=base west, inner sep=0, text=white,
font=\fontsize{9.07}{11}\bfseries\selectfont] at (74.5,49.5)
{Usama Muneeb};
\documentclass[aspectratio=169]{beamer}
\usepackage{sample_files/mytheme}
% Step 1: Import the `interactivefig` package.
\usepackage{interactivefig}
% Step 2: Use the `importinteractivelibrary` command to bundle
% a JavaScript library into your PDF file, and give it a name
% e.g. `plotly` in this case
\importinteractivelibrary{plotly}{sample_files/plotly.min.js}
% Step 3: You may now add interactive figures that use this library.
% You will find below, the uses of the `interactivefigure` command
% Used as:
%
% \interactivefigure[library=<LIBRARY_NAME>]{<FIGURE_FILE>.html}{<WIDTH>}{<HEIGHT>}{%
% <PLACEHOLDER TEXT OR IMAGE>
% }
\title{Serengeti: LaTeX meets interactive figures}
\subtitle{Introducing interactive figures in Beamer presentations}
\author{Usama Muneeb}
\date{\today}
\begin{document}
\maketitle
\begin{frame}{Visualizing a dataset and hyperplane using a Plotly surface}
\begin{figure}
\interactivefigure[library=plotly]{sample_files/cube.html}{0.8\textwidth}{0.6\textheight}{%
Scatter plot of a dataset
}
\caption{Scatter plot of a dataset along with the separating hyperplane.}
\end{figure}
\end{frame}
\begin{frame}{Visualizing a cone using a Plotly surface}
\begin{figure}
\interactivefigure[library=plotly]{sample_files/psdcone.html}{0.8\textwidth}{0.6\textheight}{%
\includegraphics[width=0.8\textwidth]{sample_files/psdcone.png}
}
\caption{Visualizing the positive semidefinite (PSD) cone}
\end{figure}
\end{frame}
\begin{frame}{Loss landscape of a two-parameter model}
\begin{figure}
\interactivefigure[library=plotly]{sample_files/loss.html}{0.8\textwidth}{0.6\textheight}{%
Loss surface
}
\caption{Loss $L(w_1, w_2)$ over the parameter grid.}
\end{figure}
\end{frame}
\end{document}