CUSTOMER TOUCH UX: CTUXtaidlin.com/_include/img/work/projects/tmo/tmo-ctux-proposal_small.pdfCall...
Transcript of CUSTOMER TOUCH UX: CTUXtaidlin.com/_include/img/work/projects/tmo/tmo-ctux-proposal_small.pdfCall...
CUSTOMER TOUCH UX: CTUX!Customer & User Experience Design Approach – V1.4
What we propose and why
With the goal of enhanced customer experiences and engagement in mind, we envisioned empowering employees with quickly intelligible and actionable customer data. With this information in-hand, newly empowered and guided RSRs can assist customers more efficiently and accurately.
Making data clear, actionable, and custom, both co-workers and customers win.
UX Perspective
Our opportunity We can enhance the the customer experience by providing a tool to surface relevant and insightful recommendations and content to business employees. By harnessing insightful data and using trusted user experience principles to create digital paths toward achieving the best outcomes for both the customer and the business.
We aim to Enable a quick understanding of the “customer snapshot” for quick response to – if not anticipation of – questions, guidance, and customer satisfaction Create a unique and special experience for individual customers by tailoring customer service, offers, deals, and communications to their specific needs Tap the power of our data – provide employees with relevant, detailed data-visualizations, enabling quick comprehension and clear path-to-action.
Call Center Customer Service Representative
Miriam 28, Call Center, Seattle
“I not only solve customer problems, needs, and questions, I also want to have people really like T-Mobile.”
DAILY TASKS • Takes calls from customers from a
Central Call Center with others in the same role
• Provide relevant offers, promo:ons, and direc:on toward appropriate services and products
• Forward customer inquiries to relevant experts to resolve par:cular customer concerns
NEEDS • Easy way to communicate needs and
get the best result
• Guidance to relevant services and products that may enhance their business experience
• Easy access to knowledge about customer history, service data, and relevant informa:on, empowering best service and needs met quickly
Exis/ng Customer
Chris 38, Seattle WA
“I am happy with my plans but I’d love to get a new phone if there’s a good offer or deal.”
DAILY TASKS • Uses phone oDen during the day
for conference calls up to an hour.
• Some interna:onal calling
• Lots of text and data through tex:ng and sending photographs when traveling
• Considerable data use through streaming on a second device (an iPad)
Scenario: Change a plan
2 Info o Review
<u'St():'(JN Dashbo.lrd RecOOimtndauons
1 Getting Started Home Dashboard
(u~omel Engagement
3 Choose & Buy R~com~a~IOI"li
Related products & Sef\'iC~S
A differentiated expenence to tailored products and servrces
/ Close the <a , tavc noces.
follow upw1th ~all
Us1ng va'IOus conduitS to re evant cata, our approach to uX agg•egates these sou•ces 1nto
nt1u1t1ve user '"'terfaces and data v1suahzat~ons. Comb ned w;h custem·ta lored orocun anc serV>ce recommenda:>ons, T-'vlcol e CS~s are aole to g.-ide CLstomc•s 11ore accurately and effiCient~' to :he bes• 11t fo• thc1r ntcnt.
Dashboard Elements
New & Recommenda/ons Sidebar
General Dashboard & Customer Profile Page Structures Compared
Data visualiza/on Detail (Large) View (in landscape, by default)
CSR / Web Home Dashboard
CSR / Web Customer Overview
RSR / Touch Home Dashboard & Customer Overview
RSR / Touch Customer Overview and Customer History Detail Views
Style guidelines!CTUX
How to use color
Magenta used for primary actionable items #fff used for content section backgrounds #f1f1f2 background #ccc content border and dividing lines Light grey used for unavailable items Dark grey for secondary actionable items
Note: to reduce the number of fonts used, fonts can be approximated using font-weight CSS styles.
Typography
Our default stack for web-fonts should degrade gracefully to accommodate the T-Mobile brand as well as device defaults and standards.
Tele-Grotesk Nor Tele-Grotesk Hal Tele-Grotesk Fet Tele-Grotesk Ultra
Helvetica Neue Light Helvetica Neue Regular Helvetica Neue Medium!Helvetica Neue Bold
Helvetica Light!Helvetica RegularHelveticaHelvetica Bold
Arial Arial Bold
Architecture Frameworks
Technology Frameworks Foundation Responsive framework for multi-channel experiences http://foundation.zurb.com
Handlebars js for the generation of information architecture and interaction templates http://handlebarsjs.com/ jQuery Standard interactions http://jqueryui.com/
Grid architecture Utilize Responsive 12-Column Grid structure accomodating: Web Browser layout up to 1200px wide iPad iPad Mini Secondary form factors to consider: Mobile (iOS & Android) Android Tablets Large-Screen displays such as televisions
THANK YOU!We appreciate your time & attention