最近研究Chrome Extension,玩出了一些心得。突發奇想的想到,當我們在做系統的時候,都會需要有「管理」的功能,有些系統將管理功能整合在一起,例如wordpress,當你已經登入時,你就可以直接針對你在瀏覽的文章做「編輯」,不過「編輯」說穿了也是一個連結,其實這只是將這個功能放在所見即所得的地方,讓操作者能夠很快速的執行他所要操作的動作。然而也有些系統的管理需求,需要前後台分開,前台(給使用者看),後台(給管理者操作),如此較可以掌握安全性的問題,例如後台系統鎖IP,你不能從任何地方執行後台功能,也因此前台不會有任何程式漏洞造成使用者可以執行管理者權限的動作。
然而前後台分開,就會有所見不是所得的問題。例如新聞輪播系統,在前台看到新聞輪播,管理者發現某一則新聞的內容有問題,因此要去後台查這一則新聞出來做修改,結果到了後台發現,因為新聞太多,後台又沒有做篩選的功能,所以查起來眼花撩亂。這在管理上就造成一個很大的落差。
企劃:「能不能在做一個搜尋的功能讓我方便搜尋」
RD:「搜尋喔~可以是可以啦,不過現在前台的東西都做不完了,等我有空再做吧!」
檢討一下這個需求,其實這個需求並不是搜尋的需求,而是所見即所得的需求,管理者和使用者看到的畫面其實都一樣,但管理者多了管理的需求,因此需要對使用者看到的畫面做管理,但後台系統通常都做的很隨性,沒有設計,流程僅是工程師導向,因此每個操作後台系統的人永遠會說「這系統真是難用」,要什麼沒什麼。
那麼,「如何設計一個所見即所得的管理工具?」
上述提到,管理功能直接做在前台中,讓管理者登入之後就可以進行操作,這是最理想的方式,但由於安全性的考量,大部分嚴謹的系統都前後台會區分出來,因此造成後台「所見非所得,只能重新整理前台」。Chrome Extension有個特點:透過Extension,可以存取、修改content的DOM物件,因此我可以針對頁面內容做任意修改操作。重點來了,管理功能說穿了就是連結,只要我能將前台的管理功能顯示在畫面上,就能讓管理者「所見即所得」的操作。我們直接來看個範例圖。
簡單說明一下這個需求,在前台有很多的廣告顯示,然而廣告管理後台卻僅僅是列出所有廣告,管理者只能依照ID與「肉眼辨識頁面顯示位置」來做篩選,非常的不友善。這種需求非常需要所見即所得的功能來輔助管理者操作,因此我做了一個小工具,將頁面上的廣告顯示出來,並添加一個管理連結,讓管理者可以直接進入該廣告的管理頁面。概念非常簡單,實做也不難,只要能掌握一點javascrtip/ DOM的操作就可以達到這個需求。很簡單,對吧。而安全性的問題同樣也不是問題,因為這個工具只是帶連結過去,後台操作還是要登入才能執行。
雖然這個概念只是解決了管理者所遇到的問題,但我想這樣的方式可以大幅降低管理系統的操作流程,不用再煩惱後台的呈現方式。不過這也這讓我思考到,還有沒有類似的案例可以用這種方式來提供?野人獻曝,歡迎討論。