科技网

当前位置: 首页 >数码

交互设计分析网站通行证的交互设计分析如何方便用户管理

数码
来源: 作者: 2019-05-17 14:31:17

1 : 网站通行证的交互设计分析 如何方便用户管理

A5创业项目春季招商 好项目招代理无忧

现在愈来愈多企业和公司触及到通行证的概念,那末通行证到底应当甚么模样的?甚么样的通行证既简单又能满足用户需求?笔者挑出几款主流互联网产品做了1个扼要的分析:

新浪网:

(新浪通行证架构图)

新浪网注册通行证:笔者想要在新浪网注册个会员,但在新浪网首页页面顶部没有发现会员注册按钮。假设你非要在首页找到会员注册这几个字,那末请到页面的底部。还有1种方法是在首页输入毛病的用户名和密码点击登录,可以跳转到登录界面,在登录界面你可以选择会员注册。

首先,新浪网采取邮箱作为登陆名,用户注册必须要填写新浪邮箱的邮箱,否则会提示“邮箱名不能包括特殊字符”。这时候你会排除注册不成功的缘由,难道是字符输入错了?全角半角又全都试了1下,结果又以失败告终。仔细的你会在上方发现有1个小小的提示信息“提示:如果您有经常使用邮箱,也可用于注册新浪会员。”。意思是说默许的注册界面你必须得使用新浪邮箱。如果你非要使用其他邮箱酒会提示你邮箱里包括特殊字符。

Ps:估计新浪邮箱团队会有新增用户数量的KPI。这样在影响用户体验条件下,杀鸡取卵不可取。

其次,设置安全信息,要求用户填写“密码、确认密码、密保验证”都是必填项。

再次,填写”个人昵称”

最后,输入验证码,完成注册

新浪的注册表单7项,相对现有的互联网产品比较注册流程稍显复杂1些,但新浪有1个很聪明的做法,是值的我们学习的,利用分割线,把7项表单采取分割的方法,分为4项。而此时给用户的酿成的感觉只需要填写4项表单,会减少用户的心理负担。

进入通行证弹出窗口提示绑定手机和绑定邮箱。选择进入子项目如:新浪博客提示“您的博客还没有开通,仅1步操作就可以开通您的个人博客”,需要完昵称“博客名称、昵称和隐私设置”便可开通博客。进入微博提示”新浪邮箱账号(不可修改)、性别、所在地和验证码,便可开通微博”。

搜狐网:

1. 甚么是搜狐通行证?

搜狐通行证是您畅游并使用搜狐矩阵所有产品的身份帐号。通行证登录名现支持搜狐邮箱、其它邮箱帐号及手机号码

2. 搜狐通行证有甚么用途?

现今互联网由于产品、服务等快速的增长,1个网站的旗下产品、所有平台表现层独立(注册界面),数据底层耦合(用户基本信息&完善信息)

3. 搜狐通行证有甚么用途?

搜狐通行证是访问搜狐众多服务的钥匙,只需要登录1次,就能够在搜狐的服务中随便漫游。这些服务包括搜狐白社会、微博、博客、Chinaren校友录、搜狐社区、焦点房地产论坛等。

4. 甚么是多账号关联?

搜狐通行证多帐号关联,是针对拥用多个搜狐通行证帐号且各帐号下有不同产品利用的用户推出的1种服务。用户可用1个帐号(手机号)发起关联,将某1产品服务对应到自己原来经常使用的其它搜狐帐号上,从而实现使用这1个发起帐号登录时,进入该产品服务时是履行的操作是以关联帐号的名义进行的

5. 怎样样进行多账号关联?

请至搜狐通行证首页,在多帐户管理列表中,选择要关联其它帐号的产品服务,并输入正确的关联帐号的用户名密码,便可关联成功。同时,您还可以变更、消除关联。关联成功后,各帐号自行登录时所示产品服务仍然保存各自独立性

6. 搜狐-个人中心

