社区中心

登入的用戶可自由切換簡/繁字體喔!

了解更多

社区中心
Advertisement
社区中心

本文由鐵桶翻譯自2021年3月26日的英文社群中心網誌(有改動)。

大家好!

在遷移至統一社區平台(英文:Unified Community Platform,簡稱UCP)的過程中,最常被問到的問題之一就是「平台的新設計是怎樣的?」這就是我們今天要深入研究的問題。您將了解到新的FandomDesktop體驗的外觀樣式;這個項目有什麼,又沒有什麼;我們採納了哪些意見回饋;我們從Fandom和Gamepedia上吸取了哪些經驗和教訓;以及讀者和登入編輯者的不同體驗。

幾週前的社群交流會議上,我們所做出的承諾之一就是「More is More」(越多越好)。更多的透明度、更多的背景資訊、更多的坦誠、更多的資訊。這篇網誌真的很長,但它是為了現在和將來兌現這一承諾而做出的努力。我們很高興大家一同研究這些設計。這麼說不僅僅是因為我們在Fandom工作——我們對FandomDesktop感到「難以置信」的興奮。這是一個現代化的Fandom設計體驗,其中又包含了Gamepedia的重要元素。事實上,在這篇網誌的後面還有一處驚喜,那是我們能夠帶給大家的最激動人心的消息,到時我們就會公布這個驚喜。

且慢,你們剛剛搞完UCP,現在又要改設計?

在漫長的UCP過程之後,我們應該先回顧一下之前就所提供過的資訊,並且為大家提供更多的背景資訊。在我們宣布UCP計畫的時候,我們所述了兩個階段——技術(即平台在技術層面上的運行方式)和外觀。截至目前,我們和您一樣仍然重點關注在第一階段。畢竟,在造車時,必須先確保引擎運轉良好,然後才能關心如何給汽車噴漆。

在過去幾個月裡,我們基本完成了UCP遷移作業,即將關上舊平台的大門。在過去的兩週里,我們在修復關鍵的「體驗品質」錯誤方面做了很大的努力,您應該也很高興聽到這些消息。隨著不斷發展,我們的開發團隊將有更多的時間和資源專注於不斷改善現有以及新的功能,提高所有使用者的「體驗品質」,並減少平台上運行的錯誤。

我們也將會把Gamepedia的所有wiki和目前30%的Fandom的wiki預設使用的全新FandomMobile外觀全域啟用,這是我們全新的統一行動體驗的第一階段中的一部分。

探討大家最為關心的話題的時候到了:Fandom和Gamepedia上wiki的桌面版體驗是怎樣的。畢竟,諸位中不乏使用行動版體驗者,使用行動版的流量也確實占了我們總流量的大部分,但是wiki通常是在桌面版體驗上變更和維護的。因此,設計好FandomDesktop至關重要,儘管桌面版的流量不是主要流量,但它一定是大多數人所使用的外觀,是社區的管家和命脈。

什麼是FandomDesktop?

FandomDesktop是Fandom和Gamepedia上的wiki的全新統一外觀。這是我們對它最為精闢的說法。簡而言之,就是網站上的桌面版外觀。它是基於我們從過去的實驗和之前改變平台設計的嘗試中所吸取的經驗設計而成。這也不是我們第一次這樣做了!但這一定是自2010年以來我們對Fandom外觀所做出的的最大視覺改變,我們同時也意識到這是Gamepedia上的wiki的一次重大轉變。

這也基於多年以來的意見回饋,包括普通讀者、管理員和編輯者的意見回饋。這也包括了一些最近的研究。我們已經做了三次使用者研究(兩次是有關編輯者方面,一次是有關使用者方面),我們直接從社群委員會徵求意見回饋,還在社群交流會議上聽取了意見回饋意見。在這一過程中,我們測試了許多方案,根據意見回饋意見進行了修改,並與所有讀者進行了進一步測試,以確保設計符合預期。

設計同時也考慮到了兩個平台的重要元素,但並非所有元素——如果我們將這兩種截然不同的風格結合起來,那麼很可能就是一個試圖取悅所有人但最終誰也開心不起來的「科學怪人」。

wiki管理員和編輯者認為有一些因素對他們而言至關重要,普通讀者也是如此。讓我們來看看一些因素:

