Add HCI to report's design section

mcttn22 · Jan 7, 2024 · 3023b77 · 3023b77
1 parent 3f1102e
commit 3023b77
Show file tree

Hide file tree

Showing 8 changed files with 53 additions and 2 deletions.
diff --git a/project-report/project-report.pdf b/project-report/project-report.pdf
diff --git a/project-report/src/images/home-frame-design.png b/project-report/src/images/home-frame-design.png
diff --git a/project-report/src/images/hyper-parameter-frame-design.png b/project-report/src/images/hyper-parameter-frame-design.png
diff --git a/project-report/src/images/load-model-frame-design.png b/project-report/src/images/load-model-frame-design.png
diff --git a/project-report/src/images/testing-frame-design.png b/project-report/src/images/testing-frame-design.png
diff --git a/project-report/src/images/training-frame-1-design.png b/project-report/src/images/training-frame-1-design.png
diff --git a/project-report/src/images/training-frame-2-design.png b/project-report/src/images/training-frame-2-design.png
diff --git a/project-report/src/latex/design.tex b/project-report/src/latex/design.tex
@@ -121,9 +121,60 @@ \subsection{Queries}
     \end{minted}
 \end{itemize}
 
-\subsection{Human-Computer Interaction TODO}
+\subsection{Human-Computer Interaction}
 
-- Labeled screenshots of UI
+Here are the designs of each tkinter frame in the User Interface:
+
+\begin{itemize}
+    \item Home Frame design:
+        \begin{figure}[h!]
+        \centering
+        \includegraphics[width=0.7\textwidth]{./project-report/src/images/home-frame-design.png}
+        \end{figure}
+
+    \pagebreak
+
+    \item Hyper-Parameter Frame design:
+        \begin{figure}[h!]
+        \centering
+        \includegraphics[width=0.7\textwidth]{./project-report/src/images/hyper-parameter-frame-design.png}
+        \end{figure}
+
+    \pagebreak
+
+    \item Training Frame design:
+        \begin{itemize}
+            \item During training, the following is displayed on the Training Frame:
+                \begin{figure}[h!]
+                \centering
+                \includegraphics[width=0.7\textwidth]{./project-report/src/images/training-frame-1-design.png}
+                \end{figure}
+
+            \pagebreak
+
+            \item Once training has finished, the following is displayed on the Training Frame:
+                \begin{figure}[h!]
+                \centering
+                \includegraphics[width=0.7\textwidth]{./project-report/src/images/training-frame-1-design.png}
+                \end{figure}
+            \end{itemize}
+
+    \pagebreak
+
+    \item Load Model Frame design:
+        \begin{figure}[h!]
+        \centering
+        \includegraphics[width=0.7\textwidth]{./project-report/src/images/load-model-frame-design.png}
+        \end{figure}
+
+    \pagebreak
+
+    \item Test Frame design:
+        \begin{figure}[h!]
+        \centering
+        \includegraphics[width=0.7\textwidth]{./project-report/src/images/testing-frame-design.png}
+        \end{figure}
+\end{itemize}
 
 \subsection{Hardware Design}