WebRTC dokáže výrazně vylepšit podporu zákazníků

10. 7. 2017

Sdílet

Autor: Fotolia
WebRTC poskytuje webovým prohlížečům podporu hovorů a videohovorů bez nutnostií mít na straně klienta speciální software. Toho mohou využít jak operátoři kontaktních center, tak například tvůrci samoobslužných aplikací.

Relativně nová technologie WebRTC (Web Real-Time Communication) slibuje, že více než kdy v minulosti usnadní zlepšení podpory zákazníků tím, že uživatelům webových prohlížečů poskytne podporu hovorů a videohovorů bez nutnosti stahování jakéhokoli klientského softwaru.

Jak lze WebRTC využít v kombinaci s kontaktním centrem? Zde jsou čtyři způsoby, jak bude WebRTC podporovat kontaktní centra v budoucnu.

 

1. Volající použije WebRTC z webových stránek. Když se vyvinula technologie WebRTC, zaměřovala se většina případů použití na videokonference (v podstatě jako konkurence pro Skype) a jako widgety click-to-dial (zahájení hovoru kliknutím) pro webové stránky.

Druhý jmenovaný přístup předpokládal, že když už jsou internetoví návštěvníci na webové stránce a komunikační kanál je otevřený, nedává smysl je přesměrovávat na jiný externí kanál (třeba telefonní linku).

Přestože byly widgety pro volání poměrně populární, jejich přijetí nakonec nebylo nijak zvlášť vysoké, protože tuto funkci podporovaly jen některé prohlížeče (Internet Explorer a Safari podporu WebRTC neměly) a uživatelé se museli vypořádat s mikrofony notebooků, které využívali jen zřídka (pokud vůbec).

V loňském roce pak počet dodavatelů nabízejících click-to-dial widgety nerostl tak rychle jako v minulých letech a nevypadá to, že by se letos měla situace nějak zvlášť zlepšit.

2. Operátor použije WebRTC k přijetí hovoru. Dominantním případem využití WebRTC v kontaktních centrech v loňském roce bylo příjímání příchozích hovorů pomocí WebRTC operátory kontaktního centra.

Uživatelé se dovolali a byli přesměrovaní přes firemní systém IVR (Interactive Voice Response) do kontaktního centra. Namísto přepojení na fyzický telefon nebo na softwarového klienta IP telefonie na desktopovém počítači operátora se však hovory směrovaly do webového prohlížeče operátora.

Oddělení IT má v takovém případě menší počet dodavatelů a méně softwaru, který by bylo potřebné spravovat a udržovat, a to firmě umožňuje rozšiřovat fyzické kontaktní centrum, takže mohou agenti pracovat odkudkoliv.

Stejnou funkci může použít operátor nebo prodejce k volání ven ze systému CRM přes prohlížeč a WebRTC na telefonní linky uživatelů.

Toto schéma se stalo primárním způsobem využití technologie WebRTC v kontaktních centrech v roce 2015. Společnosti jako LiveOps, Zendesk a Freshdesk používají WebRTC klienta společnosti Twilio k provozování této konektivity mezi svými systémy CRM a cloudovými službami linek podpory. Očekává se, že tento trend bude i nadále pokračovat a postupně si najde místo i ve větších podnicích.

 

3. Zavolání surfařům identifikovaným přes analytiku. Když si lidé prohlížejí webové stránky, sbírá se přitom mnoho informací – jako například jak dlouho se dívají na některé stránky, odkud jsou, na co klikli atd. 

Někteří dodavatelé posunuli tyto možnosti ještě o krok dál. Namísto pouhého shromažďování těchto informací a použití marketingových automatizovaných metod k zasílání nabídek takovým lidem lze zahájit telefonický hovor z kontaktního centra, okamžitě zavolat osobě právě si prohlížející příslušné stránky a přímo se zaměřit na potenciálního klienta na základě informací v reálném čase. Jedním z dodavatelů působících v této oblasti je Altocloud.

Hodí se to nejvíce pro weby, kde mají transakce spíše vyšší hodnotu a operátoři jsou více orientováni na prodej než na služby či podporu.

WebRTC byl v tomto případě chybějící článek. Všechny ostatní používané technologie – webové stránky, CRM i analytické nástroje – již internetové technologie používají. Hlasové hovory a videohovory využívající WebRTC jsou tedy přirozeným doplňkem.

 

4. Hovory přes samoobslužné aplikace s možností volat přes WebRTC. WebRTC směřuje i do mobilních aplikací. Protože jde o open source technologii, lze WebRTC portovat na platformy iOS či Android a integrovat ji do konkrétních aplikací.

Do jisté míry je to způsob, jakým společnost Amazon implementovala Mayday – její službu podpory pro Kindle Fire založenou na videohovorech. Stejně tak došlo k rozšíření o videopodporu u samoobslužné aplikace AmEx na platformě iPad.

