Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

How to Manage Digital User Experience for Web Applications

155 views

Published on

If you're losing customers to competitors, the reason could be just one thing: customer experience. Managing the digital user experience is more critical than ever, and web application performance should be an essential element of business strategy. However, attempts to address this can often fragment and frustrate the organization.

This webinar on digital experience monitoring will address both the front-end — passive real user monitoring (RUM) and active synthetic transaction monitoring approaches — as well as back-end infrastructure monitoring. We'll discuss the pros and cons of each and outline why fragmenting your approach to end-user experience monitoring is no longer sufficient in the digital age.

Watch this webinar by John Worthington, Director Product Marketing, as he takes us for a deep-dive into digital experience monitoring.
- Learn how to track real-time user experience as end users access web applications
- Understand the customer journey end to end and determine business impact
- Proactively test user experience using simulation and baseline KPIs
- Evaluate pros and cons associated with passive and active user experience monitoring techniques

Published in: Technology
  • Be the first to comment

  • Be the first to like this

How to Manage Digital User Experience for Web Applications

  1. 1. How to Manage the Digital User Experience Approaches and Use Cases © eG Innovations, Inc | www.eginnovations.com
  2. 2. © eG Innovations, Inc | www.eginnovations.com Moderator • Natalie Tomko • Digital Marketing Manager • eG Innovations • Natalie.tomko@eginnovations.com
  3. 3. © eG Innovations, Inc | www.eginnovations.com Logistics • Please submit your questions at any time during the webinar using the questions panel on the GoToWebinar client • This webinar is being recorded. You’ll receive a link to the recording in a few days • A copy of the presentation will be posted on SlideShare: http//www.slideshare.net/eginnovations/
  4. 4. © eG Innovations, Inc | www.eginnovations.com Today’s Presenter • John Worthington • Director Product Marketing • eG Innovations • John.Worthington@eginnovations.com • 201.826.1374
  5. 5. © eG Innovations, Inc | www.eginnovations.com Today’s Agenda • What is the digital user experience? • Digital user experience approaches and use cases • Digital user experience and digital performance management • Conclusion
  6. 6. © eG Innovations, Inc | www.eginnovations.com WHAT IS DIGITAL USER EXPERIENCE? How to Manage the Digital User Experience
  7. 7. © eG Innovations, Inc | www.eginnovations.com What is the Digital User Experience (UX)? Customer experience has been defined as the quality of all of a consumer’s encounters with a company’s products, services, and brand1. Offline experience A customer’s experience in a physical setting is determined by a large group of factors ...they naturally set a lower bar for what passes as a satisfactory experience. Online (Digital) experience Digital customer experience includes only those experienced through a digital interface, like a computer, tablet, or smartphone. • Online and offline customers are birds of very different feathers • A ten-second wait for a page to load can make 50% of consumers give up and leave • Researchers at Microsoft even found that a website begins losing traffic to competitors when it takes 250 milliseconds longer to load • It seems that when people have a less-than-favorable online experience, they fault the company immediately. To consumers, there’s no satisfactory excuse for a poor digital experience. 1 What a Great Digital Customer Experience Actually Looks Like, Harvard Business Review
  8. 8. © eG Innovations, Inc | www.eginnovations.com Digital User Journey Mapping PR Email Blog Social Awareness Consideration Purchase Retention Advocacy Content Video Blog Website eCommerce Store Support Services Knowledge Base Case Study Blog Social Forums Vision & Strategy Manage Products & Services Market & Sell Products & Services Deliver Physical Products Deliver Services Manage Customer Service Management & Support Services Level 1 Business Processes – External/Internal Customer-Facing IT Services Network Storage Servers Virtualization OS Middleware Runtime Data Applications Network Storage Servers Virtualization OS Middleware Runtime Data Applications Network Storage Servers Virtualization OS Middleware Runtime Data Applications Network Storage Servers Virtualization OS Middleware Runtime Data Applications Private IaaS PaaS SaaS Client Managed Provider Managed IT Segments – Supporting IT Services Digital journey maps can span the entire customer lifecycle... ...digital business services are the basis of value and customer experience... ...but the Digital User Experience is made up of many different segments!
  9. 9. © eG Innovations, Inc | www.eginnovations.com Simplifying the Digital UX Pyramid UX Design • Useful: Your content should be original and fulfill a need • Usable: Site must be easy to use • Desirable: Image, identity, brand, and other design elements are used to evoke emotion and appreciation • Findable: Content needs to be navigable and locatable onsite and offsite • Accessible: Content needs to be accessible to people with disabilities • Credible: Users must trust and believe what you tell them Usability.gov 79% of people who don’t like what they find on one site will go back and search for another site
  10. 10. © eG Innovations, Inc | www.eginnovations.com Simplifying the Digital UX Pyramid UX Design UI Design 48% of users say they feel frustrated and annoyed when on sites that are poorly optimized for mobile Akamai, Gomez • Project Management • User Research • Usability Evaluation • Information Architecture (IA) • User Interface Design • Interaction Design (IxD) • Visual Design • Content Strategy • Accessibility • Web Analytics
  11. 11. © eG Innovations, Inc | www.eginnovations.com Simplifying the Digital UX Pyramid UX Design UI Design Site/Application Performance • Poor performance damages findability • Poor performance increases the time to complete a task • Poor performance reduces user satisfaction • Poor performance endangers accessibility • Poor performance undermines understanding The faster the site, the better the ranking, especially on mobile. Akamai, Gomez A one-second delay in load time leads to a 7% drop in conversion and an 11% fewer page views. In fact, a staggering 1 in 4 people will abandon a page that takes longer than 4 seconds to load. Akamai, Gomez A 1-second delay in page load will decrease customer satisfaction by about 16%. Worst still 79% of users who are dissatisfied with a website’s performance are less likely to buy from the same site again. Akamai, Gomez Each 1 second added to load time leads to users viewing 11% fewer pages. The fewer pages users visit, the less understanding they have of your products or services. Akamai, Gomez All of your efforts in UX and UI design are wasted if site/application performance is poor
  12. 12. © eG Innovations, Inc | www.eginnovations.com COMMON APPROACHES TO MONITORING DIGITAL USER EXPERIENCE How to Manage the Digital User Experience
  13. 13. © eG Innovations, Inc | www.eginnovations.com Application code? Database? Storage? Server? Network? Virtualization? Cloud Service? Digital User Experience Monitoring End Users Accessing Websites UX Analytics Front-End Back-End
  14. 14. © eG Innovations, Inc | www.eginnovations.com Analytics • Analytics tools help optimize your content marketing efforts – Web Analytics, Competitive Intelligence and Benchmarking, Content Marketing, SMO, and Marketing Performance Management UX Design UI Design While UX analytics tools are important for understanding user behavior, they are not sufficient for digital user experience monitoring Site/Application Performance
  15. 15. © eG Innovations, Inc | www.eginnovations.com Front-End: Synthetic User Monitoring • Can be performed at the application-protocol level (i.e., HTTP GET to a web server) – Does not test actual clients (web browser, Citrix receiver, etc.) – May not include multiple transactions in a single session • Client emulator – Uses same client applications that users access – Creates scripts that detail all the steps a user takes – Matches results to expected and specified patterns – Reports results – Broad applicability - can be used for web-based, thin-client (i.e., Citrix) or thick client (i.e., SAP GUI) applications While protocol level emulation is useful for determining if an application is up or not, it does not assess all aspects of application performance.
  16. 16. © eG Innovations, Inc | www.eginnovations.com Free Logon Simulators for Digital Workspaces Front-End: Application-specific Emulators • Do not require recording or script creation • Make use of the fact that packaged applications have a pre-defined login form and a click-through format • Offer pre-built solutions that work out of the box with minimal configuration - very simple to deploy https://www.eginnovations.com/solutions/citrix/free-logon-simulator https://www.eginnovations.com/solutions/vmware-horizon/free-logon-simulator
  17. 17. © eG Innovations, Inc | www.eginnovations.com Front-End: Synthetic User Monitoring Use Cases • Understand the performance of an application at any time, even when there is no real user load – minimizes production overhead • Obtain a consistent benchmark of the availability and performance of an application; provide SLA baseline/benchmark • Measure the performance of an application before and after an upgrade, or before and after a migration • Assess the performance of an application from multiple geographies • Ensure that new functionality or a new workflow added to an application is working as expected
  18. 18. © eG Innovations, Inc | www.eginnovations.com Demonstration Correlated Visibility, Root Cause Diagnosis, Machine Learning, AIOps ü User Experience ü Business Transactions ü Application Performance ü Infrastructure Performance On-premises Cloud End-User Experience Business Transactions Application Middleware Database Operating System Server (Physical/Virtual) Network, Storage, AD, etc. ApplicationInfrastructure
  19. 19. © eG Innovations, Inc | www.eginnovations.com Synthetic User Monitoring – Pros & Cons • Pros • Active Monitoring – Measure performance by simulating users, can be used 24x7 • Proactive – Provides a measure of user experience even when there are no real users – Can proactively detect slowness before end-users • Cons • Simulation – Does not report on what actual users are experiencing • Limited Visibility – Only transactions executed during the simulated test • No visibility into browsers or devices not included in synthetic tests • Browser rendering, network latency, server backend or content payload not measured What Synthetic Monitoring Provides • Is the service up?  Detect outages • How fast is the service?  Measure page load time • Are all the transactions working as expected?  Measure response time for transactions and establish baselines
  20. 20. © eG Innovations, Inc | www.eginnovations.com Front-End: Real User Monitoring (RUM) Approaches • Network Probes/Sniffers – Hardware devices that can be deployed on the network, connected to span ports, and configured to snoop on traffic over the network to capture and analyze user experience metrics in real-time • Client Agent – Involves installing an agent on the client device and configuring that agent to track the requests and responses at the client • JavaScript – An ‘agentless approach’ that involves embedding a small Java script in every page to be monitored in the target web site/web application
  21. 21. © eG Innovations, Inc | www.eginnovations.com Easy to Use • Hassle-free installation, language and framework-independent, hands-free monitoring • Auto-discovers where (i.e., the location) application users are coming from and reports user experience per location Front-End Diagnostics • Monitors real users in real-time • Front-end isolation; browsers, JavaScript errors, client devices and their impact on performance Advantages of JavaScript Approach to RUM
  22. 22. © eG Innovations, Inc | www.eginnovations.com Front-End: JavaScript Code Injection JavaScript code snippet injected into web page User hits web page, downloads JavaScript to browser Web Site User RUM Collector eG Remote Agent eG Manager eG Database eG Agent collects web performance statistics and sends this to the eG manager Real time visibility into your application 1 2 3 4 1. Use automatic container injection – no code change required 2. Insert JavaScript snippet manually into the common header/footer 3. Edit template code to include custom API helper class that generates the RUM script 4. Use automatic RUM instrumentation via JTM jar 5. Use manual injection for every page
  23. 23. © eG Innovations, Inc | www.eginnovations.com Front-End: Real User Monitoring Use Cases • Analysis of user behavior, device and browser usage in plan/build stage • In pre-production and view breakdown of all page resources, including 3rd party content – Assess true impact of infrastructure and software changes • Auto-triage front-end user experience performance issues in production in real time • Verify compliance with SLAs
  24. 24. © eG Innovations, Inc | www.eginnovations.com Demonstration Correlated Visibility, Root Cause Diagnosis, Machine Learning, AIOps ü User Experience ü Business Transactions ü Application Performance ü Infrastructure Performance On-premises Cloud End-User Experience Business Transactions Application Middleware Database Operating System Server (Physical/Virtual) Network, Storage, AD, etc. ApplicationInfrastructure
  25. 25. © eG Innovations, Inc | www.eginnovations.com Real User Monitoring – Pros & Cons • Pros • Passive monitoring – Capture how real users interact with the website or application • Front-End Isolation – Get real-time measures of user transactions and detect performance problems • Cons • Requires real user activity – If there are no real users, there is no measure of system availability or performance – No visibility to issues with the transactions and website paths not taken by real users What Real User Monitoring Provides • How are users interacting with the service?  Track real-time activity • What is the actual user experience?  Identify bottlenecks – traffic, load times, errors, etc. • Where is performance bottleneck?  Front-End or Back-End?
  26. 26. © eG Innovations, Inc | www.eginnovations.com Back-End: Infrastructure Monitoring • End user experience can be impacted by issues associated with applications and/or infrastructure – Networks, servers, databases, third-party calls, operating systems, application code or physical/virtual infrastructure – Trace slow business transactions • Tag and follow each request and break down processing time by tier – Application deep dive • View code causing poor performance (i.e., database query, third party call, etc.) – Infrastructure analytics • Auto-correlate infrastructure dependencies with web application performance
  27. 27. © eG Innovations, Inc | www.eginnovations.com Back-End: Infrastructure Monitoring Use Cases • Map software to the physical and logical runtime architecture needed to run workloads (topology) – Feasibility analysis for cloud migration • Capture comprehensive performance baselines inclusive of the entire end user ecosystem • Trace transactions to analyze processing time by tier and isolate code-level issues (pre- and post-production) • Auto-correlate user experience to application and infrastructure dependencies
  28. 28. © eG Innovations, Inc | www.eginnovations.com Demonstration Correlated Visibility, Root Cause Diagnosis, Machine Learning, AIOps ü User Experience ü Business Transactions ü Application Performance ü Infrastructure Performance On-premises Cloud End-User Experience Business Transactions Application Middleware Database Operating System Server (Physical/Virtual) Network, Storage, AD, etc. ApplicationInfrastructure
  29. 29. © eG Innovations, Inc | www.eginnovations.com Infrastructure Monitoring – Pros & Cons • Pros • Transaction Tracing – Transaction tracing can help visualize business transaction flow, speed application debugging and improve MTTR • Back-End Isolation – Provides reach and depth needed for problem analysis and capacity planning • Cons • Requires Front-End Context – Without an end user context, infrastructure monitoring can be reactive and inconsistent • Dependency Management – Infrastructure monitoring requires service orientation for dependency analysis and effective correlation What Infrastructure Monitoring Provides • What are the paths taken by user transactions?  Visualize business transaction flow, speed application debugging and improve MTTR • Why is my site or application slow?  Identify actionable causes of poor performance • When will I need more capacity?  Leverage historical trends and forecasting
  30. 30. © eG Innovations, Inc | www.eginnovations.com DIGITAL USER EXPERIENCE AND DIGITAL PERFORMANCE MANAGEMENT How to Manage the Digital User Experience
  31. 31. © eG Innovations, Inc | www.eginnovations.com Front-End: Both RUM & Synthetic Monitoring Are Needed Use Cases RUM Synthetic Determine user satisfaction: know what users are seeing in real time Identify root cause of real-time website issues Visualize real user transaction to measure front-end vs. network vs. server response time Analytics: Trend patterns of user activity, locations, browsers, device types Monitor transaction performance Test new feature before deployment, or before entering new market Test with simulated workloads to establish baselines of web performance Detect website/web application if up and running 24x7
  32. 32. © eG Innovations, Inc | www.eginnovations.com Back-End: Required for isolation and effective analysis Use Cases Front-End Back-End Isolate what are the digital user experience performance issues Isolate where the digital user experience performance issues are IF THEY ARE IN THE FRONT-END (i.e., JavaScript errors, network slowness, content download, transaction tier) Isolate why there is an issue with digital user experience performance, including the applications and their supporting ecosystems End Users Accessing Websites UX Analytics Front-End Back-End APM-only solutions still leave performance visibility gaps. Issues associated with the underlying application ecosystems, whether they are on-premises or in the cloud, are not included in any performance correlation.
  33. 33. © eG Innovations, Inc | www.eginnovations.com Digital User Experience and Digital Performance Management UX Design UI Design Site/Application Performance End Users Accessing Websites UX Analytics Front-End Back-End Application code? Database? Storage? Server? Network? Virtualization? Cloud Service? User Experience Monitoring, UX Analytics What is the issue? Front-End Monitoring, Simulated User Monitoring, Real User Monitoring Where is the issue? Back-End Monitoring, Topology Discovery, Transaction Tracing, Application Deep- Dive, Pre-emptive Alerting, Auto-diagnosis Why is there an issue?
  34. 34. © eG Innovations, Inc | www.eginnovations.com Traditional (ITIL) Approach UX Design UI Design Site/Application Performance 1 Business Requirements People/ Roles Processes/ Procedures Management Tools Technology 1. Identify service targets, service segments – Good initial targets are neither too easy (no business value) or too hard (too broad in scope) 2. Application/Infrastructure Component Instrumentation – All segments and components of the target service(s) – Identify any process requirements (i.e., monitoring run book) 3. Front and Back-End Monitoring Integration – Process integration/automation(s) will vary (ticketing, tool chains, etc.)
  35. 35. © eG Innovations, Inc | www.eginnovations.com Traditional (ITIL) Approach UX Design UI Design Site/Application Performance 1 2 Business Requirements People/ Roles Processes/ Procedures Management Tools Technology Business Requirements People/ Roles Processes/ Procedures Management Tools Technology 1. Identify service targets, service segments – Good initial targets are neither too easy (no business value) or too hard (too broad in scope) 2. Application/Infrastructure Component Instrumentation – All segments and components of the target service(s) – Identify any process requirements (i.e., monitoring run book) 3. Front and Back-End Monitoring Integration – Process integration/automation(s) will vary (ticketing, tool chains, etc.)
  36. 36. © eG Innovations, Inc | www.eginnovations.com Traditional (ITIL) Approach UX Design UI Design Site/Application Performance 1 2 3 UX Design UI Design Business Requirements People/ Roles Processes/ Procedures Management Tools Technology Business Requirements People/ Roles Processes/ Procedures Management Tools Technology 1. Identify service targets, service segments – Good initial targets are neither too easy (no business value) or too hard (too broad in scope) 2. Application/Infrastructure Component Instrumentation – All segments and components of the target service(s) – Identify any process requirements (i.e., monitoring run book) 3. Front and Back-End Monitoring Integration – Process integration/automation(s) will vary (i.e., operating model(s), ticketing, tool chains, etc.)
  37. 37. © eG Innovations, Inc | www.eginnovations.com Today’s Reality UX Design UI Design Site/Application Performance 1 2 3 UX Design UI Design Business Requirements People/ Roles Processes/ Procedures Management Tools Technology Business Requirements People/ Roles Processes/ Procedures Management Tools Technology “the layers of the pyramid are not layers at all, but rather mutually supporting and reinforcing elements... Better than a pyramid would be a swirling whirlpool wherein all elements of a complete system support and reinforce one another.” - User experience is not a pyramid Gerald Gordinier, Interaction Designer @ Google Monitoring is Shifting Left Process & Service Owners Managers Practitioners Service Design Service Transition Service Operation Plan & Build Release Operate ITIL© DevOps DevOps organizations will seek to structure around capabilities and is more dynamic; i.e., ‘Team of Teams’ ITIL structures emphasizes cross-functional processes and services Business Capability Teams Product Owner Designer Developers Testers Shared Services Teams Service Owner Deployment Staff Testers Engineers IT Operations Management Application Management Infrastructure Management Ops Control / Facilities Mgt Service Desk Process & Service Owners Managers Practitioners Service Design Service Transition Service Operation Plan & Build Release Operate ITIL© DevOps DevOps organizations will seek to structure around capabilities and is more dynamic; i.e., ‘Team of Teams’ ITIL structures emphasizes cross-functional processes and services Business Capability Teams Product Owner Designer Developers Testers Shared Services Teams Service Owner Deployment Staff Testers Engineers IT Operations Management Application Management Infrastructure Management Ops Control / Facilities Mgt Service Desk
  38. 38. © eG Innovations, Inc | www.eginnovations.com How to Manage the Digital User Experience UX Design UI Design Site/Application Performance Business Requirements People/ Roles Processes/ Procedures Management Tools Technology 1 2 Business Requirements People/ Roles Processes/ Procedures Management Tools Technology 3 Public Cloud SAP Business Service Segments Share Point O365 Digital Workspace • Ideal service targets should focus on internal or external customer-facing IT services – User Experience ≠ supporting IT services • Provide flexibility in instrumentation approaches – Front-end, Back-end or Converged • Integrate the front and back-end – eG Enterprise supports 180+ applications, 10+ operating systems, 10+ virtualization platforms and 20+ storage devices out-of-the-box
  39. 39. © eG Innovations, Inc | www.eginnovations.com APPLICATION PERFORMANCE MONITORING INFRASTRUCTURE MONITORING & AUTO-DIAGNOSIS End-User Experience Monitoring User-Defined Transaction Profiling Application Topology Discovery & Visualization Application Component Deep Dive Analytics & Reporting End-to-End Infrastructure Visibility Auto-Baselining & Thresholding Automatic Cross-Tier Diagnostics Preemptive Detection & Alerting Configuration Change Tracking & Correlation Automatic Topology / Dependency Mapping Comprehensive Reporting & Trending How to Manage the Digital User Experience Developers Systems Engineers A Single Pane of Glass View of Performance for the entire Service Team Observability Monitoring • Digital User Experience is a critical guidepost – Helps keep stakeholders business-aligned and situationally aware – Can adapt to multi-mode operating models
  40. 40. © eG Innovations, Inc | www.eginnovations.com eG Enterprise and Digital User Experience Monitoring • eG Enterprise monitors the entire digital user experience – Business transactions – Applications – Infrastructure Digital User Experience • Protect your investments in UX and UI design • Assure the underlying business transactions, applications and infrastructure health
  41. 41. © eG Innovations, Inc | www.eginnovations.com About eG Innovations Worldwide Locations Global Headquarters: Singapore US Headquarters: New Jersey Founded in 2001 eG Innovations is a provider of enterprise-class application and IT infrastructure performance management software that delivers end-to-end monitoring, diagnosis, reporting and analytics across on-premises, cloud, and hybrid IT environments. Faster diagnosis and resolution of performance problems Enhanced service delivery and user satisfaction Maximum business productivity and cost savings Accelerated IT deployments and production rollouts Improved user experience and customer satisfaction Transform IT Service Delivery into Business Advantage
  42. 42. Questions? © eG Innovations, Inc | www.eginnovations.comwww.eginnovations.com info@eginnovations.com +1 (866) 526 6700 Manage the Digital User Experience Front-End | Back-End End-to-End Code to bare metal. Public, Private, Hybrid.

×