Android项目实战系列—基于博学谷(二)界面设计
2020-04-26 本文已影响0人
微笑涛声
![](https://img.haomeiwen.com/i23054086/31093d83574109d1.png)
一、原型设计介绍
百度百科
:原型设计是交互设计师与PD、PM、网站开发工程师沟通的最好工具。而该块的设计在原则上必须是交互设计师的产物,交互设计以用户为中心的理念会贯穿整个产品。利用交互设计师专业的眼光与经验直接导致该产品的可用性。产品原型可以概括的说是整个产品面市之前的一个框架设计。以网站注册作为例子,整个前期的交互设计流程图之后,就是原形开发的设计阶段,简单的来说是将页面的模块、元素、人机交互的形式,利用线框描述的方法,将产品脱离皮肤状态下更加具体跟生动的进行表达
个人观点:进行原型设计是为了更好地体现产品的原型,程序开发本来就是一项抽象的工作。加入原型设计会使程序开发人员对产品有一个更好的认知和了解。大大缩短的开发时间,更加明确了用户需求,增加了开发效率。
二、原型设计工具介绍
1、比较流行的原型设计软件
Axure PR(推荐使用)
墨刀
Invision
Marvel
POP(Prototyping on Paper)
Moqup
- 还有很多....
2、我的使用
我使用的是Axure PR 8
,可以简单上手,功能强大。Axure PR 9
也可以使用了。在Axure PR 8的基础上升级了一些功能。如果需要安装Axure 8 PR可以参考我- 的另一篇博客:
3、Axure软件主界面
![](https://img.haomeiwen.com/i23054086/6290cfb88f31afd4.png)
三、部分界面设计展示
1、界面结构设计
![](https://img.haomeiwen.com/i23054086/77a140647ecaf94a.png)
2、点击预览,会跳转到浏览器进行效果预览。
![](https://img.haomeiwen.com/i23054086/4784814f7aec8022.png)
3、欢迎界面,软件启动时会先运行欢迎界面。停留三秒后跳转到主界面(课程界面)。
![](https://img.haomeiwen.com/i23054086/edfeda289004bdeb.png)
4、课程界面,也是主界面。所以有轮播图片。
![](https://img.haomeiwen.com/i23054086/eaac6b54038272aa.png)
5、课程详情界面——课程简介部分
![](https://img.haomeiwen.com/i23054086/6957cacb85a676ba.png)
6、课程详情界面——视频部分
![](https://img.haomeiwen.com/i23054086/7c39572372d21ec1.png)
7、习题界面
![](https://img.haomeiwen.com/i23054086/0e52fea56e7283cd.png)
9、习题详情界面及作答效果
![](https://img.haomeiwen.com/i23054086/ee8936182aa3c481.png)
Android项目实战系列—基于博学谷 开源地址
![](https://img.haomeiwen.com/i23054086/5aeb699a8ae5f8b5.png)
![](https://img.haomeiwen.com/i23054086/6f0bc88cd62da800.png)