PLook——记录你的知识

PLook （ Peek 升级版）

<img src="https://i.loli.net/2018/08/08...; width = "100%" align=center />

<!-- MarkdownTOC -->

• 概述

  • 选题背景
  • 项目意义

• 可行性分析和目标群体

  • 可行性分析

    • 设备基础
    • 行为习惯
    • 竞争分析
  • 目标群体

• 做品功能和产品设计

  • 整体功能结构

  • 具体功能模块设计

    • 内容识别引擎
    • 内容辅助标记模块
    • 卡片模态匹配模块
    • 姿态转移识别模型
    • 图像叠态处理模块
    • “三模式”帧态转换处理模型
  • 界面设计（部分）

• 做品实现、特点和难点

  • 做品实现

    • 首页——个人小册
    • 首页——个人小册——小册详情
    • 首页——我的中心
    • 相机——进入相机
    • 相机
    • 内容识别引擎（识别完毕）
    • 内容辅助标记模块
    • 内容辅助标记模块（画笔选择）
    • 内容辅助标记模块（两指放大缩小）
    • 卡片归档小册（长按选中小册，拖拽释放归档）
    • 内容识别引擎模式
  • 特点分析

  • 难点和解决方案

    • 首页
    • 内容识别引擎：
• 团队介绍和人员分工

• 其它

  • 开发结束后的感想
  • 不足之处和从此设想

<!-- /MarkdownTOC -->

概述

现在人们的生活已经离不开手机，除了通信娱乐，手机还能够帮助人们工做和学习。本产品名为“ PLook ”，是一款为给学生群体打造的知识分享载体，其呈现方式为移动互联网应用软件，重点利用线下学生课本知识结合 PLook 线上聚集打造或分享本身的知识内容。

选题背景

学生时代的咱们都喜欢使用荧光笔涂抹书本中的重点内容，当须要屡次复习不一样书本中的一部份内容时不得不带着一本一本又一本厚重的书籍；当独自一人在复习重点内容时，想要把本身梳理的一系列重点内容完整的分享给其它同窗怎么办？

项目意义

不想由于几个重点知识点而带上一本厚厚的书？不想把本身努力梳理出来的重点知识束之高阁？很想跟同窗们打造一本属于本身的知识小册？咱们来了！PLook打造了独特的内容识别引擎，无论你是使用了荧光笔仍是中性笔进行重点内容区域的涂抹和绘制，PLook 都可以较好的识别，帮助你快速记录重点知识！

市面上任何一种荧光笔（主要是红和蓝）均可以透过PLook来将课本中的划线部分传送到手机中显示，如此一来无论学生身处何地，均可以使用手机来复习书上的重点，对于碎片时间的利用率会更高。经过 PLook 自研的内容识别引擎，可以较好的减轻初高中的同窗们可以在平常的学习生活中对重点知识记录和记忆的负担，而且咱们还了打造一个完整知识分享平台，同窗们可以把本身收集起来的重点知识内容进行归档保存，聚集成册，分享给本身的好友，也能够浏览到好友目前正在收集的知识小册内容，从而达到流量闭环，缩减同窗们进行知识交流所耗费的精力。

PLook 自研的内容识别引擎结合了Core ML、Visio、OpenCV三大成熟框架，站在巨人的肩膀上，从新调整，可以对初高中同窗们的平常知识内容识别率达 60%，固然咱们开发团队也在持续不断的努力攻关当中。

<img src="https://i.loli.net/2018/07/29...; width = "50%" height = "50%" align=center />

可行性分析和目标群体

可行性分析

设备基础

