CASE STUDIES

把经验拆开,让实践更近一步。

发起投稿

设计、前端与后端,30 份原创教学案例,从情境、取舍到验证方法。

共 30 份内容
案例
设计·入门

把品牌官网从信息堆叠变成清晰路径

以独立创作工具的品牌官网为练习,将一句话定位、能力证据、适用人群和行动入口排成可理解的阅读顺序,学习用内容清单与任务检查改善首屏和页面层级。

信息架构品牌官网内容设计
案例
前端开发·进阶

图表的加载、空值与失败如何实现

为内容统计图建立可区分的加载、成功为空、成功有值与请求失败状态,保留更新中的旧数据和时间信息,用文本与表格补足图像信息,防止把零值或失败画成误导趋势。

图表状态异步请求数据展示
案例
设计·进阶

B 端仪表盘先展示什么:从指标到决策

以内容运营仪表盘为练习,按待处理事项、趋势解释和明细追查排列信息,拆分零值、缺失和延迟,建立指标口径及更新时间,让每块图表都能支持一个明确决策。

仪表盘数据可视化信息优先级
案例
设计·入门

登录页的四种异常状态怎么画

从格式错误、凭证不匹配、请求中断和会话过期四类异常入手,建立登录页的状态表、恢复入口与反馈文案,兼顾用户能继续操作和身份信息不被无意暴露的边界。

登录体验异常状态交互文案
案例
后端开发·进阶

审核状态与审计:让每次决定都有来处

为教学案例建立草稿、待审核、已发布和退回的状态转换,使用版本条件避免并发覆盖,把审核决定与审计记录同事务保存,区分内容修改、审核动作和紧急下架的责任边界。

审核流程审计日志并发控制
案例
后端开发·进阶

角色权限:从按钮可见走到资源级校验

以作者、审核者和管理员为例,把读取、修改、审核与管理拆成权限矩阵,再叠加资源归属和内容状态,每次请求执行服务端检查,避免只靠前端隐藏按钮或相信客户端传来的角色。

权限设计资源授权RBAC
案例
前端开发·入门

响应式官网实现:由内容决定断点

把品牌官网拆成语义结构、流动布局和响应式图片三个层次,使用内容拥挤点决定断点,补齐长标题、键盘导航和首屏图片加载检查,避免只适配几张固定宽度截图。

响应式CSS布局图片优化
案例
后端开发·进阶

统计去重:先定义一次,再实现一次

以文章浏览和收藏统计为例,区分事件次数、会话阅读与独立读者,建立稳定事件标识和去重窗口,处理重试、机器人及延迟汇总,避免把每次页面渲染都当成新增访问。

事件统计去重数据口径
案例
设计·进阶

素材库筛选:让条件与结果形成闭环

从查找一套可商用线性图标的任务出发,设计分类、格式和授权的筛选组合,保留当前条件与结果数量,区分没有素材和没有匹配,补齐清空、返回及移动端应用流程。

素材管理筛选交互空状态
案例
前端开发·进阶

素材长列表:懒加载、分页与滚动恢复

从缩略图较多的素材库出发,区分图片懒加载、结果分页和列表虚拟化,使用观察器触发下一批请求,处理重复请求、失败重试与返回定位,让加载策略服务于持续浏览。

懒加载IntersectionObserver列表性能