wiki管理員和編輯者 普通讀者
他們對Fandom和Gamepedia之間的變化感到焦慮,每個人都有他們永遠不想失去的清晰的體驗元素。 他們往往沒有意識到,每個wiki都是一個平台的一部分。他們從搜尋引擎進入網站查找資訊,但沒有將品牌聯繫起來。
他們想要利用更多的螢幕空間,許多人都不喜歡Fandom上的wiki的固定寬度體驗。 wiki上的內容通常很長,難以閱讀,尤其是在查找特定問題的答案的時候。
他們喜歡有機會自訂自己的wiki,並為自己所構建的內容和表達身份的方式而感到非常自豪。 他們喜歡易於瀏覽的簡潔一致的設計,不喜歡會影響可訪問性的自訂。
他們希望可以快速訪問自己的編輯器工具和重要連結,並能夠輕鬆地調整和管理自己的wiki。 他們在每次訪問中通常只訪問一種wiki和/或一種類型的內容,因此並不是每個工具或頁面都與他們的體驗相關。

考慮到這些因素,我們必須定義我們使用FandomDesktop和整個重新設計項目(包括FandomMobile)所做的範圍。認識到什麼是FandomDesktop有的,什麼是FandomDesktop沒有的至關重要。讓我們來看看:

FandomDesktop有什麼 FandomDesktop沒有什麼
這是一個重新設計的wiki文章布局,包括一致的廣告位置投放和內容瀏覽,這樣人們不必重新學習如何從一個wiki到另外一個wiki使用該網站。 它沒有引入新類型的內容或創作者工具。這就是下個目標!我們很快就會有一個介紹一些您可以期待的新工具的的網誌。我們在社群交流會議上宣布了其中的一些內容,引起熱烈反響。
它為Fandom和Gamepedia上的wiki提供了統一的全域導覽列體驗和本地導覽列體驗,讓使用者可以輕鬆地在自己所在的wiki上以及整個平台上找到內容。 它沒有實現與搜尋相關的新功能,不過在長期解決更好的搜尋體驗之前,我們可以在這個項目中進行一些漸進式的搜尋改進。
這是一個將與FandomMobile外觀進一步結合的設計,全新的主題設計器最後將應用於行動版上(將行動版主題引入到Fandom上的wiki——這是Fandom使用者多年以來一直想要的)。 它沒有重新設計非wiki頁面,例如Fandom首頁、Fandom文章或討論板。另外一個對Fandom首頁網站進行一些初步更新的項目將同時進行。

FandomDesktop是怎樣的?

既然我們已經把所有背景資訊都弄清楚了,那麼我們終於可以開始最有趣的部分了——它的神秘面貌到底如何!先說一下,我們將先展示非登入使用者以及非wiki編輯者的體驗。所以您可能會看到一些模擬廣告以及一些並非針對您的方面的東西。我們認為,首先向您展示普通讀者會看到什麼是很重要的。

ANON - Default.png
注意:本模擬圖中的部分元素(例如:資訊框)僅供模擬,不代表wiki不可以自訂這些元素的外觀。

這是普通讀者第一次訪問網站並沒有登入時所見的體驗,通常是在搜尋引擎的搜尋結果中找到所需wiki之後所見。在介紹更多將顯示更個性化的瀏覽體驗的模擬之前,我們想提醒大家注意一些事項。

  • 全域導覽列體驗。您也許已經注意到Fandom的全域導覽列現在位於頁面左側而非頁面頂部,這不令我們驚訝。我們改變它有幾個原因。首先,由於頁面頂部有全域導覽列和廣告,所以要真正到達頁面的重要部分——內容——要花費更多時間。因此,這一變更可以釋放一些垂直空間。其次,我們總是很難讓人們點擊我們放在頂級導覽列上的任何內容。透過這種新方式——我們相信——在使用者測試中親眼目睹——我們將吸引更多的目光,從而增加對更多內容的發現,特別是在Fandom首頁也進行了改版並變得更具相關性之後。因為知道我們大多數讀者是從左至右閱讀的,因此我們將其放在了左側,可能會使它對人們來說更加突出。將這一成果與頂部導覽列進行比較會很有趣。這也是對Gamepedia左側導覽列體驗的認同。我們正在尋找利用這種全域導覽列的方式來推動跨wiki訪問,這反過來也會為您的wiki帶來更多讀者和潛在的新編輯者。
  • 本地導覽列體驗。在全新的設計中,我們仍然選擇使用Fandom上的wiki中現有本地導覽列的位置。我們知道左側導覽列對很多Gamepedia編輯者來說非常重要,作為這個過程的一部分,我們探索了幾十種可能的布局選項,使用了全域導覽列和wiki導覽列放置的不同組合,以及它們如何與可變的寬度體驗交互(稍後將詳細介紹!)。最後,我們發現這種設計是我們構建後最具伸縮性、功能性和現代性的方案。稍後我們將詳細介紹這些。
  • 頁眉圖片。在這個設計中,我們將從本地導覽列移除純色頁眉,並用更個性化的背景頁眉取而代之。

