方格精選

vocus 方格子沙龍改版:手機瀏覽優化、首頁排版邏輯 & 教學

更新 發佈閱讀 9 分鐘

今天一覺起來就看到格友們在討論沙龍的介面改版啦。從原本 beta 版到現在的(...這算 3.0 版嗎?4.0?)改動真的很多!也很多人敏銳的觀察到,這版更有手機閱讀習慣的感覺出來啦!

不過我其實不習慣滿滿的房間出現左右滑動的版面XD
用手機看也會覺得太多惹!!!

所以這篇文章主要是分享沙龍首頁的幾個更新 & 我自己的使用邏輯,給想要調整自己沙龍首頁的人一些參考~

raw-image

如果你是對於小細節都充滿好奇的人~

可以追蹤 方格子 vocus 官方沙龍 在【版本更新日誌】這邊,方格子會不定時跟大家分享最近修改了哪些 bug,或是一些功能更新!以下我挑了兩個近期我覺得對沙龍呈現比較重要的兩條分享:

  • 2025/05/28 :房間釘選篇數開放至 10 篇
  • 2025/04/30 :沙龍首頁跳轉機制調整:現在無論你是不是指定沙龍的成員,進入沙龍首頁後將直接看到首頁內容,一眼掌握最新內容!

「進入沙龍首頁後將直接看到首頁內容」這點很少人討論,但我覺得超重要的啊!

不曉得你還記不記得?以往點去你尚未加入的【沙龍】都會先跳到一個介紹頁面,你要點選【加入】之後才能進到沙龍主頁。我明白這是想要讓更多人「成為沙龍會員」的行動設計,但還是覺得對於「我想讀內容!」的人來說,增加了一些門檻/不夠直覺。

