头像web版交互设计总结
NO
头像web版交互设计总结
头像web版交互设计总结
jadl201*-4-22
互联网资源
1.项目背景
QQ会员头像是一个会员比较喜欢的功能，为用户提供了大量优质精美的头像。但内容一直由官方提供，虽然保证了质量，但在数量上更新速度上难以满足用户的需求。
在加上用户分享头像的新特性后，客户端小页面的局限性问题也凸显出来，不再适合大量item内容的展现。由此，头像专区迁入到VIP官网正式立项。
2.设计过程
在头像web版项目中，交互设计首次尝试交互组重点项目设计流程，完整、严格并且有总结性输出的对流程做了验证。
设计流程和涉及的方法如下图所示：
1.用户研究
这部分内容主要回答以下问题：“谁将使用这个产品？”“用户？用户到底是谁？他们是什么样的？”“他们为什么用这个产品？”
1.1用户角色
在头像项目中，首次尝试引进人物角色这一强大的设计工具。通过建立用户模型和人物角色，来解决产品用户群基数大，目标用户不明确的问题。这是一次非常值得、并富有意义的尝试。并且用户角色定义后，为QQ会员以后其他的项目提供了便利。
1.2情景描述的任务分析方法
相比其它的任务分析方法，情景描述法好处在于它容易懂，问题会暴露的更明显，对后续的功能设计更有用。此外也可以来帮助做系统评估。
2.信息构架
这部分起承接作用，目的是为了将前期用研的成果，向界面设计转化。“信息架构”比较术语，可以将它理解成站点结构的搭建或内容组织。
这一步我们要做的，首先是设计一些功能，用于支持角色完成任务或帮助解决之前任务分析中所碰到的问题。因为商城是一次改版、而非全新的项目，所以不需要对所有功能面面俱到的进行分析，只是阐述其中一些关键、有代表性的功能。接下来，是对站点整体结构进行设计和组织，力图使其条理清晰，逻辑关系明确。
最终出产的站点结构，需要可以支持用户完成任务流程，并尽可能的使这个过程自然流畅，符合角色的思维方式。大多数人只有在找不到自己想要的信息或遭遇困惑时，才会留意到站点的结构和分类等。这也就意味着，一个好的信息架构，应该是不会被角色注意到的，但它又确确实实地帮助着角色去完成任务。
2.1功能设计
相比客户端小页面，功能点上面没有增加很多新的特性。
2.2站点架构设计
3.交互设计
当站点的结构被骨架搭建起来之后，就需要更为详尽的细笔钩勒，让整个站点丰满起来。
通过框架设计，解决这个站点的结构，主要区域为item内容展示。侧边栏为公用模块。
接下来，是两人个关键界面的设计：首页和item列表页。这两个界面将为后续的详细设计定义具体的框架和模板。
整个流程中的还有一个亮点，将通用模块的元件化处理，不仅使得复用性增强、效率提高，也为大型设计项目积累经验，使得多个设计师的合作更为有趣和高效。
详细界面设计，从两个方面入手：布局和行为。功能模块如何组织？点击某个功能将会触发怎样的操作？而这些，也就是交互设计师最终将输出给项目组的稿件。
3.1界面架构设计
首页采用三栏式布局，突出丰富多彩的内容。
内页详情页面。右侧边栏为固定组件，左边为主要内容展示区。
3.2模块组件处理
对于一些在原型制作过程中，会重复用到的功能模块，使用Axure将其制作成了元件（master），可重复使用。
这样做有几个方面的好处：
A.原型制作效率大幅度提升（观看制作过程）；
B.在需要多名设计师合作的大型设计项目中，可以通过这种方法保证原型风格统
一；
C.有利于培养新同学快速上手。
这里典型的模块为页面右侧边栏，“自定义头像”“分享头像”和“7天自动分享头像”为特性功能点，做成模块化处理，在各个页面都可以很顺利的进行。
扩展阅读：交互设计笔试题总结
1平面设计工作的流程1)进行设计需求分析；2)提供设计构思；3)收集整理资料；4)选择相关软件进行制作；
5)根据领导或客户的意见进行修改；6)成稿。
2用户体验（UE）是一种纯主观的，在用户使用产品过程中建立起来的感受。但是对于一个界定明确的用户群来讲，其用户体验的共性是能够竟有良好的设计实验来认识到。好的用户体验，是一种“自然”的体验。
一、问答题。
3对用户体验及相关行业阅读过的书籍。
4列出至少5个国内外对应网站？
GoogleVS百度FacebookVS人人Twitter(140字符)VS微博eBayVS淘宝AmazonVS京东YouTubeVS优酷土豆grouponVS拉手网
5jpg和gif格式的不同点，各自应用在哪些场合。
1).jpg格式是由一个软件开发联合组织制定的有损压缩格式，用最少的空间得
到较好的图像品质。对色彩的信息保留较好，适合应用于互联网和需要连续色调的图像如照片。
2).gif格式是一种基于LZW算法的连续色调无损压缩格式，它的另一个特点是
可以存多幅彩色图像，可以构成最简单的动画。GIF文件支持透明特性，有大量的软件使用GIF图像文件，它还适用于icon图。
3).png格式是基于公共专利压缩算法的无损压缩格式，支持8位和24位图像。
PNG文件也支持透明特性，8位的PNG图片与GIF图片基本相同，24位的PNG可以支持Alpha透明效果，适合用于需要与背景完美融合场合。
6怎样理解“设计”二字？
7好的设计有什么标准？
8中国web设计与外国的同行比较有哪些优势和不足。
9说说优秀的设计师需要哪些素质和能力。
10一句话解释交互设计
11比较一般的网页翻页设计和移动平台产品的翻页设计。
12网站首页常常会放大量的分类信息和导航栏，怎样改进并提升用户体验？
13为什么现在的网站注册名都要用邮箱地址？
二、分析题。
14列出至少5个生活中用户体验不方便的案例，如电梯的上与下。选择上述5个案例之一进行分析并解决之。
15说一下你觉得用户体验最好的互联网产品有哪些，为什么？
16近三个月着重观察的互联网产品列表。
17小A是一个交互设计师，某日接到一个任务，设计一个表单，一共只有三个输入框，而且都是必填项。小A就开始犯愁了：如果有一项是必填的，我可以给它加上”*”，那剩下的两项就不是必填的。但现在三项都是必填的，我怎么把这个信息表达给用户呢？另外，如果我把这个信息表达得过于明显了，用户当然都会偷懒不填的。那我怎么才能收集到尽可能多的用户输入呢？这分寸的把握比谈恋爱还难了，怎么办呢？
请用尽可能简短的文字表述您的解决方案。如果您对这道题目本身有异议，也可以叙述您的见解。
三、画图题。
18画出从淘宝买东西的一个高保真流程图。从将货物添加到购物车到确认订单中间的所有流程和反馈。
20画邮件发送流程图。在发送邮件过程中，若小于50M，正常邮件界面发送，若大于50M，进入超大附件界面，此时进行判断，条件一：开通手机邮件功能，条件二：安装手机邮件插件。只有在这两条件都满足的情况下，才可以成功发送，否则不成功。
四、设计题。
21某公司为合作客户建立信息列表，大约有1000个客户，近五年的记录都在里面。现在让你设计一个列表页面，来显示客户信息。画出原型和写设计说明。
22假设有一个”CEO服装网”，它的主营业务是针对中国的大公司CEO们销售各式服装。请您为该网站设计一个简单的Persona（注意，仅一个）
23未来的社交信息超级聚合器。未来的移动互联用户的信息分散在新浪微博、腾讯微博、QQ、QQ空间、人人、开心、facebook等多处，你需要在iPad（或AndroidPad）平板平台上设计一款聚合软件，吧用户身边好友的信息，其他（通过你对用户情况的分析）信息（如淘宝信息、天气……）整合到一个适合平台阅读的界面中去，需要兼顾其可用性和游戏性。
24北京三里屯有一家AppleStore，每当有新产品刚发售的时候总是有很多客户来排队购买，中间掺杂着一些黄牛党。设计一款供该商店使用的触摸屏手机app，提供新品发售排队的客户排号用，保证：
25公司向针对“节假日回家”这一行为开发一款互联网产品，需要写一个项目策划，用户潜在需求，时间和工作人员分工，功能流程框架，网站首页草图和另外某一屏草图。
不再只是一味的追求视觉或实现产品功能、结构等，而是视觉、可用性一个都不能少。
如何压缩可用的图片？如何设计网页的色彩？如何给页面信息归类排列优先级？如何架构一个页面、一个网站？最后如何熟练使用软件完成设计？
1简单的智力计算题，只要审题仔细的话肯定没问题的2网络常识，外国的社交网站，视频网站考你一下3JavaSrcipt基本知识，设计原则什么的填空题：
1Chrome浏览器内核
Trident内核：IE,MaxThon,TT,TheWorld,360,搜狗浏览器等
Gecko内核：Netscape6及以上版本，FF,MozillaSuite/SeaMonkey等Presto内核：Opera7及以上Webkit内核：Safari,Chrome等典型的双核浏览器包括：
搜狗2.0：Trident内核和WebKit内核傲游3.0Beta：Trident和WebKit内核QQ浏览器5：Trident内核和WebKit内核
2Twitter一次能最多能发多少字符13电容式屏幕和电阻式屏幕的比较
1)电阻屏在触模时需要轻触压按，而电容屏即使很轻微的手指触碰感应就能激
活。
2)电阻屏可以用任何物体来触摸，而电容屏是人体热感应工作原理，只能用手
指的热感区来触摸，指甲和手写笔均无效。
3)电容屏可以很容易进行多点触摸，电阻屏一般不能实现多点触摸的。4)电阻屏内部是软的，一般是在4到5层超薄的钢化玻璃中间夹杂细微的炭粒
（显微镜下才能看见），通过按压导致上下两层的炭粒相互接触而接通触屏电路，产生触摸反应，容易产生出油、划痕，易坏，容易触屏不灵，而电容屏都是采用单层加厚钢化玻璃，硬度大，耐旧，使用寿命长。
5)电阻屏在阳光下可视性稍差，电容屏则非常好，在阳光写可视性依然很强。6)热感电容屏的成本比普通按压式电阻屏贵50美金,使用寿命是普通电阻屏的
2倍,因此热感电容屏一般使用于高档高端手机上,电阻屏一般使用于普通手机上。
4举两个社交媒体网站
开心网人人网QQ空间朋友网Facebook豆瓣珍爱百合世纪佳缘QQ空间基于6.37亿活跃QQ用户的中国最大的社交网络。Qzone的问题不在于数量，而是这种基于昵称的社交图谱的质量。
Renren是中国实名社交网站的领头羊。它为中国的SNS设立了标准，但是仍然面对着其他社交网站的挑战，比如腾讯朋友，Kaixin001。
附加题：
用户喜欢在用QQ签名存一些网址，电话等信息备忘，但QQ签名档不是针对此进行设计的，请提出解决方案
友情提示：本文中关于《头像web版交互设计总结》给出的范例仅供您参考拓展思维使用，头像web版交互设计总结：该篇文章建议您自主创作。
来源：网络整理 免责声明：本文仅限学习分享，如产生版权问题，请联系我们及时删除。
公文素材库友情提示：本网站所有内容为共享上传提供，不涉及任何商业利益，本站对此不承担任何保证责任！
Copyright © www.bsmz.net Corporation, All Rights Reserved 共享时代 共享你我他 版权所有