This presentation details the UX design steps for the Device Manager project and their artifacts. It starts with requirement gathering and user research with stakeholders and end-users, through wireframing, mocking up, and prototyping, and validation testing with the end-users.

1. Design Process
and Artifacts
for
Device Manager
Joel Baskin
Sr. UX/UI Designer
at PlayNetwork
Nov 2013-Nov 2015

2. About PlayNetwork
PlayNetwork creates hand-crafted playlists for the world's biggest brands and
delivers music through their proprietary networked music player devices.
450 Brands 185,000 locations 127 countries
You may not have heard of PlayNetwork, but you have experienced their
product at Starbucks and most high-end retail spaces.
From their website
PlayNetwork began in 1996 with custom in-store music for businesses. Today,
PlayNetwork is a leading global consumer engagement company providing
creative strategy, original and curated content, distribution platforms, and
consumer insights—all under one roof.
https://content.playnetwork.com/product-info/playnetwork-overview

3. My Role in the Project
• Only person on UX Design team
• User Research
• Define the problem and its root causes
• Gather, organize, and share institutional knowledge
• Document and analyze the users, goals, scenarios, and tasks
• Project Management
• Identify and recruit available resources
• Propose solutions and a roadmap to success
• UX Design
• Mockup and prototype the UX
• Validate design through user testing and reviews

4. Problem
Statements
Poor customer satisfaction
Customers (mostly retail store employees) reported problems
when they became angry enough at the absence of music in their
stores to call Customer Service and complain.
Troubleshooting was difficult and time-consuming
Customer Service reps could not easily diagnose errors for devices.
The PlayServer Manager application reported only current settings
of devices with minimal error-reporting.
Problems were getting worse
The volume of calls increased when the new class of devices
deployed to replace then older, failing devices proved unstable.
Outdated software
Despite spending effort to increase the reporting capabilities of the
new devices, PlayServer Manager was incapable of displaying the
new metrics and fields. TechDevs were pulled from coding solutions
to troubleshoot devices.
Primary target audiences are displayed in bold.

5. Initial
Questions
1) Who is affected by this problem,
internally and externally?
2) How are they currently doing their
work?
3) Who can contribute to the
solution?
4) What are their goals for the
project?
5) What are their measures of
success?

6. Success
Criteria for
Device
Manager
Enable Customer Service representatives to diagnose
and close issues in less time.
Decrease
Time per
Ticket
Expose key indicators across many devices without
additional inspection by representatives.
Focus on common problem states and leverage the
reporting capabilities of the new devices.
By
Increasing
Visibility
Isolate and identify devices as issues begin.
Facilitate proactive identification and resolution of
device issues before customers report them.
And Earlier
Detection
Of
Problems
Provide an attractive and useful user experience to
larger customers so they will self-service their devices.
Stretch Goal
The new user interface will

7. User Research and Analysis

8. Error Causes and
Key Indicators
• Customer Service did not have a consistent
process for diagnosing and resolving device
issues.
• I coordinated the senior CS reps, device
software engineers, and device test engineers
to identify and order steps for determining
error causes and how to resolve them.
• I charted the diagnostic task flow and
resolutions for Customer Service.
• Using the diagram, I identified the key
indicators and how to display them on a
dashboard.
• View full diagram in the Appendix

9. Final Design
1 2
3
4
5
6
See Appendix for larger view
Mapping Key Indicators
To Visualizations

10. See Appendix for larger view
From Wireframes to Final Design

11. Final Design
• Unambiguous and impactful status
• Status focuses only on key indicators
• Error states are color coded for easy discovery
• Full display of key attributes
• Users do not need to drill down to view common
attributes
• Broad view of devices
• Users can view many devices at once
• Users can spot patterns to identify devices with similar
issues
• Status Summary bar
• Identifies and organizes High Impact issues
• Clicking the numbers filters the view for quick inspection
• My Groups
• Users can create groups to track ongoing resolution of
issues
• Search
• Users can quickly find a specific device or search for an
attribute across devices to determine extent of an issue
• Devices with a specific problem can be isolated quickly
1
2
3
4
5
6
1 2
3
4
5
6
See Appendix for larger view

12. Simplifying the
Group Dashboard

13. Improved Visibility
by Accounts
• Users can easily view the status of
devices across several groups
• Customer Service assignments can
focus on specific customer accounts
• Users in External IT groups can view
the status of devices according to
their organization’s structure
• Devices in error states can be quickly
identified and inspected by clicking
on the numbered indicators.
See Appendix for larger view

14. Interactive Prototype
in Axure
• Clickable status count indicators on
the Status bar open filtered device
list views
• Rollovers for critical status indicators
describe the cause for the error
state
• Functional group drop-down
selector demonstrates ability switch
easily between groups without
pogo-sticking through the Groups
Dashboard
• Full golden-path walk-through from
Group Dashboard through device
detail pages
• Successful user testing validated
ease-of-use and accuracy of the key
indicators chosen for the dashboard
See Appendix for larger view
1
2
3
4
1
2
3
4

15. Appendix