現在可以直到抵達【沙龍首頁】我覺得很讚!也很重要!( *´◒`*)​

過去我覺得對於「尚未成為沙龍會員」或是「沒有註冊過方格子的新讀者」來說,沙龍的那一頁真的不夠友善,所以我反而會推廣我的【香水百合個人頁】而非【沙龍頁】。現在就沒有這個顧慮了~


什麼時候用個人頁?什麼時候用沙龍頁?

這點我也稍微提一下好了!如果你有用「主題專家」有參加不同沙龍,那麼這兩個頁面功用就不太一樣喔~身為創作者,你可以推廣給別人看你的【個人頁】或是【沙龍】。

  • 【個人頁】呈現的是你發布過的所有內容,也就是說你在 A、B、C 不同沙龍發布的內容,都可以在【個人頁】找到。
  • 【沙龍頁】呈現的則是你 & 你的「主題專家」在這個沙龍發布內容。

例如你在【香水百合】個人頁的「發布內容」下面可以找到我在【情慾交流事務所】、【Moonrogu的歡樂鳥窩】、【方格子 vocus 官方沙龍】發布的文章/貼文。

在【Moonrogu的歡樂鳥窩】沙龍,你可以看到村長、我、李羊、老鳳、閒人等人在「創巢書店」發布文章/貼文。

(當然,今天如果你沒有擔任或是邀請「主題專家」,這個具體差別就不太大啦。)


接下來我們來看看沙龍改版後的視覺~

我以兩位格友 閒人 & 老鳳 的沙龍作為參考(左為電腦、右為手機截圖畫面):

raw-image

可以看到閒人的沙龍視覺上超級舒服,把個人品牌的整體形象又更加體現出來了。而因為我有訂閱閒人的沙龍,所以在按鈕上是呈現【查看方案】

raw-image

老鳳的視覺設計也是沒話說,然後因為我沒有付費訂閱,所以會有一個比較顯眼的紅色【付費訂閱】按鈕。網頁版還會呈現資訊:累積XX位付費會員/共有XXX篇付費限定內容/最近更新 2025/06/12。

這次的方格子更新,基本上跟我們以往預測/討論/期待的方向相同:沙龍首頁會有更多元、彈性的個人化設計。

以前老鳳還有開玩笑說過,如果可以自行套用背景顏色、模板、背景音樂,那是不是就是回到無名小站的感覺了XDDDD


vocus 方格子沙龍新改版:該怎麼安排你的首頁?

我們來看一下這次改版之後,有哪些東東你可以調整!

1、橫幅首頁圖

raw-image

這個圖片可以在【沙龍設定】>【基本設定】>【封面照片】調整。
以前雖然沙龍就能呈現【標誌LOGO】,但畢竟圖比較小,有了首頁圖的出線之後,整個畫面更有個人風格了。

raw-image

2、自選模塊

這些版塊你可以自行決定是否顯示 & 調整順序。包含:橫幅廣告(左右滑動的大圖)、連結版位、TOP 5、商品、房間。

可以在【沙龍設定】>【首頁設定】進行調整。

raw-image

視覺上面,你可以更感覺到這是適合手機瀏覽的畫面。

raw-image

優點是「貼文與文章的高度終於貼合了,整合成像是同一種視覺產品,只是不會凸出來一塊、凹進去一塊」(我這句直接抄老鳳的)

缺點是:
1、這比較像手機閱覽的形式,電腦網頁上反而使用體感不方便。
2、什麼都放上去畫面很凌亂、不知重點為何。

我覺得版面自由度更高的時候,更是考驗你的品牌呈現方式!

其一是你的視覺需要有更好的呈現你的品牌,例如可以統一色調、製作系列圖等等。

其二是「考量到閱讀者的習慣與視覺」。例如從上面我所有的截圖,你可以發現,手機閱讀的第一畫面只會看到你的沙龍首圖 + 沙龍頭像 + 橫幅廣告

往下滑,按照預設你會看到 連結版位 + Top 5 + 商品 + 房間BUT!
由於這些版塊的大小,在手機上一次瀏覽也只能看到 1.5 個內容(比如說上圖,你可以老看到老鳳的完整【類超自然】+ 半個【獨立作品】)。

如果你跟我一樣有商品區、又有3個以上的房間,那我覺得整體首頁瀏覽起來會超級不好讀

所以我就直接把許多房間的模板以隱藏起來了。以下是我的安排邏輯分享,你可以參考看看留下什麼是重要的模板!


香水百合的安排邏輯分享

調整前與調整後的首頁差別:
(兩個滑動速度不一樣請見諒XD 可以先看左邊,再看右邊)

raw-image

我並不是專業的 UI/UX 設計師,只是以我過去做過網站運營 & 自己身為使用者、讀者的經驗,分享一下自己的觀察與想法。

我自己是覺得調整之前,我有 8 個沙龍房間實在是太多了!我比較想要快點讓人看到新的文章貼文。所以調整後,我將版面留下:橫幅廣告 +連結版位 + 1個房間。後面文章的部分則是瀑布流,可以無限下拉滑取,沒有 ending。

你可以點開你常用的手機 APP 畫面,觀察一下視覺大小給人的舒適程度:

raw-image

你會發現,app 畫面上,不同版塊的圖片視覺呈現會有大有小,你可以清楚知道不同版塊的用途與重點。但如果連續好幾個【沙龍房間】的版塊,反而沒有重點 & 不好閱讀(因為很大一個!在手機畫面上一次只能閱覽到 1.5 個版塊,視覺上我覺得很痛苦><)

為了讓視覺不要那麼疲勞 + 快速讓讀者找到重點。
我調整後的邏輯是這樣的:

raw-image

小版塊我捨棄了 top 5(因為我覺得那個模板設計目前沒有很吸引人,文章標題太長也會都會被切掉)

其實「輪轉廣告圖」也不見得要擺第一個,可以根據你想給人強調的重點去排序。

「輪轉廣告圖」我目前還是會放系列文的推薦,所以下面多個房間的呈現我覺得比較多餘 & 不見得好找文章。所以我想「保留1個本月想推薦的房間」;之後如果有新商品上線了,我也會考慮再把「商品」模板加上去。

raw-image

為了未來的 vocus 手機 APP 做準備

我猜 & 希望未來的手機 APP 不會直接完全搬移目前的網頁版模板(不然我會覺得很頭大哦...>口< 大小等等都可以有更好的 UX/UI)。

不過如果我們每個創作者的沙龍頁,上了APP 之後也都是能自己決定模板的情況,那麼模板排序取捨也會是各位創作者可以考量的設計點喔~

我相信很多擅長視覺設計的創作者,可以想出更多有創意的排列方式!(๑´ㅂ`๑)


建議與許願 *ଘ(੭*ˊᵕˋ)੭* ੈ✩‧₊˚

不太喜歡新的 Top 5 模板,以前的 Top 5 標題完整 & 更有排行榜的感覺。

raw-image

這是我參考其他 app 的模板,發想的 Top 5 版型,希望方格子未來可以把這個部分再調整一下~ 視覺上也有更多不同大小的呈現。

raw-image

更多沙龍介面討論:

老鳳:沙龍介面更新|首頁 X 模塊 X 文種視覺統一


更多香水百合的內容經營相關討論:


加入【Moonrogu的歡樂鳥窩

我會不定時在【創巢書店】中,分享有關寫作、品牌、方格子經營的想法。


關於-香水百合

2021年開始在方格子寫《Tinder冒險記》紀錄與思考關於性與愛的個人故事,接著開立了《情慾交流事務所》希望可以跟大家交流更多關於情感與性愛的不同面向與思考。

謝謝你將本文讀到最後 :)

🌹訂閱【情慾交流事務所】的各種方案
🌹歡迎利用以下管道小額贊助:【單次贊助

