§04 信息架构

Information Architecture

产品结构、页面层级与导航设计

4.1 产品架构图

4.1.1 整体结构

产品功能架构图
graph TD
    A[产品名称] --> B[模块A]
    A --> C[模块B]
    A --> D[模块C]
    A --> E[模块D]

    B --> B1[功能1]
    B --> B2[功能2]

    C --> C1[功能3]
    C --> C2[功能4]

    D --> D1[功能5]

    E --> E1[设置]
    E --> E2[个人中心]
    

4.1.2 模块说明

模块 功能描述 用户价值 优先级
【模块A】 【如:内容浏览与学习】 【核心价值】 P0
【模块B】 【如:社交互动】 【价值】 P1
【模块C】 【如:个人管理】 【价值】 P0
【模块D】 【如:系统设置】 【价值】 P1

4.2 页面结构

4.2.1 页面层级

页面层级结构
graph TD
    Root[App/Web入口] --> Tab1[首页]
    Root --> Tab2[分类]
    Root --> Tab3[消息]
    Root --> Tab4[我的]

    Tab1 --> P1_1[详情页]
    Tab1 --> P1_2[搜索页]

    Tab2 --> P2_1[列表页]
    Tab2 --> P2_2[筛选页]

    Tab3 --> P3_1[通知列表]
    Tab3 --> P3_2[聊天详情]

    Tab4 --> P4_1[个人资料]
    Tab4 --> P4_2[设置]
    Tab4 --> P4_3[订单/记录]

    P4_2 --> S1[账号安全]
    P4_2 --> S2[隐私设置]
    P4_2 --> S3[关于我们]
    

4.2.2 页面清单

页面ID 页面名称 页面路径 入口 优先级
P01 首页 /home 启动页/Tab栏 P0
P02 分类页 /category Tab栏 P0
P03 详情页 /detail/:id 首页/分类/搜索 P0
P04 搜索页 /search 首页/分类 P1
P05 消息中心 /message Tab栏 P1
P06 个人中心 /profile Tab栏 P0
P07 设置页 /settings 个人中心 P1
P08 登录页 /login 需要登录时 P0

4.3 导航系统

4.3.1 主导航

【描述底部Tab栏或主导航的设计】

Tab 名称 图标 选中状态 未读提示
1 首页 home 填充图标 支持
2 发现 compass 填充图标 不支持
3 消息 message 填充图标 红点+数字
4 我的 user 填充图标 不支持

4.3.2 返回规则

场景 返回行为 说明
一级页面点击返回 退出App/提示再按一次 【如:首页点击返回】
二级页面点击返回 返回上一级 【如:详情页返回首页】
存在未保存内容 弹窗确认 【提示保存或放弃】
深层页面返回 逐层返回 【如:设置-账号安全-修改密码】

4.4 状态与权限

4.4.1 登录状态

页面/功能 游客可见 登录后可见 未登录处理
首页浏览 正常访问
收藏功能 跳转登录
评论功能 跳转登录
个人中心 部分 完整 显示登录入口

4.4.2 用户角色权限

功能 普通用户 VIP用户 管理员
基础功能
高级功能
内容管理 仅自己 仅自己 全部
数据统计