用户可从搜狐网首页选择进入通行证和个人中心,通行证主要承当关联账号功能、修改密码、个人信息修改、找回密码等功能。搜狐个人中心主要承当着与子项目之间相互的交互,用户只需在个人中心便可享受多种服务,发博客,发微博,上传照片。更改密码跳转到搜狐通行证用户在用户中心操作,如发布博文,系统会自动生成当前没有昵称的用户生成1个昵称

网易通行证:

从架构图可以看出,网易通行证的信息架构更加公道

通行证主界面:聚合网易服务

账号管理:修改网易通行证基本信息

密保管理:账号安全信息设置,设置保护,和网易游戏的口令卡。

网易给出经常使用邮箱表单,不限制用户使用其他邮箱注册,用户使用任意邮箱注册网易通行证,在表单的右边会有1段提示信息”您还可使用网易邮箱注册账号”,这1点做的比新浪的体验要好的多。唯1的区分就是使用其他邮箱必须激活,你才可以享受高级服务。如你使用网易邮箱注册激活这1步可以省略。这样可以在1定程度上鼓励用户使用网易邮箱,明显产品设计人员设计产品时,已斟酌到这1点!

注册成功的会弹出1个提示页面,告知用户该邮箱账号,可以作为网易通行证。并可以其他邮箱关联。

输入用户名&密码后,直接进入网易通行证,弹出窗口提示完善信息。

网易的注册流程和新浪类似,但1个出于商业目的,另外一个照顾了用户习惯

盛大通行证:

盛大整合了众多服务,具有盛大通行证便可在所有支持产品中无需再次注册直接登录,游戏、利用、服务,1步到位,给您提供最多的方便,支持多种注册方式手机、邮箱、通行证账号。盛大把提供把旗下的服务聚合到盛大通行证内,并提供账号保护,安全认证,密码找回等功能。

基于上述,我们总结以下:

随着网络产品的多元化,1个互联网公司已不单单独立独立运作1款产品,最少旗下多款产品,服务在增加到1定的程度时,用户管理起这么多产品的账号、密码来会非常繁琐,因此就产生了了通行证,即把旗下产品账号统1处理,方便用户的管理。通行证现在时跨网满足任何操作,1次验证全网通行,可以实现找回密码绑定等功能,用户只需要登陆1次,便可访问服务下的所有网站。

有两种情况我们需要斟酌:

如果公司未来的产品多元化,且提供不同类型的服务,建议每一个产品各自具有1个独立的用户中心,方便用户管理在不同类型的个人信息。

如果公司未来的产品单1,提供的服务关联密接,建议共用1个用户中心,里面的资料1网通行。

本文链接:

2 : 交互设计细节分析——搜索

1 推荐字

关于推荐关键词放置位置的问题:

推荐字在框下:普遍认为放在下面好1些,从版面美观度斟酌,从给用户的冲击力和干扰程度斟酌;

推荐字在框上:有时搜索框上面会放分类等tab,推荐关键字易被认为作分类;但具体放在上面给用户带来的干扰程度,是不是会让很多用户很讨厌,笔者认为来搜索的用户普遍目的性较强,会下意识自动过滤掉自己不需要的内容,此时的用户是很难被干扰到的,可放心放到搜索框之上;但可能喜欢清新1些或有洁癖的用户比较希望甚么都不要放。

