Theme:微信校友平台开发 Character: 课程作业 Capacity:了解产品设计的基本流程
Didore
Interaction Design Portfolio
All our dreams can come ture if we have courage to pursure them
2016.Didore
Name 倪鹏 Home 安徽天长 Birthday 1993.8.23 Address: 浙江省杭州市西湖区留和路288号
About Me 因为喜欢所以选择设计，Design creates our future life,而设计确实是改变了 我的生活，改变了我很多。在过去的两年时间里不断地充实自己，想让自己能够 一直走在设计的这条路上，虽然也走了很多的弯路，遇到了很多困难，但是当时 想的不是放弃，而是我可以做的更好，因为我爱设计。
Experience
Education
2013.9 学校轮滑社团发起者
2011.9-2015.6 滁州学院/学士/机械设计制造及其自动化
2015.7-2015.8 无锡市乐云科技有限公司
2015.9-至今
浙江工业大学/硕士/工业设计工程
2015.6 全国大学生机械创新大赛省赛三等奖 2016.5 比亚迪3D液晶仪表设计入围奖
Skills
Contact Way
Photoshop，Illustrator，Axure
Mobile：+86 15957172576
After Effect，Premiere
Wechat: np5118106412
Sketching
Email：Didore@163.com
Rhino，Keyshot Solidworks 微信二维码
交互设计 UX Design 微信端校友平台设计 骑行APP改善设计
Content
智能产品软硬件设计Intelligent Product Design 儿童智能洗手机设计 智能车内CO2检测器 联觉智能画笔设计
手绘 Sketching
ONE 微信校友平台开发 WeChat sterilizing machine for children
Background 校友平台为校友建立互信的关系网，促进校友之间的交流和共同发展，以及为校友创业困难 、爱心捐赠、助学帮助和学校建设提供 帮助，达到实现校友和学校的长远发展的目的。
Demand Analysis
社会关系网
校友募捐
校区建设
校友创业阶段会遇到融资困难、募捐资金用于校区建 设，校友平台为校友建立互信的关系网，促进校友之 间的交流和共同发展，通过校友达到实现校友和学校 的长远发展的目的。
Wireframe
校友平台
1 主页
2
3
2.1
2.5
搜索
2.2
搜索
3.1
创办活动
校友会 动态
我的
话题
3.2
4.1
我关注的
搜索
4.2
4.3
话题内容
发布话题
5.3
5.4
2.4
2.3
运动
1.1
校友会
活动
首页
5
4
聚会
旅游
1.2
1.3
1.4
1.5
5.1
学校新闻
校友募捐
知名校友
返校指南
个人信息
1.5.1
1.5.2
1.5.3
5.1.1
5.1.2
朝晖校区
屏峰校区
之江校区
基本信息
学籍信息
5.2
收藏
活动
校友会
5.5
话题
5.6
校友
学校新闻
活动
话题内容
展示校方最近的官方新闻，让校友可以随 时得到母校相关的资讯
活动是校友会生命力的体现，以共同的兴 趣爱好为出发点，拉近校友之间的距离， 促进校友之间的交流
为校友进行提问和寻找答案提供便利，节 省校友得到准确答案的时间
校友募捐 通过该模块可查看募捐内容并且完成募捐操 作 知名校友 展示学校知名校友的风采 返校指南 展示校方的三个校区地址和地图信息，为 返校的校友提供相关的资讯和帮助。
校友会动态 校为地方校友会，为地方校友建立互信的 关系网，促进共同发展
我的 为校友平台中与自己相关的内容进行一个 汇聚，减少用户在使用过程中为寻找而浪 费的时间
Task Flow 公众号
是否首次登陆?
No
Yes
注册
首页
活动
No
所有活动
创办活动
活动详情
信息填写
是否可以报名？
审核是否通过？
Yes
报名
成功提醒
人数过限
No
Yes
通过提醒
活动模块作为保证校友平台和校友之间活力 的重要内容，因此选取这一部分进行任务流 程分析，通过所有活动的申请和创办活动的 申请分析，为产品低保真提供页面流程的理 论依据
Wireframe Official Accounts
Sign Up
已注册直接进入平台首页
Home Page
Activity
创办活动
注册后进入平台首页
查看活动详情
点击活动按钮 进入活动模块 首次登入进入注册页面 微信公众号推送学校相 关新闻资讯，以及校友 平台内消息推送
首次登入需首先进行学 籍认证进行注册，非首 次直接进入校友平台
校友平台首页主要展示学 校相关内容，由导航进入 活动模块相关内容
Activity Detail
Start a Activity
Join In
报名后的到报名 成功或者失败提醒
活动报名后将得到报名 成功或者不成功提醒
进入活动详情页面可查看 活动相关内容
进入活动模块后，可进行 顶部导航选择感兴趣的活 动，并且可以创办活动
Check
创办活动后得 到系统审核提醒
填写活动相关的内容，完 成创办活动
提交活动申请，校方对活 动进行审查，审查成功后 将通知创办者并可进行报名
Main Pages Visual Design
9:41 AM
Visual Design 用户界面采用简洁、易用的界面设计，白色为主色调，保证内容的可读性 ，迎合多年龄阶段的校友。
100%
TWO 骑行APP开发 Riding application development
Background 低碳、健康让骑行风迅速流行，作为一名骑行爱好者，在使用当下 一些APP时发现很多没有必要的功能，却缺少骑行过程中 急需 的 功能，因此希望通过 改善 骑行APP，真正的帮助和解决骑士们在 骑行中遇到的 问题 ，享受骑行带来的快乐
Product Research
骑遇
野兽骑行
黑鸟单车
行者
通过分析以上五款主流的骑行APP，分析出各款的优缺点 1.骑行移动端APP数据太多 2.骑行爱好者喜欢分享个人骑行经验和心得，游记分享 3.爱探险，进行未知的探索和发现 4.户外补给，包括住宿、饮食、单车维修 5.提示推荐的景色，精品路线描述不详细 6.户外联系和自动添加集合点 7.商城积分取代勋章，提供骑行的激励作用
Function Analysis 通过之前产品分析发现的问题之后，与浙江、上海、安徽的骑友进行语 音访谈，深入了解目标用户在骑行中的痛点。根据骑行移动端APP的产 品规划，围绕 骑行 、 发现 和 我的 三大模块，列举了产品详细的功能 点，经过筛选和整理，对骑行过程提出 骑行约伴 和 沿途美景 提示 、 寻找食宿 和 维修 和与 失散朋友集合 的功能点，得到产品的信 息架构，作为后续产品设计的总框架
Information Architecture
城市列表
难度
里程
创建线路
总里程
总时间
我的消息
最高速度
个人信息
平均速度
骑行里程
适合车型
创建者
线路列表
骑行历史
活动时间
我的线路
骑行设置
消息权限
离线地图
线路简介
地图信息
骑友评论
搜索
骑行线路
精品线路
已下载
黑名单
意见反馈
年
我的
周
月
推荐
同城
我的
活动简介
退出登录
活动奖品
热门活动
俱乐部
排行榜
设置
其他
我的
骑行APP
骑行
发现
骑行时间
活动简介
分享骑行
发布约伴
地图信息
人数限制
选择路线
穿件路线
GPS定位
发布问题
联系方式
标题
速度
内容
添加图片
时间
数据
里程
地图
最高速度
骑行数据
食宿维
附近约伴
沿途美景
Wireframe
Task Flow
开始
通过分析，建立一个实用和初期的产品原型，以任务流程为依据绘制出更加注 重结构和纯颜色块视觉的低保真原型， 保证后面的高保真原型高效的输出 No
是否注册? Yes
登陆
2
注册
6
5
7 主页
准备骑行
8 是否调用线路？
No
Yes
调用路线
发送请求
是否同意？
查看附近骑友
创建线路
开始骑行
查看地图
No
Yes
添加集合
继续骑行
结束骑行
是否添加补给站？
1
No
1
可通过第三方登陆
2
可通过返回按钮返回 APP首页
3
账号填写后，用户头像 可出现用户头像
4
忘记密码可由此进入密 码修改页面
Yes
添加信息
完成骑行
分享状态
结束
很多骑友在骑行中会约不到同伴一起骑行，作为关注于骑友的骑行过程， 因此将将骑行APP的“骑行”模块这一功能进行任务流程分析，并且作为 后面页面流程的基础
5
其他模块通过向右划开
6
点击进入约伴骑行和发 布问题
7
此处Banner展示推荐活 动
8
骑友分享的线路地图
3 4
骑行页
选择骑行路线
创建骑行路线
首次创建路线
6 5 1
7
3
2 4
1
向左滑动可转换至最高 速度显示
2
点击开始骑行
3
线路选定后即页面显暗
4
点击可增加新地点
6
点击可创建新线路
5
点击输入可搜索新地点
7
未有骑行路线即可通过 点击进行创建路线
骑行页
附近骑友
发送结伴请求
收到结伴请求
3 1 4
5
6
2
1
点击进入地图页面
7
2
点击可退出地图页面进 入数据页面
6
对方的地图位置显示的 比自己的突出用来区别
3
显示骑行数据
7
点击向附近的骑友发送 结伴请求
4
点击可显示补给站地理 位置
5
点击可查看附近介绍骑 友
8
8
点击可同意或者拒绝对 方发出的结伴请求
添加集合
添加补给点描述
补给点描述
查看点描述
1
2
1
同意约伴后，系统根据 双方骑行路线自动添加 集合点
2
骑行结束后即可对骑行 后的地图添加补给站或 者景色等
3
3
描述成功后即可查看相 关描述
询问是否分享
分享骑行
2
3 1
1
骑行结束后退出页面， 系统将自动询问是否分 享骑行动态
2
此图显示为骑行地图的 缩略图
3
点击可添加照片
用户可通过新用户注册和用户登 录，以及第三方支持登录
用户通过手机号码获取验证码进 行用户注册
用户通过手机号码进行登录，当手机号 码填写后头像将出现用户头像
Visual Design 用户界面以欢快、明亮的黄色作为主色调，以符合骑行 爱好者的视觉个性的审美要求
骑行地图界面 骑行地图界面展示以地图信息为主，地图顶部为用 户提供骑行数据，右部图标为骑行用户提供相关工 具的便捷
9:41 AM
100%
THREE 儿童智能洗手机 Intelligent washing machine for children
•
Concept Description 我们希望通过一种既能体现趣味作用，又着重保卫 儿童健康 使用产品，加强产品的 关怀性。形成一种新的使用方式的体验，既体现父母的 监护作用 又培养儿童的 好
奇心 。本着情感化设计的宗旨对儿童生活用品进行再设计，使熟悉的产品陌生化。 希望儿童成长过程中 重新 去用心体会身边的事物，满足情感需求的细微之处。令设 计不仅仅是设计而是用 设计方式 去生活
Research
2015.11.27 通过实地走访杭州儿童医院 寻找设计契机
采访护士长
Behavior analysis 摸
细菌 布满了整个医院，而儿童更是喜好 乱摸乱碰 ，
洗
有些儿童甚至是喜欢将手放入嘴中，细菌毕竟通过口进入
儿童身体而导致生病。儿童有的时候 不喜欢洗手 ，而 父母不得不为此伤痛脑筋。因此希望通过通过设计，让儿
搓
童能够在洗手的过程中发现 乐趣 ，并使得儿童能耐 乐
于洗手 ，而不是不得不洗手
Major Components GPS信号
温度
数据
地图 商城
UNO
骑行
怎样让儿童主动去消毒？
分享
Arduino开发板
发现
移动端 光电传感器
其他 超声波传感器
精品路线
热门活动 蓝牙传感器
这就需要提出一种互动、有趣的的方式去吸引儿童的注意力 约伴 Development Board
Photosensor
Ultransonic Transducer
Bluetooth Sensor
俱乐部
我的 问答
设置
排行榜
消息
个人资料
总里程
我的路线
骑行历史
设置
设置
通过Arduino开发板连接蓝牙传感器、红热传感器、超声 设置 波传感器， 红热传感器 判断是否有人靠近， 超声波
传感器 判断儿童手的与洗手机的距离， 蓝牙传感器
设置
传递信号产生视频
设置
怎样让儿童 主动 去消毒？
这就需要提出一种 互动 、 有趣 的的方式去 吸引 儿童的注意力
骑行地图界面 当儿童站在机器面前，机器生 产出水幕，洗手机在中间区域 创造出一个虚拟影像，当儿童 洗手时，虚拟影像随着儿童的 手而运动，就像影像在和儿童 玩一样
FOUR 智能车内CO2检测器 Intelligent vehicle internal CO2 detector
Concept Description 对于儿童来说，父母是他们的绝对依靠，生活中，父母总是试图去寻找更好的方式去照顾他们，甚至想要亲 力亲为，但某些 原因 却不可避免有的时候做不了。感受至此，我们思考能否将 关爱 的概念引入到日常用品
再设计 中去，我们的切入点由此而生，即设想一种新的基于儿童日常生活的产品使用方式的产生，从而达 到 守护 的状态 国内儿童被困车内时间频发
Problems Finding 如将孩子遗忘在车内， 密封状态 下，车的材质是金属，会吸热，会使车内温度增
2014.3新疆9月大的女 童独留车内，中毒身亡
藏或玩耍时将自己锁在车内，这种状态下，家长 没有及时发现 致孩子窒息事件 ，将会有 生命危险
FIVE
2013.10 河南3岁儿童 被忘校车内窒息死亡
加，另外，呼吸会使氧气浓度降低，二氧化碳浓度升高,从而导致 窒息 。小孩子捉迷
2015.4 四川3岁女童被 困校车内数小时，死亡
2015.6 湖南4岁男 童被困数小时死亡
2015.6 广西12岁男孩独 进车内被锁，窒息死亡
Major Components
2015.4 上海19个月大儿 童被困车内数小时，死亡
2014.8 福建2岁女童 被忘车内12小时，死亡
信息来源：腾讯网
Arduino开发板
Co2传感器
Development Board
Co2 sensor
蜂鸣传感器 Buzzer sensor
当Co2浓度高于某一定值时将触发蜂鸣器传感 器，从而达到报警作用
sketch
Thank You For Looking
Mobile：+86 15957172576 Wechat: np5118106412 微信二维码
Email：Didore@163.com