1. 本产品面向的对象为初高中同窗，据团队同窗调研，我国大部分初高中学生都携带了智能手机，家长们也都比较开明，可是仍是会有部分家长十分抵制本身的孩子携带智能手机；
2. 一小部分初高中学校已经明令禁止学生携带智能手机进入校园，以上两点都对本产品推广具有必定量的挑战；
3. 但很大一部分的家长和初高中学校并无进行禁止学生们携带智能手机，或者准备禁止携带的态度存在；
4. PLook 这个产品的本意就是给初高中同窗们减轻学习压力，利用课间、放学回家路上等等一些零碎的时间去完善本身的重点知识，协助同窗们牢记重点知识。

行为习惯

1. 初高中学生几乎都会在本身的课本上使用各类颜色的荧光笔涂抹课本上的重点内容，以提醒本身，方便复习；
2. 初高中学生已经接受了使用互联网产品（ App ）的文化，而且也乐于分享本身的成就、乐于分享本身的所见所闻；

竞争分析

这能够说是目前互联网+教育仅存很少的蓝海之一了，市场上保有量很是高的教育类产品基本上都是“解题”、“刷题”、“搜题”、“网课”等等内容，基本上都是站在了引导性学习的一面，可是尚未一个产品是站在学生的角度，让学生自发的组建本身的知识集，利用学生的零散时间去回顾本身的所作下的重点知识，没有一个比较好的方式去聚集、去分享本身的课本中的知识内容。

目标群体

PLook 主要面向的人群为初高中学生，目标人群较为明确，受众群体基数庞大，特别适合在学生过程当中须要大量学习资料、整理大量学习资料的同窗们。

做品功能和产品设计

整体功能结构

<img src="https://i.loli.net/2018/07/29...; width = "50%" height = "50%" align=center />

具体功能模块设计

内容识别引擎

咱们使用 OpenCV 做为图像识别及处理核心，结合 Core ML 和 Visio 框架管理相关模型和输出内容模型，在三者的相互协做下打造出了 PLook 独特的内容识别引擎。

<img src="https://i.loli.net/2018/07/29...; width = "50%" height = "50%" align=center />

引擎支持红色荧光笔、蓝色荧光笔、OCR 扫描识别三大主要功能，因时间因素引擎只完成了红色荧光笔和蓝色荧光笔两种识别模式。红色荧光笔起名为—— “遮罩模式”，蓝色荧光笔起名为—— “切割模式”，这两个模式互不干扰，红色没法识别蓝色，蓝色没法识别红色，可是能够在 PLook 自带独特的相机模块中连续拍摄不一样模式下的照片。

PLook 的内容识别引擎可以较好的处理用户所拍摄照片中核心识别对象由于所处环境的光线明暗、杂物干扰、主体差别等问题干扰，从而较为完整的输出用户想要识别的核心内容。而且用户还能够进行选择是否将识别出的内容转文字，目前 PLook 的内容识别引擎支持英文和中文两种文字的识别。

内容辅助标记模块

在该模块中咱们充分发挥了 iOS 操做系统的优越性，基于Quartz 2D框架开发了一套独特的内容辅助标记模块。总体使用了Core Graphic进行绘制，而且进行了必定量的性能调优，在必定量程度上缓解了传统方法直接重载使用drawRect:方法进行绘制致使的内存暴涨，同时也避免了直接生产寄宿图，渲染快速，使用了硬件加速，而且高效使用内存。由于避免了建立一个寄宿图形，因此不管有用户进行绘制的图像有多大，都不会占用太多的内存，不会被图层边界剪裁掉也不会出现像素化。

<img src="https://i.loli.net/2018/07/29...; width = "50%" height = "50%" align=center />

卡片模态匹配模块

PLook 的灵魂基本上就在用户所拍摄一张张的卡片，因此卡片在某种程度上就成为了决定用户留存的关键因素。卡片模态匹配主要呈如今 PLook 的内容识别引擎把用户的关键内容识别出来后以及在内容辅助标记模块中处理完后的关键阶段发挥做用，在该阶段中，卡片模态匹配模块须要精准定位对应模态的z-index参数，并根据该参数开放模态匹配模式，根据事件传递响应链的层级关系映射到对应z-index参数对应的卡片上，从而达到完整的匹配闭环。

