劉連響:為什麼看好小程序音視頻在教育行業的應用?
作者簡介:劉連響,一起玩耍科技創始人。2013年起開始研究WebRTC, 對音視頻處理、 直播、實時音視頻相關技術非常感興趣,具有多個實時音視頻產品研發經驗。目前關注實時音視頻在在線教育,醫療行業的應用。
今天為大家帶來的分享是:小程序實時音視頻在互動教育場景下的應用。我個人一直在做基礎方面的研究,接觸音視頻也比較早,2013年的時候就開始做包括直播在內的相關產品,有多個音視頻研究的相關經驗。目前我們關注教育、醫療方向的音視頻,以及有關這方面的應用。
下面是我與客戶溝通中列出的一些問題,也就是做一個線上教育實時互動的產品會面臨的問題:
沒有攝像頭。比如一個PC機,有些是沒有攝像頭。如果想要進行視頻教育,需要額外買一個攝像頭。這就是用戶端遇到的問題。
背景比較混亂。一個孩子在固定的電腦前,因為身後的背景比較混亂,可能會不太願意打開視頻。固定電腦沒有辦法很好地移動,這也是一個問題。
終端設備多樣。大家使用的是iPad、手機以及各種各樣的電腦,這是多樣設備適配的問題。
設備調試。設備的調試跟上一個問題相輔相成,我們發現一些教育客戶,要花很多能力給它的C端用戶做培訓,手機上沒有聲音,聲音變小了,或者類似各種各樣的問題,他要花很多人力進行遠程電話支持,你要怎麼操作。
教務系統多種。這是面對SaaS客戶遇到的問題,沒有辦法接入到排課系統。
網路延遲、視頻卡頓。目前為止沒有一個特別完美的解決方法,只能說行業在不斷進行優化,提升體驗。
以上是我列出的問題。有人提到音視頻延遲這部分的問題,音頻很流暢,但是視頻不行,這個技術問題可以歸為視頻卡頓中。
小程序音視頻是怎麼解決這個問題的呢?先說一下方案介紹。
零基礎快速對接。這個比較好理解。小程序提供音視頻組件JS API,無須具備音視頻基礎知識就可以進行應用。
卓越的音視頻品質。騰訊已經做了十幾年,從QQ時代就有視頻通話,質量是端到端、400毫秒以下的延遲、800毫秒的網路抖動,30%丟包。
跨平台互通。小程序、安卓、IOS、Web端,都可以用它的SDK去解決這個問題。
我們為什麼會看好小程序音視頻在教育行業的應用呢?
首先是統一的平台」微信OS」,主要有以下幾點:
第一,統一的賬戶系統。一個APP需要用戶去註冊登錄,而微信有用戶頭像,有完備的用戶信息, 這是微信已經做好的。
第二,標準的介面。小程序的介面很標準,只要記住兩個東西就可以,一個是上,一個是下。這兩個有相關的介面,只要記住有上有下就可以了。
第三,極簡的API。
第四,軟硬體遍解碼底層適配。如果你做音視頻相關的解決方案,尤其是安卓端,iOS還好一些。安卓端因為每個平台硬體的底層不太一樣,需要進行適配,比如高通的、三星的、英特爾的晶元,可能每家每個型號的晶元、表現都不一樣,這時就需要花很長的時間做適配。我們做這個東西就很痛苦,沒有辦法通過簡單的代碼來解決。
在小程序里就不需要擔心了,騰訊基於多種機型的適配,已經做得比較完善了。
第五,降噪回升消除。為什麼有回聲?背景為什麼那麼噪雜?這是比較難解決的問題,行業里真正做得好的只有很少一部分。
第六,統一的操作路徑。小程序都是一樣的規範、一樣的操作,這些都是非常統一的。
以上是統一平台的部分,下面介紹非常低廉的群傳播、打開成本。這是我們的界面,相當於創建一個課堂之後,小程序為你提供了分享的介面,可以做分享的動作。它的分享成本非常低廉。我們假設在原生的APP場景分享了一個鏈接之後,別人需要下載一個APP進行註冊,再回到那個房間、教室,小程序可以極大地簡化這個流程。
小程序生態完備。在教育環境,我們有四個環節,教、練、測、管。大家看到錄播產品、直播產品,經常在朋友圈轉發的課程,這是教的環節。練的環節,我們看到的一些相關產品,比如打卡、題庫、作業等,各位多多少少也接觸過。測,就是線上考試、比賽、PK的部分。管,就是基於微信群,或者一些督學和家長溝通的工具。在微信小程序環節裡面,每一個環節裡面都有相應的產品。你再設計解決方案的時候,完全不需要做一個教育產品,還需要做其他的嗎?不需要了,你可以在這個生態里只做你擅長的教學內容,其他部分可以和整個生態其他的工具串聯起來,你可以有相對統一的用戶唯一標識,這是一個非常好的生態,可以幫助你的業務更好地發展。以上是我總結出來的三個點,統一的平台、低廉的傳播成本和完備的生態。
那麼我們是怎麼做的呢?我們剛開始就做了一些小的嘗試,內部已經有了產品,下面主要為大家講一下這個過程中的幾點。
首先是基礎框架,騰訊官網推出了一個官方的小程序框架,我們選了vuejS和wepy這兩個技術。如果你會這兩個,一天就可以進行小程序開發了。另外一個是socketio。市面上有些人做了一些第三方的實現,但是我們發現它的bug很多,因為它畢竟不是為小程序而生的,只能移到小程序中使用。typescript的前端和後端都可以用同樣的語言來開發,大部分的數據都直接存在redis裡面,像一些實時的場景,比如房間管理、操作歷史等一系列相關的東西都可以用Reids。我們一開始的時候也有被坑到的點,音視頻的部分需要單獨開放許可權,它開放了直播、教育、醫療和金融這四個分類。如果不開放許可權,在調用相關介面的時候就會報錯,這裡還是需要設置一下。
下面介紹一下產品設計的時候需要特別注意的部分,因為音視頻是一個原生組件,它的層級比其他都要高,這時不能做複雜的交互。簡單的滑動還可以做,其他的複雜交互不太好做,比如動畫、放大、縮小,很容易造成閃退。最好布局和UI相對簡單固定的,我們一開始的交互設計比較複雜,最終改了兩個版本,比較簡單一些。但現在還有這樣的問題存在,需要用更長的時間進行優化。音頻比視頻更簡單一些,因為它的資源消耗比視頻小很多,音頻的房間幾十個人都沒有問題,主要是看大家的需求。兩三個人進行互動,其他人觀看,是這樣的一個場景。
教育跟白板是少不了的,包括視頻白板。我們做了ppt、doc、pdf格式,現在的版本做得相對簡單,相當於把PPT、文檔和PDF轉成一張張圖片進行同步,包括回放的錄製。回放後,需要滑鼠的指示或三角形、畫線操作,在進行廣播的時候可以同步在學生端。
文檔格式轉換,因為會涉及到一些變形的問題,我們摸索出來比較好的方式就是用OpenOffice headless mode。它沒有UI,可以拿來操作,通過OpenOffice headless mode的介面進行轉換。經過測試下發現它的還原度比較好,不會有太多變形。騰訊雲也有文檔轉換的服務,因為我們已經做了這個部分,也希望對這個系統更可控,所以就自己做了一套轉換的服務。
操作歷史記錄,比如老師翻到下一頁、老師畫了一個三角形,這些都需要記錄下來。提供給你一個時間戳,在回放的時候,根據時間軸就可以。
多人授權白板,相當於老師布置了一個任務讓學生進行操作,可以將白板授權給學生,學生來操作白板,老師也可以把許可權收回。
動畫、音頻、視頻的支持,目前來看沒有很好的方案。例如一些幼教的產品,3歲到6歲這種,它的可見非常活潑、非常豐富,各種動畫、視頻比較多。單純的圖片轉換不太能滿足這種需求,這時就需要一些機構進行動畫相應的轉化。目前,小程序的底層技術還無法很好地支撐這些東西,我們可以在PC端進行這部分。
小程序暫時沒有辦法支持PDF,這不是小程序的問題,而是操作系統的問題,上傳的時候只能選圖片和視頻。現在iOS已經支持了,可以選擇其他文件。而安卓還沒有一個統一的結構,小程序目前還不能支持,只能上傳一張張圖片。
雲端錄製可以方便學生之後再進行學習,騰訊在小程序音視頻上提供了雲端的錄製,其實就是標準的rtmp流。這部分是額外收費的,如果需要錄製的服務可以進行開通。
關於截圖鑑黃,教育場景有必要做這些嗎?還是非常有必要的。在中國這種大的環境下,多注意都不過分,以防萬一,這部分真的非常有必要。
關於雲端混流,比如說一個房間裡面有五路音視頻,你需要把這些流混起來。還有一些其他更特殊的場景,需要將PPT和老師的操作都混起來,這是有一些麻煩的。目前騰訊雲的方案提供了視頻的混流,可以將多個視頻混流,但還沒有提到PPT和音視頻混流的方案。這部分我們自己有實現一套方案,你可以把音視頻錄製下來再進行合成。因為我們之前做過類似方案,有一些相應的技術積累,我們盡量在做服務的時候,能可以自己把控的就盡量自己把控。
關於雲存儲,在錄製下來之後存放在騰訊雲上面就可以了。
關於合成ffmpeg、moviepy,如果遇到一些合成效果就可以來研究一下,常見的視頻效果都可以通過幾行命令行來搞定。
關於瀏覽器合流、screen recorder,大家想像一個場景,在整個教育過程中需要回放合流的時候,假如一個房間五個人,在服務端合流很難完美地浮現學生當時看到的場景,因為回放和學生當時看到的不是完全之一致的。而且像PPT這種操作,沒有辦法完美合進去。這時候我們有一些技巧,瀏覽器的合流可以把幾個視頻合成一個流。甚至把白板、視頻、音頻都合成一個視頻錄製下來上傳到服務端。它可以將當前窗口完美錄製下來,比合流的效果更好一些。這個方案可以考慮,但是有限的瀏覽器支持,作為一個對服務端混流的補充。
我們應該怎麼做呢?
WebRTC大家都了解,可以很快地做一個demo。小程序為了節省資源,用的不是RTC的技術,很多市面上的產品已經有那麼多平台支持了,這要怎麼辦呢?騰訊確實也提供了這樣的方案,像WebRTC。小程序的音視頻就是rtmp,它在傳輸時基於UDP的協議,只需要將這兩個東西打通就可以。騰訊在服務端已經在做將這兩種動態打通,我們正常去做音頻轉碼就可以了。騰訊雲團隊將相關的操作都已經封裝成一個比較好的組件,比如RTC多人動畫的組件。
WebRTC這部分的能力可以使PC端和小程序進行互通,打包成一個組件提供給大家。同時它也提供相應的服務端的代碼,有java版本。它提供的服務可以某種程度滿足你的需求,畢竟做得相對集成一些,我們相當於在這個基礎之上,自己封裝了一套,因為還有很多定製化的需求在。比較好的是你可以快速搭建一個demo,很快地跑起來看到是什麼效果。如果真正做深的話,還要基於自己的理解去封裝一套東西。
我們說了一些好的方面,接下來再說一下存在的問題:
視頻原生組件,不能做太多複雜的交互。視頻的部分,它的原生組件,在視頻上沒有辦法做複雜的交互。比如視頻之上不能覆蓋東西,或者只能覆蓋一些比較簡單的東西,基於視頻的動畫也不可以。
品類限制。現在只有四個品類,限制比較多。教育品類已經開放,大家可以使用,也希望可以開放更多的品類,做出更多的場景。
不支持pad。在相對大屏上是不可以的,只能用PC端的產品來進行替代。
不支持模擬器調試。正常開發一個場景,在寫完代碼後,用這個手機掃一下,另外一個手機再掃一下,調試過程相對痛苦,希望可以支持中遠程去調試。
上傳文件的限制。這是操作系統的限制,不是小程序的限制。我們希望在操作系統進化的時候,小程序也將相應的能力提升上去。
Q/A
Q:我們發現市場有個特定的應用,剛好跟視頻結合比較完美,數量大概有1億以上。目前了解到有沒有支持到這個量級?這個應用已經到了1億的瀏覽量上,不知道您現在做的應用,有沒有支持大並發?
A:視頻能支持這種量級很難,比如鬥魚這種高並發級別宣稱有幾百萬,其實也到不了,可能幾十萬已經差不多了。主要的壓力在於視頻,比如現在有的機構一天的課堂數有幾萬節,這已經非常多了。像你說的1億可能是應用人數,這不一定就代表了高並發。
Q:您是公司的創始人,我不是做互聯網行業的,對這部分不太了解。作為一個外行人想問兩個關於產品的問題。第一,我們基於騰訊雲小程序所做的開發,隨著用戶量越來越龐大,對於騰訊雲小程序的耦合性越來越緊。緊耦合性將帶來一個問題,對騰訊的依賴會越來越深。現在量沒有上去時對我們不收費。量級上去就會收費很多。而且,騰訊有自己的公開課或騰訊課堂,我們做的產品對騰訊的市場有了衝擊,我們還依賴於它,這種問題應該如何處理?
A:我說一下自己的看法,每個階段你都有應該考慮的問題。首先更多的還是把產品打磨好,第二個階段其實你已經有足夠的能力擺脫這方面的限制。一個很現實的情況就是,如果你到達一定量級後,很多公司到了C輪、D輪級別,才開始大量去鋪自己的基礎IT設施。我覺得如果到了兩個量級,再考慮這個問題比較OK。我跟騰訊雲交流比較多,他們選擇一種合作模式,這點從過去幾年騰訊一些具體例子可以看到,我認為騰訊還是相對開放。你的問題可能會作為憂慮的一部分,但更多還是把自己的產品做好,讓更多的人使用。
Q:現在大家基於小程序做了很多程序,做了自己的APP。平台是沒有技術壁壘的,一個沒有技術壁壘的產品,是很容易被模仿的。不知道您的投資人是否諮詢過關於技術這部分的問題,如果沒有技術壁壘,如何在同類產品突出自己的產品亮點,或者憑什麼吸引我們?比如教育行業的一些名師就是師資資源上的亮點,但從程序本身,有沒有可以打造亮點的地方?
A:技術和產品在這個環節中的應用我想要說明一下,雖然我是技術出身,很重視技術,但是不得不承認一點,在某些行業里技術和產品只是第一步,是重要的第一步。每個公司、每個業務一定是一個整體。你不能說,我只有這一部分強。教育行業是很重服務的,它有很多老師。在這種場景下,它確實很重要,同時還有上層的業務打造。考慮這個問題的時候,還是要想清楚自己的優勢,自己能做什麼?有什麼樣的資源?如果你有技術,確實可以省去很多的時間和精力。
![](https://pic.pimg.tw/zzuyanan/1488615166-1259157397.png)
![](https://pic.pimg.tw/zzuyanan/1482887990-2595557020.jpg)
※如何在雲上構建容器化的大規模計算平台?
※如何成為優秀的全棧工程師?面向未來的跨界開發技術(下)
TAG:雲加社區 |