The Annotation Tool

THE PROBLEM

How do we incorporate an annotation tool for our physician experts

Industries, such as healthcare, construction, and even transportation, currently use some form of walkie-talkie or other push-to-talk (PTT) devices to fill their communication needs across their teams.

These devices are often clunky and hard to use, and do not come with administrative properties for managing users, which can result in a muddy and confusing chat channel.

THE USERS

Administrators

need to be able to provision multiple accounts to effectively manage user permissions and roles, while also being able to set-up organizations to use our services.

Managers

need to be able to manage users within their own communication groups/teams to make sure their team can run smoothly, while optimizing their given workflow.

Employees/Others

need to be able to hear their managers clearly without interference from other team members, so that top-down orders can be received or necessary updates can be heard and they can

re-route their workflow as needed.

Any industry that comprises of people needing direct, hands-free communication (i.e. voice activated tools), with multiple groups to aid in coordinating efforts across any distance is a potential user.

With the addition of the Command Center, this means the ability to create and dispatch teams from a desktop without having to be out in the field, while also being able to track real-time locations of their teams.

Past case studies include being able to organize with a team of healthcare professionals to provide better quality care through reduced response times or a bike maintenance service that required truck drivers to be able to communicate with operation managers on where to drive to for their tasks and to keep their team updated with their location and task status.

THE TEAM

Web UX Designer (me)
Mobile UX Designer
UX Researcher
VP of Product
Director of Design
Web Developer Team

For the conception of our Orion Command Center, I worked directly with the VP of Product and the web engineering team to understand constraints from a technical and timeline perspective.

 

During iteration cycles for designs, I would consult with our Director of Design, Mobile UX designer, and User Researcher to validate solutions and gather feedback.

SCOPE & CONSTRAINTS

Get a working demo of the MVP ready within 8 months, so we can debut it at IWCE 2017 in Las Vegas.
Read about the launch..
Deliver the next set of advanced features in 9 months.

For the minimal viable product, we had a timeline of 8 months. For me, it's crucial to come from a place of understanding. I studied the product design document closely for the first couple of weeks to understand proposed feature sets and familiarize with potential technical hiccups we may face.

Our post-MVP goals were focused on more advanced features, such as allowing users to customize their groups settings and user permissions. Our timeline for our second round of deliverables was around 9 months, but we luckily received an extension for this.

Discover & Define

SITE MAP & ARCHITECTURE

To begin planning the architecture of our platform, I created a sitemap to cover basic navigation and user flows based on product requirements in our Product Design Document.

 

Then, I color-coded portions of this map so our team could visualize what parts would be built first, second, and "TBD". This map went through several iterations and presentations with stakeholders - namely, the product team and the engineering team.

 

I felt that it was imperative to get as much feedback as possible from teams to capture any potential issues anyone could find early in our process. What were we missing? What should we consider for the future? These were the answers we all sought to discover.

Artboard 1.png

USER FLOWS & RESEARCH

From the sitemap, I identified the most necessary user flows we should focus on first. To start, we needed a way to get users set-up with their own account with the Orion Command Center and a way to create their own organization.

 

I worked with our user researcher to document comparisons of different sign-up flows. We discussed which flows worked best from our observations and what could be better or improved upon, and then I created an idealized flow based on our finding.

I then presented the flows to the engineering team for feedback and to see where the flow could be optimized to decrease development time.

user-flows.jpg

SKETCHES & PAPER PROTOTYPES

I explored a few different layouts for Orion Command Center by creating sketches, then turning those sketches into paper prototypes.

 

At its core, the platform would need an "overview" screen, and a "details" screen. I found that a  single panel layout that could expand into a dual panel layout was the most versatile for what we were trying to achieve with the Command Center.

I advocated for mobile-first screens, but due to time-constraints, we decided to table it for later. To me, it wasn’t a matter of if we’d do responsive, but when.

 

I kept this in mind and it was the main reason I designed widgets and self-contained sections for content on all the pages.

sketches_paperprototypes_edited.jpg

Wireframes & Mocks

I created gray-scale wireframes to refine my paper prototypes. I used grayscale as a means of cheap preliminary "testing" of the UI. By presenting these to the team, I was able to gain insights on button placement, content legibility, and  page layout.

ACCOUNT REGISTRATION & ACCOUNT CREATION

 Create Account (Empty)
2.2_ Create Account (Compete)
 Org. Details (Empty)
3.2_ Org. Details (Complete)
 Billing (Empty)
 Registration Complete

THE ORION COMMAND CENTER

WF_ Home
WF_ Groups
WF_ Group Details
WF_ User List
WF_ User Profile
WF_ Settings

MVP Deliverables

Next, I created a style guide and high-fidelity mock-ups. The mocks went through a series of iterations and feedback sessions with first the product and design team, then with the engineering teams to make sure I wasn't breaching any technical constraints.

ACCOUNT REGISTRATION & ACCOUNT CREATION

 Create Account (Empty)
1.3_ Create Account (Complete)
sign in (Success)
 Org. Details (Empty)
3.2_ Org. Details (Complete)
Non-billed User Profile

THE ORION COMMAND CENTER

Demo Portal_ Empty
Demo Portal_ Content & Dropdown
Settings-My Profile
Users_ Empty
Users List
Group Details_ Input Hover
Groups List
Groups_ Search Groups
Users_ View Profile

Impact

We needed a minimal viable product to showcase what our Command Center could do, and in turn, generate customer interest. The International Wireless Communications Expo (IWCE) presented the perfect opportunity for our company to demo the Command Center and the Onyx device to potential key players from a variety of industries. Seeing reactions to our enterprise voice platform helped me gauge the initial reception and see what areas could be improved while learning about use cases and applicable situations.

We wanted to capture as many leads as possible - those who would be interested in learning more and potentially signing contracts in the future. Aside from gaining valuable insights from those that could benefit from our product, creating this MVP was a huge money saver because we didn't have to allocate resources to build everything that we thought was "right" for the product, but instead built minimal managerial functions to allow admins to manage their organizations through the Command Center, which in turn, gave us an established base point to churn interest in different market sectors.

Shipped MVP Features:

• View, add, or remove users from your organization

• View, add, or remove groups from your organization

• Assign group leaders within communication channels to manage teams

• Edit group name and what groups users can participate in

• Monitor recently added users or groups from the dashboard

• Sync data with the Orion Mobile App to give users a seamless experience

 

Case Studies

A SHOWCASE OF MY WORK AT ORION LABS
The Command Center

From conception to completion, we delivered our minimal viable product in under 8 months.

Settings

To give organizations a way to manage their users and groups, we created "Setting" views to help provision permissions.

Subscription Models
  • LinkedIn - Black Circle

Connect with me on LinkedIn!

© 2020 Toni Chen. All rights reserved.