Hooray App, 讓遠端工作更順暢的第二次嘗試


-

2020 x remote work

想不到 2020 就在 COVID-19 的混亂中過去了,今年時常想起不知世界何時才會恢復正常,現在則覺得所謂「正常」的定義已經徹底被改變了,只能期盼因著疫情被影響到的人能慢慢減少或至少影響程度降低。

公司的遠端工作政策調整從過年後持續到現在,疫情之前是每週一天可以遠端,後來變成每週一天進辦公室。一開始還算適應,大概是因為換了工作環境的新鮮感和各種討論等被打斷的機會減少,所以能夠更專注。但時間一放長,反而因為工作日常少了「人的元素」而變得枯燥。沒過多久就回去辦公室了。

依舊從發現問題開始

相信每個開始實行遠端工作的團隊,都會遇到少了面對面溝通機會造成的各種難題。身為一位想擁有 10x 影響力的打工仔,是不會輕易忽視任何能用軟體改變現狀的機會的。這回讓我最想改變的是遠端 all hands meeting 體驗。

公司每個禮拜固定會有 all hands meeting,會議中有 shoutouts section-會議主持(通常是老闆)分享本週各個 team 或成員對彼此的感謝,例如:某 sales 感謝其他 sales 因為完成了很多困難的業務、某成員感謝產品團隊因為完成了新產品並推出等等。

在 full remote 之前,shoutouts 是非常歡樂的,因為多數人是待在同一個會議室,每當分享完一則 shoutout 大家會很自然的鼓掌歡呼。但是 full remote 之後,因為多數人都沒有在同一個實體空間裡參加,就少了很多互享鼓舞的互動。

造成這樣現象的原因應該不太難想像,我認為有以下幾種:

總之 shoutouts 最後變成剩下老闆一人在自 high,其他參加者就是默默地面帶微笑外加按一按 Zoom 的 emoji reactions 無聲地表達內心的澎湃。

重建互動感的可能

每週一次的尷尬 3~5 分鐘持續了許久,某次突發奇想覺得如果每個 shoutout 後,參加者能用某種方式觸發會議 screen sharer 的電腦,播放出罐頭歡呼聲,像是煙火聲、群眾歡呼聲、甚至是傳統鞭炮聲(雖然後來發現實在太吵),而所有參加會議的人都能聽到。這樣似乎能夠:

有了這個念頭的當下,其實已經大致想到可能的實作方式了。

使用情境假設

先來拆解一下控制別人電腦播出聲音這件事,它包含了:

而我認為後者是需要先被確定的,畢竟最終是要讓被控制者的電腦能播放出聲音。所以誰來播放?怎麼播放?被控制者需要做多少事情才能被播放?這些問題需要先被回答才能決定下一步。

因為目前 all hands meeting 筆記是用 Dropbox Paper 網頁版(沒錯,剛剛查了一下才知道 Paper 也有桌機版),會議進行時通常會由主持分享螢幕給大家看。這樣的前提下,使用瀏覽器來播放聲音會是相對低門檻的選擇,透過瀏覽器 extension 應該能夠做到被控制這件事。

控制者和如何控制就相對簡單,用我比較熟悉的網頁就能完成了。

最終想像中的架構如下

Hooray App structure

動手

Chrome extension - for screen sharer

一開始先從 screen sharer 使用的 Chrome extension 下手,搭配 Firebase Cloud Firestore,目標是實作出能夠透過 extension 介面產生網頁連結,這個網頁就是給會議參加者觸發播放背景音效用的。

最終 extension 的使用方式是這樣:

  1. 點擊 extension icon 後 popup 內看到 Hooray 按鈕 Extension step 1

  2. 點擊 Start Hooray 按鈕,顯示給參加者用的網頁連結 Extension step 2

Hooray 按鈕背後做的事情主要有這幾個:

extension background 的任務則是:

Web - for participants

這部分的實作相對單純,大概的長相如下:

web

當 Hooray 按鈕被點擊時:

User flow recap

這邊重新順一下使用流程:

角色/事件序screen sharerparticipants
1點擊 extension 的 Start Hooray button
2分享網頁連結給 participants
3前往網頁
4點擊網頁上的 Hooray 按鈕
5extension background 收到 Hooray 事件並播放音效
7從 Zoom meeting screen sharing 聽到音效

難得沒出事的 demo

做完的隔天剛好就是 all hands meeting,簡單介紹這個 App 想嘗試解決的問題後就直接進入 shoutouts section 開始 demo。因為還沒有打包上架 Chrome Web Store 的關係,前一天臨時跟老闆喬好一樣由他主持 shoutouts 但由我來 share screen。

結果除了一開始 share screen 忘記勾「Share computer sound」小落漆了一下,整個 demo 蠻順利的,自己預期中的差不多,shoutouts section 再度活絡了起來。更讓我意外的是大家都蠻配合掌握按 Hooray 按鈕的時機,整個效果又再往上推了一點。

後記

其實做這個 App 的念頭已經存在許久,一直拖到要在 dev team sharing 時分享才花了半個假日下午跟一個差點見日出的夜晚完成。因為沒有寫過 Chrome extension;Firebase 也只用過早期一點的 Realtime Database;甚至 UI 部分還硬把沒碰過的 Svelte 拿來用。整個過程是在翻文件、找範例、寫 code、debug 反覆交錯之中,一點一點把 App 拼湊出來。記得第一次聽到透過網頁觸發 extension background 播放出的音效時,真的是感動到電腦蓋起來就去睡覺。

Demo 結束之後當然也有一些意見反饋,例如:音效有時太大聲會蓋過說話的人的聲音、音效太過重複等。這些就之後再來慢慢微調了。

能親手用技術解決問題並且能影響一些人的感覺真的很棒,這回也再次體會了人在有死線壓力之下學習力跟執行力的大爆發。至於標題提到的「第二次嘗試」其實是因為 2020 上半年我有做了另一個同樣要解決遠端工作後遇到的問題的 side project,有機會再來跟大家分享。

期待下一個等待我去解決的問題 👨🏻‍💻