Media Mapper Mobile Iteration #10 updated mockups

Transcription

1 Topic Media Mapper Mobile Iteration #10 updated mockups By Martha Roden November 14, 2013 Quick Overview 2 What Does MMM Do? (diagram) 3 Startup and Home Screens 4 Home > GPS Details & Point of Interest screen 5 Home > GPS Details & Point of Interest > buttons 6 Page Home > Setup > GPS screen and pop-up windows 7-12 Home > Setup > Proj screen 13 Home > Setup > Log screen 14 Home > Setup > Camera screen and pop-up windows Home > Setup > Intervalometry and pop-up windows 18 Home > Setup > Google Earth screen and pop-up windows Home > Project Collection screen 21 Home > Project Collection > Collection Details 22 Home > Project Collection > Select Category 23 Home > Photos, Videos, and Audio screen 24 = new or changed mockups 1

2 Quick Overview My initial UI evaluation examined the home screen and all screens accessed by the large buttons on that screen (and by large buttons on the Task screen), as well as screens accessed from the expanded menu produced by the ellipses at the bottom of the screen. 1. After viewing the screens, I recommend the following which I have implemented in the mockups: a. Use a layout different from than large rectangular buttons ( main menu items ) for a fresher, more modern appearance. b. Use icons for main menu items to call attention to them and make them look clickable. c. Develop a color scheme for dialogs that brands the application as a Red Hen app red, gray, black, white. d. Left-align labels, align all text entry fields, and align pull-down menus for a less cluttered look. e. Improve task flow where possible so users can perform their tasks faster. f. Improve menu items names where necessary. g. If possible, group tasks into categories and display as many of those categories as possible on the Home screen to help user grasp the wide range of tasks available to them and access them more quickly. h. Provide pop-up Help screens when there is not room for explanatory text in a readable font. 2. The mockups in this slide set provide sample screens to demonstrate my ideas. As a starting point, they focus only on the: Home screen GPS Details & Point of Interest screen Setup screen with all its various tabs Project collection screens 3. The mockups also give you an idea how we might group tasks associated with photos and videos. 2

3 What Does MediaMapper Mobile Do? Internal GPS Point of Interest Audio Notes Photos Videos Field Forms Sensor Data GPS Track Logs Capture Transfer files via USB Files External GPS DSLR Camera Laser Range Finder Upload photos Bluetooth Blue2CAN Download photos via USB OTG Bluetooth Receive Media Mapper Mobile (MMM) Transfer 3G/4G WiFi Share Control Upload KMZ files and GPS track logs 3G/4G WiFi 3G/4G WiFi Send s 3G/4G WiFi Connect to MMM and download files to PC Upload photos, videos, audio notes Social Media and Others Web Browser MediaMapper Server Google Earth PC 3

4 Startup and Home screens APPS WIDGETS Media Mapper Mobile Experts in Geo-Tagged Multimedia Media Mapper Mobile Home GPS Details & Points of Interest Setup Track Logs Photos, Videos, and Audio Project Collection Forms External Camera Control About Help Turn on the mobile device and go the the Apps screen; click the Media Mapper Mobile icon. 1 2 The MMM Home page appears. 4

5 Home > GPS Details & Points of Interest Media Mapper Mobile Satellite Details window appears (see page 6) GPS Details & Points of Interest UTC Time: 20:56:10 09/12/02013 Latitude: S Longitude: E Altitude: 20.1m Click to log Point of Interest: POI Satellite Signals Track Log Loud beep is heard and point of interest is logged. Track Log Details window appears (see page 6) Collection Details Record Audio Day/Night Mode 5

6 Home > GPS Details & Points of Interest > buttons 3 4 Satellite Details Track Log Details GPS Device Fix: #1 2D Satellites Device in #2 View: 09 Satellites Device in #3 Use: 07 Accuracy: H V 10 P 0 Signal Strength: Close User/Collector Device #1 Initials: Device #2 Country Code: Device #3 Track Log ID: File Name: Folder: View All Track Logs View Track Logs window appears with list of track logs to choose from. NOTE: The bottom of GPS Details & Points of Interest screen expands to display keyboard. 6

