毕业设计（论文）_基于axure个人门户类网站交互原型设计
时间：2021-10-23 12:31:08 来源：网友投稿
学 大 学 告 毕 业 设 计 （ 论 文 ）
开 题 报 告
题
目 目
基于 e axure 的 个人门户类 网站
交互 原型 设计
学
院 院 管理学院
专
业 业 电子商务
姓
名
班
级
学
号
指导教师
一． 选题依据
1 1.1 选 题意义
本次设计以“基于 axure 的个人门户类网站交互原型设计”为主题，即是要基于axure 打造一个个人门户网站，此网站的交互设计、网站内容、网页风格等应符合个人门户类网站的基本特征。其中重点对网站的交互原型进行设计。
目前，对交互设计的研究非常多，主要为了增强用户体验，本设计希望基于原型设计把个人门户类网站优秀的交互设计特征予以整合展现，以寻求对交互设计的更深理解。既可作为其他交互产品设计时的参照，也可启发其他信息系统的交互设计。
同时，也希望在设计过程中，自身获得对用户体验的全面把握，以及 axure 原型设计工具的熟练运用。在整个课题进程中，提升网站交互分析、文笔、审美、用户心理分析、及运用原型设计工具的能力。
1.2 选题背景
1. 2.1 1 个人门户网站介绍
随着互联网的发展，门户网站的兴起，人们的生活发生了划时代的转变。我们生活的方方面面都已更多的依赖于网络。在日常的工作，学习，生活中，每人每天需要接触不同的网站，点击进入数十个门户。据一项数据调查，目前中国青年层每日平均访问网站数达12个之多，其中涉及新闻类、娱乐类、生活类、交友类等不同类型的门户网站。而同一类型的门户网站,用户可能选择多个进入浏览。正如许多用户会同时拥有“土豆”和“优酷”，光临“天涯社区”之后再去“百度贴吧”等等。
正因为要频繁光临不同的网站，花费大量时间，于是，一种致力于帮用户解决所有网络生活问题的网站出现了——个人门户。通过个人门户，用户可以根据个人喜好，自由的添加内容，布局页面。用户可以将自己喜欢的网站添加到自己的门户，以后上网浏览信息，再也不需要一个个网站点击进入，甚至在忘记网址的情况下惹得一身烦恼。个人门户网站，就是以个人为中心的上网入口，还可以进一步延伸为个人信息中心。个人门户具备门户的全部特征，同时能够实现个性化定制，实现内容、社区、应用的有机整合。通过个性化的呈现扩展用户利用互联网的能力，节约用户利用互联网的时间成本。互联网的发展，已到了个性化的时代，因此，个人门户将是互联网发展的必然趋势。
2 1.2.2 原型设计 在交互产品设计中的作用
在交互产品设计实践中，设计师更加关注影响用户行为与习惯的各种因素，如何使用户在交互过程中获得良好的体验。为此，设计团队往往需要根据创意概念构建出一系列的装置，以不断验证想法，评估其价值，并为进一步设计深入提供基础与灵感。在交互设计中， 一般把这样的帮助我们与未来产品进行交互， 从而获得第一手体验，
并发掘新思路的装置，称之为“原型”。
交互原型设计的主要作用，就是要通过设计—体验—改进（设计）的循环过
程，来获得最佳的用户体验，满足用户需求，增强用户粘性。
1.3 小结
通过上述分析可以看出， ，个人门户将是互联网发展的必然趋势。关注未来的网络，重点离不开个人门户，个人门户网站也必将成为未来的焦点。因此，目前，个人门户类网站层出不穷，甚至打出了web3.0理念的招牌，一批批个性化门户网站纷纷上线，都希望在这段肥地分得一杯羹。但是拥有良好用户体验的网站并不很多，许多网站正挣扎在生死存亡的边缘。针对这一普遍现象，我们来寻求改进。
网站的成功与用户体验息息相关，而用户体验便来自于交互设计的结果。可以说交互体验极大的影响着网站的生存与发展。
本课题就将以交互设计为重点，致力于通过体验各类个人门户网站，提取其中优秀的交互模式，并予以整合，同时对不足之处进行改进，集合在自己的原型设计中。最终希望作品可为其他个人门户类产品设计提供参照，使网站获得更佳的用户体验，并启发其他信息系统的交互设计。
同时，也希望通过设计过程，自身获得对用户体验的全面把握，以及 axure 原型设计工具的熟练运用。在整个课题进程中，提升策划、审美、用户心理分析、网站交互分析及运用原型设计工具的能力。
二． 研究内容
1 2.1 研究方向
本课题主要研究并体验以下几方面内容：个人门户类网站、axure 原型设计工具的具体应用、交互设计，原型设计法。
重点是在对交互设计概念的理解之上，通过对比分析国内外几家个人门户类网站，提取出他们优秀的设计，并进行其它的改进，再加入自己的创意于本设计，以最终设计出一个更具良好用户体验的个性化门户网站交互原型。
2 2.2 拟解决的主要问题
本课题意在通过对交互设计理念的理解分析，对比各类个人门户网站的交互原型设计，对个人门户网站的交互原型予以优化。通过对比分析，设计更加完善的交互模式，提升用户体验的满意度。最后完成一个完整的基于 axure 的网站交互原型及网站规划书。
3 2.3 研究 目标
1、关于交互设计目标：希望通过多家网站的对比研究，先进行交互体验，再集合优秀的交互设计模式于本网站。同时也结合本网站特色，创新出部分交互模式，使之更个性化。
2、关于网页设计目标：希望通过对比几个个人门户网站的原型，分析其中的差异后，设计出更符合用户习惯的，更易接受的网页风格，这个网页界面，布局甚至色彩，也必将对交互体验带来好处，原型版式将会更加自由，开阔及个性。
3、关于网站内容设计目标：对于网站内容设计，要符合个性化门户的独特之处，在内容上有一定的创新，使整个内容也能跟上步伐，更加个性化。
4 2.4 本课题 的创新之处
1、打造一个优秀交互模式集中的应用平台。本课题将在进行各类网站的交互体验之后，集合各模块的优秀设计，再注入作者的创新来进行交互的研究设计。
2、在网页风格设计中将会结合个性化理念所需要的内容，进行全新的改版，将呈现更加宽阔，清洁，自由的页面，以便用户个性化添加自己所需。
3、在交互设计中，将会在亲自体验多个网站之后，集合模仿优秀交互设计。同时，进行一定程度的个性化交互创新，以目前的流行趋势为参考，着力使用户感受到一种紧跟时代，更贴近生活的创新性交互体验。
三. . 研究 过程
3 31 .1 研究步骤（研究步骤如图 1 所示）
1、用户对个性化主页的需求调查：通过对用户的需求调查，了解用户对个性化主页的设计内容有哪些要求，以便更好的安排网站的版块设计。
2、个性化门户网站特点分析：对个性化门户网站特点进行分析，根据其特点，结合用户需求，进行内容的整体设计。
3、相关网站交互模式的体验：继承优秀的 HCI-Pattern，找出人机交互设计上存在的不足。选择“雅蛙”“I google”“netvibes”等个性化理念的门户网站或个人门户网站进行重点交互体验。收集优秀的交互设计模式。列出网站的优缺点对照表（见表 1）。
4、对交互设计流程进行分析设计，画出流程图。对设计的每一环节，都考虑是否有创新点，结合当今潮流进行个性化交互模式设计。
5、选择不同职业，年龄，学历的人进行交互体验，并收集意见建议，进行改进优化。
6、尽量重复以上的交互体验过程，尽可能的完善网站交互功能。
7、收集相关材料，撰写网站规划书。
图 1 研究步骤 3 3 .2 、研究方法、工具
本次设计使用网站原型设计方法，利用 axure 原型设计工具进行原型和交互设计。
选择 axure 原型设计工具的原因：
1、Axure 可快速绘制网站构架图，而且可以让构架图中的每一个页面节点，直接连接到对应网页。
2、Axure 内建了许多会经常使用到的 widget 元件，例如：按钮(Button)、图片(Image)、文字面板(Text Panel)、选择钮(Radio Button)、下拉式菜单(Droplist)。
3、Axure 快速建立流程图就像建立 wireframe 一样容易，Flow Widget 中有设计流程图时会经常用到的形状，您可以轻松在流程之间加入连接线并设定连接的格式。
4、其中大多数的 widget 可以对一个或多个事件产生动作，包括 OnClick、OnMouseOver 和 OnMouseLeave 等。
5、Axure 可以将 wireframe，输出成符合 InternetExplorer 或 Firefox 等不同浏览器的 HTML prototype。
6、Axure RP 可以输出 Word 的格式的文件，规格文件包含了目录、网页清单、网页和附有注解的 Master、Annotation、Interaction 和 Widget特定的资讯，以及结尾文件，规格的内容与格式也可以依据不同的阅读对象来变更。
本课题选择 axure 这一新兴原型设计工具，同时避开了 Word、Visio、 Dreamweave等对交互表达不好、不利于演示、操作难度大、需要 html 知识等劣势。更利于各种交互功能的实现及用户体验。选择 axure 作为设计工具，希望在工程训练的同时，
达到对这一新兴工具的熟练运用。设计成果的表现形式为 RP 文件的动态交互原型，及对应的电子商务规划设计文档。
3 3 .3. . 交互体验对比表
表 1：部分网站交互模式优缺点对比表 （I google）亮点 1 亮点 2 亮点 3 每个页面可更换不同的主题，更具个性化。
添加页签过程，弹出窗口显示灯箱效果。
删除标签可二次确认，即删除完毕后有“撤销”按钮，可选择撤销。
（I google）缺陷 1 缺陷 2 缺陷 3 页面里每个小版块可编辑的范围很小，甚至无法编辑 删除页面中某一版块时无确认键，很容易使用户出错。
只 能 选 择 网 站 内 的 主题，用户被局限在网站推出的内容中。
（netivibes）亮点 1 亮点 2 亮点 3 对某一页签或小版块，都可以（通过email、twitter 等形式）根据用户兴趣分享给其它人。
注册过程，可选择选项“不用在公开资料中显示我的年龄”，这点极好的抓住了用户心理。
页面编辑时，可更换背景，同时可更换语言，更加个性化。
（netivibes）缺陷 1 缺陷 2 缺陷 3 搜索朋友时没有引导搜索的选项。
“私有页面”与“公开页面”需分开创建，若通过加密按钮来实现则省事很多。
网站内主题，不能根据不同的页面，不同的模块更换、搭配相关的主题和背景。
(雅蛙）亮点 1 亮点 2 亮点 3 个人资料完善里面有“星座”与“故乡”选项，符合当前人们的关注焦点。
对某页面进行编辑，可以设定加密访问，用户可以选择公开的页面和私人所有的页面。
在“好友管理”里面，独特的推出“好友动态屏蔽”按钮，独具特色。
(雅蛙）缺陷 1 缺陷 2 缺陷 3 在“搜索圈子”模块，只有输入圈子名才能搜索，应该进行分类引导 在对“我的好友”发信息时，当发送完成，页面跳转至 “发信箱”页面，不利于继续发送。
添加好友模块，接收对方申请，只能选“同意并添加对方为好友”，用户非常被动。
四、研究工作进度：
序号
时间
内容
1 1
2 2 月 月 6 16 日- -2 2 月 月 4 24 日
进入 毕业设计，准备开题报告
2 2
2 2 月 月 5 25 日
开题答辩
3 3
2 2 月 月 8 28 日- -3 3 月 月 5 15 日
修改文献综述、外文翻译
4 4
3 3 月 月 6 16 日- -4 4 月 月 5 15 日
期中检查，系统分析和设计
5 5
4 4 月 月 6 16 日- -5 5 月 月 5 15 日
交互模型 开发
6 6
5 5 月 月 6 16 日- -5 5 月 月 3 23 日
撰写论文，论文修改
7 7
5 5 月 月 5 15 日- -5 5 月 月 0 20 日
交互模型 调式
8 8
5 5 月 月 1 21 日- -5 5 月 月 3 23 日
成 果验收
9 9
6 6 月 月 1 1 日- -6 6 月 月 3 3 日
论文答辩
10
6 6 月 月 3 3 日- -6 6 月 月 8 8 日
毕业设计总结
五、主要参考文献：
[1] 马丽、张露.交互设计初探. 信息科学[J], 2007 年,第 5 期:34.
[2] 徐苏、林振荣.交互设计在电子商务网站中的应用研究[J].科技广场，2004.9:12-14.
[3] COOPER Alan .交互设计之路— — —让高科技回归人性 [M ]. D I NGChris等译.北京:电子工业出版社, 2006. [4]刘金晓.人机交互界面定制及生成工具的研究与开发[D].北京:华北电力大学,2008. [5] 吴继雁 , 高山. Web发展新模式[J ].黑龙江科技信息 ,2007,11:52. [6] 刘增.以用户为中心的网络界面设计研究[D].南京：南京航空航天大学，2007. [7] 杨秀蓉.基于互联网交互性的新产品开发及其实证研究[D].长沙：中南大学，2004. [8] 吴瑜.人机交互设计界面问题研究[D].武汉：武汉理工大学，2004. [9] 欧阳波.用户研究和用户体验设计[J].江苏大学学报（自然科学版）,2006,27 卷 5A 期，55-57. [10] 王震亚,刘和山.谈人机交互原理在产品设计中的应用[J]. 工程图学学
报.2009(02)-0126-04. [11] [美]Jennifer Preece, Yvonne Rogers, Helen Sharp 著. 交互设计——超越人机交互[M].
刘晓晖译.
北京: 电子工业出版社, 2003. 6-7.
[12] Jennifer Preece, Yvonne Rogers, Helen Sharp.Interaction Design—Beyond Human-Computer Interaction[M]. John Wiley&Sons Inc. 2002. [13] Terry Winograd. From computing machinery to ingteraction design[J]. New York:Spring-Verlag,149-162.
六、 指导教师审核 意见：
指导教师签字：
年
月
日七 、系（ 教研室）评议意见：
系（教研室）主任签字：
年
月
日
八 、 开题小组评审 意见：
开题小组负责人签字：
年
月
日
九 、 学院 领导审核意见：
1．通过；
2．完善后通过；
３．未通过
学院领导签字：
年
月
日
1、前言 随着互联...