基於參考圖片設計風格的復古廣播雜誌(Zine)桌面網頁佈局樣機。高對比度編輯刊物美學,採用亮藍色、米白、明黃與黑色的配色方案,粗體濃縮無襯線塊面排版,利落的網格邊框,帶有絲網印刷質感與清晰規整的間距。
頂部欄:
- 後設資料:“Friday, July 24, Edition 001”,配有小巧的“Live Today”狀態標籤。
- 右上方文案:“One hour of YouTube. Picked by a superfan. Ready now.”
首屏焦點區域:
- 大型圓形時鐘選時轉盤偏左放置,與醒目標題戲劇性重疊,中心標註“Today’s Hour / Music Videos / Curated by Mara Ortiz”。
- 正在播放(On Now)特色卡片:展示時間碼“[00:48]”、大標題“[The Future Arrives Early]”、“12 min left”,以及右下角帶導演署名的電影感深藍色配圖(極簡現代建築中站立的西裝男子)。
- 策展人側邊卡片:Mara Ortiz的深藍黑調肖像裁切、簡要介紹、策展寄語以及“Become a curator →”文字連結。
節目播放順序條(Running Order Bar):
橫向長條,左側標有“Today’s Running Order”,右側標有口號“One hour. Five acts. Curated live. Ready now.”,包含5個幕次單元:
1. “Public Access Fever” — 00:00, played, 8 min
2. “The Beat Goes Global” — 00:08, played, 12 min
3. “Directors Turn Auteur” — 00:20, played, 15 min
4. “Deep Cuts, Big Swings” — 00:35, played, 13 min
5. “The Future Arrives Early” — 00:48, on now, 12 min
底部節目排期網格:
- 左側藍色板塊:“Explore More Hours”,附簡要說明及“Browse all categories →”。
- 3張大尺寸預覽卡片:
1. “[Animation After Dark]” — 標註“Today at 9 PM”,藍調動漫眼眸插畫。
2. “[Cult Sci-Fi]” — 標註“Today at 11 PM”,復古宇航員頭盔插畫。
3. “[Game Design]” — 標註“Tomorrow at Noon”,藍色畫素風風光插畫。
- 右側黑色板塊:“Also Playing”,列出5項(Internet Lore、Fashion Forward、Reality TV Canon、Hip-Hop Deep Cuts、Skate Culture),附黃色“See today’s full guide →”連結。
ui-ux-design網頁樣機復古排版