留言
avatar-img
Moonrogu的炬靈書室
21.0K會員
2.5K內容數
文字是嚮導,意識是光炬。 唯有書寫,我們才得以前進,而意識也得以照拂更遙遠的境界。 儘管世界為濛霧阻饒、路途充滿荊棘,靈魂無可倖免。 文字終將引領意識。 我們都是意識的旅者。我們書寫,我們創造。
你可能也想看
Thumbnail
vocus 慶祝推出 App,舉辦 2026 全站慶。推出精選內容與數位商品折扣,訂單免費與紅包抽獎、新註冊會員專屬活動、Boba Boost 贊助抽紅包,以及全站徵文,並邀請你一起來回顧過去的一年, vocus 與創作者共同留下了哪些精彩創作。
Thumbnail
vocus 慶祝推出 App,舉辦 2026 全站慶。推出精選內容與數位商品折扣,訂單免費與紅包抽獎、新註冊會員專屬活動、Boba Boost 贊助抽紅包,以及全站徵文,並邀請你一起來回顧過去的一年, vocus 與創作者共同留下了哪些精彩創作。
Thumbnail
隨著格友們在 vocus 上分享的內容越來越豐富,vocus 不僅提供了更細緻的分類功能給創作者,還對搜尋功能進行了優化! 現在,讓格編帶你開箱這次的新介面與功能亮點吧!
Thumbnail
隨著格友們在 vocus 上分享的內容越來越豐富,vocus 不僅提供了更細緻的分類功能給創作者,還對搜尋功能進行了優化! 現在,讓格編帶你開箱這次的新介面與功能亮點吧!
Thumbnail
各位格友們好!格編聽到許多格友們許願的聲音,希望能調整沙龍導覽列的房間順序,該是實踐諾言的時候了,今天格編要來分享兩個眾所期待的新功能!
Thumbnail
各位格友們好!格編聽到許多格友們許願的聲音,希望能調整沙龍導覽列的房間順序,該是實踐諾言的時候了,今天格編要來分享兩個眾所期待的新功能!
Thumbnail
在 vocus 首頁的「我加入的沙龍」可以直接一覽加入沙龍的精彩內容。為了協助格友們更簡單地發掘喜愛的內容, vocus 開放了設定內容偏好功能!
Thumbnail
在 vocus 首頁的「我加入的沙龍」可以直接一覽加入沙龍的精彩內容。為了協助格友們更簡單地發掘喜愛的內容, vocus 開放了設定內容偏好功能!
Thumbnail
我們觀察到,許多創作者已經將沙龍玩轉出不同風格了! 為幫助創作者透過沙龍凝聚更多核心粉絲、持續壯大個人品牌,同時提升沙龍會員的參與體驗,vocus 團隊持續優化沙龍功能。 我們不僅將出版專題時代的後台功能一併整合至沙龍後台,還推出了幾個有助於沙龍經營的全新功能,讓沙龍擁有者能夠在後台輕鬆操作!
Thumbnail
我們觀察到,許多創作者已經將沙龍玩轉出不同風格了! 為幫助創作者透過沙龍凝聚更多核心粉絲、持續壯大個人品牌,同時提升沙龍會員的參與體驗,vocus 團隊持續優化沙龍功能。 我們不僅將出版專題時代的後台功能一併整合至沙龍後台,還推出了幾個有助於沙龍經營的全新功能,讓沙龍擁有者能夠在後台輕鬆操作!
Thumbnail
眼尖的格友們發現了嗎?在今日的 vocus 更新中,閱讀頁變得稍微不一樣了!即日起,只要創作者有在發佈工具為內容設定「下一篇」,粉絲瀏覽完該篇內容時,只要將頁面向下捲動,即可無縫瀏覽下一篇內容,享有更加滑順的使用體驗。
Thumbnail
眼尖的格友們發現了嗎?在今日的 vocus 更新中,閱讀頁變得稍微不一樣了!即日起,只要創作者有在發佈工具為內容設定「下一篇」,粉絲瀏覽完該篇內容時,只要將頁面向下捲動,即可無縫瀏覽下一篇內容,享有更加滑順的使用體驗。
Thumbnail
在近期的沙龍改版升級中,非常感謝各位會員與創作者給予的回饋,不論是透過客服信箱、討論區、留言或是其他管道, vocus 產品團隊與營運夥伴皆會悉心傾聽會員們的聲音,並用心推出更好的服務,滿足各位會員的使用需求。
Thumbnail
在近期的沙龍改版升級中,非常感謝各位會員與創作者給予的回饋,不論是透過客服信箱、討論區、留言或是其他管道, vocus 產品團隊與營運夥伴皆會悉心傾聽會員們的聲音,並用心推出更好的服務,滿足各位會員的使用需求。
Thumbnail
Vocus 新增了沙龍功能,目的是為了取代原本的「專題」,我這篇就來分享一下我目前摸索沙龍的經驗
Thumbnail
Vocus 新增了沙龍功能,目的是為了取代原本的「專題」,我這篇就來分享一下我目前摸索沙龍的經驗
追蹤感興趣的內容從 Google News 追蹤更多 vocus 的最新精選內容追蹤 Google News