一名交互设计师必备的知识架构

UI及交互设计知识整理(超详细 基础篇) UI设计流程和规范 阅读详情

如果你也是一枚刚入门的交互设计师,是不是常有这样一种感觉:不知从何下手,闷头读了一大堆书、学了一大堆软件、画了一大堆图之后还是感觉心里不踏实,总害怕自己还缺点什么,恨不得要有本《交互设计学习大纲》就好了。出现这个问题有两个原因,一是交互设计师没有可视性强的产物,交互设计师的产物一般是线框图、流程图、信息架构图、说明文档等等,但这些东西既不如视觉设计稿华丽精美,也不如程序代码高贵冷艳,在外行人看来初级交互设计师和高级交互设计师画的好像都差不多,轻易看不出你修炼到了几层功力;第二个原因是交互设计是跨学科的专业,需要学的太多太杂,今天这位大神说要学好PS,明天那位大神又说要学程序,后天又有大神说要学心理学,blablabla…信息量太大、太乱就会导致这种不知所措的局面。

今天,我制作了一份“交互设计师的知识架构图”,如下图所示,该图对交互设计师所需的知识储备进行了梳理,并按照交互设计的一般流程进行排列,从需求分析开始,到信息架构、流程设计,到原型设计,再到可用性测试。以这样的逻辑为大家介绍每一个环节涉及到的知识,化整为零,这样,童鞋们也就可以采取逐个击破的方法一步一个脚印学习交互设计,接下来我也会为大家推荐相应环节涉及到的文章或者书籍,等你全部掌握之后,相信就不会再有不踏实的感觉了。

交互设计师的知识架构图

交互设计师的知识架构图

好,开始为大家解读这张图。

需求分析

一般来说,交互设计的第一个环节就是需求分析,需求分析主要指用户研究、场景剧本、角色创建以及需求提炼。

首先,用户研究的方法包括用户访谈、调查问卷、观察、焦点访谈等。

其次,创建人物角色和场景剧本将有利于设计团队始终围绕用户目标进行设计,保证你的设计以用户为中心,当然,人物角色和场景剧本不是凭空想象的,而是基于充分的用户研究提炼出来的。

以上两块知识在《About Face 3:交互设计精髓》这本书里都有详细的介绍,大家一定要把这本书看完看懂。

最后,需求提炼这块,我个人比较喜欢从“人、系统、环境”三个角度进行分析提炼,但是需要注意的是,这三个角度可以看成是一个公式,要学会灵活运用,针对不同的任务、对象,会用不同的名词,比如针对一个实物产品,这个公式就变成“人、物、场景”,针对一个任务则是“人、目标、场景”等等。需求提炼这块大家可以参考《产品学堂:万能的产品策划公式》,网上也有各种各样的需求分析的方法,只要精通掌握一种就够了,最重要的是要有自己的一套原则与流程,然后不断地拿自己总结的方法去实践。

信息架构和流程设计

这一块需要掌握的知识有:流程图和信息架构图的绘制、心理学、逻辑学。

流程图和信息架构图都是为了表达交互设计的整体逻辑路径的工具,一张好的流程图或信息架构图对于团队沟通和开拓思维都是很有帮助的。网上有很多相关的学习资料,但网上的文章通常会不够系统、严谨,所以我再给大家推荐两本书:《高效沟通设计之道》、《交互设计指南》。

层次任务分析法是流程设计中的一个重要方法,简单来说,层次任务分析就是将一个任务进行结构化的分解,将用户完成任务的过程所需要的每一种情况和每一个动作进行细化整理。这样分析的好处是你可以进一步理解用户是如何使用产品、如何与产品和环境进行交互的,保证设计的逻辑严谨性,最终使你的交互流程更加高效和人性化。层次任务分析法可以从这篇文章里学习个大概:《层次任务分析》 不过我并不觉得这篇文章非常严谨详细,将来有机会我可能会用一篇文章来单独为大家介绍这个方法。

心理学和逻辑学可以说是交互设计师最重要的内功,看起来比较高大上,可能会无从下手,但千万不要逃避和盲目乱学,要进行系统的、循循渐进的学习。比如心理学你可以依次学习色彩心理学、设计心理学、认知心理学、行为心理学,交互设计师是以人为中心的,琢磨人的认知、记忆心理对于提高你的设计质量至关重要,推荐的书籍有唐纳德诺曼的《设计心理学》,埃森克的《认知心理学》,此外,同学们还可以看一下我之前的一篇文章:《交互设计与心理学》;逻辑学似乎就更加虚幻了,甚至会觉得这货就像智商一样无力回天,其实不是,一个人的逻辑思维是通过后天锻炼的,逻辑思维的提高可以参考知乎上大神的回答:知乎:如何提高逻辑思维能力?书籍的话,可以参考这里:提高逻辑思维能力,有哪些书或者资料可以推荐的么?