<img src="https://i.loli.net/2018/07/29...; width = "50%" height = "50%" align=center />

姿态转移识别模型

咱们根据 PLook 的业务操做逻辑开发了一套姿态转移识别模型，在该模型中可以较为精准的识别出用户姿态的变化，从而让 PLook 作出提早的判断，预先加载业务资源，提早load上对应的资源文件，稍微用一些空间上的资源浪费来换取时间是的资源减小，较大的拓展 iPhone 设备的硬件资源能力。

<img src="https://i.loli.net/2018/07/29...; width = "50%" height = "50%" align=center />

图像叠态处理模块

PLook 通过一系列模块生成的最终卡片实际上三态图像的叠态状态，三态图像中各自都具有各自须要渲染的图像内容，而如何处理好三态图像的叠加渲染流程就是“图像叠态处理模块”要解决的核心问题，再加上咱们要将引入3D-Touch技术，配合该技术可以让用户直达一重态渲染的原始图像，提高用户体验的同时也能充分的发挥出该模块的核心功能。

<img src="https://i.loli.net/2018/07/29...; width = "50%" height = "50%" align=center />

“三模式”帧态转换处理模型

PLook 中预制了三种帧态处理模式，分别为“遮罩”、“切割”、“连通”三种模式。三种帧态都依赖于同一环境，对环境要求较为苛刻，须要对同一环境下的单一帧态进行环境隔离和清洗，稍一不慎就会致使共用内存区域泄露，该模型可以较好的转换在同一环境下的不一样帧态所要求的初始化环境，可以保证每次切换帧态时环境的完整性和独立性。

<img src="https://i.loli.net/2018/07/29...; width = "50%" height = "50%" align=center />

界面设计（部分）

<img src="https://i.loli.net/2018/07/29...; width = "50%" height = "50%" align=center />

<img src="https://i.loli.net/2018/07/29...; width = "50%" height = "50%" align=center />

做品实现、特点和难点

做品实现

首页——个人小册

<img src="https://i.loli.net/2018/07/29...; width = "50%" height = "50%" align=center />

首页——个人小册——小册详情

<img src="https://i.loli.net/2018/07/29...; width = "50%" height = "50%" align=center />

首页——我的中心

<img src="https://i.loli.net/2018/07/29...; width = "50%" height = "50%" align=center />

相机——进入相机

<img src="https://i.loli.net/2018/07/29...; width = "50%" height = "50%" align=center />

相机

<img src="https://i.loli.net/2018/07/29...; width = "50%" height = "50%" align=center />

内容识别引擎（识别完毕）

<img src="https://i.loli.net/2018/07/29...; width = "50%" height = "50%" align=center />

内容辅助标记模块

<img src="https://i.loli.net/2018/07/29...; width = "50%" height = "50%" align=center />

内容辅助标记模块（画笔选择）

<img src="https://i.loli.net/2018/07/29...; width = "50%" height = "50%" align=center />

内容辅助标记模块（两指放大缩小）

<img src="https://i.loli.net/2018/07/29...; width = "50%" height = "50%" align=center />
<img src="https://i.loli.net/2018/07/29...; width = "50%" height = "50%" align=center />

卡片归档小册（长按选中小册，拖拽释放归档）

<img src="https://i.loli.net/2018/07/29...; width = "50%" height = "50%" align=center />
<img src="https://i.loli.net/2018/07/29...; width = "50%" height = "50%" align=center />

内容识别引擎模式

• 蓝色荧光笔——“切割模式”：

<img src="https://i.loli.net/2018/07/29...; width = "50%" height = "50%" align=center />
<img src="https://i.loli.net/2018/07/29...; width = "50%" height = "50%" align=center />

• 红色荧光笔——“遮罩模式”：

<img src="https://i.loli.net/2018/07/29...; width = "50%" height = "50%" align=center />
<img src="https://i.loli.net/2018/07/29...; width = "50%" height = "50%" align=center />

