当前位置:首页 » 网页前端 » 交互设计中的web
扩展阅读
webinf下怎么引入js 2023-08-31 21:54:13
堡垒机怎么打开web 2023-08-31 21:54:11

交互设计中的web

发布时间: 2023-01-03 15:10:29

Ⅰ 交互设计与用户体验设计

app和web:交互设计是由页面、icon、文字着三种基本要素构成的系统流程

交互设计概念

路径 效率 行为

1、以最简短的路径达到自己想要的目标

2、交互设计决定着用户对产品的使用效率

3、帮助用户用最简单的方式引导,让他们找到关注的内容和想要使用的功能。

用户体验设计概念

感受

用户体验时用户在使用产品过程中建立起来的一种纯主观感受。它是整个过程中身心全方位的接触和体验

用户体验贯穿产品:

有用性(基本)

易用性

友好性(用户对你的产品认可,丢不掉)

 用户体验核心本质

用户体验核心和本质就是研究人在特定场景下的思维模式和逻辑,然后顺应和利用它。

如:以最短路径提升用户购买欲望

及时反馈

产品与用户交流的指标

交互设计是否有效

信息是否传达准确

反馈类型-视觉

最常见的反馈方式,所以也最容易会被用户忽视

1、toast提示:一般2到3秒短暂出现,可以在屏幕任意位置,然后自动消失,无需任何操作,内容短信息不重要。

2、弹窗提示:能后引起用户的主要,需要简单的操作,通常用在询问用户是非需要进行某项操作。

3、按钮被按下的状态:当用户在使用中按下一个按钮时,一般都会出现按下状态,让用户知道他的操作得到了回应。

4、动效反馈:帮助用户直观的了解操作,同时会给用户留有深刻印象,提升产品的吸引力

注意:简洁易懂,操作反馈信息简单适当使用插画吸引用户注意帮助用户提示判断类型。

听觉

强度高于视觉,使用率却不是很高,不能作为主要反馈,并要给用户关闭的权利,因为过度使用用户会反感。

触觉

比较少见但是很强烈的反馈方式,基本作为辅助

操作流程简捷

1、使用自然思维非程序思维

2、围绕用户的目的设计

3、减少查找步骤

4、将常用功能提前

5、遵循已经成型的用户习惯

审核交互:

1操作前可预知

2操作中有反馈

3操作后可撤销

用户习惯与用户体验:

用户习惯大于用户体验

UE:用户体验的简称(国外叫UX)

产品设计的灵魂职位,通过分析用户心理模型,产品功能需求。设计任务流程,运用交互知识搭建产品核心构架,并设计出原型以最终实现产品的易用,好用。

PM项目经理(Project Manager)思维导图和原型图

前端开发:FE(Front-End Development)只能看不能用

研发:RD(Research and Development)偏向于后端的技术实现:功能技术实现,能看能用

测试:QA(QUALITY ASSURANCE)

产品经理至少2-3个,

设计师游3个人,前端就要有6个,后端9个,测试1-2个

UI设计思路

立项会议:头脑风暴

用户头像(用户痛点,用户故事)

竞品分析

产出产品文档与流程图

参与者:所有人

沟通会议 确认产品文档

设计师核对原型图

程序员考虑开发成本

参与者:产品经理 设计师 程序员

原型图-低保真(没图片图标)

为什么需要低保真:低保真原型时在设计初期帮助我们验证想法的粗略表述

低保真原型构建起来更加容易且成本更低

沟通会议:确认低保真

产品经理核对低保真

工程师核对低保真是否可实现

工程师搭建框架

沟通会议:确认高保真

产品经理确认界面符合产品要求

工程师趣儿是否能实现界面交互

沟通会议:如何对接

如何切图,切图的命名方式

如何交互,交互方式

产品开发完毕

设计师核对界面

测试工程师找bug

工程师改bug

立项会议:头脑风暴

下版本规划

测试工程师继续找bug

工程师继续改bug

时间节点:app78十张三个月左右 web一个星期

交互设计6大原则