原型设计

原型设计是交互设计师最主要的工作之一,也是交互设计师的最佳练兵场,因此,需要在这一块储备大量的知识,比如交互范式、设计原则、平台规范、排版和草图绘画。

交互范式指交互方式(参考下图)、交互元素(比如操作、窗口、控件、菜单、对话框)等。这些都是基本功,很多同学自信学有所成了,但面试的时候一问控件的种类和区别就胡乱回答一通,这是没有系统学习的后果。

交互方式

交互方式

设计原则,这里指的是交互设计原则。这个就多了,可以说数不胜数,而且每个人都有不同的版本,如果你是初学者,没有特别好的办法,推荐你先把《About Face 3:交互设计精髓》吃透,还是那句话,网上的知识是碎片化的,一味地看大神写的千把个字的文章容易消耗你的耐心、增加你的记忆负荷,而且到头来还是不够全面,所以先把权威的书籍吃透再说。
平台规范。从终端上看,平台分为PC、手机、平板电脑等,从系统上看又分为Windows,Mac,IOS,Windows Phone,Android等,每一个平台都有相应的设计规范,想做交互设计师就得先把他们掌握了,另外,这些规范通常都是英文,而中文的最新翻译一般都比较难找,并且网友的翻译有参差不齐的风险,所以亲们一定要学好英语,这点也很重要!

排版和草图绘画。受过专业的排版训练的交互设计师会有很大的优势,因为排版不仅需要一定的审美感觉,也需要扎实的视觉理论基础和逻辑思维甚至心理学理论,排版其实也是一种交互设计,是读者与作品在视觉上的交互。另外草图绘画是一个加分项,画的一手漂亮的草图会让团队沟通更加高效,不过,这里的草图不是素描草图,不是对某一个物品进行精雕细琢,而是简笔画。下图是著名交互设计师比尔·维普兰克画的,他对图形和手绘草图有一种惊人的表现能力,他可以在谈话的同时,随时用手绘的方法勾勒出草图来说明其观点。这是我在看《交互设计概论》时看到的,当时我简直被迷晕了,这技能太牛了!于是我也去学简笔画,不过学的断断续续,至今还是菜的一逼。

比尔·维普兰克画的草图

比尔·维普兰克画的草图

可用性测试。这一块推荐大家先把《可用性工程》这本书看完,不过这本书可能由于翻译的原因,看起来会有一点吃力,大家可以先看网易UEDC的这篇文章了解一下:《简单快速的可用性测试》。

当然,理论终究是不够的,学习理论之后,要进行大量的实践来巩固,再总结出自己的一套流程与方法。

视觉设计与程序设计

基础加分项,既是加分项,也是基本功。不是说必须学好视觉和代码,但多少会一点对你有很大的好处,比如有利于与团队的其他人员沟通,有利于选择更合理更现实的交互方案。我建议大家学一下PS、AI、Axure、PPT和AE等软件,有时间的话再学一学C语音/Java,HTML+CSS+Javascript.

最后也是最重要的

这篇文章仅仅是在知识架构上给大家做一个整理和归纳,虽然也推荐了不少适合新手入门的书籍和文章给大家,但仅仅看这些书籍和文章肯定是不够的,还需要进行大量的实践和体验,交互设计不像学习一个软件可以短期大幅度提高,更需要的是长期积累,平时应该经常去看别人的优秀设计,去体验各种app,网站,平台,要积累大量的素材,要不断地总结经验,并且将经验运用于实战中。若这篇文章能为你提供一丁点的帮助,我也十分欣慰。

对于复杂交互的前端页面架构的思考(干货) 项目背景effevo致力于为用户提供最方便的云端任务管理工具,任务管理过程中主要涉及的就是数据的CRUD,并能够将这种数据变化实时的反馈出来;有些地方(比如甘特图)需要比较复杂的dom操作和交互;有些页面(比如首页)有SEO的要求。由于系统的这种复杂性决定不可能由单一的技术来实现整体的系统。 本文主要对Effevo 前端的整体架构做了一个简单的介绍,给大家提供一种前端架构的解决方案。其中也还存在着 阅读详情

