Studio Brief 1 - D&AD Crimewatch - App Mock ups

Following on from my initial sketches of the layout of the mobile app. I began to mock up the sketches into a digital form to start to get an understanding of how the app might look in a realistic style.

This design is for the video section. The video section will showcase a list of videos that the user can scroll through horizontally. The videos will be separated into two categories. "Top crimes in your area" & "Crimes that need your help" these categories have been created to be personal that encourages the user to want to engage with the videos and not think of the video section as uninteresting or forced. The first category is based of the user's location and where they would be most valuable due to their knowledge of that area. The next category encourages the user to investigate the unsolved crimes. Using language like "Crimes that need your help" suggests that the user is important and of value to Crimewatch.

Overall the user would use this area to get to the other 360 videos which will prolong the users time solving crimes. The design also incorporates horizontal scrolling because the horizontal scrolling is more natural for their fingers instead of maximising their reach to keep scrolling vertically. 

This design showcases the paused screen. Essentially the user would proceed onto the 360 video and then pause the reconstruction by tapping on the screen which will bring up the pause button to stop the video. Many different design features and elements will then appear on the screen that will allow the user to understand and engage with the crime. On the right hand side will be other 360 footage but from different areas of the crime. For example the crime could take place in three locations so this allows the user to investigate all of the crime scene areas without taking the unnecessary step to go searching for the other crime scene areas. Lastly, it gives the user everything they need that is one tap away, giving them the best opportunity to focus their efforts on trying to solve the crime.

The next feature is the 'help' or 'how to' button which will allow the user to understand how the 360º feature works. If the user is stuck or simply doesn't know what is required off them, then this button will tell them the how to work the 360º footage.

This design showcases the 'my investigation' section. This section is customised to their preferences. It's a place where the user can use as their hub, there go to place to review their investigation. This section displays the users recently viewed videos and two other sections. One section that allows the user to make notes, this would be beneficial if the user wants to quickly type out something they've seen in the crime scene or if they want to quickly draw an image showing how they think the crime happened. The next section allows the user to save images from the 360 video to a folder where they can review them later.

Overall this section gives the user a personal home page where they can collect and correlate information from the crime, It acts as a crime lab where the user feels apart of the process of the crime and not just a person viewing a videos, It's an experience for the user and that's what the design is achieving.

This design is the same as the one above but with the expandable sections. The 'notes' and 'saved images' are both expandable by tapping the boxes. The reason for the expandable boxes are to limit the information on the screen. I didn't want to over power the section by adding loads of irrelevant information as this will only frustrate the user as they would have to keep scrolling down further to reach the info they want to read. This way it allows the user chose what he wants to view, giving the overall interface a clean and professional look, which reflects the same modern style of the BBC and Crimewatch. As you can see from the above design the 'notes' box has expanded giving you the option to write a message and view previous messages by using the drop down arrow.

This design showcases what the user will see when they tap on the 'help' or 'how to' button. It will demonstrate how to use the 360º feature. 360º video is still a fairly new concept in the technology industry, therefore not a lot of people would have any experience using it, so it was important to give the user an opportunity to understand the concept around 360 video, this will only improve the user journey and gaining the users loyalty if they new the ins and outs of the app within a short period.

The info graphics articulates the different ways you can interact with the 360 video, either by tilting or touching the screen. The right hand side suggests how can the user would use the interactive feature where they can highlight and save a certain area of the screen

This design showcases the home page of the app. The first page the user will land on, the home page will allow the user to navigate their way around the app by using the navigation. The navigation has been stripped down to the relevant sections that are most beneficial to the video app. I didn't think it would of been effective if I copied word by word from the desktop site as the app isn' the Crimewatch website in it's entirety but only specialises in the 360º video feature.

The home page also includes the 'LIVE' button which the user can watch Crimewatch live from the app and will then be giving the option to solve the crime while watching the live broadcast live. This breaks down the traditional barrier between broadcasts and digital and links them both by integrating both forms of mediums. Along side the "Live' button will sections such as 'unsolved crimes' and a section where newly updated crimes will appear along the side. The language used for both of these section makes the user feel included and that they are apart of the investigation and not just a member of the public using the Crimewatch app. Lastly, the top right corner will be the profile section, this section will give the user access to their profile and 'my investigation' section where they can view saved images and notes.

This section is to demonstrates the crime information page. A place where the user can quickly see information about the crime and to pick and choose the information they want to see with the expandable sections which include 'facts' and 'mugshots'.

This section of the app gives the user all the contact details they would need to contact crimewatch, which also includes a contact form so the user can contact or message Crimewatch on the app without having to go to an external website or email application.

This screen demonstrates the action the app would do if the user finds something of interest in the crime scene. For the example above the user has spotted a street sign which could be an important clue that could jog the users memory of that day or location. Once a certain point of a crime scene catches the eyes of the user then they hold their finger on that area and the app would highlight that point and give the user three options. The three options include saving the image, sharing the image or calling directly to Crimewatch to report the find.

The reason for this feature is to make investigation more personal to the user, getting them involved in crime then ever before. It's a way that the user can quickly work their way around the crime scene as quickly as possible. It feels more personal, as if you are really in control.