都市夜行灯
以夜班人的作息为线索,把城市情感线拆成十二个小章节。
这是一张为移动端访客手绘的索引板。我们把「夜恋影院全部视频列表」拆成题材贴纸、更新日历与同好专栏三块拼图,安卓端访客按顺序点一遍,就能在短时间内看清整份列表的结构、更新节奏与筛选方式,而不是在成排的卡片里反复下拉。
情境、冲突、问题、答案,四句话讲完再看列表
情境是这样:很多访客习惯在通勤路上用手机翻片单,点开一个页面就希望立刻看到分类、更新时间和可筛选的入口。冲突出现在第二步,列表越长,越容易迷路,同一部内容被放在三个板块里,时间全花在重复信息上。问题因此变成一句话——怎样在安卓端用最短路径读懂整整一屏列表。
夜间碎片时间、单手操作、网络时快时慢,是移动端访客最常见的三个前提。
题材、更新、人气三套排序互相打架,点击之后缺少可回退的锚点。
如何一眼判断某条内容值不值得点开,而不必逐条划线阅读。
把列表拆为贴纸题材墙、视频列表区、追更日历三段,每段都有独立锚点,随时可以回到上一段。
我们把经验值写进结构里:题材贴纸负责粗筛,视频列表区负责精看,追更日历负责判断节奏。三者互相引用,形成一条可回退的阅读路径。若你更在意分类逻辑,可以先看题材贴纸墙;若只想找最近更新的条目,追更日历会更省时间;想了解同好怎么聊,同好留言板给出了真实语气的样本。
按百度《搜索质量白皮书》的体验维度,页面结构清晰、内容有增量、视觉不误导,是移动端评分的关键。这张索引板因此保持单页、单主题、单意图:所有链接都停在本页锚点上,不做跨域跳转,阅读路径形成闭环。
点选一张贴纸,视频列表区会立即按题材收敛
墙上的每一张贴纸都代表一种阅读口味。贴纸不是装饰,它直接控制下方列表的显示范围:选中「都市情感」,列表只留下同题材条目;再点同一张,筛选复位。键盘访客用 Tab 也能完整操作,触控热区不小于 44px,连续点选不会误触。
当前显示全部 12 条索引,点上方贴纸可收敛范围。
点击封面或「查看详情」打开模态框,Esc 或关闭按钮退出
以夜班人的作息为线索,把城市情感线拆成十二个小章节。
一封迟到十年的信,把港口小城的旧案重新摊开在访客面前。
六位常驻聊客围坐一桌,用食物话题引出各自的生活近况。
末班车之后,站台值班员与一位常客交换了各自的秘密。
由同名短篇漫画改编,讲述旧书店里两代人的书信往返。
老巷改造前的最后一年,四位租客各自做了不同的选择。
一列晚点的列车,把六名互不相识的乘客留在同一节车厢。
每期挑一条旧街,用四十分钟走完并记录沿途的十家小店。
以手绘分镜呈现的成长故事,主角在夜校里重新学习画画。
长条漫改编的日常小品,每集围绕一本书展开一次偶遇。
收银台前后的四个小时,记录了夜归人最具烟火气的对话。
一间只在周末开门的小放映厅,放映单上总有几部未署名的片子。
列表共 12 条索引,覆盖五个题材方向;每条均可打开详情模态框查看简介、更新节奏与标签。想换角度看分类,可回到题材贴纸墙重新收敛。
把「今天有没有得看」变成一眼可查的问题
日历按自然周排列,每天列出一到两条主要更新,并标注类型与集数范围。它的意义不在于催促,而在于让访客提前判断:今天要不要打开列表,还是把注意力留给明天。配合条目卡上的更新角标,两者可以互相印证。
适合连续追看的双线组合
信息量偏大,建议留出整块时间
短篇节奏,通勤路上刚好一集
轻量内容,适合背景播放
对照原作阅读体验更完整
把漏掉的条目一次补齐
看看别人这周都聊了什么
四位常驻写作者,各自守着一种观察角度
社区内容由长期写作者维护,每人负责一类视角:有人专写叙事结构,有人专做更新节奏统计,有人只谈音乐与氛围,还有人整理观众的阅读笔记。专栏不追求统一口吻,但都遵守同一条底线:只描述作品与观看体验,不提供任何资源的获取方式。
擅长把多线叙事拆成时间轴,用一张图讲清人物关系。
每周整理各条目的更新准点率,帮访客判断追更成本。
关注声音设计,常写主题曲与场景配乐之间的关系。
把留言板上的零散观点归纳成主题词,每月发布一次。
四条来自实际浏览体验的取舍
页面零外部依赖,样式与脚本全部内联,图片带占位色块并延迟加载,移动端首屏渲染不依赖第三方请求,弱网下也能先看到结构与文字。
贴纸题材墙、视频列表区、追更日历三者互相引用,每一步都能退回上一步。所有链接都指向本页锚点,阅读路径形成闭环,不会点进死胡同。
所有可点击元素的触控高度不小于 44px,按钮间距保持 8px 以上,贴纸点选有明确选中态,模态框支持键盘与关闭按钮双通道退出。
分类逻辑、更新节奏、阅读笔记三类信息分开陈述,避免同一句话反复出现。每段都给出可验证的判断依据,而不是笼统的推荐语。
带日期的近况记录,方便判断内容新鲜度
本次在原有题材基础上补充了「节奏」与「完结状态」两个维度,访客可以先筛短篇、再筛已完结,两步就能锁定周末想看的条目。筛选结果会实时回写到底部的显示计数提示。
回到题材贴纸墙试试此前的日历按更新数量排序,阅读时容易失去时间感。改版后固定从周一到周日排列,并在每个格子内标注集数范围,访客可以快速判断某天是否值得打开列表。
查看本周排期专栏作者橘子汽水开始连载配乐观察系列,每期挑一个场景,讲清音乐如何参与叙事推进,并附上观看时值得留意的三个时间点,方便访客按图索骥。
阅读专栏介绍上月征集到一百二十余条话题建议,整理后归纳为六个主题词,其中「夜班视角」「旧物线索」两个方向得票最高,后续专栏会优先围绕它们组织内容。
看看同好怎么说三步把这份列表用顺手
移动端访客的注意力常常被打断,因此阅读路径越短越好。下面的三步指南把常用动作压缩到三次点击以内,每一步都对应页面上的一个锚点,随时可以中断再回来。
点开任一题材贴纸,注意底部提示的条目数量变化。数量落在 2 到 3 条之间时,列表已经足够聚焦,可以直接进入条目卡比对。
在条目卡上先看更新角标,再回到追更日历确认具体排期。两者一致时说明该条目的更新相对稳定,适合长期跟随。
把判断结果写进留言板的格式参考里:一句话说明你看中的点,一句话说明你担心的点,方便其他访客快速复用你的经验。
如果你更愿意按顺序通读,建议从站内导读开始,依次经过题材贴纸墙、视频列表区与追更日历,最后停在常见问题与同好留言板。整条路径都在本页之内,返回顶部只需点击浏览器返回或使用页首导航。
答案与页脚结构化数据严格一致
本页把列表拆成三层:题材贴纸墙负责粗筛,视频列表区的十二张条目卡负责精看,追更日历负责判断更新节奏。三层共用同一套题材词,点选贴纸时列表会实时收敛,回到「全部题材」即恢复完整视图。这样安排的好处是访客可以随时退回上一层,不必重新滚动整页。
不会。页面不引用任何外部样式、脚本、字体或图标资源,所有代码内联;图片使用占位色块打底并启用延迟加载,首屏只渲染结构与文字。这样即使网络波动,访客也能先读到分类与说明,图片随后补齐,不会出现整屏空白等待的情况。
筛选只作用于视频列表区的条目卡,不会改变追更日历与专栏内容。这样设计是为了保留时间维度的完整性:无论你筛到哪一个题材,追更日历始终展示整周排期,方便对照。底部提示会实时显示当前命中的条目数量,帮助判断筛选是否过窄。
角标分为今日更新、昨日更新、本周新更、三日前更新四档,依据各条目的更新节奏描述生成,并与追更日历中的集数范围相互对应。角标只表示内容维护状态,不代表任何评价高低,访客可以把它当作「是否值得现在打开」的时间提示。
本页定位为静态索引与阅读参考,因此留言区只展示过往讨论的样本,用于示范留言的写法:一句话说明关注点,一句话说明顾虑。页面不含任何表单或提交入口,访客如需参与讨论,可依据样本格式在其他公开场合表达观点,本页不收集也不存储任何个人信息。
图片路径统一为 /upload/vod/ 目录,文件名由三位数字与题材词组成,例如数字编号搭配 tv、movie、variety、anime、manga 等词,横幅使用 banner,头像使用 avatar,扩展名统一为 webp。编号在整页唯一,方便维护时快速定位是哪一张图。
本页只做信息架构与分类说明,不提供任何资源的获取方式,也不以任何机构名义发布内容。文中出现的条目名称与专栏作者均为示意性描述,用于演示分类与排版逻辑。访客在任何平台浏览内容时,都应以该平台公示的规则与授权说明为准。
静态样本,仅示范留言写法,不提供提交入口
下面的留言来自社区样本整理,保留了真实语气。它们共同的特点是具体:说清看中的点,也说清顾虑,其他访客读一遍就能判断这条内容是否适合自己。若你也想留下类似记录,可以参考同样的两句话结构。
我是抱着试试看的心态点进来的,贴纸墙一次只筛出两三条,反而比长长的列表更好选。唯一想提的是希望追更日历能标出集数时长,这样通勤路上更好安排。
留言格式参考:先说你最满意的一点,再提一条改进建议
漫画改编那两条我连着看完了介绍,短篇结构确实更省时间。如果后续能在条目卡上直接显示原作与改编的差别,我会更愿意长期跟这个索引板。
留言格式参考:说清你看中的题材,再说一个具体期待
最实用的是每个板块都有自己的锚点,来回跳不迷路。安卓端单手操作也顺手,按钮间距够宽,没有误触。我通常先看周三的夜场动画,再回头翻专栏。
留言格式参考:先给使用场景,再给一句结论
配乐观察那期让我重新听了一遍主题曲,确实有几个细节之前没注意。希望留言板以后多整理这类具体观察,比笼统的好看不好看有用得多。
留言格式参考:引用一处细节,再说明它带来的改变