# Interfacial_design **Repository Path**: zengjieting/Interfacial_design ## Basic Information - **Project Name**: Interfacial_design - **Description**: No description available - **Primary Language**: Unknown - **License**: Not specified - **Default Branch**: master - **Homepage**: None - **GVP Project**: No ## Statistics - **Stars**: 1 - **Forks**: 0 - **Created**: 2020-03-28 - **Last Updated**: 2020-12-19 ## Categories & Tags **Categories**: Uncategorized **Tags**: None ## README

期中项目——“绿动”(竞品:Seek)

成员:梁善宜181013114、梁颖其181013121、颜癸悦181013128、曾洁婷181013024、邱珊珊181013033、徐旖芊181013093

# **一、竞品分析--Seek APP** ## **1. 架构层** ### **1.1 Seek架构图总览** ![1](img-storage/1.png) ### **1.2 Seek产品定位** > Seek是一款利用图像识别技术为用户提供**拍照识别周围植物和动物**的APP。 ### **1.3 一级页面功能简述** * **登入页面**:提供了两种登录方式,分别为INATURALIST账号登录和游客登录,给用户不同的登录选择权利。 * **首页**:根据登入用户的定位搜索并推荐定位中心附近的物种分类,然后以图片形式展示在主页面上。同时有下拉选单提供筛选功能,为用户的物种种类鉴别提供更大的选择空间。在该页面上,设有拍照识别和通知窗口以及另外的一级页面入口:“挑战”。 * **挑战**:该页面主要用于软件的增益功能的存放,用户通过在此页面进行一系列的挑战达成“成就”,是两个一级页面的相互联系,同时用户可以查看已完成或未完成的挑战成果,来了解自己在挑战中的进度。 * **成就**:提高用户参与感而设置的奖励机制,用户可以通过识别物种获得奖牌。用户可以查看自己的级别和赢取的奖牌,增加用户对软件的趣味性和参与感。 * **设定**:此页面用于设定“拍照识别”的相机模式,能够以“通用”或“学术”名称来直击用户的喜好。 * **关于**:用户可以查看app的版本,进行更新,能够查看app的合作团队,增加用户对于软件的信任度和了解。 * **观察**:在观察界面用户不仅可以开启相机,进行识别物种,还可以通过查找观察结果,浏览自己的识别记录,为用户提供了一个属于自己的空间,保留了独特性。 * **INATURALIST**:提供了全球的观察数据汇总以及app的相关简介,同时开设INATURALIST的申请入口,帮助想了解更多社区内容的用户达成目的。 *** ## **2. 交互路径分析** ### **2.1 交互路径图示-Seek** ![2](img-storage/2.png) ![3](img-storage/3.jpg) ![4](img-storage/4.jpg) ### **2.2 交互亮点提取** (1) **提供了两种显示菜单栏的方法**:在屏幕最左侧向右滑会出现菜单栏,左下角也有便于点击的菜单按钮。 * 优点:利于用户自行选择更方便快捷,适合自己的进入菜单栏的方式; * 缺点:对于习惯在屏幕最左侧右滑而进行返回操作的用户而言,这样的设计也有可能会让这一类用户感到不习惯。 (2) **多个“挑战模块功能”跳转**:出现在首页,可以点击跳转“参加挑战”或“查看所有挑战”,也出现在菜单栏中的第三栏,点击后会直接显示所有挑战。 * 优点:利于用户发现这个app比较重要的模块,并且进行点击。 (3) **页面左下角的菜单按钮,弹窗操作内容** * 优点:功能高亮显示,明显的交互方式,容易吸引用户点击选择。 *** ## **3. 视觉层面分析** ![5](img-storage/5.png) ![6](img-storage/6.png) ![7](img-storage/7.png) *** # **二、自己作品** ## **1. 产品页面展示**