费茨定律:光标到达一个目标的时间,与当前光标所在的位置和目标位置的距离和目标大小有关

席克定律:是指一个人面临的选择越多,所需要作出决定的时间就越长

泰思勒定律:这个定律时说产品固有的复杂性存在一个临界点,超过了这个点过程就不能再简化了

4防错原则

5剃刀法则:我们做产品时功能上不可以太繁琐,应该保证简洁和工具化(国外用的好,国内差)

6接近法则:将相似的、有关联的信息尽量摆在一起,不要让用户迷茫,要潜意识知道在哪里能找到自己想要的信息

设计师误区

误区A:配图是后台运营的工作

页面由icon、文字、配图的排版而组成

误区B:状态栏颜色只能一种

误区C:界面动效全权交给AE

1code4app

2市面已完成动效

3AE辅助实现(有前提)

4keynote辅助实现

误区D:让所有用户满意(50%以上)

误区E:完全按产品经理意图行事

1反驳产品经理不靠谱的需求

2主动分析调研,提升用户体验数据

3深入思考使用场景

4跟进开发,找到性价比高的方案

5寻找创新有趣的交互方式

 didot衬线英文:时尚饰品

Ⅱ 交互设计要注意什么 跨终端web

一、力求一致性
例如网站首页需要和每一个下级页面保持一致的风格,导航都要放在屏幕的左上角,具有高度一致性的界面能给人清晰整洁的感觉。
二、允许频繁使用快捷键
快捷键表示产品使用的灵活性和有效性,想想每次使用搜索引擎的时候是鼠标点击的搜索还是按的回车?
三、提供明确的反馈
出现错误时要明确说出错误的含义,而且需要考虑用户能否理解,比如大家基本上都遇到过HTTP404错误,但绝大多数人能看懂么?所以反馈要明确且通俗易懂。
四、设计对话,告诉用户任务已完成
要在用户完成某项任务或操作后进行提示。如果用户在做了很多操作后却得不到反馈,用户就无法知道自己是否达成目标。
五、提供错误预防和简单的纠错功能
例如把某些当前不能点击的按钮设置为灰色,在系统执行时让用户在确认一下。
六、应该方便用户取消某个操作
大多数的应用软件都有撤销和恢复的功能,如果用户总是惧怕一失足成千古恨,那样的用户体验可想而知。
七、用户应掌握控制权
一般而言用户希望自己去控制系统交互,在执行任务中,用户应该可以随时中止或退出,而不是无奈的看着系统继续。
八、减轻用户记忆负担
应该尽可能帮助用户避免要求他们记住各种信息,例如各个菜单项之间的逻辑关联,更好的分类就会帮助用户找出哪个功能按钮在什么地方。

Ⅲ web交互设计和网页设计有什么区别

交互设计比网页设计需要更多的设计技能,在良好的网页设计基础上,需要多用到前端方面的技术

Ⅳ 什么是web前端开发

前端前景是很不错的,像前端这样的专业还是一线城市比较好,师资力量跟得上、就业的薪资也是可观的,学习前端可以按照路线图的顺序,

0基础学习前端是没有问题的,关键是找到靠谱的前端培训机构,你可以深度了解机构的口碑情况,问问周围知道这家机构的人,除了口碑再了解机构的以下几方面:

1. 师资力量雄厚

要想有1+1>2的实际效果,很关键的一点是师资队伍,你接下来无论是找个工作还是工作中出任哪些的人物角色,都越来越爱你本身的技术专业前端技术性,也许的技术专业前端技术性则绝大多数来自你的技术专业前端教师,一个好的前端培训机构必须具备雄厚的师资力量。

2. 就业保障完善

实现1+1>2效果的关键在于能够为你提供良好的发展平台,即能够为你提供良好的就业保障,让学员能够学到实在实在的知识,并向前端学员提供一对一的就业指导,确保学员找到自己的心理工作。

3. 学费性价比高

一个好的前端培训机构肯定能给你带来1+1>2的效果,如果你在一个由专业的前端教师领导并由前端培训机构自己提供的平台上工作,你将获得比以往更多的投资。

希望你早日学有所成。