全站版面整理與手機上傳

01作品頁電腦版：左右兩欄高度平衡

問題在哪

左邊只有封面和縮圖，下面一大片空白；右邊的版本選擇器、訂閱、浮水印說明排成一條很長的窄欄。

什麼情況會遇到

用電腦打開任何一個作品頁。

為什麼要改

整頁左邊空、右邊擠，看起來不整齊，也要往下捲很久才看完版本。

改了之後

左邊放封面、縮圖、作品說明，右邊放標題、創作者、版本選擇器，兩邊高度接近；一般版與隱藏版兩張版本卡並排。

改版前

改版後

02作品頁手機版：版本卡變寬

問題在哪

版本卡被兩層外框和內距擠成窄條，字被迫折成很多行。

什麼情況會遇到

用手機打開作品頁，往下看版本選擇器。

為什麼要改

要選哪個版本、多少鑽石不容易看清楚。

改了之後

拿掉外層的框，版本卡用滿整個畫面寬度。

改版前

改版後

03登入頁：左側深色框不再留大片空白

問題在哪

左側深色框被拉得跟右邊表單一樣高，中間空了一大塊，身分選擇卡掉到最底下。

什麼情況會遇到

用電腦打開登入頁。

為什麼要改

選擇「一般會員」或「創作者」的位置被推得很遠，容易忽略。

改了之後

深色框只長到內容的高度，說明文字和身分選擇卡緊接在一起。

改版前

改版後

04作品列表：篩選列排成一列

問題在哪

關鍵字、類型、排序分兩排，搜尋鈕孤零零在左下角。

什麼情況會遇到

用電腦打開作品列表要找作品時。

為什麼要改

篩選區占掉大半個畫面，作品要往下捲才看到。

改了之後

關鍵字、類型、排序與搜尋鈕排在同一列，作品提早出現在畫面中。

改版前

改版後

05說明與條款頁：內容置中

問題在哪

文字貼左排成一條，電腦版右半邊整片空白。

什麼情況會遇到

用電腦打開這些說明頁。

為什麼要改

畫面左重右空，看起來像沒排好。

改了之後

頁首與內容一起置中，說明頁寬約 760 到 800 像素，表單頁約 480 到 560 像素。

改版前

改版後

06排行榜手機版：每名次只佔一行

問題在哪

每一個名次被拆成四行（名次、作品、創作者各一行），一列約 130 像素高。

什麼情況會遇到

用手機看排行榜。

為什麼要改

一個畫面只看得到兩三個名次，要一直往下捲。

改了之後

每個名次一行：名次、縮圖與作品名、創作者，同一個畫面看得到六個名次。

改版前

改版後

07平板寬度的頁首不再超出畫面

問題在哪

儲值鈕擠住搜尋框，頭像超出畫面右邊約 5 像素，頁面可以橫向拖動。

什麼情況會遇到

用平板或視窗縮到 768 像素寬時。

為什麼要改

畫面會左右晃動，搜尋框被擠得很小。

改了之後

儲值鈕讓位、間距縮小，搜尋框維持寬度，頭像完整顯示，不再橫向拖動。

08作品管理：一列變矮、桌機不必左右捲

問題在哪

10 欄表格塞不下，操作鈕各自一行，每列約 205 像素高，還要左右捲動才看到狀態和按鈕；內容區只有約 860 像素寬。

什麼情況會遇到

創作者用電腦管理自己的作品清單。

為什麼要改

作品多的時候要一直往下、往右捲，找一件作品很費力。

改了之後

內容區加寬到約 1140 像素，操作鈕排成三排內排完，每列降到約 133 像素；電腦版不再左右捲，搜尋框與排序同一行。

改版前

改版後

09其他創作者後台頁整理

問題在哪

統計格只有 2 到 3 個卻照 4 欄切、右邊空一塊；交易編號折成 5 行；私訊對話區固定高、訊息貼在最上面；趨勢圖日期標籤疊在刻度上；個人頁設定底部儲存列文字貼邊。