(图为 迅雷看看官网,http://www.xunlei.com/)

(图为 淘宝首页搜索,http://www.taobao.com/)

(图为 国美网上商城,http://www.gome.com.cn/)

推荐字放在搜索框后:干扰性最小,横向空间扩大性差;

(图为 中关村在线,http://www.zol.com.cn/)

关于关键字个数:普遍认为不容易太长,最好不擅长输入框的长度,个数在5——9个之间。

2 框内的文本

建议放1些成心义的文字,

提示文本:比如直接告知用户可以输入的内容来引导,语气友好些,文本简短明确些;否则用户会以为你的搜索框内可以随意搜东西,但实际是输入某些内容是搜不出结果的,然后用户会很懊恼,觉得你的搜索做的不行;

(图为 美丽说首页,http://www.meilishuo.com/)

推荐内容,留住阅读型用户;

(图为 迅雷看看电影频道,http://movie.xunlei.com/)

单纯放1些客套话如‘您需要找甚么?’能增加些许网站亲切性,看多了就觉得‘虚伪’了。

3 : 网站设计分析:交互设计那些事儿(2)

《交互设计那些事儿》之1完工后,承蒙各位抬爱,在微博时期被大量转发和分享,也让我收到1些邮件,询问我下篇为什么还不出来?请谅解我的惰性,每一个周末都给自己找了很多借口1拖再拖,上个周末又在家里养了两天的病——在此提示朋友们,换季季节,多喝水,多休息,少生病哈。

1. 理论条件

1. 人机交互与人类信息处理机制理论

既然产品设计出来不是给设计师用的,而是给用户用的,他们如何理解、认知、使用产品才是最重要的。因此“定义用户”,“了解用户”,“研究用户”是交互设计前需要做的重要工作。

要了解3种不同的“模型”:实现模型,用户心理模型和表现模型。在《交互设计精华》书中(英文名:about face3.0about face3.0),作者Alan Cooper写道:设计者最重要的目标之1,就是要使表现模型和用户的心理模型尽量地接近,因此,设计师能否详细地了解目标用户所认为的“如何使用软件”非常关键。

图1:实现模型,表现模型,用户心理模型

我们举个简单的例子去论述以上的理论。电路板……1个普通的家庭妇女1天要用到电路板很屡次,早上插上豆浆机,开启微波炉,开启电饭煲,洗了头发插上吹风机,晚上按亮台灯……她只需要做的就是保持插头接入电源,然後开启电器便可。若你采访她说:你了解这些电器的工作原理吗?你知道为什么会有电吗?

除非她是个物理学家,要不然她有可能给出和我1样的答案:我以为我只要插入插头,插座里的开关就会被连接起来,电流就会从某个中心站源源不断输入到电线里,进而启动我的电器。没错,我想到就是输液1样的经验……电流正如输液管中的液体1样被输入到电器里。

但是实际上这个简单的动作背后有着非常复杂的电路原理……请谅解我根本没法去描写这个工作原理.它想起来也许犹如下图中左边的电路板……但是实际原理比这个还要复杂。我不了解这些,但是我的认知虽然毛病,但是完全无妨碍我去用“电”。由于设计人员给了我1个简单的插头和插座,和各种简单的开关。

图2: 实现模型电路板和用户心理模型插头对照

很多产品设计也是如此,你不需要教育你的用户成为精通电路板和输电站工作原理的专家才让他们能够用你的产品。他们是如何理解的?虽然是毛病的,但是这预示着你应当如何去“表现”你的设计。

2. 了解用户—行动、态度、能力……

但凡交互设计的书籍都会从了解用户开始。可是了解用户的甚么呢?

首先了解的是人本身,人类的信息处理机制,心理学,和消费者心理学、行动学等等。

其次才是商业环境下的用户,再可以细分到某个行业的用户,比如电子商务购物者研究。和市场研究学对消费者的研究有所不同的时,用户体验设计部的用户研究员更关心的是用户产生的行动研究(behavior),而不是观点(view).

图3:用户行动变量

以上4个领域都属于要了解用户的维度,用户体验设计部更加偏重于对用户行动的研究,通过用户行动的视察、研究,发掘出用户真实的内在需求。

在目前的UED组织架构中,虽然有用户研究员这1专门的职位,但是作为交互设计师,仍然要尽量亲身参与了解用户的工作中,下图所示的了解用户的不同层次的工作,若有兴趣,可以多多浏览。

图4:从了解人到了解用户,从了解心理到研究行动

3. 可用性及交互设计10大原则

从上世纪的80年代起,Jakob nielsen(网站:http://www.useit.com/)就1直是可用性领域的领军人物。

他提出,通常来说,要使产品或服务具有可用性,最少需要斟酌以下5个维度:

可学习性: 系统应当很容易学习,这样用户就能够快速展开工作

效力性:1旦使用便可提高生产率

可记忆性:即便离开1个系统1段时间,以后重新使用这个系统,也不用1切从头学起。

容错和毛病预防能力:最低的毛病率,让用户很少出错,即便出错也很快能够恢复,必须保证不产生灾害性的事故。

主观满意度:使用起来使人愉悦。

要举出这5个方面的反例,也不难,用过公司财务系统,Oracal的同学自然会清楚。为何有些系统必须要培训了才能上手,并且1段时间不用,就会忘记掉怎样用,最糟的是,在使用的进程中,你充满了委屈和愁闷。

可用性和其他相干因素的关系(整理自《重塑用户体验》1书):

图5:可用性与相干因素关系

在5大维度的基础上,Jakob nielsen发展了1套沿用至今的启发式评估指南兼原则。在用户研究领域,看1个新的产品是不是到达可用性目标,除约请真实的客户外,也会让行业专业、用户体验设计师们,用Nielsen提出的10大交互设计原则作为启发式评估的纲领,去审视设计作品。

图6:10大启发式评估原则

这应当是交互设计领域理论的沉淀结果。

2. 意识条件

在实际利用中,除掌握基本的理论基础,还需要了解工作环境对交互设计师的特殊要求。据我的经验,以下几点需要注意:

1. 好的解决方案是平衡

甚么是好的设计方案?工作环境为结果买单,为进程喝彩。首先这个方案必定是技术可行的,这个方案必定是到达商业目标的,这个方案是在满足种种期望下,符合种种制约条件下的尽量用户体验最优化的产物。如果用户体验是10分,你先是做到10,然後综合各种因素削减做到7。而不是死守着10不放,也不是1开始就奔着7去做。交互设计师如何拿到结果?#p#副标题#e#

2. 多谋,方能善断

交互设计是理性的,也是感性的,更是理性的。它始终在寻求最好解决方案——现实中常常没有出现过这个最好方案,只有最合适的。所以交互设计师不能放弃探索。在任何1个既定的需求下,都有着无数个解决方案。除非你相信1开始蹦到头脑里的就是最合适的。否则多做1些尝试,多听1些意见,多做1些评审。

3. 不求1次完善

极可能到了要交付的日期,你头脑里还在探索。你又有了新的解决方案。渴求完善的心理,几近是设计师的通病。产品上线后糟的用户反馈,会比你的主管给你打个糟的KPI的分数更让你难以忍耐。但是上线后产品更加容易得到用户的行动数据和反馈,让下1次的优化更加有目标。该放手就放手吧。

掌握节奏感,要记住自己是项目中的1环,确保项目的进程是重要任务。记下那些犹豫不决,记下那些纠结,在发布以后的用户研究需求里提出来去验证。

3. 交互方法

1. FLOW CHART 流程图

流程图种类非常多,1般经常使用的有任务流程图(Task Flow)和页面流程图(Page Flow).

任务流程图(Task Flow)——为了到达某个目标,用户需要进行的各项任务,和各项任务之间的逻辑关系,1般来说,技术人员绘制的UML流程图和产品经理绘制的业务流程图都属于任务流程图。

举1个GTD(getting things done,时间管理)的任务流程图:

图7:GTD流程图

我们可以根据以上的时间管理启发,轻松绘制出家庭收纳指南流程图:

图8:家庭收纳指南流程图

当任务中参与部门较多时,流程图如果有必要体现出不同节点各部门、人员如何配合,更换流程图的情势,多用泳道流程图表示:

图9:年度预算流程图(泳道图,来源于网络)

而页面流程图(Page Flow)则多由设计师产出,用来表示为了完成所有任务,需要的页面和页面之间的跳转关系。任务流程图上的某些任务是在页面上完成的,有些可能不是,比如通过邮件、系统消息等。在分析任务,和分析任务流程图并得出页面流程图的进程中,设计师基本上可以知道需要多少个页面,每一个页面的目标和设计需求是甚么。

页面流程图能够提供“俯瞰全局”的视角,让设计师不堕入到某个具体页面的细节里,始终掌控大局。另外能够帮助设计师查漏补缺,在没有详细展开线框图及交互细节设计之前,不是平空去想像复杂的交互行动。

好的页面流程图应当有各页面的编号,并和线框图的页面对应起来。它也能够在以后作为项目组进行任务走查的基础。

2. WIRE FRAMES 线框图

过去,我也写过几篇文章:

-聊聊线框图:那些必要的理论和条件

-聊聊线框图:UED和PD对线框图不同的定位

-聊聊线框图: 多给线框图1些时间

在《聊聊线框图:那些必要的理论和条件》文中,我对那几个观点没有其他补充性的内容:

1. 线框图不是“画”出来的,而是想出来的,是确认出来的。

2. 精美细致其实不重要

3. 从最简单的开始,逐步补充细节

4. 选择性价比最高的工具——不要把时间花在学习工具上

线框图说白了,也只是工具而已。作为交互设计师,不单单只有这个方法才能表达产品。

3. 讲故事

交互设计师要有平空想象复杂的交互行动的能力。作为1个路痴的我,根本没法平空去想象1个火车站的架构,地铁站的架构,我1直认为自己在“平空想象复杂的交互行动”能力方面不足。但是,我愿意去学习和弥补。利用周全的流程图即是弥补的方法之1,通过流程图,可以逼迫自己把各种分支流程都斟酌到,穷举出各种CASE. 而另外一个好用的方法即是讲故事。

直到现在,每当有人给我讲他的1个新的构想的时候,我总是忍不住打断他费劲的讲授,说:讲个故事吧。假定现在你的方案都实现了,假定有了这个东西,假定你的用户是小明,他……

我们也总是能发现,讲故事除引人入胜,更能发掘出本身不符合逻辑的事实——由于故事很容易讲不下去。但是没有故事,片断的话语很容易“蒙混过关”。

角色模型,任务走查,故事板归根结柢是为了讲需求和产品设计场景化,因此我将他们都统1为1种技能:讲故事。

要讲1个好故事,你可能得:

1. 设定主人公,他们是谁,有甚么特点?他们的需求是甚么?

2. 设定故事的背景,要引人入胜,故事从哪里开始?

3. 设定你的故事线,你可以平空去讲,在你有了原型以后,也能够用页面流程图、任务流程图等将故事串起来,点击具体的页面,让项目组和你1起在故事中进行任务的走查。

交互设计的方法还有很多,比如卡片分类法、概念图、站点地图(SITE MAP)等,没法逐一展开了。有兴趣的同学自行了解哈。

至于交互设计的工具:

1. 纸和笔,头脑和嘴巴——这是开始设计的第1步,通过沟通了解需求,发掘需求,笔和纸是具像化设计的第1步。

2. Axure——我用它来做线框图、流程图和详细流程图,虽然它有不尽如人意的地方,但是仍然是目前来看最符合交互性价比的工具。了解它下载它可以看:www.axure.org.

3. OmniGraffle——苹果系统里最好用的画图工具,自从用了它以后,流程图,概念图之类的,基本上就用它。

嗯,有关交互设计那些事儿,聊到这里,发现还有太多故事,交互设计的迷茫期和瓶颈期,更是让我感悟很多,写长文是伤身体的活儿,先到此为止了。我们以后聊,欢迎交换。关注我请点击:http://weibo.com/heidixie

原文:

网站设计分析:交互设计那些事儿(1)

预防癫痫病的措施都有什么济南那家治疗寻常型牛皮癣好?白癜风出现的早期症状有什么

相关推荐