发表于： 2019-07-27 23:58:21
1 483
今天完成的事情：
网页端的调研
明天计划的事情：
网页端原型
遇到的问题：
看了老王的日报以后总感觉分析的有点浅，自己选了个略难的角度，结果老杨说没什么太大的必要，略感迷茫
收获：
.png)
| 内容 | 产品 | 详情 | 用户专属产品信息 | 备注 |
| 爱奇艺 | 左侧一级列表导航，个人设置划分二级tab导航，囊括用户信息 | 记录，关注，收藏，预约，消息，空间，积分，vip，上传，钱包，商城 | 划分略显混乱，个人空间鸡肋 | |
| 腾讯视频 | 左侧个人信息卡片+列表导航 | 记录，收藏，订阅，评论，消息，上传，管理，实名认证，VIP，商城 | 对社交平台所绑定的用户信息并无访问权限，由于商城功能涉及资金，故加入了实名认证 | |
| 起点中文 | 首页+左侧列表导航 | 账务，票夹，红包，书评 经验值等级，任务，徽章 会员，安全，作家 广告 | 对左侧的导航列表进行小分类，设置首页页面作为综合展示 | |
| 知乎 | 个人主页使用tab导航，创作者中心功能较多，使用左侧列表导航 | 账号密码，消息邮件，个人设置，个人主页，创作者中心 | 对用户和创作者有两个不同的子模块进行管理，绑定账号在设置模块，入口和页面分类简洁明确 | |
| 赶集 | 个人主页，tab一级导航，左侧二级列表导航 | 信息管理，账户信息，帮助中心 | 在二级导航进行了明确分类，但页面设计较为原始 | |
| 淘宝 | 首页，tab一级导航，左侧二级列表导航 | 首页，账户设置（安全，资料，绑定），消息 | 通过标签分开了用户信息和用户产品专属信息，同时在用户信息下设置了下拉菜单进行导航，进行内容提示 | |
| 华为云 | 左侧列表导航 | 基本信息，实名认证，学生认证，首选项，特权，推荐 | 账号信息、账号安全、产品功能相互，独立无法在页面内切换，只能在通用顶部导航栏内进行切换，划分明确，避免臃肿 | |
| 腾讯云 | 左侧列表导航 | 账号信息，安全设置，项目管理，访问管理 | 页面内导航与导航栏保持一致 |
今天完成的事情：
网页端的调研
明天计划的事情：
网页端原型
遇到的问题：
收获：
| 入口位置及样式 | 产品 | 设计方式 | 详情 | 跳转方式 |
| 爱奇艺 | 右上角导航栏圆形头像+下拉卡片 | 头像，用户名，会员，退出登录以及订阅、收藏、安全、帮助 | 鼠标移入出现卡片，点击头像跳转到个人中心页面 | |
| 腾讯视频 | 用户名，切换，退出，vip，消息，记录，活动，app | |||
| 起点中文 | 右上角用户名 | 用户名，消息，退出 | 点击标签进行跳转 | |
| 知乎 | 右上角导航栏方形头像+下拉列表 | 主页，创作者中心，设置，退出 | 点击头像出现下拉列表，点击主页进行跳转 | |
| 赶集 | 右上角标签导航+下拉列表 | 用户名，退出，个人中心，帮助，app | 鼠标移入出现下拉列表，点击个人中心，进行跳转 | |
| 淘宝 | 左上角用户名+下拉卡片 | 头像，账号管理，退出，会员 | 鼠标移入出现下拉列表，点击账号管理，进行跳转 | |
| 华为云 | 右上角导航栏圆形头像+用户名+下拉列表 | 账号中心，费用中心，待支付订单，待续费产品，未读消息，工商管理，退出 | 鼠标移入出现下拉列表，点击账号中心进行跳转 | |
| 腾讯云 | 右上角导航栏圆形图标+下拉列表 | 昵称，账号信息，费用中心，未读消息，我的工单，退出 | 鼠标移入出现下拉列表，点击图标进行跳转 |
经过调研，入口位置无过多变动，多在右上角，淘宝由于内容过多，放在了左边，不同产品之间区别最大的是个人中心入口是否与导航栏相结合，视具体情况而定；
入口样式有三种，一：图标+卡片；二：图标+列表；三：标签导航；
圆形，方形图标，头像的作用与用户名类似，均是为了引出卡片或列表，所以对用户并无较大影响，其中圆形头像较多，证明其较为符合用户习惯；
卡片和列表的作用均是为了容纳更多的用户产品专属信息入口，卡片的优点是存在一定的设计空间，所以常见于淘宝，爱奇艺等风格较为轻快的产品，列表的优点是清晰明了，适合于知乎，腾讯云，华为云等风格较为严谨的产品；
标签导航即直接将入口外置在右上角的导航栏内，适合用户对该模块的使用需求较高的情况，如赶集网； 跳转方式中，按钮位置与设计方式相关，不做赘述，触发方式有移入触发和点击触发两种，在实际应用中移入触发明显更为便捷，点击触发的方式应用较少，可能是为了防止误操作；
| 设计方式 | 适用场景 | 优点 | 缺点 | 案例 | |
| 首页\个人主页 | 风格较为轻快的产品，更多作为展示 | 信息综合展示 | 过于繁杂，会出现要用的没有还得在导航里找的情况，用户使用成本高，且不作为首页展示的时候，使用频率极低 | 赶集网 | |
| 左侧列表导航 | 对产品功能使用频率高的娱乐性质产品。列表内容较多，对风格严禁的商务产品，列表分类明确 | 应用广泛 | 对网站设计者模块划分的功底有很大考验，好的很明晰，差的很混乱 | 知乎，华为云 | |
| 一级列表，二级tab | 对子模块下还有内容需要划分 | 对模块进行了分类 | 一般列表划分较细，对其再进行划分，内容少，强行添加会造成结构混乱 | 爱奇艺 | |
| 一级tab，二级列表 | 对产品的用户资料，产品功能，用户安全，等大模块划分明确 | 划分明确 | 页面简单的情况下，需设置辅助方式进行提示 | 淘宝 |
返回列表
评论