*** ## **2. 架构图分析** ### **2.1 架构图总览** ![8](img-storage/8.png) ### **2.2 架构分析** #### **2.2.1 产品定位** > 《绿动》是一款以花园经营为背景,运用图像识别和VR技术打造的一款探索养成类APP。玩家通过VR和拍照识别植物,在虚拟现实和现实世界中进行发现和探索,结合社交+互动的方式,开设了任务、广场、战斗等功能,实现玩家与玩家的交流。该APP可以让玩家在花园经营中得到越来越多的成就感,从而更加关注和关爱身边自然环境中的植物,并且带动身边好友一同参与,达到为绿色环保出一份力的目标。 #### **2.2.2 页面功能简述** * **登入界面**:提供三种注册登录方式,分别是**手机注册登录,第三方软件登录**(微信、微博、QQ)都是用户较为常用的第三方平台,还有**邮箱注册登录**供用户选择,即使忘了密码也可以通过注册的账号找回。 * **首页**:该页面包含了APP的大部分功能,在**页面的底部设置了花园、探索、广场**三个入口,作为APP中最主要的三个功能,用户不仅可以通过页面底部进入,也能通过侧边栏进入,提供了两种进入方式,符合用户平时的使用习惯;在页面的**侧边栏处,有花园、成就、商店、广场、探索、任务、个人中心的入口**,用户可以根据自己的需求点击跳转进入相对应处;在**页面中间,设置了地图,用户可根据定位,实现在自己区域的植物识别和探索**。首页的导航设置为用户提供了更便捷的帮助和指引。 * **广场**:在该界面中,用户可以查看自己的已添加好友列表,并且像查看“朋友圈”那样浏览好友们的动态,如**好友们的花园实况**,用户还可以在该界面中与好友进行进一步的交流对话。此外,还设置了**分享按钮**,便于用户在微信/微博等平台分享自己看到的动态,也起到了一定的“吸引目标用户和潜在用户”的目的。 * **任务**:在该界面用户可以**查看当前的任务以及该任务对应的金币奖励**,根据自己的能力和喜好解锁任务并进行完成,在此界面中用户还可以反复**查看自己当前任务的进度**,进度条的循序变化可以让用户有一种“满足感”,从而使用户不断去解锁新功能,在此款游戏中找到更多的乐趣。 * **探索/发现**:玩家不仅可以**通过VR和拍照识别植物,在虚拟现实和现实世界中进行发现和探索,进行识别物种**。同时,也可以通过**扫描相册的植物图片进行识别**。进行上述操作之后服务器会返回植物的名称、图片展示以及相关详情介绍供用户进行了解,同时用户会得到相应识别到植物的种子以及金币,继而可以开启自己的花园旅程。 * **花园**:该页面相当于用户在虚拟世界中拥有自己的一片**小花园**,可以在该页面**种植在探索页中获得的植物种子**,也可以**在商店页面通过金币购买装饰物和道具更好地经营个人花园**。此外,在花园中,还可以和好友进行**战斗**,并且查看战斗情况,用户可以选择在背包里选取道具**进行反击或者选择放弃逃跑**,增强用户之间的互动性。 * **成就**:提高用户参与感而设置的奖励机制,用户可以通过识别物种获得**相应物种图鉴**。用户可以**查看自己的级别和解锁的物种类型**,增加用户对软件的趣味性和参与感。 * **商店**:此页面提供让玩家**购买经营花园所需用品**的功能以及**获得稀有植物种子**的机会。玩家可以在此处购买植物种子、种植相关工具、花园装饰道具以及肥料更好地经营自己的花园,同时,页面下方的销售员根据用户的相应点击也会对步骤及产品进行详细说明,让玩家更好挑选自己想要的商品。 * **个人中心**:此页面用户可以**看到自己当前的购买记录、我的金币的信息**,也能对该APP进行相关设置(如音量,显示等),同时,还可以对APP进行**意见反馈**,在底部设置了退出键,方便用户对自己游戏账号进行退出登录,切换账号等操作。此外,用户可以在个人中心更换自己的头像和简介。 *** ## **3. 交互路径分析** ### **3.1 交互路径图示—绿动**
### **3.2 交互亮点提取** (1) **提供两种进入“探索”功能的路径**:可从首页下部中间的“探索”按钮直接进入;另外也可从左侧边栏中的“探索”功能级层进入。 * 优点:首页bar按钮简单快捷,左侧边栏也有利于用户熟悉页面结构操作,同时也以更加干净优雅的方式呈现更多的链接。 * 缺点:垂直导航所占据的空间,可能会挤压首页的部分内容。按照习惯来说,绝大多数用户是右撇子,所以可能需要用户横快整个手机屏幕去点击导航栏。 (2) **广场页外部软件同步APP动态交互** * 优点:有利于APP本身内容与外链软件达成互通互联。 * 缺点:可选择共享内容的外链软件不够全面。 (3) **商店页中下部分面板不同商品的介绍随着用户的点击与操作而变化** * 优点:可以让用户在实际体验中更加了解商品的实质功效与内容。 * 缺点:占用版面较大。 (4) **底部导航图标选中高亮显示** * 优点:能够帮助用户区别选中前后的图标的不同,有助于帮助用户清楚自己的状态,避免操作失误。 (5) **“成就”页面滑动与脚步同步显示** * 优点:横向滑动的占用的板块小,滑动的同时也给用户留下了神秘感,为整个界面的设计都增加了活力和动感。 * 缺点:横向的滑动局限性较大,当内容变多时,会增加滑动的负担,造成用户的耐性减少。 ## **4. 视觉规范** (ps.这里的图片要是显示不出来,请登录gitee账号再看) ![请登录gitee后查看](img-storage/24.png) ![请登录gitee后查看](img-storage/25.jpg) ![26](img-storage/26.jpg) ![27](img-storage/27.jpg) ![28](img-storage/28.jpg)