Track OSD

Resolve shipping issues faster through video chat

Comment

Inspiration

Online shoppers, retailers, and shipping carriers currently do not have a video-based platform where they can efficiently log, share, and work through any ecommerce overage, shortage, and damage (O.S.D.) shipping issues . When an online shopper receives a damaged package or package with missing or incorrect items, they must email numerous pictures with lengthy descriptions or explain their issue over the phone without any visual aids. In addition, retailers and shipping carriers must reach disposition on damaged or over shipments without any visual evidence or proof.

What it does

Currently, an online shopper can input the tracking number of their package to view shipping details. At the bottom of the page, the shopper can choose to connect with customer service via video chat by pressing the webcam icon. Then, once they choose the issue category, they will be connected to a video chat channel.

How I built it

I used HTML, CSS, and Javascript to build the user interface including the main tracking number and video chat channel pages.

I utilized the Agora Video SDK for Web version 2.5.0, particularly the following new features released in the 2.5.0 version:

While the customer waits to be connected with a customer service rep, an audio of an advertisement of retailer or shipping carrier can be play:

Stream.startAudioMixing

Stream.stopAudioMixing

Stream.pauseAudioMixing

Stream.resumeAudioMixing

Stream.adjustAudioMixingVolume

Stream.getAudioMixingDuration

To help the customer and customer service adjust volume:

Client.enableAudioVolumeIndicator

To help customer service keep track of call quality and continue to improve service

Client.getRemoteVideoStats

Client.getRemoteAudioStats

Client.getTransportStats

In the future, I would like to utilize the StatsMap to gather data that could help improve customer service such as how long a video call lasted, how long did the channel take to initialize (or how long did the customer wait to get connected with a rep), etc.

Challenges I ran into

Initially, I did not include quotation marks around my AppID so the user could not automatically log onto the channel. They had to be notified of and input the AppID manually.

Since at first, I did not know how to host a web page on a web server, I would test my app on my local computer and run into numerous errors.

I am still struggling to fully implement the audio mixing features at different positions during the call. At the beginning, I want the mix audio to play only when one person is on the call and is waiting for a rep to connect. During the call and at the end, even if the custoner is still in the channel once the rep has resolved the issur and left, I do not want the mix audio to play.

What I learned

I am new to web development and the Agora Video SDK was the first RTC API that I integrated onto a website. I learned how to:

  1. Integrate the Agora Video SDK onto a webpage
  2. Read and search for different features in Agora Docs Center
  3. Host my video chat app on a web server by activating Github Pages for my repository

What's next for Track OSD

Since I work at a third-party logistics company, I will continue to explore how video chat integration in customer service can help reduce the amount of emails and attachments that we need to track and lower the turnaround time for shipping resolutions.

In the future, I hope that Track OSD can become a comprehensive video-based logging system for shipping clams and disrupt the shipping claims insurance sector. I further explore Agora's "Publish" feature to store video of communication between warehouses, retailers, and transport carriers and "Live Broadcasting" feature to have claims adjusters review O.S.D. claims without being on site at a shipping dock.

Built With

Share this project:

Updates