# 界面设计期中 **Repository Path**: yangqian5842/interface_design_period ## Basic Information - **Project Name**: 界面设计期中 - **Description**: No description available - **Primary Language**: Unknown - **License**: Not specified - **Default Branch**: master - **Homepage**: None - **GVP Project**: No ## Statistics - **Stars**: 0 - **Forks**: 0 - **Created**: 2020-05-06 - **Last Updated**: 2020-12-19 ## Categories & Tags **Categories**: Uncategorized **Tags**: None ## README # 交互路径分析 #### 图形化与任务点 图形代表不同的前进想法具体化，此处列举网易云音乐的首页和任意播放页面进行分析。 ![网易云首页](https://images.gitee.com/uploads/images/2020/0506/223946_2e7f710f_2228981.jpeg "1.jpg") ![任意播放界面](https://images.gitee.com/uploads/images/2020/0506/224001_b8d7964b_2228981.jpeg "2.jpg") - 从图中我们举例说明：每日推荐的图标是一个“日历”，强调用户使用时如果想要获取每日推荐应该首先看到的图标必须鲜明有代表性；当用户对于每日推荐或者歌单的图标“音乐清单” **产生实际应用习惯之后，类似的交互功能就会在用户的大脑中被图标化。** 这是网易云音乐这款产品采取的比较通用的图形化交互按钮设计。 - 同时，不同的任务点和任务进度用箭头、进程线、进度条来代替表示“前进、后退、循环执行”的交互动作，详见图2中的单箭头表示“回到上一级”，进度条显示歌曲播放的时间、歌曲总时长等等，任务点应用简明的图标不仅在互动意义上比较直观的向用户展示，同时也节省了用户交互操作的流程，提高交互效率。 ### 路径类型 #### 线性路径与径向路径 为了更好的对比线性路径和径向路径的不同之处，采用电脑端网易云音乐和手机客户端的操作页面进行展示：点击播放一个音乐视频，从不同的路径操作返回至首页推荐页面的流程对比 1. 电脑端 流程：搜索视频弹出歌手页面进行查找——返回歌手详情页面——回到首页 ![径向1](https://images.gitee.com/uploads/images/2020/0506/230921_f57120f3_2228981.jpeg "3.jpg") ![径向2](https://images.gitee.com/uploads/images/2020/0506/230939_187ad3b6_2228981.jpeg "4.jpg") 此处的步骤有三项，但是这是属于径向路径：环绕中心点的核心任务进行但是并不是直接进行任务交互执行。 2. 手机端 流程：直接搜索视频名称——返回查找页面——返回首页 ![线性1](https://images.gitee.com/uploads/images/2020/0506/232413_c59af088_2228981.jpeg "5.jpg") ![线性2](https://images.gitee.com/uploads/images/2020/0506/232428_a4e2b5dd_2228981.jpeg "6.jpg") ![线性3](https://images.gitee.com/uploads/images/2020/0506/232441_5ff66e0b_2228981.jpeg "7.jpg") 虽然步骤数相同，但是这属于单线交互的线性路径，直接查找核心任务节点进行交互操作然后返回。 3. 对比 **相对而言，线性路径的查找方式更加符合用户在进行交互时的目的和直接想法，可以更加直接简明的查找想要的搜索内容，而径向路径在交互过程中会展现更多的推荐内容，从推荐智能化的角度来说更加容易推广。** #### 方向与层级 我们仍然采用网易云音乐首页最低端的分类图标进行说明分析。在首页下方的“发现”音乐标志涵盖了例如直播、每日推荐等分类内容；所以下面的五个大图标与右上角的即时播放图标都属于第一层，“账号”处点击交互后可以看到用户歌单和最近播放，也说明了界面设计的方向必须体现明确的层级关系和分类层级说明。 ![层级关系说明](https://images.gitee.com/uploads/images/2020/0506/233151_27f63259_2228981.jpeg "8.jpg") # 自己作品 #### 交互路径亮点提取 我们主打的蛋黄音乐交友APP，在以往音乐APP和社交App上做出了两点修改和交互体验改良。 ![首页](https://images.gitee.com/uploads/images/2020/0510/215509_a608a25e_2228981.jpeg "10.jpg") 首页我们把分区修改为发现-语音-歌单-同城-账号，增加了好友通讯录内有记录的注册对象的搜索历史和优先推送，加强了用户在通讯列表可获取的交互行为能力。 ![亮点](https://images.gitee.com/uploads/images/2020/0510/220000_b982bb29_2228981.jpeg "9.jpg") 我们在播放页面增加了一个小的交互组件，点击可以获取最佳评论的用户进行资料查看，促进歌曲播放当中的用户交互。 ![亮点2](https://images.gitee.com/uploads/images/2020/0510/220054_dce21d81_2228981.jpeg "11.jpg") 其次我们按照动态与私信的交流方式进行了分隔，使得以创新的私信歌曲评论进行新的交互设计。 ![访问记录](https://images.gitee.com/uploads/images/2020/0510/220158_3acc2ff4_2228981.jpeg "13.jpg") 与之对照，我们设计了手动选择是否开启访问记录的选项，并且可以查看具体交互行为发生在哪一首歌曲的哪一条评论。 ![同城交友](https://images.gitee.com/uploads/images/2020/0510/220319_9e2e4a29_2228981.jpeg "12.jpg") 同城交友可以与语音交流相结合，推送相同歌曲或者相同歌手的收听用户，用协同过滤的方式找到用户最想与之互动的歌曲听众，提高交互效率，缩短交互路径。