特点分析

PLook 除了基础框架外达到了核心模块的 100%自研，存在必定的技术壁垒，可以较好的解决初高中学生使用零散时间温习重点知识的需求，而且咱们会持续完善 PLook 的内容识别引擎，使其支持多种颜色荧光笔的识别和提高现有颜色荧光笔识别的准确度。

开发团队来来回回修改了好几回核心业务操做流程，大大缩短了面向的目标人群使用产品的多余时间。从时间诉求上看，PLook 并无花费学生们多余的时间，学生们在使用 PLook 的过程当中，排除一些必须操做几乎都是自动化流程，一张卡片从拍摄到归档，最短只须要不到 10 秒的时间；从精力上看，学生们只须要肯定好本身要手机知识内容，掏出手机，打开 PLook，上滑开启相机，拍摄，归档，这一系列流程下来，很是的顺滑，一鼓作气。

在使用 PLook 制做制做卡片的过程当中，咱们十分推荐用户一旦发现 PLook 内置的内容识别引擎作出的识别效果只要有一些稍微的不满意，在条件容许的状况下最好直接丢弃或者重拍，由于这样会让你手中的 PLook 越用越聪明，越用越符合学生们各自的习惯。

难点和解决方案

首页

在 PLook 的首页设计中，咱们开发团队迭代了十几回，从最初的 Peek 到如今最新的 PLook，一边是内容识别引擎的升级一边是首页的迭代，这两块重担在比赛要求时间这么紧的状况下压力十分巨大。咱们都知道，一个 App 最重要的地方就在首页，由于首页是用户对这个 App 第一印象最直接的判断，好很差用、想不想用，极可能就在这短短的十几秒中，就在这个 App 的两三个页面滑滑看看，点点这点点那。

因此咱们开发团队阅读了一些关于心理学的书，好比《认知心理学基础》、《行为心理学》等等资料，而且仔细攻关拿下最终的首页的定稿——拟物化书本设计。这不是简单意义上的 UI 出几张图就能应付得过去挑剔用户的视觉感官体验的，开发团队最后在 PLook 的代码中把首页的“拟物化书本设计”进行了二次封装，跟随外部设备尺寸变化而进行拟物化书本设计的扩缩，较为充分的把拟物化书本的设计进行了 2D 平面上的延伸。以下所示：

<img src="https://i.loli.net/2018/07/29...; width = "50%" height = "50%" align=center />

内容识别引擎：

内容识别引擎是咱们开发团队重点攻关和技术沉淀，而且花费了大量时间的基础模块，其中最大的难点就在几大框架的协同合做上，尤为是OpenCV的识别模式嫁接，数据流的导向和在上下流层级的格式转换是一块很是难啃的硬骨头，屡次把开发团队的小伙伴搞得十分的郁闷和无奈。一直在截止提交做品的前一天晚上，开发团队的小伙伴都一直还在接着对内容识别模块进行调优。

团队介绍和人员分工

你们好！咱们是 PJYF ！ PJ 和 YF 都来自北京信息科技大学计算机学院，软件工程专业，大三。

PJ 是一个阳光积极的小伙子，从大一入学开始就被学长带入 iOS 开发中，整个大一不但要熟悉大学生活，还要快马加鞭的跟进课程的学习，因此留给本身喜欢的 iOS 开发中时间并很少，直到暑假才能静下心来好好的梳理一遍 iOS 开发中须要掌握的知识内容。这一路走来也磕磕碰碰的掌握了一些 iOS 开发的要点，也算是踏入了 iOS 开发的大门。PJ 主要负责 PLook 的开发、测试、部署和。

YF 是本来也很是的喜欢计算机，可是在接下来的计算机专业学习过程当中，YF 发现其实本身仍是喜欢画画，遂萌生往设计方向发展，造成了一套本身设计语言，并持续的输出本身的设计思想。YF 主要负责 PLook 的调研、设计和产品。