Jak stále více firem přidává podporu komunikace do svých samoobslužných aplikací, také více z nich používá WebRTC k zahájení mobilních hovorů namísto přesměrování na bezplatné telefonní linky. Hlavní výhodou je přidání užitečného kontextu k interakci, což přináší snížení průměrné doby obsloužení.

Pokud lze říci, že rok 2015 byl charakteristický využitím rozhraní WebRTC operátory kontaktních center, rok 2016 je ve znamení využití WebRTC v samoobslužných aplikacích pro kontaktní centra.

Proč je to důležité? Kontaktní centra se vyvíjejí. Mnoho z nich přesouvá pozornost na sociální sítě a vícekanálová řešení. WebRTC v této transformaci hraje významnou roli, protože přenáší obyčejný telefonní hovor kontaktního centra na zcela novou úroveň tím, že z něj dělá flexibilní a výkonný nástroj pro komunikaci se zákazníky.

Firmám, které se snaží maximalizovat kvalitu služeb zákazníkům a neustále pracují na zlepšení zákaznických zkušeností, pomůže technologie WebRTC nasazená v kontaktním centru v jejich úsilí co nejvíce vytěžit existující příležitosti.

docker + kubernetes školení s dotací tip

 

Tento příspěvek vyšel v Computerworldu 10/2016. Časopis (starší čísla i předplatné těch nadcházejících) si můžete objednat na adrese našeho vydavatelství.