7 Home > Setup > GPS Media Mapper Mobile Home GPS Details & Points of Interest Set Up Track Logs Photos, Videos, and Audio Project Collection Forms External Camera Control About Help Media Media Mapper Mapper Mobile Mobile Set Up GPS Proj Log Camera Intervalometry Google Earth GPS, Bluetooth, and Services Use External Bluetooth GPS GPS Device: Status: Connect to Blue2Can Status: Connect to Bluetooth CAN Status: Connect to Laser Range Finder LRF: Status: 2 Set Up screen appears with GPS tab in the foreground. 3 Select Devices window appears (see next page) Connect to HTTP Web Server 1 Select Setup from Home screen. Port Number: Status: Connect to MediaMapper Server Configure Server 4 Configure MediaMapper Server window appears (see next page) 7

8 Home > Setup > connection and configuration pop-up windows 3 Home > Setup > GPS > GPS Device 4 Home > Setup > GPS > LRF Select Device Home > Setup > GPS > Configure Server Configure MediaMapper Server 7 Available Devices Device #1 Device #2 Device #3 Pair Devices Add Manually Add Bluetooth Device Manually Press the Help buttons to get more information. See Windows #5, #6, and #7 on the next page. 5 6 GPS, User Bluetooth, Name: and Services Password: Connect to Bluetooth CAN Server: Status: Port Connect to Laser Range Finder Number: LRF: Work Group: Status: Connect Allow photos to Server with duplicate GPS Port Automatically Number: upload photos to Status: MMS Prompt before uploading to MMS Connect to MediaMapper Server Only Configure use WIFI Server connection Set image size for upload: Enter 17-digit hexadecimal code for Bluetooth device: (Separate digits by colons, for example, A1:B2:C3:D4:E5:F6) 8

9 Home > Setup > connection and configuration pop-up windows 3 Home > Setup > GPS > GPS Device 4 Home > Setup > GPS > LRF Select Device Home > Setup > GPS > Configure Server Configure MediaMapper Server 7 Available Devices Device #1 Device #2 Device #3 Pair Devices Add Manually Add Bluetooth Device Manually Press the Help buttons to get more information. See Windows #5, #6, and #7 on the next page. 5 6 GPS, User Bluetooth, Name: and Services Password: Connect to Bluetooth CAN Server: Status: Port Connect to Laser Range Finder Number: LRF: Work Group: Status: Connect Allow photos to Server with duplicate GPS Port Automatically Number: upload photos to Status: MMS Prompt before uploading to MMS Connect to MediaMapper Server Only Configure use WIFI Server connection Set image size for upload: Enter 17-digit hexadecimal code for Bluetooth device: (Separate digits by colons, for example, A1:B2:C3:D4:E5:F6) 9

10 Help screen: Pairing 5a Scroll down to see the rest (see next page) More About Pairing If you do not see the device you want to select, it may require pairing. Pairing is the process of identifying an external device to your Android device. To determine if pairing is required for use, check the documentation provided by the device manufacturer. When pairing is required, you must enter a 4-digit pass-key (or PIN number) provided by the manufacturer (usually specified in the documentation). You typically have to pair the device only once, and from then on the Android operating system remembers the paired device. 1. From your Android device (phone or tablet), click Apps. 2. From the Apps screen, select Settings. a. From the Settings screen, look for the Wireless and Networks category. b. Beneath that category, make sure that Bluetooth is ON. 3. Select Bluetooth to view the Bluetooth screen. a. Power on the Bluetooth device and make sure it is located within a few meters of the Android device. Also make sure the Bluetooth and Android devices have charged batteries for extended use. b. From the Bluetooth screen, press the Android device name until this message appears beneath it: Visible to all nearby Bluetooth Devices. Close Help Screen for Pair button. 10

11 Help screen Pairing (cont d) 5b More About Pairing 4. At the top-right corner of the Bluetooth screen, press Search for Devices. a. Wait for the name of the Bluetooth device to appear in the list of Available Devices and select it.. b. When prompted, enter the 4-digit pass key for the Bluetooth device. c. Once the pass key is accepted, the device name will appear in the Paired Devices list. The device is now ready to use with MediaMapper Mobile. 5. If you performed the pairing by originally clicking the Pair button in the Select Device screen, you will be automatically returned to MediaMapper Mobile. Otherwise, manually exit the Android Settings screen and return to MediaMapper Mobile. 6. Use the MediaMapper Mobile Settings screens to select and use the paired Bluetooth device as needed, such as for an external GPS Receiver or Laser Range Finder. 7. Power off the Bluetooth device when you finish using it. Make sure to stop access to the device by unchecking its option in the MediaMapper Mobile Setup screens. This ensures that MediaMapper Mobile does not continue trying to re-establish communication with the Bluetooth device, causes unnecessary battery depletion. Note: It is possible to change the default name of Bluetooth devices when using the Android device; however, we recommend you leave the device name as is when using Media Mapper Mobile. In some cases this allows Media Mapper Mobile to recognize the type or model of the Bluetooth device with which it is communicating. Close 11