這不僅可以讓人們更深入地沉浸在wiki的主題之中,還可以讓社區的個性化在整個頁面中上升到新的高度,從而在頁面載入之後的一開始就定下了「基調」。儘管這是我們全新的主題設計器所將支援的設計,但是wiki仍然可以透過CSS設定整個背景圖片。

  • 伸縮自如的寬度。在內容空間的左側,您將看到一個帶有雙向箭頭的按鈕。我們還借鑑了Gamepedia,所有使用者都可以瀏覽流暢的布局。無論所用設備或瀏覽器的大小如何,對於任何想要擴大頁面寬度的人來說,您的內容都會占據更多的螢幕。這提供了比目前Fandom所允許的更大的螢幕空間,也超過了非登入的Gamepedia使用者通常在螢幕上所能看到的空間。
  • Gamepedia徽章。正如所承諾的那樣,Gamepedia上的wiki將保留Gamepedia的重要元素,這是全新體驗的一部分。這是我們目前的想法,以表明其wiki為Gamepedia社區。Gamepedia的標誌(由火焰和書本所組成)將位於wiki標題的旁邊,並由職員設定,因此只有原Gamepedia社區才能擁有這一徽章。點擊徽章將進入社群中心上的頁面,以紀念Gamepedia的歷史。我們希望得到您對這種方案和它的設計的意見回饋。

向下滑動後,FandomDesktop是怎樣的?

問得好!頁面頂部非常重要,但當您滾動到頁面的核心並開始挖掘內容時,不要忘記了網站的外觀。

當使用者開始查找資訊時,對我們來說重要的是讓所有導覽列元素都應保持在觸手可及的範圍內,以便使用者可以快速穿梭於頁面、wiki或Fandom中。

以下是對這一情況的模擬圖:

ANON - Scroll.png
注意:本模擬圖中的部分元素(例如:摺疊的目錄)僅供模擬,並不表示有意變更功能。

讓我們探討一些要點:

  • 搜尋總是觸手可及。您可以看到我們如何開始保留滾動頁面後工具的使用方式,同時搜尋功能在頁面左側就可以看到了。Fandom上的wiki已經做了這一點,它有一個固定的全域導覽列,然而Gamepedia上的wiki並非如此。因此,這將在所有社區變得一致,這樣人們就可以快速地搜尋更多內容。
  • 本地導覽列伴您滾動。當您向下滾動頁面時,本地導覽列的大小將會摺疊,並在您向下滾動頁面時一直伴隨。這樣,讀者就可以隨時訪問您為他們所提供的的重要連結。我們之前就提過,我們嘗試了很多不同的導覽列設計,頂部和側面的都有。我們之所以選擇這個設計,並非是一定要把它放在左邊,很大程度上是因為我們能讓導覽列伴您滾動。這在Fandom上的wiki是無法實現的(本地導覽列僅固定在頁面頂部),在大多數的Gamepedia上的wiki同樣無法實現(左側導覽列可以任意設定,因為需要滾動才能看到所有連結,因此不能保持固定)。這是全域導覽列位於左側的部分原因,這樣就不會有兩個導覽列堆在頂部了。
  • 輕鬆使用工具連結。 您也許已經注意到三個按鈕懸停在內容空間的左端。第一個(即最上面的)按鈕是寬度切換,第二個按鈕可以打開您所在頁面的目錄,雖然在文章的簡介和正文之間仍有目錄,但無論您向下滾動到何處,您都可以打開目錄,使頁面導航更加方便。三個按鈕是編輯按鈕,它也會伴隨您的滾動。您仍然可以像往常一樣使用整個頁面的章節編輯,這確保了無論您身在何處,都可以輕鬆地訪問完整的文章編輯視圖。

深色模式?

我們關注到了您的需求。深色模式在Gamepedia上作為wiki級別的選項已經有很長一段時間了,但它從未在Fandom上出現過。隨著我們增加更多個性化的瀏覽選項,這種情況即將改變。看看這個:

