-\documentclass[aspectratio=169]{beamer}
+\documentclass[aspectratio=169,ignorenonframetext,hyperref={pdfpagelabels=false}]{beamer}
\usepackage[utf8]{inputenc}
+\usepackage[T1,T2A]{fontenc}
+\usepackage[british]{babel}
\usepackage{relsize}
+\usepackage{tikz}
+\usetikzlibrary{pie,positioning,shapes,automata,fit,shadows,matrix,backgrounds,shapes.geometric}
\graphicspath{{./img}}
\beamertemplatenavigationsymbolsempty%
\urlstyle{same}
+\usefonttheme{serif}
+\newcommand{\IOT}{\texorpdfstring{Io\kern-1ptT}{IoT}}
% Add slide numbers
-\setbeamertemplate{footline}{%
- \quad%
- \usebeamercolor[fg]{page number in head/foot}%
- \usebeamerfont{page number in head/foot}%
- \insertframenumber%
- \kern1em\vspace{2pt}%
-}
+%\setbeamertemplate{footline}{%
+% \quad%
+% \usebeamercolor[fg]{page number in head/foot}%
+% \usebeamerfont{page number in head/foot}%
+% \insertframenumber%
+% \vspace{2mm}
+%}
\title{\texorpdfstring{\larger[2]}{}Orchestrating the Internet of Things\texorpdfstring{\\}{\ }with Task-Oriented Programming}
\subtitle{\texorpdfstring{\larger[2]}{}a purely functional rhapsody}
\maketitle
\end{frame}
-\begin{frame}{Internet of Things (IoT)}{A layered heterogeneous distributed system}
-
+\begin{frame}[plain]
+ \begin{figure}
+ \centering
+ \includegraphics[height=.95\textheight]{iot}\\
+% {\tiny \url{https://freesvg.org/internet-world} (CC 0)}
+ \end{figure}
\end{frame}
-\begin{frame}{Tierless programming}
+\begin{frame}[plain]
+ \begin{figure}
+ \centering
+ \begin{tikzpicture}[node distance=3em,nodes={rectangle,draw,minimum width=12em, minimum height=3em}]
+ \begin{uncoverenv}<2->
+ \node (1) [] {presentation \begin{uncoverenv}<4->\includegraphics[height=2em]{phone}\end{uncoverenv}};
+ \node (2) [below=of 1] {application \begin{uncoverenv}<6->\includegraphics[height=2em]{laptop}\end{uncoverenv}};
+ \node (3) [below=of 2] {perception \begin{uncoverenv}<7->\includegraphics[height=2em]{lamp}\includegraphics<7->[height=2em]{magn}\end{uncoverenv}};
+
+ \draw [<->] (1) -- (2);
+ \draw [<->] (2) -- (3);
+
+ \draw [fill=white]
+ ([xshift=1em,yshift=-2em]1.south west)
+ -- ([xshift=1em,yshift=-1em]1.south west)
+ -- ([yshift=-1em,xshift=1em]1.south east)
+ -- ([xshift=1em]1.north east)
+ -- ([xshift=5em]1.north east)
+ -- node [draw=none,midway,sloped,below,yshift=-2pt] {\large network \begin{uncoverenv}<9->\includegraphics[height=2em,origin=c,angle=90]{mail}\end{uncoverenv}} ([xshift=5em]3.south east)
+ -- ([xshift=1em]3.south east)
+ -- ([yshift=1em,xshift=1em]3.north east)
+ -- ([xshift=1em,yshift=1em]3.north west)
+ -- ([xshift=1em,yshift=2em]3.north west)
+ -- ([yshift=2em,xshift=1em]3.north east)
+ -- ([yshift=-2em,xshift=1em]1.south east)
+ -- cycle;
+
+ \draw [densely dotted] (1.south) -- (2.north);
+ \draw [densely dotted] (2.south) -- (3.north);
+ \end{uncoverenv}
+
+ \node<1-2> (text) [draw=none,fit=(1) (2) (3),xshift=20em] {};
+ \node<1-2> [draw=none] at (text.center) {\includegraphics[width=11em]{iot}};
+ \node<3-8> (text) [fit=(1) (2) (3),xshift=20em] {};
+ \node<3> [draw=none,align=left] at (text.center) {%
+ \includegraphics[width=3em]{ff}%
+ \includegraphics[width=3em]{chrome}%
+ \includegraphics[width=3em]{phone}\\
+ \includegraphics[width=9em]{tablet}
+ };
+ \node<4-5> [draw=none,align=left] at (text.center) {%
+ \includegraphics[width=5.5em]{laptop}%
+ \includegraphics[width=5.5em]{cloud}\\
+ \begin{uncoverenv}<5>
+ \includegraphics[width=11em]{server}
+ \end{uncoverenv}
+ };
+ \node<6> [draw=none,align=left] at (text.center) {%
+ \includegraphics[width=5.5em]{mcu}
+ \includegraphics[width=5.5em]{pi}\\
+ \includegraphics[width=5.5em]{pir}
+ \includegraphics[width=5.5em]{stepper}
+ };
+ \node<7-8> [draw=none,align=left] at (text.center) {%
+ \includegraphics[width=4em]{wifi}\\
+ \includegraphics[width=11em]{gsm}\\
+ \begin{uncoverenv}<8>
+ \includegraphics[width=5.5em]{lora}%
+ \includegraphics[width=5.5em]{blte}
+ \end{uncoverenv}
+ };
+ \uncover<9->{%
+ \node [draw=none] at (text.center) {%
+ \includegraphics<10>[height=15em,width=11em,keepaspectratio]{spaghetti}%
+ \includegraphics<11->[height=15em,width=11em,keepaspectratio]{orchestra}
+ };
+ }
+ \draw<3> [line width=1.5pt,densely dotted](1.north east) -- (text.north west);
+ \draw<3> [line width=1.5pt,densely dotted](1.south east) -- (text.south west);
+ \draw<4-5> [line width=1.5pt,densely dotted](2.north east) -- (text.north west);
+ \draw<4-5> [line width=1.5pt,densely dotted](2.south east) -- (text.south west);
+ \draw<6> [line width=1.5pt,densely dotted](3.north east) -- (text.north west);
+ \draw<6> [line width=1.5pt,densely dotted](3.south east) -- (text.south west);
+ \draw<7-8> [line width=1.5pt,densely dotted]([xshift=3em]1.north east) -- (text.north west);
+ \draw<7-8> [line width=1.5pt,densely dotted]([xshift=3em]3.south east) -- (text.south west);
+ \end{tikzpicture}
+ \end{figure}
+ \uncover<9->{%
+ \begin{center}
+ \Huge \strut\only<-10>{Driven by software}\only<12>{Task-Oriented Programming}
+ \end{center}
+ }
\end{frame}
-\begin{frame}{Task-oriented programming (TOP)}
+\begin{frame}[shrink]
+ \begin{columns}[t]
+ \begin{column}{.4\textwidth}
+ \begin{block}{Task-oriented programming}
+ \begin{itemize}
+ \item Task
+ \begin{itemize}
+ \item Abstraction over work
+ \end{itemize}
+ \item Declarative programming
+
+ \begin{itemize}
+ \item Focus on \emph{What} and not \emph{How}.
+ \end{itemize}
+ \item<2-> mTask: Domain-specific language
+
+ \begin{itemize}
+ \item Constrained TOP language for small computers.
+ \end{itemize}
+ \item<4-> iTask: TOP for the web
+ \item<6-> Tierless programming
+ \begin{itemize}
+ \item Maintainability
+ \item Security
+ \item Interoperability
+ \end{itemize}
+ \end{itemize}
+ \end{block}
+ \end{column}
+ \begin{column}{.6\textwidth}
+ \begin{figure}
+ \begin{tikzpicture}[node distance=3em,nodes={rectangle,draw,minimum width=10em, minimum height=3em}]
+ \node (1) [] {presentation \includegraphics[height=1em]{phone}};
+ \node (2) [below=of 1] {application \includegraphics[height=1em]{laptop}};
+ \node (3) [below=of 2] {perception \includegraphics[height=1em]{lamp}\includegraphics[height=1em]{magn}};
+
+ \draw [<->] (1) -- (2);
+ \draw [<->] (2) -- (3);
+
+ \draw [fill=white]
+ ([xshift=1em,yshift=-2em]1.south west)
+ -- ([xshift=1em,yshift=-1em]1.south west)
+ -- ([yshift=-1em,xshift=1em]1.south east)
+ -- ([xshift=1em]1.north east)
+ -- ([xshift=4em]1.north east)
+ -- node (net) [draw=none,midway,sloped,below,yshift=-2pt] {\large network \includegraphics[height=1em,origin=c,angle=90]{mail}} ([xshift=4em]3.south east)
+ -- ([xshift=1em]3.south east)
+ -- ([yshift=1em,xshift=1em]3.north east)
+ -- ([xshift=1em,yshift=1em]3.north west)
+ -- ([xshift=1em,yshift=2em]3.north west)
+ -- ([yshift=2em,xshift=1em]3.north east)
+ -- ([yshift=-2em,xshift=1em]1.south east)
+ -- cycle;
+
+ \draw [densely dotted] (1.south) -- (2.north);
+ \draw<-2> [densely dotted] (2.south) -- (3.north);
+
+ \begin{uncoverenv}<3->
+ \node (mtask) [dotted,line width=3pt,fit={(3)},label={[fill=white]\large\bf mTask}] {};
+ \end{uncoverenv}
+ \begin{uncoverenv}<5->
+ \node (itask) [densely dotted,line width=2pt,inner sep=1em,fit={(1) (2) (3) ([xshift=5em]1.north east)},label=above:{\large\bf iTask}] {};
+ \end{uncoverenv}
+ \end{tikzpicture}
+ \end{figure}
+ \end{column}
+ \end{columns}
\end{frame}
\end{document}
repositories / phd-thesis.git / commitdiff
