core.tex 9.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336
  1. \documentclass[aspectratio=169]{beamer}
  2. % get rid of clickable beamer buttons
  3. \beamertemplatenavigationsymbolsempty
  4. % parse most utf-8 correctly
  5. \usepackage[utf8]{inputenc}
  6. \usepackage[ngerman]{babel}
  7. % better graphics
  8. \usepackage{graphicx}
  9. % beamer settings
  10. \title{snailmail}
  11. \author{Noah Vogt \& Simon Hammer}
  12. \date{5 Februar 2022}
  13. \institute{Gymnasium Kirschgarten}
  14. \usetheme{Copenhagen}
  15. \usepackage{varwidth}
  16. \usepackage{graphicx,calc}
  17. \newlength\myheight
  18. \newlength\mydepth
  19. \settototalheight\myheight{Xygp}
  20. \settodepth\mydepth{Xygp}
  21. \setlength\fboxsep{0pt}
  22. \newcommand*\inlinegraphics[1]{
  23. \settototalheight\myheight{Xygp}
  24. \settodepth\mydepth{Xygp}
  25. \raisebox{-\mydepth}{\includegraphics[height=\myheight]{#1}}%
  26. }
  27. % for code snippits
  28. \usepackage{listings}
  29. \usepackage{color}
  30. \definecolor{dkgreen}{rgb}{0,0.6,0}
  31. \definecolor{gray}{rgb}{0.5,0.5,0.5}
  32. \definecolor{mauve}{rgb}{0.58,0,0.82}
  33. \definecolor{background}{rgb}{0.36,0.36,0.36}
  34. \lstset{
  35. numbersep=3pt,
  36. keywordstyle=\color{blue},
  37. commentstyle=\color{dkgreen},
  38. stringstyle=\color{mauve},
  39. breaklines=true,
  40. numbers=left,
  41. numberstyle=\scriptsize\color{black},
  42. frame=none,
  43. basicstyle = \small\ttfamily,
  44. breaklines=true
  45. breakatwhitespace=false,
  46. columns=flexible,
  47. xleftmargin=0.5cm,framesep=8pt,framerule=0pt,
  48. aboveskip=3mm,
  49. belowskip=3mm,
  50. }
  51. % Package to use videos
  52. \usepackage{movie15}
  53. %% Putting the background image in the frames
  54. \usebackgroundtemplate{%
  55. %\vbox to \paperheight{\hfil\hbox to \paperwidth{\hfil\includegraphics[width=1\paperwidth]{../../logo/version2grey.pdf}\hfil}\vfil}
  56. \hspace{5.2cm}\includegraphics[width=0.8\paperwidth]{../logo/version2grey.pdf}
  57. }
  58. \begin{document}
  59. \maketitle
  60. \begin{frame}{Inhaltsverzeichniss}
  61. INSERT TOC HERE
  62. \end{frame}
  63. %\section{Vorwort}
  64. \begin{frame}{Motivation}
  65. \begin{varwidth}{.5\textwidth}
  66. \begin{figure}
  67. \centering
  68. \includegraphics[width=.9\textwidth]{media/macbook.jpg}
  69. \end{figure}
  70. \end{varwidth}
  71. \hfill
  72. \begin{varwidth}{.5\textwidth}
  73. \begin{itemize}\pause
  74. \item allgemeines Interesse\pause
  75. \item fehlender Edubs-Mail-Client\pause
  76. %\item fehlender Edubs-Mail-Client\inlinegraphics{media/baslerstab-1.jpg}\pause
  77. \item persönliche Bedürfnisse
  78. \end{itemize}
  79. \end{varwidth}
  80. \end{frame}
  81. %\subsection{Ziele}
  82. \begin{frame}{Ziele}
  83. \begin{varwidth}{.5\textwidth}
  84. \begin{figure}
  85. \centering
  86. \includegraphics[width=.8\textwidth]{../logo/version3d.png}
  87. \caption{snailmail Logo}
  88. \end{figure}
  89. \end{varwidth}
  90. \hfill
  91. \begin{varwidth}{.5\textwidth}
  92. \begin{itemize}\pause
  93. \item Basisfunktionen \inlinegraphics{media/mail.png} \pause
  94. \item Account Manager\inlinegraphics{media/business.png}\pause
  95. \item Design Prinzipien\inlinegraphics{media/paintbrush.png}\pause
  96. \item Schnelligkeit\inlinegraphics{media/run.png}\pause
  97. \item Mobil und Modern\inlinegraphics{media/mobile.png}\pause
  98. \item Einstellungen\inlinegraphics{media/settings.png}
  99. \end{itemize}
  100. \end{varwidth}
  101. \end{frame}
  102. \begin{frame}{Warum Java}
  103. \begin{varwidth}{.3\textwidth}
  104. \begin{figure}
  105. \centering
  106. \includegraphics[height=.8\textheight]{media/java-logo.png}
  107. \end{figure}
  108. \end{varwidth}
  109. \hfill
  110. \begin{varwidth}{.6\textwidth}
  111. \begin{itemize}\pause
  112. \item war offizielle Sprache für Android Apps\pause
  113. \item abgelöst von Kotlin (seit 2019)\pause
  114. \item EF Informatik
  115. \end{itemize}
  116. \end{varwidth}
  117. \end{frame}
  118. % TODO: consider using external player
  119. \begin{frame}{Demo}
  120. \begin{figure}[h]
  121. \centering
  122. \includemovie[toolbar]{120pt}{190pt}{media/cutaccountViewer.mp4}
  123. \includemovie[toolbar]{90pt}{90pt}{media/draftsExample.mp4}
  124. \end{figure}
  125. \end{frame}
  126. \begin{frame}{Was alles drin ist}
  127. \begin{figure}[h]
  128. \includegraphics[height=.8\textheight]{media/emailViewer.jpg}
  129. \pause
  130. \includegraphics[height=.8\textheight]{media/emailWriter.jpg}
  131. \pause
  132. \includegraphics[height=.8\textheight]{media/accountManager.jpg}
  133. \pause
  134. \includegraphics[height=.8\textheight]{media/moreSettings.jpg}
  135. \end{figure}
  136. \end{frame}
  137. \begin{frame}{Allgemeine App-Struktur}
  138. \begin{varwidth}{.3\textwidth}
  139. \pause
  140. \begin{figure}
  141. \centering
  142. \includegraphics[height=.7\textheight]{../maturText/media/AppStructure.png}
  143. \end{figure}
  144. \end{varwidth}
  145. \hfill
  146. \begin{varwidth}{.5\textwidth}
  147. \begin{itemize}\pause
  148. \item Das User Interface \pause
  149. \item Die Server Connection \pause
  150. \item Die Database \pause
  151. \item Schnelligkeit\inlinegraphics{media/run.png}\pause
  152. \item Mobil und Modern\inlinegraphics{media/mobile.png}\pause
  153. \item Einstellungen\inlinegraphics{media/settings.png}
  154. \end{itemize}
  155. \end{varwidth}
  156. \end{frame}
  157. \begin{frame}{Database}
  158. \begin{block}{allgemein}
  159. \end{block}
  160. \begin{block}{in der app}
  161. \end{block}
  162. \end{frame}
  163. \begin{frame}{Email Connection}
  164. \centering
  165. \includegraphics[width=.8\textwidth]{../maturText/media/connection-diagram.png}
  166. \end{frame}
  167. \defverbatim[colored]\makeset{
  168. \lstset{language=python}
  169. \begin{lstlisting}
  170. def sendStarttls(host, sendingMail, receivingMail, password, message="",
  171. subject="", port=587, cc=[], bcc=[]):
  172. context = ssl.create_default_context()
  173. if type(cc) is not str:
  174. cc = ",".join(cc)
  175. if type(bcc) is not str:
  176. bcc = ",".join(bcc)
  177. utf8Message = ("Subject: " + subject + "\nCC: " + cc + "\nBCC: " + bcc +
  178. "\n\n" + message)
  179. decoded = utf8Message.encode('cp1252').decode('utf-8')
  180. with smtplib.SMTP(host, port) as serverConnection:
  181. serverConnection.starttls(context=context)
  182. serverConnection.login(sendingMail, password)
  183. serverConnection.sendmail(sendingMail, receivingMail, decoded)
  184. \end{lstlisting}
  185. }
  186. \begin{frame}{Sendung einer Email}
  187. \makeset
  188. \end{frame}
  189. \begin{frame}{Was haben wir wirklich selber gemacht?}
  190. \centering
  191. \includegraphics[height=.8\textheight]{media/self.jpeg}
  192. \end{frame}
  193. \begin{frame}{Room}
  194. INSERT ABSTRACTION LAYERS
  195. \end{frame}
  196. \begin{frame}{Material Design}
  197. \begin{varwidth}{.5\textwidth}
  198. \begin{figure}
  199. \centering
  200. \includegraphics[width=\textwidth]{media/material-design-in-action.jpg}
  201. \end{figure}
  202. \end{varwidth}
  203. \hfill
  204. \begin{varwidth}{.4\textwidth}
  205. \includegraphics[width=\textwidth]{media/material-android.png}
  206. \begin{itemize}\pause
  207. \item GUI-Framework\pause
  208. \item beliebt\pause
  209. \item in Google Apps
  210. \end{itemize}
  211. \end{varwidth}
  212. \end{frame}
  213. \begin{frame}{Bugs}
  214. INSERT BUGS HERE
  215. \end{frame}
  216. %:TODO Ich han eig gmeint Bilder us de Apps. Also wenn du seisch es isch zu überlade das me das in de Apps seht und ned s Logo fo de App
  217. \begin{frame}{Inspiration Design}
  218. \begin{varwidth}{.3\textwidth}\pause
  219. \begin{figure}
  220. \centering
  221. \includegraphics[width=.9\textwidth]{media/gmail-logo.png}
  222. \end{figure}
  223. \end{varwidth}
  224. \hfill
  225. \begin{varwidth}{.3\textwidth}\pause
  226. \begin{figure}
  227. \centering
  228. \includegraphics[width=.9\textwidth]{media/k9-logo.png}
  229. \end{figure}
  230. \end{varwidth}
  231. \hfill
  232. \begin{varwidth}{.3\textwidth}\pause
  233. \begin{figure}
  234. \centering
  235. \includegraphics[width=.9\textwidth]{media/fairmail-logo.png}
  236. \end{figure}
  237. \end{varwidth}
  238. \end{frame}
  239. \begin{frame}{Resultate}
  240. \begin{itemize}\pause
  241. \item User Interface\pause
  242. \item chaquopy\pause
  243. \item Funktionalität\pause
  244. \item abschliessend
  245. \end{itemize}
  246. \end{frame}
  247. \begin{frame}{Was wir gelernt haben}
  248. \begin{varwidth}{.5\textwidth}
  249. \begin{figure}
  250. \centering
  251. \includegraphics[width=.95\textwidth]{media/monetary-success.jpeg}
  252. \end{figure}
  253. \end{varwidth}
  254. \hfill
  255. \begin{varwidth}{.5\textwidth}
  256. \begin{itemize}\pause
  257. \item Java\inlinegraphics{media/java-only-logo.png}\pause
  258. \item Android Apps\inlinegraphics{media/android-robot.png}\pause
  259. \item Android Studio\inlinegraphics{media/android-studio-logo.png}\pause
  260. \item Database \& SQL\inlinegraphics{media/database.png}\pause
  261. \item Gradle\inlinegraphics{media/gradle.png}\pause
  262. \item kryptografisches Signieren\inlinegraphics{media/key.png}
  263. \end{itemize}
  264. \end{varwidth}
  265. \end{frame}
  266. % TODO: WAS GUT / SCHLECHT LIEF
  267. \begin{frame}{persönliche Meinung}
  268. \begin{varwidth}{.4\textwidth}
  269. \begin{itemize}\pause
  270. \item VCS $\rightarrow$ Git $\rightarrow$ GitHub\pause
  271. \item Treffen \& Absprachen \& VoIP\pause
  272. \item texdiary
  273. \end{itemize}
  274. \end{varwidth}
  275. \hfill
  276. \begin{varwidth}{.4\textwidth}
  277. \begin{itemize}\pause
  278. \item fehlende Erfahrung\pause
  279. \item Java Libraries\pause
  280. \item persönlicher \& beruflicher Vorteil
  281. \end{itemize}
  282. \end{varwidth}
  283. \end{frame}
  284. \begin{frame}{Zukunft: Wie geht es weiter?}
  285. \begin{figure}
  286. \centering
  287. \includegraphics[height=.7\textheight]{media/github-repo.jpg}
  288. \end{figure}
  289. \begin{itemize}
  290. \centering
  291. \item https://github.com/noahvogt/snailmail
  292. \item https://git.noahvogt.com/me/snailmail
  293. \end{itemize}
  294. \end{frame}
  295. \end{document}