ID-10: Aufgabenblatt bearbeitet

This commit is contained in:
Jim Martens 2014-07-06 21:46:41 +02:00
parent bd09c1508b
commit 3f0ae4ba3a
5 changed files with 108 additions and 0 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.4 MiB

BIN
id/blatt10/ID-GOG-404.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 282 KiB

BIN
id/blatt10/ID-Gimp.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 241 KiB

54
id/blatt10/hci.sty Executable file
View File

@ -0,0 +1,54 @@
\usepackage[ngerman]{babel}
\usepackage{geometry}
\usepackage{fancyhdr}
\usepackage{amsmath}
\usepackage{amssymb}
\usepackage{listings}
\usepackage{bold-extra}
\usepackage{ifpdf}
\usepackage{pgfplots}
\usepackage{tikz}
\usetikzlibrary{automata,trees,matrix,fadings,calc,positioning,decorations.pathreplacing,arrows,decorations.markings}
\geometry{left=2.5cm,right=2.5cm,top=2.0cm,bottom=2.0cm}
\parindent0mm
\pagestyle{fancy}
\ifpdf
\pdfinfo {
/Author (\autor)
/Title (Interaktionsdesign I \blatt)
}
\fi
\newcommand{\betreuer}{Prof. Dr. Frank Steinicke, Dr. Gerd Bruder, Dr. Sven Magg}
\renewcommand{\figurename}{Abbildung}
\newcommand{\kopf}{
\Large
\centerline{\textbf{Human-Computer Interaction}}
\vspace*{0.1\baselineskip}
\large
\centerline{\textbf{Bearbeitung zu \emph{Interaktionsdesign}, SoSe 2014}}
\vspace*{0.1\baselineskip}
\normalsize
Betreuer:~\betreuer\\
Autor(en):~\autor~\hfill~{\"U}bung~\blatt \\
\rule{\textwidth}{.25pt}
}
\headsep.5cm
\renewcommand{\headrulewidth}{.25pt}
\renewcommand{\footrulewidth}{.25pt}
\renewcommand{\labelenumi}{(\alph{enumi})}
\renewcommand{\labelenumii}{(\roman{enumii})}
\newcommand{\aufgabe}[1]{\section*{Aufgabe #1}}
\newcommand{\sourcecode}[1]{\lstinputlisting[caption={#1},label=lst:#1,language=C++,frame=single,showstringspaces=false,basicstyle={\ttfamily \small},breaklines=true,breakatwhitespace=true,tabsize=4,numbers=left,stepnumber=5,numberfirstline=false,firstnumber=1,numberstyle={\scriptsize}]{#1}}

View File

@ -0,0 +1,54 @@
\documentclass[a4paper,10pt]{scrartcl}
% Hier die Nummer des Blatts und Autoren angeben.
\newcommand{\blatt}{10}
\newcommand{\autor}{Jim Martens}
\usepackage{hci}
\usepackage[utf8]{inputenc}
\usepackage{float}
\usepackage[official]{eurosym}
\usepackage[parfill]{parskip}
\begin{document}
% Seitenkopf mit Informationen
\kopf
\renewcommand{\figurename}{Figure}
\aufgabe{1}
\subsection*{Website}
Bei der Website habe ich mich für die 404-Errorseite von gog.com entschieden, da bei dieser nicht all zu viel vorhanden ist und damit eine Analyse halbwegs gerechtfertigt erscheint.
Oben in der Menüleiste kann man das Logo sehen, welches bei Klick darauf wieder zur Startseite führt. Dies entspricht damit mehreren Pattern (Escape Hatch, Pyramid). Außerdem ist die gesamte Menüleiste ein ActionPanel, da es stets am oberen Rand verbleibt und damit immer zu sehen ist.
Der Hauptbereich der Seite entspricht einer CenterStage, da alles Wesentliche in der horizontalen und vertikalen Mitte angeordnet ist. Die Suche in der oberen Leiste implementiert AutoCompletion (hier nicht zu sehen).
\begin{figure}[htp]
\includegraphics[scale=0.35]{ID-GOG-404}
\end{figure}
\subsection*{Desktop-Anwendung}
Bei der Desktopanwendung habe ich mich für Gimp entschieden.
Leicht zu erkennen sind die Pattern Canvas Plus Palette und Movable Panels. Ebenso lassen sich Module Tabs in dem Panel auf der rechten Seite erkennen.
In jenem Panel können auch zwei ButtonGroups erkannt werden.
Am unteren Rand kann eine SpinBox, sowie eine N-Item Drop-Down-List gesehen werden.
\begin{figure}[htp]
\includegraphics[scale=0.35]{ID-Gimp}
\end{figure}
\newpage
\subsection*{Mobile Anwendung}
Bei dieser Anwendung kann am oberen Rand eine ButtonGroup sehen. Außerdem wird die Sequence Map verwendet, indem man zurück zur Reiseauskunft navigieren kann. Zudem gibt es eine ButtonGroup in der unteren Leiste.
\begin{figure}[htp]
\includegraphics[scale=0.40]{ID-DBNavigator}
\caption{Quelle: http://www.hacon.de/hafas-en/mobil/HaCon\%20iPad\%20Mockup\%201.png}
\end{figure}
\end{document}