Assignment 3e: Digital Mockup

CSE 440 Section AB | DASH

Digital Mockup Overview

Sketch 9041 AM 100% Sketch 9%41 AM 100%

Sketch 9041 AM 100% Sketch 9%41 AM 100%

Dashboard Dashboard Dashboard Dashboard

Tues, Feb 21 Today Today Today

Day Week Month Day Week Month

Apps
Focused

15
Connect device and
62
SAFETY
MINUTES
40
MINUTES
start driving…
SCORE

Snapchat 40%
6 min

Facebook 33%
5 min Eyes on road
95%
38 min
Focused Apps Twitter 20%
3 min
Texting Calls Eyes on mirrors
2 min
5%
Gmail 7%
1 min

Dashboard Stats Leaderboard Settings

Dashboard Stats Leaderboard Settings

Sketch 9%41 AM 100% Sketch 9%41 AM 100% Sketch 9%41 AM 100%

Stats Stats Stats

Stats
Week Month Year

February Eyes on road

95%
Safety Score 38 min

Oct - Feb 2017

Eyes on mirrors
2 min
5%
100

80
74
SAFETY
TOP APPS

SCORE Gmail 10 min

Snapchat 8 min
60

Facebook 7 min
Focused Apps
40
Texting Calls Twitter 2 min

20 SUMMARY Instagram 2 min

Focused
38 min
74%
TEXTS
0
Apps
Oct Nov Dec Jan Feb 5% Sent
2 min
18 messages
4 min
Eyes on road
95% Received
38 min
22 messages
3 min
Dashboard Stats Leaderboard Settings Eyes on mirrors
2 min
5%

Sketch 9%41 AM 100% Sketch 9%41 AM 100% Sketch 9%41 AM 100%

Leaderboard Profile Add Friends

Friends National

Clarissa
1
82 Safety Search Contacts
Score
2 Friends since July 2015
Clara Herrera

3
Josh Hogan Pending…

STANDINGS
Anh Nguyen
Terry Anh Josh National
90th percentile 127
Becky Patti Graham
4 Friends
91.7
94th percentile
6
You
5 82.0
Terry Watts

Michael
6 80.2
Lilian Davis

7 Clarissa Michael Lawrence

Dashboard Stats Leaderboard Settings Dashboard Stats Leaderboard Settings

Dashboard Stats Leaderboard Settings
Digital Mockup Overview

Sketch 9%41 AM 100% Sketch 9%41 AM 100% Sketch 9%41 AM 100%

Settings Privacy Device

SHARING

Profile
Share with friends
CONNECTED
Device
Share with national dataset 80% Battery

Alerts
Block all contacts

Privacy
TRACKING Sync Frequency Real Time

Help Track eye movements

Hardware Version 1.0.0

Track body movements

Software Update
Sharing and tracking can be changed at any time.
About Dash Privacy….

Dashboard Stats Leaderboard Settings Dashboard Stats Leaderboard Settings

Dashboard Stats Leaderboard Settings

Sketch 9%41 AM 100% Sketch 9%41 AM 100% Sketch 9%41 AM 100%

Sync Frequency Alerts Alert Sound

CLASSIC
Real time
Alerts
Beep
Every 1 minute
Alert Sound Beep
Chime
Every 5 minutes Dash alerts you when it detects distracting activity while
the car is in motion. Signal
Every 10 minutes
SPEAKER Twinkle
Dash will continuously sync your tracking data with the app.
Panda Device
VOICE
Phone
American English
Dash will alert you through the panda device’s speakers.
Change volume settings on the panda device itself.
British English

Dashboard Stats Leaderboard Settings Dashboard Stats Leaderboard Settings Dashboard Stats Leaderboard Settings
Task 1: Visualizing and Processing Driving Behavior

Sketch 9041 AM 100% Sketch 9041 AM 100% Sketch 9%41 AM 100% Sketch 9%41 AM 100%

Dashboard Dashboard Dashboard Dashboard

Today Today Today Today

Day Week Month Day Week Month

Apps
Focused

15
Connect device and
62
SAFETY
MINUTES
40
MINUTES
start driving…
SCORE

Snapchat 40%
6 min

Facebook 33%
5 min Eyes on road
95%
38 min
Focused Apps Twitter 20%
3 min
Texting Calls Eyes on mirrors
2 min
5%
Gmail 7%
1 min

Dashboard Stats Leaderboard Settings

Dashboard Stats Leaderboard Settings

These screens are found on the Dashboard tab of the app. The first screen will appear if the driver has not
driven during the current day and/or their panda tracking hardware is not paired (upper left panda graphic
has a connection indicator light). Upon driving, the dashboard will be populated with an interactive graph.
The driver will be taken to a detail view if he/she clicks on any section in the pie chart; information is
provided on duration of activity.

Sketch 9041 AM 100% Sketch 9041 AM 100% Sketch 9041 AM 100%

Dashboard Dashboard Dashboard

Today Tues, Feb 21 Today

Day Week Month Day Week Month Day Week Month

62SAFETY
55
SAFETY
62
SAFETY
SCORE SCORE SCORE

Focused Apps Focused Apps Focused Apps

Texting Calls Texting Calls Texting Calls

OK
Dashboard Stats Leaderboard Settings Dashboard Stats Leaderboard Settings Dashboard Stats Leaderboard Settings

These screens demonstrate the app’s ability to show different dates of driving data. Clicking on
“Today” (or whatever is the date at the top of the screen) will allow the driver to select a date.
Clicking on the left and right arrows leads to different days/weeks/months, depending on the
current selection below.
 Task 1: Visualizing and Processing Driving Behavior (cont.)