相关推荐

软件架构与设计(七)-----互动架构

抽象模块看起来像MVC的模型模块,控制模块就像MVC的控制器模块,但它们的控制和组织流程不同。控制器视图和模型之间的连接可以按照订阅通知的模式(如上图所示)设计,控制器视图订阅模型和模型会通知控制器视图的任何更改。MVC将给定的软件应用程序分解成三个互连的部分,这些部分有助于将信息的内部表示与向用户呈现或接受的信息进行分离。相同信息的多个视图是可能的,例如用于管理的条形图和会计师的表格视图。MVC应用程序适用于模块之间明确划分的应用程序,以便可以分配不同的专业人员同时处理此类应用程序的不同方面。...

—莫言— 865

UI设计师如果能够设计好逻辑图,绝对不简单

设计好逻辑图对于 UI 设计师来说绝对不简单,它需要设计师具备清晰的思维逻辑和深入的用户理解能力。逻辑图在 UI 设计中起着至关重要的作用,它可以提升用户体验、优化设计流程,提高项目的成功率和用户满意度。为了提升设计逻辑图的水平,设计师需要不断学习相关知识,进行实践和反思,借鉴优秀案例,不断创新和改进自己的设计方法和技巧。展望未来,随着数字化技术的不断发展和用户需求的不断变化,UI 设计也将面临更多的挑战和机遇。逻辑图作为 UI 设计的重要工具,也将不断发展和创新。

2401_82616673的博客 1760

一个BS架构软件的原型设计

一个BS 架构软件的 原型设计 项目调研与原型设计之间,最好有个UE调研,先出几个主要的UE界面,再出原型,不然后期的修改会增大! 答复:你所说的UE调研,其实已经包含在需求调研中了,当然也体现在原型上了,这个过程没有独立做,肯定不会做到很完善,但是项目管理与产品设计是有区别的,比如: 产品设计,除注重产品功能外,还有很如用户体验、市场、竞争对手等等情况; 项目管理,项目没有绝对完美,只有项目经理去引导客户的需求,直到验收并拿到验收款,讲究的是项目的实施成本、利润空间等。 所以,两者过程都会涉及到产品的设计等,但目标是不同的

人机交互-8-交互式系统设计

人机交互-8-交互式系统设计

SpriCoder的博客 5938

逆向工程实战:解密AppleAccount的X-MMe-Nas-Qualify签名生成机制

本文通过逆向工程实战,详细解析了AppleAccount服务中X-MMe-Nas-Qualify签名的生成机制。作者利用Frida进行动态追踪定位签名源头,结合IDA Pro进行静态分析,并借助LLDB动态调试还原核心算法。文章最终分享了如何独立于苹果官方库,通过Python代码复现签名算法,为自动化测试和深度交互苹果服务的开发者提供了关键技术路径。

weixin_29323049的博客 706

opencv图像去畸变

opencv图像去畸变

智能机器人产学研基地 4864

交互设计之架构真经


 
 
 
 
 
 
 建立信息架构是交互设计师主要工作之一,是需求转向交互稿中非常重要的过程。一个架构的好坏决定这这个产品...

架构文摘 519

Vivado ILA抓不到低频信号?试试Capture Control模式,保姆级配置教程(附PWM调试实例)

本文详细解析了Vivado ILA的Capture Control模式在低频信号捕获中的应用,特别针对PWM调试等场景提供保姆级配置教程。通过条件采样和时间拉伸技术,有效解决传统ILA采样在低频信号调试中的存储深度不足、关键信号丢失等问题,并附赠呼吸灯PWM的完整调试实例,帮助FPGA开发者提升调试效率。

weixin_42549451的博客 349

交互设计入门(思维、方法、工具)

-

asdasdasd23451的博客 1731

Python 爬虫实战:在房天下抓取房产信息,分析房价走势

通过本次 Python 爬虫实战,我们成功地从房天下爬取了房产信息,并进行了存储、处理、分析和可视化展示。在这个过程中,我们不仅掌握了爬虫技术的基本应用,还学会了如何对动态加载的数据进行处理和分析。然而,本次爬虫任务也存在一些局限性,例如仅爬取了部分区域的房产数据,且未对房产的图片和视频内容进行分析。在未来的工作中,我们可以进一步优化爬虫程序,爬取更多区域的房产数据,并深入分析房产的多媒体内容、用户行为模式等,为购房者和房地产从业者提供更有价值的数据支持。

u014481728的博客 1367