12 Help screens: Add Manually and More About Devices 6 More About Adding Manually Some Bluetooth devices do not broadcast their name and address details, in which case you need to add the device address #Manually. This allows you to enter the hexadecimal code for the device. Close Help Screen for Add Manually button. This link takes the user to the Add Bluetooth Device Manually screen (page 8) where the user can actually enter the hexadecimal code. 7 More About Devices Selecting a device is only required if you want MediaMapper Mobile to communicate with an external GPS unit, Laser Range Finder, or other Android device. Note: Do NOT select a device if you want MediaMapper Mobile to communicate with Blue2Can devices or with a Bluetooth sensor, such as SensorTag.. If you do not see the device you want to select, you may need to add it #Manually or #Pair it. Close Help Screen for Add Devices screen. These links take the user to the Add Bluetooth Device Manually screen (this page) and the Android Bluetooth screens (pp. 9-10). 12

13 Home > Setup > Proj Media Media Mapper Mapper Mobile Mobile Set Up 1 Press Setup from Home screen. Then press Proj tab GPS Proj Log Camera Intervalometry Google Earth Project Collection Default Project Collection Definitions foi_pipeline.xml Prompt to save image 2 Select Default Project Collection Select the xml file containing the appropriate feature definitions for the type of data you will be collecting. foi.xml foi_pipeline.xml foi_right-of-way.xml 13

14 Home > Setup > Log Media Media Mapper Mapper Mobile Mobile Set Up GPS Proj Log Camera Intervalometry Google Earth 1 Press Setup from Home screen. Then press Log tab. Data Logging Enable GPS NMEA log Enable GPX log Enable.RHPROJ Re-create last.rhproj Enable Sensor log Sensor Frequency: Sensor Log Frequency: (ms) Normal Recreate last.rhproj Re-create.RHPROJ for last project collection? Fast Normal Slow Yes Sensor Frequency No 4 Keyboard appears at bottom of screen 14

15 Home > Setup > Camera Media Media Mapper Mapper Mobile Mobile Set Up GPS Proj Log Camera Intervalometry Google Earth 1 Press Setup from Home screen. Then press Camera tab for Camera Settings screen to appear. Camera Settings Image Quality: (0 100) Image Effects: Image Size: Flash Mode: Focus Mode: Image White Balance: Zoom (0-28): 95 foi.xml None 1280 x 720 Auto Auto Auto Numbered windows appear on the next page. Image Comment: Image Night Shot Mode Slide Show Delay Slide Show Transition 3 Lap Dissolve Log Debug Messages False Device Name: CFF

16 Home > Setup > Camera > pop-up windows Keyboard appears at bottom of screen None Mono Negative Aqua Blackboard Posterize Sepia Solarize Whiteboard Auto On Off Image Effects Grouped and alphabetized for ease of reading Flash Mode x x x x x x x Auto Infinity Image Size Focus Mode Grouped for ease of reading 7 Auto Custom Daylight Image White Balance Incandescent Fluorescent Cloudy Shade Twilight Grouped and alphabetized for ease of reading 16

17 Home > Setup > Camera > pop-up windows (continued) 8 Keyboard appears at bottom of screen 9 Slide Show Transition Lap Dissolve Zoom Dissolve 10 Yes No Log Debug Messages? 11 Keyboard appears at bottom of screen 17