什麼情況會遇到

創作者逛後台各頁時。

為什麼要改

版面空洞、字疊在一起，要的數字不容易讀。

改了之後

統計格依項數均分整列；交易編號一行顯示、完整編號滑過可看；私訊依訊息量長高且貼近輸入框；趨勢圖日期移回圖下方；儲存列補上內距。

10會員中心：排成左右兩欄、封面放大

問題在哪

右欄疊了六張短卡、左欄只有兩張；已購作品封面約 105 像素，很小。

什麼情況會遇到

會員打開會員中心看已購作品與餘額。

為什麼要改

右邊很長、左邊很空，封面太小看不出是哪一本。

改了之後

票券與訂單、追隨與訂閱改成左欄兩兩並排；右欄只留鑽石餘額、本月徽章、推薦好友；已購作品封面放大到 150 像素以上。手機版把鑽石餘額與儲值鈕排在已購作品之前。

改版前

改版後

11訂單、票券、儲值、通知與檢舉頁

問題在哪

內容單欄貼左，電腦版右邊整片空白；七個儲值方案一列一個靠左；單張票券的 QR 碼把卡片撐成長條。

什麼情況會遇到

會員用電腦開這些頁面時。

為什麼要改

畫面空，要往下捲很久才看完。

改了之後

訂單與票券依寬度並排（只有一筆時維持單欄）；儲值方案改成方案卡格；通知桌機兩欄；檢舉兩個表單置中成 640 像素欄；QR 碼縮到 220 像素。

12管理後台儀表板：卡片排整齊、內容區變寬

問題在哪

待處理卡片排成「3 張加 2 張」後留空格；今日、本月、累計三組格數不齊；內容區只有約 900 像素寬。

什麼情況會遇到

管理員用電腦看儀表板。

為什麼要改

一眼看不全待處理事項，數字格參差不齊。

改了之後

待處理卡片依寬度排成一列；今日、本月、累計各自排齊；內容區加寬到約 1140 像素；統計格改成無外框，不再卡片包卡片。

改版前

改版後

13管理後台設定與其他頁

問題在哪

九張設定卡在電腦版只有一欄；外流辨識的兩張統計卡被推到左右兩端；網站速度統計卡撐出頁面，1024 與 768 寬會橫向拖動。

什麼情況會遇到

管理員開設定頁或在較窄視窗操作。

為什麼要改

要一直往下捲，窄視窗還會左右晃動。

改了之後

設定卡電腦版兩欄；外流辨識兩張統計卡等寬並排；網站速度統計不再撐出頁面。

14封面小字與麵包屑更清楚

問題在哪

封面左下的「VOL」字與麵包屑「首頁」連結顏色太淡，對比不夠。

什麼情況會遇到

看任何作品封面或內頁時。

為什麼要改

字淡，視力不好或在強光下的人看不清楚。

改了之後

「VOL」字取消半透明並加淡陰影，麵包屑連結加深，對比都達到 4.5 比 1 以上。

15封面上傳：網路中斷會自動重試、有進度、失敗看得懂

「我還有一張封面照一直上傳不了」LINE 2026-10-10 19:51

問題在哪

iPhone／Safari 在網路連線被中途切斷時不會自動再送一次，直接顯示「連線失敗」；上傳前的準備步驟只送一次，也沒有進度與重試鈕，創作者看起來就是按了沒反應。

什麼情況會遇到

創作者用 iPhone 上傳 3 到 5 MB 的封面照時（10 月 16、17 日有 3 次這樣的回報）。

為什麼要改

創作者以為壞掉、反覆重傳，或放棄上傳。

改了之後

上傳前後的步驟遇到沒回應或網站暫時忙碌時，最多自動重試 6 次，離線時等網路回來再送；顯示進度條與狀態（準備中、上傳中、確認中、整理中、網路不穩正在重試）；失敗時用白話說明並有「重試」鈕，不必重選檔；超過 1.5 MB 的封面先在手機上縮小再傳，畫質仍夠封面使用。