Design Mockups

Before begging to code the application I decided that it would be best to design some example  mockups of what I would like the interface to include. 

Below is the homepage, I decided to keep it plain and simple as the multimodal sections will contain all of the information and functions that will fill the screen. 

The image below is still the homepage with a hover menu allocating the various functionalities of the application. This hover menu keeps the overall appearance tidy and clatter free. An issue with this design is that there is no form of icon that allows the user to identify the hover menu, an arrow pointing downwards will identify the further features. 

The image below displays the camera function, I implemented a grid to represent the area that will be used to capture images. I also implemented a triangle at the top of the screen in order for the users to identify the hover menu.

Part of the multimodal section includes the use of a notepad to record notes and memos. Below is a small structure of the notepad. Within it I have incorporated a  hover menu with sub menu categories, an example of it is the "+" sign that signifies a new document.