18 Home > Setup > Intervalometry Media Media Mapper Mapper Mobile Mobile Set Up GPS Proj Log Camera Intervalometry Google Earth Intervalometry Settings Images can be captured at regular intervals based on time, distance, or speed intervals. Intervalometry Mode: Time Interval (sec): Time Time to wait between the capture of successive images. Specify positive, whole seconds only (0, 1, 2, 3, etc.). Intervals less than 3 seconds will trigger as quickly as device is capable Press Setup from Home screen. Then press Sequence tab for Image Sequence Settings screen to appear. Time Distance Intervalometry Mode: Distance Interval (m): Sequence Mode Photo Burst Speed 100 Distance to move (as measured by GPS) between the capture of successive images. Specify positive whole meters only (0, 10, 20, 30, etc.). If you specify an invalid value, a 100 meter interval will be used by default. An interval less than 10 meters may cause the camera to trigger unreliably due to GPS jitter and inaccuracy. Based on the Sequence Mode you select, the rest of the Image Sequence Settings screen changes. (as indicated by RED rectangles) Distance Intervalometry Mode: Minimum Speed (kph): Vehicle speed above which images will be captured. Photo Burst Specify 0 to capture Photo Burst images regardless of speed. Specify a value greater than 0 to record Photo Burst images only when the device is moving faster than the specified speed. 3 18

19 Home > Setup > Google Earth Media Media Mapper Mapper Mobile Mobile Set Up GPS Proj Log Camera Intervalometry Google Earth Google Earth Tour Settings MediaMapper Mobile creates foi.xml Google Earth Tour kml and kmz files with image sequences, audio, and GPS location details. Camera Altitude (m): Camera Tilt (deg): Fly To Time (sec) Photo Overlay Altitude: (m) Photo Overlay Tilt (deg): Photo Overlay Roll (deg): Image Direction Method: Bearing #8 window appears on next page Press Setup from Home screen. T hen press Google Earth tab. Press to get to Help windows (#2-#7). This simplifies the screen Camera Altitude Height above the ground (meters) of the tour camera. Camera Tilt Close Tilt angle (degrees) of the tour camera. 90 is look ahead and 0 is look down. Fly To Time Close Time ( seconds) to fly between image sequence photos. Enter a negative value (i.e. -10) to use actual recorded elapsed time, Close Keyboard appears at bottom of screen 5 Photo Overlay Altitude Height above the ground (meters) of the image sequence photos 6 7 Photo Overlay Tilt Close Tilt angle ( degrees) of the image sequence photos. 90 is vertical and 0 is horizontal. Leave blank to use actual tilt angle recorded for each image. Photo Overlay Roll Close Roll angle (degrees) of the image sequence photos. 0 is horizontal. Leave blank to use actual roll angle recorded for each image. Close 19

20 Home > Setup > Google Earth > Image Direction Method 8 Image Direction Method You can use the GPS Bearing or the device Compass to determine the direction the image sequences photos are facing. Compass can be unreliable when affected by magnetic fields. Bearing Compass Close 20

21 Home > Project Collection screen Media Mapper Mobile Home GPS Details & Points of Interest Setup Category grouping Media Mapper Mobile Project Collection Right of Way Encroachments Type Vegetation Management Geotechnical & Natural Hazards I recommend using a table format and white background to get category icons and titled to line up better Track Logs Photos, Videos, and Audio Project Collection Category title Above-Ground facilities Bell Hole Inspection Permitting Pics (Env. Conditions) Menu options: Collection Details Forms External Camera Control About Category icon Construction Pics Start Collection Record Audio Re-create Last RHPROJ Help 1 Select Project Collection. 2 The Project Collection screen appears. Each Category Grouping is identified by bold text followed by a table with a white background. Each Category icon appears in a separate table cell. 21

22 Home > Project Collection > Collection Details Collection Details User/Collector Initials: MER Country Code: US Collection ID: 007 Collection Name: Hazards Collections:??? Prompt to record audio notes. 22

23 Home > Project Collection > Select Category Media Mapper Mobile Select Feature from Category: Geotechnical and Natural Hazards Mass Movement/Seismic Flooding Wild Fire The screen looks like this once you select a category icon you see all the features associated with the selected category. You can then press any of the features to take a photo. If Prompt to record audio notes was earlier checked on the Collection Details screen, you will also be prompted to record an audio note. Erosion Leaking Product 23

24 Home > Photos, Videos, and Audio screen Media Mapper Mobile Home GPS Details & Points of Interest Setup Track Logs Photos, Videos, and Audio Project Collection Forms External Camera Control Media Mapper Mobile Photos, Videos, and Audio Snap a Photo Capture Photo Sequence Capture Audio Note Film Videos View Photos View Videos View Map with Photos & Videos About Help 1 Select Photos, Videos, and Audio. 2 The Photos and Videos screen appears. Each item would have an icon to the left, and when clicked would behave as it does today). 24