身份与权限
学生、执行者、管理者和访客拥有不同的可见内容与操作范围。
Interactive Product Case
把世界观设定，做成可以实际操作的内部系统。
卡塞尔学院交互站不是一张概念图，而是一套可登录、可检索、具备权限差异与浏览器状态记忆的静态产品模拟。内容叙事和系统规则在同一个界面里发生。
- 身份系统
- 3 种预设身份与访客模式
- 内容规模
- 20 板块 · 26 主题 · 104 楼层
- 核心实现
- Hash Router · ES Modules · localStorage
- 交付形式
- 响应式静态应用
System Design
重点不是页面数量，而是规则一致。
不同身份进入后看到不同首页、组织信息、通知与临时授权策略；限制档案在列表、搜索结果和详情中都必须维持同一套脱敏逻辑。
论坛系统
支持排序、筛选、回复、点赞、收藏，并保留刷新后的本地状态。
档案脱敏
限制内容不只隐藏入口，也在搜索摘要和详情层同步处理。
界面叙事
通知、组织结构与隐藏事件线共同推动世界观，而非依赖说明文字。
响应式交付
桌面和 360px 移动端均完成真实页面检查，保持导航与内容可用。
Implementation
实现与验证
主要文件
cassell.html：页面入口与模块挂载cassell.css：身份界面、内容区与响应式规则cassell.js：路由、权限、交互和状态管理cassell-data.js：角色、板块、主题与档案数据
问题修正
- 修复
#/search?q=...Hash 路由解析问题 - 检查受限内容在搜索和详情中的一致脱敏
- 验证移动端无横向溢出、控制台无运行错误
- 所有账户均为本地模拟，不创建真实用户数据