FPGA入门200例(17):如何阅读RTL原理图(Schematic)?将Verilog代码与门级电路对应

本文针对FPGA开发新手常见误区,重点讲解了RTL原理图的重要性和阅读方法。文章指出,仅通过仿真验证代码会导致板级测试异常,而RTL原理图能直观呈现Verilog代码对应的硬件结构(门电路、寄存器、多路选择器等)。通过"识别基础元件→跟踪信号路径→验证逻辑关系"的三步法,新手可以建立代码与硬件的映射思维,排查冗余逻辑、意外锁存器等错误。文章还结合Vivado/Quartus工具操作指南和典型代码案例,帮助读者掌握从代码到硬件实现的转换过程,避免混淆RTL与门级原理图、忽略信号位宽等常见误

远程部署调试 运行安装 项目调试 二次开发 项目技术新 持续迭代 部分源码免费分享 196

新人入门:交互设计师的知识架构

如果你也是一枚刚入门的交互设计师,是不是常有这样一种感觉:不知从何下手,闷头读了一大堆书、学了一大堆软件、画了一大堆图之后还是感觉心里不踏实,总害怕自己还缺点什么,恨不得要有本《交互设计学习大纲》就好了。出现这个问题有两个原因,一是交互设计师没有可视性强的产物,交互设计师的产物一般是线框图、流程图、信息架构图、说明文档等等,但这些东西既不如视觉设计稿华丽精美,也不如程序代码高贵冷艳,在外行人看来初

养有道 1902

倍福CX9020(WINCE 7)控制器使用方法和操作

CX9020系列是倍福控制器中较为经济的,操作系统为Windows Embedded Compact 7(简称WINCE7或WINEC7),相对高端控制器(WINES7以上系统),操作系统古老而简洁,上位机软件的编写困难很多,本文是笔者在使用过程中摸索的流程,旨在为CX9020系列的新用户提供参考,也可供其他CE系统的控制器参考。本文中大部分截图采用倍福中国的培训文档,这是由于笔者是在流程走通后再写这篇文章,不想再恢复出厂设置走一遍截图。因笔者在写这篇文章时使用倍福控制器经验并不丰富,难免有纰漏,请读者批评

weixin_41883890的博客 4287

交互设计师必备的9种能力

网易UEDC – 杨杰 : 有好多交互新人或尚未跨进交互设计大门的同学,会经常问的一个问题:交互设计师需要具备怎样的技能和能力?本文将以「小饼」一个交互新人的成长过程以及工作中遇到的问题,来跟大家分享交互设计师必备的9种能力。 1. 产品意识 设计师有时候会收到用户的反馈,如:哎?你们易信的颜色是不是太亮了,能不能调整一下?这时候作为交互新人的小饼,他的第一反应是:哦,好吧,既然用户有

dlfeicui的博客 4478

2021年03月 C/C++(五级)真题解析#中国电子学会#全国青少年软件编程等级考试

