帶你探索雙十一光明頂監控大屏
1、專案背景
光明頂資料監控屏是每年在雙十一、雙十二前後,投屏在光明頂的作戰指大屏,供在場的工作的同學協同辦公,發現問題。雙十一和雙十二是每位技術人的大團建,在光明頂作戰室的近20個BU的兩百多名同學,其餘分作戰室10餘個,這也是每年一次的超大規模人機協同。
回顧近三年的監控大屏設計,為了給技術同學營造更好的資料閱讀體驗,每一年我們都在思辨如何改進。但由於硬體上的限制,我們大多從配色,字號等細節方面優化,對於整體的佈局以及綜合體驗難以有更大的變動。
今年,業務的量級和發展趨勢已快速擴充套件到更大的維度 ,技術也迎來的更大的挑戰,已有的監控模式已難以覆蓋如今的業務體量。 加之我們平日已經對於資料大盤已有一定的平臺沉澱,光明頂大屏硬體也在一定程度上有所升級,環境的驅動,監控模式的突破性體驗升級勢在必行。
我們從頭梳理大屏的使用場景,發現了它目前在於體驗的維度上相當侷限。我們從三個維度去衡量整個監控體驗:
業務視角(即業務訴求)是否全面?體驗旅程(即使用者訴求)是否覆蓋全面? 體驗接觸點是否能有所創新或擴充套件?
2、呈現一個全方位的業務視角
以往的光明頂的監控大屏是一個”巨大的Dashboard”,佈局上沒有明確的重心和視覺焦點。又由於硬體的限制,內容在佈局上沒有整體性,各為一體。今年我們首先根據硬體升級的程度,將大屏分為一主屏,兩輔屏的方式,讓佈局上更加聚焦的同時保持業務視角的覆蓋。
接下來,根據大屏的物理拼接方式來劃分整個大屏的柵格,以及業務模組,這樣能夠儘量避免內容出現在拼接縫的位置,這種拼接縫在展示時一般會吃掉2px左右。
在視覺設計過程中,遵循這樣一個由中間向兩邊擴散的層級關係進行。同時,選擇主屏來詮釋我們的業務層級關係,底層是基礎設施的分佈,為我們中間層為淘系及支付寶核心交易資料,這兩大核心資料支撐整個GMV。
主屏會聚焦在當下場景所關注的核心資料,一般不做變化,輔屏根據投屏的臨時需求隨機更換。譬如,當壓測時,“業務一”出現了問題,使用者可以通過語音互動或Ipad在輔屏空間內,放大“業務一”的內容。
主屏會聚焦在當下場景所關注的核心資料,一般不做變化,輔屏根據投屏的臨時需求隨機更換。譬如,當壓測時,“業務一”出現了問題,使用者可以通過語音互動或Ipad在輔屏空間內,放大“業務一”的內容。
3、覆蓋一個完整的體驗旅程
從往年來看,對監控的需求實際上從雙十一備戰期間就已經開始了。雙十一備戰從雙十一前很早就開始了,在這段時間持續保持強烈的對系統監控的需求。所以我們對整體監控的體驗流程應該從從雙十一備戰期間就開始切入,而不僅僅是雙十一當天使用。
今年我們讓各個場景的視角更加聚焦,壓測聚焦在系統穩定性、成功率上;雙十一當天將視角轉移到淘系交易相關內容上,雙十一白天10點之後隨著新零售業務加入雙十一的大軍,我們增加了新零售場景;在接近雙十一尾聲,我們增加更多回顧技術雙十一歷程等總結性的資料內容,以及拍照留念的內容。在整個體驗流程中,營造更多的驚喜點。
4、講述一個全體感的監控故事
感
資料是看不見摸不到的,怎麼樣才能讓使用者有更全方位的資料感受?我們轉換下思維,調動的五感的目的是什麼?當我們能夠真切的感受到一個物體的時候,實際上操控感、控制感的增加。從這個角度出發,我們首先嚐試了對大屏的靈活控制感:
監控屏的互動很麻煩,在多人協同的情況下,很難統一視角,所以,監控大屏的控制必須掌握在現場的指揮手中,聽從指揮排程。
IPad的切屏方式已經是非常成熟的方案,除此之外我們還嘗試了更加智慧的通過天貓精靈來切監控大屏。通過天貓精靈技術支援同學幫助,提前錄入切屏的話術達到智慧切屏的效果。(由於現場聲音嘈雜增加了隔音罩)
往年監控屏需要做好所有切屏預案,把可能發生的切屏場景都開發好,現場根據需要切預案。今年,我們通過DOA快速複製配置,並且同步移動端。這樣一來,每位同學都能夠掌控自己的大屏。
通過DOA的快速搭建同款雙十一監控大屏,衍生出眾多“戰區大屏”,用於各個作戰室進行投屏監控如螞蟻戰區、盒馬戰區,研發效能戰區,IDC戰區,高德戰區,導購戰區等等。
視
視覺作為五感中的最核心,今年我們也在思考如何更深入的營造監控氛圍。我們發現往年監控屏的”故事“講述的不完整,使用者都是直接閱讀到“故事的高潮”,並沒有開頭和結尾。今年,我們加入開場視訊,視訊內容從新零售出發,最後迴歸全球化監控視角,講述完整鏈路。為接下來所有的資料監控場景做好鋪墊。
每次壓測都會從夜晚持續到凌晨,開場視訊配上激昂的音樂,不僅從觀感上給在場的同學以儀式感,還能夠讓大家打起精神更好的狀態備戰。
情
上海媒體中心的技術大屏,是對阿里技術今年的一份答卷,這些資料凝結了阿里技術人的付出和奮鬥,它講述技術人這一年來前進的腳步。用這樣一份答卷作為光明頂監控的故事結尾最合適。
每個阿里技術人都為這個阿里巴巴締造了全球數字經濟時代的“作業系統”舔磚加瓦。在11號GMV出現歷史性顛覆時刻時(如超過去年峰值,超過2千億,零點),我們在光明頂作戰指揮大屏投上技術大屏及GMV,供大家拍照留念,記錄雙十一“高考交卷。
4、沉澱
在雙十一後我們將歷年的大屏樣式沉澱成各種大盤主題,並落地在平臺中。通過配置項變數統一控制大屏風格,最終達到一鍵切換主題的目的。