'; document.getElementById('preroll-iframe').onload = function () { setupIframe(); } prerollContainer = document.getElementsByClassName('preroll-container-iframe')[0]; } function setupIframe() { prerollDocument = document.getElementById('preroll-iframe').contentWindow.document; let el = prerollDocument.createElement('style'); prerollDocument.head.appendChild(el); el.innerText = "#adContainer>div:nth-of-type(1),#adContainer>div:nth-of-type(1) > iframe { width: 99% !important;height: 99% !important;max-width: 100%;}#videoContent,body{ width:100vw;height:100vh}body{ font-family:'Helvetica Neue',Arial,sans-serif}#videoContent{ overflow:hidden;background:#000}#adMuteBtn{ width:35px;height:35px;border:0;background:0 0;display:none;position:absolute;fill:rgba(230,230,230,1);bottom:20px;right:25px}"; videoContent = prerollDocument.getElementById('contentElement'); videoContent.style.display = 'none'; videoContent.volume = 1; videoContent.muted = false; const playPromise = videoContent.play(); if (playPromise !== undefined) { playPromise.then(function () { console.log('PREROLL sound allowed'); // setUpIMA(true); videoContent.volume = 1; videoContent.muted = false; setUpIMA(); }).catch(function () { console.log('PREROLL sound forbidden'); videoContent.volume = 0; videoContent.muted = true; setUpIMA(); }); } } function setupDimensions() { prerollWidth = Math.min(iinfoPrerollPosition.offsetWidth, 480); prerollHeight = Math.min(iinfoPrerollPosition.offsetHeight, 320); } function setUpIMA() { google.ima.settings.setDisableCustomPlaybackForIOS10Plus(true); google.ima.settings.setLocale('cs'); google.ima.settings.setNumRedirects(10); // Create the ad display container. createAdDisplayContainer(); // Create ads loader. adsLoader = new google.ima.AdsLoader(adDisplayContainer); // Listen and respond to ads loaded and error events. adsLoader.addEventListener( google.ima.AdsManagerLoadedEvent.Type.ADS_MANAGER_LOADED, onAdsManagerLoaded, false); adsLoader.addEventListener( google.ima.AdErrorEvent.Type.AD_ERROR, onAdError, false); // An event listener to tell the SDK that our content video // is completed so the SDK can play any post-roll ads. const contentEndedListener = function () { adsLoader.contentComplete(); }; videoContent.onended = contentEndedListener; // Request video ads. const adsRequest = new google.ima.AdsRequest(); adsRequest.adTagUrl = iinfoVastUrls[iinfoVastUrlIndex]; console.log('Preroll advert: ' + iinfoVastUrls[iinfoVastUrlIndex]); videoContent.muted = false; videoContent.volume = 1; // Specify the linear and nonlinear slot sizes. This helps the SDK to // select the correct creative if multiple are returned. // adsRequest.linearAdSlotWidth = prerollWidth; // adsRequest.linearAdSlotHeight = prerollHeight; adsRequest.nonLinearAdSlotWidth = 0; adsRequest.nonLinearAdSlotHeight = 0; adsLoader.requestAds(adsRequest); } function createAdDisplayContainer() { // We assume the adContainer is the DOM id of the element that will house // the ads. prerollDocument.getElementById('videoContent').style.display = 'none'; adDisplayContainer = new google.ima.AdDisplayContainer( prerollDocument.getElementById('adContainer'), videoContent); } function unmutePrerollAdvert() { adVolume = !adVolume; if (adVolume) { adsManager.setVolume(0.3); prerollDocument.getElementById('adMuteBtn').innerHTML = ''; } else { adsManager.setVolume(0); prerollDocument.getElementById('adMuteBtn').innerHTML = ''; } } function onAdsManagerLoaded(adsManagerLoadedEvent) { // Get the ads manager. const adsRenderingSettings = new google.ima.AdsRenderingSettings(); adsRenderingSettings.restoreCustomPlaybackStateOnAdBreakComplete = true; adsRenderingSettings.loadVideoTimeout = 12000; // videoContent should be set to the content video element. adsManager = adsManagerLoadedEvent.getAdsManager(videoContent, adsRenderingSettings); // Add listeners to the required events. adsManager.addEventListener(google.ima.AdErrorEvent.Type.AD_ERROR, onAdError); adsManager.addEventListener( google.ima.AdEvent.Type.CONTENT_PAUSE_REQUESTED, onContentPauseRequested); adsManager.addEventListener( google.ima.AdEvent.Type.CONTENT_RESUME_REQUESTED, onContentResumeRequested); adsManager.addEventListener( google.ima.AdEvent.Type.ALL_ADS_COMPLETED, onAdEvent); // Listen to any additional events, if necessary. adsManager.addEventListener(google.ima.AdEvent.Type.LOADED, onAdEvent); adsManager.addEventListener(google.ima.AdEvent.Type.STARTED, onAdEvent); adsManager.addEventListener(google.ima.AdEvent.Type.COMPLETE, onAdEvent); playAds(); } function playAds() { // Initialize the container. Must be done through a user action on mobile // devices. videoContent.load(); adDisplayContainer.initialize(); // setupDimensions(); try { // Initialize the ads manager. Ad rules playlist will start at this time. adsManager.init(1920, 1080, google.ima.ViewMode.NORMAL); // Call play to start showing the ad. Single video and overlay ads will // start at this time; the call will be ignored for ad rules. adsManager.start(); // window.addEventListener('resize', function (event) { // if (adsManager) { // setupDimensions(); // adsManager.resize(prerollWidth, prerollHeight, google.ima.ViewMode.NORMAL); // } // }); } catch (adError) { // An error may be thrown if there was a problem with the VAST response. // videoContent.play(); } } function onAdEvent(adEvent) { const ad = adEvent.getAd(); console.log('Preroll event: ' + adEvent.type); switch (adEvent.type) { case google.ima.AdEvent.Type.LOADED: if (!ad.isLinear()) { videoContent.play(); } prerollDocument.getElementById('adContainer').style.width = '100%'; prerollDocument.getElementById('adContainer').style.maxWidth = '640px'; prerollDocument.getElementById('adContainer').style.height = '360px'; break; case google.ima.AdEvent.Type.STARTED: window.addEventListener('scroll', onActiveView); if (ad.isLinear()) { intervalTimer = setInterval( function () { // Example: const remainingTime = adsManager.getRemainingTime(); // adsManager.pause(); }, 300); // every 300ms } prerollDocument.getElementById('adMuteBtn').style.display = 'block'; break; case google.ima.AdEvent.Type.ALL_ADS_COMPLETED: if (ad.isLinear()) { clearInterval(intervalTimer); } if (prerollLastError === 303) { playYtVideo(); } break; case google.ima.AdEvent.Type.COMPLETE: if (ad.isLinear()) { clearInterval(intervalTimer); } playYtVideo(); break; } } function onAdError(adErrorEvent) { console.log(adErrorEvent.getError()); prerollLastError = adErrorEvent.getError().getErrorCode(); if (!loadNext()) { playYtVideo(); } } function loadNext() { iinfoVastUrlIndex++; if (iinfoVastUrlIndex < iinfoVastUrls.length) { iinfoPrerollPosition.remove(); playPrerollAd(); } else { return false; } adVolume = 1; return true; } function onContentPauseRequested() { videoContent.pause(); } function onContentResumeRequested() { videoContent.play(); } function onActiveView() { if (prerollContainer) { const containerOffset = prerollContainer.getBoundingClientRect(); const windowHeight = window.innerHeight; if (containerOffset.top < windowHeight/1 && containerOffset.bottom > 0.0) { if (prerollPaused) { adsManager.resume(); prerollPaused = false; } return true; } else { if (!prerollPaused) { adsManager.pause(); prerollPaused = true; } } } return false; } function playYtVideo() { iinfoPrerollPosition.remove(); youtubeIframe.style.display = 'block'; youtubeIframe.src += '&autoplay=1&mute=1'; } }
OSZAR »