其它

开发结束后的感想

在参加比赛开发 PLook 的这段时间里，中途还得兼顾这期末考试，给团队的同窗都增长了很多压力，在加上 PLook 的核心模块——内容识别引擎的最终识别效果实际上只能达到 60%左右，性能优化问题一直困扰着开发团队，虽说可让用户在平常使用 PLook 的过程当中对其进行持续的调教，可是须要的时间过长，按照 PLook 的内容识别引擎目前的状况来看，若是只是依靠用户自身的调教，要把准确度提高到 90%的稳定输出状态，须要有效样本至少是一千张，转换到平常使用状况上来看，天天拍至少十张卡片的用户也须要一直持续的拍 100 天，成本仍是很大，引擎部分咱们开发团队仍是会继续努力优化，突破难点。

在这一段时间中，咱们逐渐的对技术充满了敬畏之心，曾经一些咱们看起来实在是很高深的技术点在咱们的不懈努力下也都慢慢的完善了出来，也感觉到了自身的知识水平和技术实力的局限性，致使一些功能的实现上走了很多弯路。

不足之处和从此设想

咱们开发团队认为，PLook 最值得称赞的地方也是它最危险的地方，若是不能很好处理内容识别引擎的上下流层级的对接关系和提高识别准确度，势必会流失大量用户，甚至还会直接致使 PLook 的消失。所以下一步咱们的作法将把内容识别引擎上云，在云端进行处理，虽然把内容识别引擎挂载在云端，从总体的使用感觉上用户会以为速度上慢一些，可是依托云服务强大的硬件能力，PLook 作出的内容识别准确度会更高。

---

以上都是比赛的文档，不具有任何参考价值

很遗憾，这个项目没进决赛，能够说是很是很是遗憾了，看到名单后心都凉了，由于付出的汗水不少不少了。总结了一下，其实问题就出在视频上，视频在这，由于最后几天搞得我十分的烦躁，因此作视频的时候内心想着这么付出了这么多汗水应该是稳了，视频就没怎么好好作，直接录屏而后配点音就完了（这视频作的彻底不是我本来水准），彻底没有当时大一作“大学+”时的那种感受，总之就是很遗憾了吧，无论怎么说，我都没有处理好不少细节，觉得扣了不少细节其它事情就无论了，由于当时作“大学+”的时候，决赛去答辩时慌得不行，由于根本没有任何亮点，就是作的平台，可是无论是从文档仍是视频上看，都作的比如今好太多了，有可能就是那种“老子有技术，天下不怕”的感受吧，哈哈哈哈。

也算是给了本身不小的一个教训吧，无论之后要作什么，每一步都要稳扎稳打，不要由于某一块作的好了，就放弃了另一块，恰好其实评委可以看到的就只有文档和视频，尤为是视频，这是抓住评委第一印象的东西，可是我在这狠狠的摔了，忽然想起来去年年底帮一个同窗就作了一个视频，而后就靠着这个视频进了决赛，当时我也只负责作视频，参加比赛的做品是一个 VR 家居展现，其实我以为这玩意就是在 Scene 中拖出来了几个墙和地，添加上纹理，再把柜子啊床啊都拖上去，再给这些 Sprite 添加上点击事件，点了就换 model，最后再添加几个 button 去选择去哪一个房间，没了。任何人只要学了 Unity 都能作的出来，不，应该说是拖的出来。当时这个同窗托我作了初赛视频，反正我也只负责视频，就这么作了，其实我到如今想起来都以为很难以想象，这玩意怎么就拿了银奖。

最初是去年上半年的一次课堂中，我看到了一个 app 的宣传视频，我以为作的东西很是神奇，视频找不到了，找到了个连接，当时就想着必定要把它作出来，去年下半年的时候就磕磕碰碰的作出了核心 demo，也是由于这个比赛的缘由才