← 所有作品
RD 製作中
即時預覽 2.0
預覽沒出現時,讓使用者知道該補素材,還是改用另開分頁。
依設計稿重繪
預覽為什麼沒出現?
Cr.ED 的廣告編輯頁把素材設定和預覽放在同一頁。當預覽沒出現,使用者需要知道是素材還沒補齊,還是模組本身不支援即時預覽。我把這兩種原因拆開,讓介面指出該回哪個欄位修正,或提供可用的預覽入口。
3種預覽回饋
3類模組範例
2條無法即時預覽時的處理路徑
01 — 三態對照
同一個預覽區,三種下一步
從廣告編輯頁的同一個位置出發,對照可預覽、素材待補和模組限制時的操作。
左側是完整編輯頁,右側三張圖對照同一個預覽區。箭頭標出素材待補時的欄位,以及不支援即時預覽時的替代入口。 · 點擊放大
02 — 設計取捨
能修的指出欄位,受限的提供入口
兩種情境都可能沒有即時畫面。我依使用者當下能採取的行動,決定提示要放在哪裡、要提供哪個操作。
01 / 留在原頁保留編輯與預覽的上下文
支援的模組在原頁呈現預覽。使用示意素材展示版位或互動時,在預覽上標示素材用途。
02 / 回表單修正原因放在預覽,修正提示放在欄位
預覽區解釋為什麼暫時看不到畫面。素材名稱、必填設定或上傳項目缺漏時,提示放在對應的表單位置。
03 / 另開分頁在看到限制的地方提供替代入口
把模組不支援的原因與「另開分頁」放在同一個預覽區,讓使用者從原處就能繼續查看。
查看三種狀態的完整介面
畫面依設計稿重繪,點圖可放大。
01 可即時預覽
重點放大
編輯素材時,在同一畫面確認廣告在內容頁的呈現。
完整畫面
02 素材未就緒
重點放大
左側預覽解釋原因,右側表單標出待補的素材。
完整畫面
03 模組不支援
重點放大
預覽說明限制,並提供另開分頁的入口。
完整畫面
03 — RD 規格
用新增與回編核對跨模組的預覽規則
用同一組預覽狀態檢查新建、回編與區塊切換,再用不同模組確認素材和互動的差異。
即時預覽的 RD 檢核情境
| 操作情境 | RD 檢核重點 |
| 新增廣告 | 用目前的模組與素材狀態對照三種回饋,確認待補項目能對回表單。 |
| 儲存後回編 | 用已儲存的模組、素材與設定重新核對預覽狀態和入口。 |
| 收合預覽 | 對照收合畫面,確認編輯區仍可操作,並有展開入口。 |
| 展開預覽 | 對照展開畫面和尺寸標示,確認目前狀態對應的提示與操作可見。 |
- Rotation
- 以多圖輪播檢查預設素材與版位呈現。
- Explosion
- 用打地鼠與橫式影音加單圖,對照遊戲和影音的不同預覽方式。
- DCO
- 以櫥窗多圖檢查商品素材在預覽區的呈現。
目前由 RD 製作中。畫面依設計稿重繪,預覽素材與提示文字經過簡化。