ANON - Dark Theme2.png

每個使用者都以自己的方式使用內容,與之相符的是,FandomDesktop讓使用者即使在非登入狀態時也能更好地控制他們查看頁面的方式。我們喜歡Gamepedia對淺色模式和深色模式的支援,所以我們把它作為全新體驗的基礎部分。

我們全新的主題設計器可以您自訂自己wiki上的淺色模式和深色模式。雖然模擬圖上使用的頁眉圖片沒有變化,但主題設計器可以讓您在淺色模式和深色模式自訂不同的圖片。管理員還可以將自己想要的任何版本設定為wiki的預設主題——這是自2010年以來預設主題首次有任何可選項。我們還加入了對自訂標題原生字體的支援,這可以更好地表現wiki的特徵。

當涉及到為淺色模式和深色模式選擇顏色的時候,我們還將提供輔助功能支援,以確保所有讀者都能欣賞到您wiki的內容。

好了,那麼登入使用者的體驗是怎樣的?

這又是一個好問題——今天表現得不錯嘛。

在Fandom和Gamepedia上,無論您是登入狀態還是非登入狀態,網站看起來都一樣。不過仍有些不同之處,例如登入後Fandom上大多數廣告會消失,在Gamepedia可以透過Gamepedia PRO做到這一點,但僅此而已。值得一提的是,目前Fandom的外觀是「一刀切」設計,編輯者可以看到讀者看到的所有內容,即便這些內容對他們沒有任何用處。多年以來的經驗告訴我們,這不對,我們應該找到新方案,讓登入後的體驗更加適合編輯者。FandomDesktop在很大程度上是朝著這個方向邁出的一步。

登入後,網站的外觀如下所示:

Logged In - Default.png

讓我們再探討一些要點:

  • 無廣告體驗。和往常一樣,您可以選擇不顯示所有廣告的選項。這一點不會改變,讓您的頁面看起來更時尚,更多的關注在內容上,而不是如何利用其盈利。盈利固然重要,否則我們將無法保持正常運營或創造新內容,但您不需要看到它。您帶給網站的價值彌補了因為我們沒有向您顯示廣告的收入損失,我們只能用無限乘以蝙蝠俠來概括。太多了。
  • 以編輯者為中心的操作。在頁面右上角,您可以看到「以編輯者為中心」的按鈕,例如建立新頁面、近期變更、管理員面板以及附加菜單中的新增圖片或新增影片的按鈕。其中大多數非登入使用者是看不見的,因為它們對非登入體驗微乎其微。它們是為了您的編輯工作而精心準備的。您還可以透過按鈕在淺色模式和深色模式之間來回切換。
  • 頁面工具。您可以看到側欄現在包含了許多重要的頁面連結和工具,可以快速使用例如鏈入頁面、頁面歷史、討論頁等內容。這些同樣也是底部工具列中的可用選項,它們是設計中的一部分,雖然沒有在這張模擬圖中展現出來。
  • 偏好寬度保持不變。如果您將選項設定為在頁面上獲得更寬的寬度體驗,網站就會記住這一點,這樣您不必在每次瀏覽頁面時都打開或關閉擴充寬度了。

在滾動時,您將看到以下內容:

Logged In - Scroll.png

和往常一樣,以下是一些要點:

  • 頁面編輯按鈕總是觸手可及。與非登入體驗類似,無論您位於頁面的何處,您都可以使用章節編輯和頁面編輯按鈕。
  • 快捷方式依然觸手可及。本地導航仍會伴隨您向下滾動頁面,因此您仍然可以使用導覽列選項。
  • 量身定做的右側欄模組。更多以編輯者為中心和以合理為核心的右側欄模組將繼續伴隨您進入頁面。
  • 重新設計的編輯者工具列。您可以看到右下角重新設計的工具列。我們將在另外一個網誌中對此做包括它是如何工作的更深入的探討。

這可真是有趣的驚喜……

確實。您可能在想,即便有那些更多的頁面工具,我還是不想看到右側欄怎麼辦?如果我想讓螢幕上的內容有更大的空間,該怎麼辦?我們在本篇網誌的早些時候就說過了,我們要公布一個我們公布過最令人興奮的驚喜,就是對這些問題的回答。

如果您是登入使用者,您可以在帳號偏好中設定摺疊並隱藏右側欄。您還可以在頁面上切換以顯示或隱藏它。以下是這一情況時的外觀:

