# UI-midterm-homework **Repository Path**: ViolaW/UI-midterm-homework ## Basic Information - **Project Name**: UI-midterm-homework - **Description**: 界面设计期中作业 - **Primary Language**: Unknown - **License**: Not specified - **Default Branch**: master - **Homepage**: None - **GVP Project**: No ## Statistics - **Stars**: 0 - **Forks**: 0 - **Created**: 2020-05-09 - **Last Updated**: 2020-12-19 ## Categories & Tags **Categories**: Uncategorized **Tags**: None ## README # CU以及竞品小狗在家分析 ## 介绍 ##### 界面设计期中作业；期中项目（自己的作品）：CU；竞品：小狗在家。 「小狗在家」是一款宠物短期寄养平台，一直专注于家庭式宠物寄养服务APP，同时结合宠物交流社区为一体的资深萌宠爱好者的集结平台。 而我们的作品「CU」是一款宠物领养平台，专注于宠物领养服务APP，同时结合宠物交流社区，宠物医疗，美容，商城为一体的资深萌宠爱好者的集结平台。 ## 一、竞品分析：小狗在家 ### 1.1 架构层 #### 主导航的信息架构简要列明： ![小狗在家1.1.1](https://gitee.com/ViolaW/UI-midterm-homework/raw/master/images/%E5%B0%8F%E7%8B%97%E5%9C%A8%E5%AE%B61.1.1.png) #### 细分页面的结构框架： ![小狗在家1.1.2](https://gitee.com/ViolaW/UI-midterm-homework/raw/master/images/%E5%B0%8F%E7%8B%97%E5%9C%A8%E5%AE%B6%201.1.2.jpg) ### 1.2 交互路径分析 - 在之前竞选“宠物”类型的产品时，首先是被“小狗在家”简洁大方的界面给吸引。其次在运用的过程中发现，“小狗在家”专攻的“宠物寄养”功能用起来十分简洁易操作，且整个寄养的过程中操作的十分流畅。（一下是对“小狗在家——寄养”的路径分析） ![1.2 小狗在家——寄养（交互路径分析）](https://gitee.com/ViolaW/UI-midterm-homework/raw/master/images/%E5%B0%8F%E7%8B%97%E5%9C%A8%E5%AE%B6%E2%80%94%E2%80%94%E5%AF%84%E5%85%BB%EF%BC%88%E8%B7%AF%E5%BE%84%E5%88%86%E6%9E%90%EF%BC%8907.png) # 亮点比较 # - 由于现阶段宠物寄样类型的app比较少，只截取了1个竞品与“小狗在家”app进行对比分析交互亮点。从中发现两个不同的app在对于“寄养”中的一些功能还存在许多差别。 ![1.2 小狗在家——寄养（亮点比较）](https://gitee.com/ViolaW/UI-midterm-homework/raw/master/images/%E5%B0%8F%E7%8B%97%E5%9C%A8%E5%AE%B6%E2%80%94%E2%80%94%E5%AF%84%E5%85%BB%EF%BC%88%E4%BA%AE%E7%82%B9%E6%AF%94%E8%BE%83%EF%BC%89.png) ![小狗在家logo](https://gitee.com/ViolaW/UI-midterm-homework/raw/master/images/xiaogouzaijialogo.jpg "小狗在家logo") ### 1.3 视觉层面分析 ![颜色规范](https://gitee.com/ViolaW/UI-midterm-homework/raw/master/images/colourguifan.jpg "颜色规范") ![图标规范1](https://gitee.com/ViolaW/UI-midterm-homework/raw/master/images/tubiaoguifan.jpg "图标规范1") ![图标规范2](https://gitee.com/ViolaW/UI-midterm-homework/raw/master/images/tubiaoguifan2.jpg "图标规范2") ![内容版式规范](https://gitee.com/ViolaW/UI-midterm-homework/raw/master/images/neirongbanshiguifan.jpg "内容版式规范") ![文字规范](https://gitee.com/ViolaW/UI-midterm-homework/raw/master/images/textguifan2.jpg "文字规范") ## 二、自己作品：CU ### 2.1结构层 #### 主导航的信息架构简要列明： ![CU2.1.1](https://gitee.com/ViolaW/UI-midterm-homework/raw/master/images/CU2.1.1.png) #### 细分页面的结构框架： ![CU2.1.2](https://gitee.com/ViolaW/UI-midterm-homework/raw/master/images/CU2.1.2.jpg) ### 2.2交互路径分析 ![cu的路径分析（首页）-01](https://gitee.com/ViolaW/UI-midterm-homework/raw/master/images/cu%E7%9A%84%E8%B7%AF%E5%BE%84%E5%88%86%E6%9E%90%EF%BC%88%E9%A6%96%E9%A1%B5%EF%BC%89-01.png) ![cu的路径分析02-01](https://gitee.com/ViolaW/UI-midterm-homework/raw/master/images/cu%E7%9A%84%E8%B7%AF%E5%BE%84%E5%88%86%E6%9E%9002-01.png) ![cu的路径分析03-01](https://gitee.com/ViolaW/UI-midterm-homework/raw/master/images/cu%E7%9A%84%E8%B7%AF%E5%BE%84%E5%88%86%E6%9E%9003-01.png) ##### 亮点分析 ![cu的亮点分析-01](https://gitee.com/ViolaW/UI-midterm-homework/raw/master/images/cu%E7%9A%84%E4%BA%AE%E7%82%B9%E5%88%86%E6%9E%90-01.png) ### 2.3视觉层面分析 ![CU 视觉层面分析](https://gitee.com/ViolaW/UI-midterm-homework/raw/master/images/shijuecengmianfenxi.png)