给定一个十进制正整数n(0 < n < 1000000000),每个数位上数字均不为0。n的位数为m。现在从m位中删除k位(0

人生就是一个不断学习的过程 1010

手把手教你学Simulink——基础储能管理场景实例:基于Simulink的压缩空气储能(CAES)系统简化模型仿真

本文介绍了基于Simulink的压缩空气储能(CAES)系统简化模型仿真方法。CAES作为大规模长时储能方案,相比锂电池具有成本低、寿命长等优势。文章详细讲解了AA-CAES系统组成、热力学建模理论,以及Simulink实现流程,包括储气室、压缩机、膨胀机等核心模块的建模方法。通过8小时充电(50MW)和6小时放电(40MW)的仿真,验证了系统可实现60%往返效率。该模型为理解CAES系统运行机制提供了实用工具,并指出热管理、储气室特性等工程实践要点,为新型电力系统储能规划提供了仿真基础。

MHD0815的博客 171

写给交互设计新手的信息架构全方位指南

信息架构是一个比众多其他领域更难定义的领域。内容策划由内容策划师来完成,交互设计由设计师来完成,而信息架构的完成与它们不同,因为信息架构师是一个非常罕见的职位。信息架构横跨于多个角色之间,是一个必要且有价值的领域。信息架构学会(Information Architecture Institute)是一个非盈利性组织,致力于推动信息架构领域的发展。他们这样简洁、概括地解释它:信息架构是帮助人们在现实世界以及网络上了解自己的环境,找到他们要找的东西的学科。

u010291330的博客 2058

jre9下载 jdk9

(Java SE Runtime Environment 9.0) 9.0u175 官方最新版 【x86|x64】

交互设计师

如果你也是一枚刚入门的交互设计师,是不是常有这样一种感觉:不知从何下手,闷头读了一大堆书、学了一大堆软件、画了一大堆图之后还是感觉心里不踏实,总害怕自己还缺点什么,恨不得要有本《交互设计学习大纲》就好了。出现这个问题有两个原因,一是交互设计师没有可视性强的产物,交互设计师的产物一般是线框图、流程图、信息架构图、说明文档等等,但这些东西既不如视觉设计稿华丽精美,也不如程序代码高贵冷艳,在外行人看来初级

huapro.vip的程序人生 713

蓝牙模块HM-10手册

蓝牙模块HM-10手册,该手册对蓝牙模块HM-10进行了详细的介绍和使用方法以及一些AT指令。

WINCC7.3破解文件

WINCC7.3硬件够破解文件,有需要的下载!WINCC7.3硬件够破解文件,有需要的下载!

成为优秀交互设计师的六个必备技能

交互设计师和用户体验设计师已经成为时下最为流行的职业之一,交互设计师是专门从事网站设计,软件设计以及任何需要人机交互设计的一种职业。用户体验设计师更多的是关注用户在使用前,使用中以及使用后的一个感受和体验。交互设计与用户体验设计密不可分,是一种你中有我,我中有你的关系。交互设计必定离不开用户体验设计,用户体验设计又包含着交互设计。 交互设计师作为现在炙手可热的职业之一,必定会得到

设计“1+2”,摹客就够了! 4458

交互逻辑思维整理

注册页面 1、定义后判断手机号输入是否有误,或者为空 2、定义后判断密码输入是否有误,或者为空 3、定义后判断验证码是否有误,或者为空 4、本地保存用户名、密码、 5、点击注册后跳转页面 登录页面 1、定义后判断手机号输入是否有误,或者为空 2、定义后判断密码输入是否有误,或者为空,密码需加密 3、本地保存用户id、手机号、密码、校验令牌、登录后返回的sessionI

沐吾 2597

如何设计出让人眼前一亮的交互框架?

这六点无论是对新人产品经理还是有经验的PD都是很重要的,按照整个流程可以避免很多问题,也会让我们的工作变得有节奏,而不至于丢三落四,确实对产品的把握。   这个问题有很多种答案,在我所有项目中,交互框架的确定是非常重要,非常费时费力的,但是实际中又很容易被忽略,被轻视,入行的新人特别容易陷入到细节自我陶醉,而忘记产品的宏观建设。   这是很危险的。   回答这个问题我们首先谈一谈

qq_32506555的博客 653

交互设计师的这些能力你都具备了吗

交互设计师是国内最近几年兴起的一个设计岗位,由于在提升产品用户体验方面起到了重要作用,各互联网公司均已设立了这个职位。本文研究了最近各大招聘网站上对高级、资深交互设计师的招聘要求,从而推导他们需要在工作中承担的责任。参考最近刚出炉的2017年中国百大互联网公司排名,重点挑选了10家一线公司进行查看比较,其中括号内为该公司在此次百大的排名:腾讯(1)、阿里(2)、百度(3)、京东(4)、网易(5)、

dlfeicui的博客 5765

学交互设计要懂什么:交互设计师的知识体系

​ 先为大家分享交互设计金字塔知识体系: 界面基础知识 界面基础知识包括:控件、布局、流程,即设计稿上可见部分。 1.控件: 控件就是界面上的最小单元,如搜索框、单选按钮、复选框、下拉框等。 认识控件最好的方法是阅读各个平台的官方设计规范,比如 iOS 、Android 、MacOS 、Windows(Desktop APP / UWP)、小程序设计规范。web 端没有官方规范,国内后台规范常见的是 antdesi.

849

设计--交互框架

天气真是热,我的项目也到了白热化时期,整个人火热火热的,用户体验建模还没有基本完成,流程转界面完成了50%,下面我倒是开始担心细节的交互设计了; 今天看alan cooper的交互设计,顺便总结一下,看看能不能给我带来什么创新的设计想法; 他提到了有6个过程描述: 1、定义形态要素和输入方法 在我们行业软件设计中,这个分析很重要的,例如影院系统,售票前台必须的输...

weixin_34310785的博客 469
上一篇: sql_mode
下一篇: MapperScannerConfigurer[注入映射器]
huapro.vip
博客等级 码龄15年 36粉丝 73原创
评论 1
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值