Logged In - Collapsed Right Rail.png

在Fandom上,這是十年以來第一次,您登陸自己的帳號,就可以擁有全寬體驗。不過我們不會為非登入使用者提供這項功能——右側是廣告投放的關鍵組成部分之一——我們正在為您整合這一優勢。我們從2010年就收到了這樣的意見回饋,當時固定寬度體驗成為Oasis(綠洲)外觀中最大的引雷針之一。 在設計FandomDesktop時,我們在與編輯者進行的使用者研究中收到了有關意見回饋,也從社群委員會收到了有關意見回饋,我們特別從Gamepedia的編輯者收到了一些有關意見回饋,否則他們可能會失去一些螢幕空間。我們還從社群交流會議上收到了有關意見回饋,我們承諾將吸取意見回饋,並盡我們所能將其納入其中。

長話短說:我們清楚地收到了來自大家的意見回饋。這對Gamepedia的編輯者來說是非常重要的事情,我們從Fandom的編輯者那邊收到了許多意見回饋,我們很高興能夠提供比Gamepedia上的螢幕空間更寬的內容。我們仍將努力使右側欄對您更加有用,並希望您能夠啟用它,但我們把選擇的權利留給您。

編輯時的體驗呢?

我們希望能夠確保您處於編輯模式的時候,FandomDesktop的視覺標識保持不變。我們正在努力改善編輯體驗,目的是在保持核心功能不變的同時,給您更多的編輯空間,Gamepedia的編輯體驗就做得很好,為您提供了編輯器工具列之外的更多功能,這也是我們在新設計中所採納的。

在您編輯時頁面的外觀:

Logged In - Editor.png

以下是一些要點:

  • 仍可使用本地導覽列。 在編輯的時候,您可能希望輕鬆訪問另外一個頁面。現在,這通常需要您打開新標籤頁並重新訪問wiki。在這種情況下,您將能夠立即在新標籤頁中打開重要連結。
  • 在編輯器之間輕鬆切換。在原始碼編輯和視覺化編輯之間切換應該乾脆利落些,這也是我們在做的事情。
  • 使用頁面工具。您正在編輯頁面並不意味著您不需要使用部分頁面工具。編輯器將由一個可以繼續使用其工具的菜單。
  • 更大的螢幕空間。編輯器占據了大部分的螢幕空間,為您的編輯工作提供了最大空間,並同步了在頁面擁有全寬體驗的選項。

如果我看到能夠改進的地方該怎麼辦?

重新設計並非是故事的終章,而是全新的開始。新外觀是我們能夠繼續改進的基礎。我們知道仍有一些關鍵領域需要改進,包括:

  • 顯示。我們收到了一些使用者的意見回饋,部分按鈕並非每個人都能看得清楚。我們將探索新方案解決這一問題。
  • 個人檔案和公告。我們先前從社群委員會委員和社群交流會議的與會者方面的意見回饋是:個人檔案按鈕和公告菜單位於新全域導覽列的左下方,這需要很多時間加以習慣,而且還並不是那麼直觀,因為大多數網站都會將這些體驗放在頁面頂部。關於如何利用新全域導覽列,我們有些令人興奮的想法,但需要確保我們得到的基本正確,我們會根據需求加以努力。

如果您認為我們遺漏了什麼,請務必告訴我們!我們將閱讀英文網誌上留下的所有意見回饋。如果您的wiki擁有Fandom代表,可以向其意見回饋。如果沒有,您可以發送電子郵件給我們:community@fandom.com

FandomDesktop的發布時間軸

FandomDesktop將在今年晚春作為一個可選和新wiki的體驗提供,現有的wiki將在夏季預設使用該外觀。我們將在稍後的網誌中提供更具體的時間安排。

下一步

好了,我們的網誌之旅到此為止。我們還沒有談到更多的東西,或者壓根沒有,或者更深入的細節。在接下來的幾週里,更多的網誌將深入探討主題設計器、本地和全域導覽列、條目頁面面、編輯器工具、自訂元素,以及有關社區意見回饋如何塑造這一全新設計的更多細節。

在此期間,我們歡迎您在英文網誌的評論區提供意見回饋!

 


鐵桶頭像.png

鐵桶

鐵桶中文預備志願者小組的原成員,現為Fandom logo 2021 light font.png中文社群中心團隊PVT wordmark dark.png中文預志願團隊的成員。如果您有任何問題,請在社區論壇上提問。
Advertisement