Sketch 9%41 AM 100% Sketch 9%41 AM 100% Sketch 9%41 AM 100% Sketch 9%41 AM 100%

Stats Stats Stats

Stats Stats Stats
Week Month Year Week Month Year

February Calls
10%
Safety Score Safety Score 5 min

Oct 2016 - Feb 2017 May - Sept 2016

Texts
2 min
5%
100 100

80 80
74
SAFETY
TOP APPS

Gmail 10 min
SCORE

60 60 Snapchat 8 min

Facebook 7 min
40 40 Focused Apps
Texting Calls Twitter 2 min

20 20 Instagram 2 min
SUMMARY

Focused
37 min
74%
0 0 TEXTS
Oct Nov Dec Jan Feb May Jun Jul Aug Sept Apps
10% Sent
5 min 18 messages
4 min

Calls Received
5 min
10% 3 min
22 messages
Dashboard Stats Leaderboard Settings Dashboard Stats Leaderboard Settings
Texting
2 min
5%

These screens are part of the Stats tab of the app. The graphs are interactive, so scrolling left and right will
display data for different weeks/months/years depending on the selected date type. Clicking on a bar will
lead to a detail view, which includes a percentage breakdown of activities, list of top apps, texts, and more.

Sketch 9%41 AM 100% Sketch 9%41 AM 100% Sketch 9%41 AM 100% Sketch 9%41 AM 100%

Settings Device Device Sync Frequency

Profile Real time

NOT CONNECTED CONNECTED

Device Every 1 minute
80% Battery 80% Battery

Alerts Every 5 minutes

Privacy Every 10 minutes

Connect Bluetooth Real Time Sync Frequency Real Time
Sync Frequency
Dash will continuously sync your tracking data with the app.
Help To pair with device, go to phone settings
Hardware Version
and select Panda V1.1 1.0.0 Hardware Version 1.0.0

Software Update Software Update

Cancel Settings

Dashboard Stats Leaderboard Settings Dashboard Stats Leaderboard Settings Dashboard Stats Leaderboard Settings
Dashboard Stats Leaderboard Settings

Device settings can be adjusted from the Settings tab of the mobile app. Upon entering the “Device”
page, if the app does not detect a paired device, it will prompt the user. The third screen displays a
connected device. Finally, the driver can choose the sync frequency between the hardware and app
(defaults to real-time tracking).
Task 2: Comparing and Sharing Driving Habits
Sketch 9%41 AM 100% Sketch 9%41 AM 100% Sketch 9%41 AM 100% Sketch 9%41 AM 100%

Leaderboard Profile Profile Privacy

Friends National SHARING

Clarissa Clarissa Share with friends

2
1
82 Safety
Score 82 Safety
Score Share with national dataset
Friends since July 2015 Friends since July 2015

3 Block all contacts

Block Clarissa?
TRACKING
STANDINGS STANDINGS
This user will no longer be able to view
your standings or add you as a friend. Track eye movements
Terry Anh Josh National National
90th percentile 127 90th percentile
127
Track body movements
Becky Cancel OK
4 91.7
Friends Friends
94th percentile
6 94th percentile
6 Sharing and tracking can be changed at any time.
About Dash Privacy….
You
5 82.0

Remove Friend
Remove Friend
Michael
6 80.2

Block User
Block User
7 Clarissa
Cancel
Dashboard Stats Leaderboard Settings Dashboard Stats Leaderboard Settings Dashboard Stats Leaderboard Settings
Dashboard Stats Leaderboard Settings

The Leaderboard tab allows drivers to accomplish Task 2. Users have the choice to compare their standings
with contacts or with a national dataset. Clicking on anyone on the leaderboard list leads to their profile,
which lists their safety score standings. Triangles pointing up indicate a user has increased in standing in
the past day (and otherwise for a triangle pointing down). Friends can be removed or blocked anytime via
the ellipsis button in the upper right hand corner of the second screen. Users can update sharing and
tracking settings anytime in the Settings > Privacy page.

Sketch 9%41 AM 100% Sketch 9%41 AM 100% Sketch 9%41 AM 100%

Add Friends Add Friends Add Friends

Search Contacts Search Contacts Search Contacts

Clara Herrera Clara Herrera

Facebook Josh Hogan Pending… Josh Hogan Pending…

"Dash" would like to access your basic

profile info and list of friends. Anh Nguyen
Anh Nguyen

Don't Allow OK
Patti Graham Patti Graham

Terry Watts q w eTerryr Watts

t y u i o p

Lilian Davis
a s Lilian
d Davis
f g h j k l

z x c v b n m
Michael Lawrence Michael Lawrence

123 space return

Dashboard Stats Leaderboard Settings Dashboard Stats Leaderboard Settings
Dashboard Stats Leaderboard Settings

Adding contacts is essential to sharing information with friends. The Add Friends view is accessed by the
upper right hand icon in the Leaderboard tab. Drivers can add friends from their phone contact list,
Facebook, or Google+, which they specially allow Dash to access. Finally, friends are searchable by name
as shown in the last screen.
Decisions and Changes

Many small cosmetic and documentation changes were added to the design. For example, in
many of the settings screens, there are sentences below setting titles that explain the current
state of the system. These helpful hints were inspired by Apple’s current Settings pages.

In the Dashboard view we included two visual elements to the screen: a legend for the pie
chart and an iOS date picker for choosing time frames. We included these elements for
readability and ease-of-use. To remain consistent with our Statistics detail view, we made the
Dashboard detail view a pull-down frame as well.

In the Leaderboard view, we upgraded the Add Friends function to a page on its own
(previously, we only had a pop up window appear). Before, we only supported a design for
phone contacts, but with the popularity of social media platforms such as Facebook and
Google+, we decided to add these options as well.