Guideandresourcesforfirsttimeinteractiondesigners
交互设计的10个步骤
新手交互设计师的指南和资源
Learningnewstuffistough.ButInteractiondesignis,rather,exciting!
学习新东西很难的一件事。但是，学交互设计却又是令人兴奋的事情！
Areyoutransitioningfromvisualdesign,psychologyorcomputerscienceoranyotherfield(chemicalengineeringinmycase)intoInteractiondesign(IxD),UXorHCIThenthispostisforyou.IfyourtitleisUXdesignerandyouarestillworkingonUIdesigns,thisisforyoutoo.IwilltouchbaseonvariousaspectswhichareclosetoIxDfield.Solet’sgetstarted.
1.Understandingthebasics-whatisInteractionDesign
1.了解基础知识-什么是交互设计？
“InteractionDesign(IxD)definesthestructureandbehaviorofinteractivesystems.InteractionDesignersstrivetocreatemeaningfulrelationshipsbetweenpeopleandtheproductsandservicesthattheyuse,fromcomputerstomobiledevicestoappliancesandbeyond.Ourpracticesevolvewiththeworld”—IXDA
“交互设计（IxD）定义了交互系统的结构和行为。交互设计师致力于在人们与其使用的产品和服务之间建立有意义的关系，从计算机到移动设备再到家用电器等。我们的做法随着世界的发展而发展”-IXDA
Byinteractivesystem,itmeanswitheveryinputadded,thereisanactionorfeedbackassociatedwithit.HencethisisthecoredifferencebetweenInteractionandCommunicationdesignthatcommdesigndoesn’trespondbackwhenyouinteract(touch,wave,pinch,see,smelletc.)withit.
Ifyoulikereadingbooks,IwouldhighlyrecommendDanSaffer’sDesigningforInteraction.Itlaysoutallthebasicsveryclearly.
如果你喜欢阅读，我会强烈推荐DanSaffer的为交互而设计。它非常清楚地列出了所有基础知识。
InteractionDesignisapartofExperienceDesign
交互设计是体验设计的一部分
ThefollowingsmallfreeUdacitycourseisagreatpointtostart.LearnaboutbasicterminologiesandunderlyingbaseofIxD.
下面小型免费的Udacity课程是一个很好的起点。你可以学习IxD的基本术语和基础知识。
HereisanotherUdacitycourseincollaborationwithFacebook:
这是与Facebook合作的另一个Udacity课程：
2.Startnoticingaffordances,signifiers,feedbacksaroundyou
2.开始注意你身边的功能可见性，示意符号和反馈
Bynow,IamassumingyouwouldhavegonethroughDonNorman’sUdacitycoursewherehetalksaboutaffordancesandsignifiers…
现在，我假设你已经上完了DonNorman的Udacity课程，在那里他谈到功能可见性和示意符号......
Affordance:“Relationshipbetweenpropertiesofanobjectandthecapabilitiesofanagentthatprovidecluestotheuseofanobject.Affordancesmustbeperceivable/visibletobeeffective”.Therefore,affordancesarewhatanobjectcando.Fore.g.achairobjectcanbepicked,thrownatsomeone,dragged,invertedetc.
Signifier:“Anymarkorsound,anyperceivableindicatorthatcommunicatesappropriatebehaviortoaperson”.Therefore,signifiersindicateswhattheobjectshoulddo,makingtheaffordancesclearertotheuser.Fore.g.thetiresofthechairindicatesitcanbedragged.ThearmsofthechairindicatesthatIcanrestmyarmsonthem.TheshapeofthechairindicatesthatIcansitonit.
功能可见性：“对象的属性与其功能之间的关系，关系提供了使用对象的线索。功能可见性必须能够有效地被感知或识别”。因此，功能可见性是一个对象可以做的事情。例如椅子这个对象可以被挑选，扔给某人，被拖，放倒等。
示意符号：“任何标记或声音，任何可感知的指示器，都在向人传达适当的行为”。因此，示意符号传达了对象应该做什么，使得用户可以更加清晰使用功能。例如椅子的轮胎表明它可以被拖动。椅子的扶手表明我可以将手臂放在它们上面。椅子的形状表明我可以坐在上面。
Thisworldwhereyouliveisagiftfromfineinnovativecraftsmenwhoworkedforgenerationstomakeourliveseasier.Soexaminethisworldaroundyou;youwillfindmanyexamplesofaffordances,feedbacks,signifiers,feedforwardandsystemimage(explainedinDonNorman’scourse)whichweignoreinourdaytodaylives.Takepictures,asmanyaspossible.Thiswillmakeyoua“curious”being—oneofthemostessentialpartofbeinganinteractiondesigner.Ithelpsgeneratenewideasforinnovativeproducts.
你居住的这个世界是来自一群精湛的创新工匠的礼物，他们世代相传，让我们的生活更舒适。所以，审视你周围的世界，你会发现许多在日常生活中忽略的功能可见性，反馈和示意符号，前馈和系统形象的例子（在唐诺曼的课程中解释）。尽可能多地拍照。这会让你成为一个“好奇”的人-成为交互设计师最重要的性格之一。它有助于为革命性产品创造新的想法。
ListenwhatDonNormanhastosay→
a)Goodexampleofsignifiers:GoogleClassroom’sbuttonsinvitingustoclickonthemb)Thisdoorhandleisabadexampleofasignifierasitdoesn’ttellifitneedstobepushedorpulledc)Goode.g.offeedback:Avisualandhapticfeedbackwhenyouenterwrongpasscode
a）示意符号的优秀案例：GoogleClassroom的按钮诱导我们点击它们；b）这个门把手是功能可见性的一个差案例，因为它没有告诉它是否需要被推或拉；c）优秀的反馈案例：输入错误密码时的视觉和触觉反馈
A)Goode.g.ofFitt’slaw:MajorlyallgoogleproductsfollowFitt’slawquitenicelyi.e.youcomfortablyclickingonadocumentwithmouse(onweb)orfinger(onphone).Onrightclick,usercanquicklyreachouttoalltheassociatedactionsB)InBankofAmericaapp,thebuttonsaretoothinthatitneedsmoreaccuracy/effortfromusertoclick
HereyoucanlearnmoreaboutUXlaws:
在这里你可以了解有关UX法则的更多信息：
3.Everydesignstartswiththeresearch—
3.每个设计都从研究开始-
Whenisayresearch,Imeanunderstandingthesystemthoroughly.Howtodothat—
当我说研究时，我的意思是彻底了解系统。怎么做？-
Browse:Whatisavailableontheinternetaboutit,whoisdoingwhatorwhereisthemarketgoing.
浏览：互联网上有关它的信息，谁在做什么或市场会走向何方。
Observe:AreyoutryingtoimprovethecoffeeshopexperienceThenvisitthatcafe.Areyoutryingtoimprovebuyingvegetablesexperience,thengotoWalmart,Target.Youcannotknowthesystembysittingatyourdesk.Understandtheexistingexperiences.Takenotes.TypesofobservationmethodsincludeFlyonthewall,Shadowing,contextualinquiry,undercoveragent.FindmoreabouttheminDanSaffer’sbookmentionedinthebeginning.
Talktopeople:Youwillgatherinsightswhichyouhaveneverexpectedbefore.The‘aha’moments.Keepthequestionsopenended.Andtrytokeeptheinterviewlocationwheretheintervieweeismostcomfortableat—wheretheywork,live,eatetc.Keepitconcise.
与人交谈：你将收集到你以前从未预料到的见解。这就是'啊哈'时刻。保持问题是开放性结尾。并尽量将访谈地点保持在受访者最适合的地方-他们工作，生活，吃饭上网地方等。保持简洁。
AfewmethodsincludeDirectedstorytelling,Unfocusgroup,Roleplaying,Extremeuserinterviews,Desk/purse/briefcasetourand100otherways…literally!Tolearnwhichmethodsshouldbeusedwhere,checkoutoneofmyfavoritebooks:
一些方法包括直接讲故事，非焦点小组，角色扮演，极端用户访谈，书桌/钱包/公文包旅游和其他100种方式…要了解在哪里应该使用哪些方法，请阅读我最喜欢的一本书:
YoucanalsoreadabouttheresearchmethodsinDanSaffer’sbook.
你还可以阅读DanSaffer的书中的研究方法。
4.AnalyzeandSynthesizetheresearch
4.分析和综合研究
Thisistheprocessoforganizingandevaluatingresearchdata:
这是组织和评估研究数据的过程：
Immediatelyaftertheinterview,reviewyournotes.
访谈结束后，立即回顾你的笔记。
Getalltheinsightsfromyournotesonstickynotes.
通过便签提炼笔记中的所有见解。
Bynowtherewouldbeashitloadofstickynotes.Nowitistimetocreatesomemeaningoutofthisdata.Startbyfindingrelationbetweentwoinsights.Fore.g.Incoffeeshopresearch,twoinsightsmightsay,“Iliketheambience”,“icomehereworkeverydaybecauseitisquietandhasaslowmusic.Don’tfeellikeleaving”.
到现在为止，会有大量的便签。现在是时候从这些数据中创造一些价值了。首先找出两种观点之间的关系。例如在咖啡店的研究中，有两种观点可能会说，“我喜欢这种氛围”，“我每天都来这里工作，因为它很安静而且音乐很慢。使我不想离开”。
Startclusteringthestickynotes.Lookforinsightswithsimilarities.Incoffeeshopresearchexample,oneclustermightbebasedon“coffeeshopambience”.Thisishowyoufindpatterns.
开始聚集起这些便利贴。寻找有相似之处的观点。在咖啡店研究案例中，一个数据组可能是基于“咖啡店氛围”的。这就是找到模式的方法。
Nowgenerateonestatementpercluster.Fore.g.“PeoplelikegoingtoXYZcoffeeshoptoenjoytheambience”.Thiscouldbeyourclusteredinsight.
现在每个数据组生成一个语句。对于例如“人们喜欢去XYZ咖啡馆享受氛围”。这可能是你的集群洞察力。
Forallthese“statements”(clusteredinsights)nowitistimetoconvertthemintoaparticularformofquestionstatement—“Howmightwe…”.Fore.g.“HowmightweprovidebetterambienceexperiencetopeoplecomingtoXYZcoffeeshop”.Thishelpsusgenerateideaswithanopenmindwithlesserbiases.Readmorehere.
对于所有这些“陈述”（聚类见解），现在是时候将它们转换成特定形式的问题陈述-“我们怎么可能......”。对于例如“我们怎样才能为来XYZ咖啡店的人们提供更好的氛围体验”。这有助于我们以开放的心态产生具有较小偏见的想法。在这里阅读更多。
FindallthemethodsmentionedinDanSaffer’sbook.
也可以在DanSaffer的书中找到提到的所有方法。
5.Thinkfromothersperspectives
5.从别人的角度思考
Alwaysthinkfromtheperspectiveofthecustomer/user/audience(orwhosoeveryourdesignisfor).Makethisahabit.Itwillbehelpfulateverystepoftheprocess.Ifyouareinterviewingapatient,trytobeintheirshoesandfeeltheirpain.Empathizewiththem.ThisisagreatwaytoovercomeourownlifebiasesandbuildsomethingFORTHEM.Applythissuperpowerineveryaspectofyourlife.
始终从客户/用户/受众（或任何你设计服务的对象）的角度思考。养成这个习惯，这将有助于在成为交互设计师中的每一步过程。如果你正在采访一位病人，试着穿上他们的鞋子，感受他们的痛苦。与他们产生同理心。这是克服我们自己的生活偏见并为他们建立一些东西的好方法。在生活的各个方面应用这个超级武器。
AreyoubuildingyourportfolioThinkwhatifyouwerearecruiter,WhatwouldyouneedfromaportfolioHowmuchtimewouldyouhaveperportfolioWhatwouldyoubefeelingetc.
Ifyouhadanargumentwithfellowdesigner/developer,thinkwhatweretheyfeelinginthatscenarioWhatwereyoufeeling(self-empathy)Whatcouldhavebeentheirintention,yourintentionWhatdoesthatsituationreflectaboutyourself-image,theirself-imageNexttime,howcouldyouhavepreventedit
如果你与设计师/开发人员有争执，那么想想他们在那个场景中的感受是什么？你的感受是什么（自我同理心）？他们的意图可能是什么，你的意图又是什么？这种情况反映了你什么样的自我意象，他们什么样的自我意象？下次，你怎么能阻止它？
Watchthisvideotolearnmoreonempathy
观看此视频，了解有关同理心的更多信息
6.Thinkinsystems
6，在系统中思考
Whilepayingattentiontodetails,doremembertolookatthebiggerpictureaswell.Sometimeswhenwediggingdeeperintothedetails,weoverlookhowitaffectsotherelementsinoursystem.Wheneveranactiontakesplace,onewayistolookbacktothesystemstructureandanalyzewhathaschangedinthesystemandwhichelementsgetaffectedbythat.
在注意细节的同时，也要同时记住要看着更大的框架。有时，当我们深入挖掘细节时，我们会忽略它如何影响我们系统中的其他元素。每当一个行为产生时，一个方法是回顾系统结构并分析系统中发生了哪些变化以及哪些因素受到影响。
YoucanreadMeadows’Thinkinginsystemsorreadthisarticlethatdescribeshowtofindtheleveragepointsinthesystemtointervene.
HavealookatthisvideothatexplainshowWorldHealthOrganisation(WHO)createdevenbiggerproblemwhilesolvingrelativelysmallerproblem.
看一下这个视频，它解释了世界卫生组织（WHO）在解决相对较小的问题时如何创造更大的问题。
Wealsodiscussedhowitisimportanttothinkfromusersperspectives.Nowitistimetodesignforthat!Userconceptualmodelsareagreatwaytoconsolidatealltheideasintoastructure.
我们还讨论了从用户角度思考是如何的重要。现在是时候该为此设计了！用户概念模型是将所有想法整合到结构中的好方法。
Conceptualmodelshelpus(designers)thinkwhatisnecessaryfortheusertoknowabouttheproduct.
概念模型帮助我们（设计师）思考用户了解产品所需的内容。
Video：ConceptualModels:CoretoGoodDesign
Checkoutthelasttwoprojectsonmywebsitetolearnhowtouseconceptualmodels.MywebsiteincludesvarioustypeofSystemsdesignprojects:Applicationsystems,Feedbackcontrolsystems,Dynamicsystems,Automaticcontrolsystems,Productsystemsetc:
查看我网站上的最后两个项目，了解如何使用概念模型。我的网站包括各种类型的系统设计项目：应用系统，反馈控制系统，动态系统，自动控制系统，产品系统等。
7.Rapidprototyping—SecretofInnovation
7.快速设计原型-创新的秘密
Don’tprototype,but“pretotoype”.Getyourhandsdirty.Startwithprototypingasearlyaspossible.Somedesignersevenstartwithprototypingalongwiththeresearch.Youcancallstickynotesontopofablanksheetasyour“websiteprototype”andthat’sfine!Pointis,thequalitydoesn’tmatteratthisstage.Becauseyourfirstdraftisalwayswrong.Butitwillbequickandinexpensivewhichwillgiveyouauthenticreactions.It’sthecheapestandmostefficientwaytotesttheideas.
不是设计原型，而是设计“早期原型”。亲自快速动手吧，尽可能早地开始原型设计。一些设计师甚至从研究开始进行原型设计。你可以把在白板上面的便签称为“网站原型”，这很好！重点是，现阶段好坏无关紧要。因为你的初稿总是错的。但它因敏捷且轻量级，会给你真实的反馈。这是测试这些想法的最划算和最有效的方法。
Intheory,Interactiondesignfollowsadoublediamondprocess.Butinreality,itsprettymuchaniterativeprocess.Therefore,thesecretmantraofsuccessfulproductsis:
理论上，交互设计遵循“双钻石模型”的过程。但实际上，它几乎是一个迭代的过程。因此，成功产品的秘诀是：
Makesomethingandlearnfromit,andlearnsomethingoutofwhatyoumadeandthenremakefromthelearningsandsoon…
做一些事情并从中学习，从你所做的事情中学到一些东西，然后从学习中重新制作，如此往返...
WatchthesepaperprototypeandpowerofprototypinglecturevideosbyScottKlemmerfromthefreecourseonPrototyping.
查看这些纸质原型和ScottKlemmer在免费课程视频中原型的力量。
Amillionstoolsthatyoucanuse:Pen/Paper(recommended),Sketch,Invision,Studio,Framer(myfavorite),Figma,proto.io,AdobeXD,Marvel,UXPin,Keynote
你可以使用的成千上万的工具：笔/纸（推荐），Sketch、Invision、Studio、Framer（我最喜欢的），Figmaproto.io、AdobeXD、Marvel、UXPin、Keynote
8.Usertest—Showthantell
8.用户测试-展示胜于空谈
Obviousisnotalwaysobvious.Wetendtogetbiasedtowardsourdesigns.Ihaveseeneventhegooddesignerstomakethemistakeoftestingtheprototypeonceit’s“ready”,andby“ready”theymean‘clickable’.Butusually,it’salreadytoolatetotest.
显而易见的并不总是明确可知的。我们倾向于我们的设计偏见。我甚至见过一些优秀的设计师在原型“就绪”后错误地对其进行测试，他们所说的“就绪”指的是“可点击的页面”。但通常情况下，这时测试已经太迟了。
Onceitisonthepaper,itisready!Andtestingshouldhappenthroughoutthedesignprocess.Createaflow—showittothepeople,drawsomesketches—showittothepeople,createwireframes—showittothepeople…Ateverystep,taketheirauthenticfeedback.Youwillbelearningalotfromthem.“People”canbeusers,otherdesigners,engineers,otherstakeholdersetc.
AndIamabigfanofguerillatesting.Itisamethodoftestingyourproductwithpeoplesittingaloneincafe’s,restaurantsetc.
Checkoutthisarticleexplaininghowtodoguerillatesting:
Also,havealookatthisyearsoldvideoofJakobNielsen,wherehetalksabouthowtoconductasimpletest.
另外，看看今年雅各布尼尔森的视频，他谈到了如何进行简单的测试。
9.Thewondersofstorytelling
9.讲故事的妙处
Icannottellyouhowimportantthisis.Storytellingisthekeytosuccess.Whateversuccessmeanstoyou…
我无法告诉你这有多重要。讲故事是成功的关键。无论成功对你意味着什么......
Our(users,designers,stakeholders,allhumans,maybealienstoo…)brainsarewiredtoexpressourthoughtsthroughthispowerfultoolofstorytelling.Thissecretpowerextendstoresearchers,strategistsanddesigners.Whetherwe(InteractionDesigners)talkaboutdoingresearch,creatingthevisuals,designingaprototype,makingavideo,oraclientpresentationoryourownportfolio,wealways…alwaysneedtotellagoodstory—astorythattheaudiencecanrelateto,thatcancreatea‘conflict’intheirminds,thatcanmakethemwonderandeventuallychangetheirperspectives.Iwilltalkmoreaboutstorytellinginmynextblogpost.
CheckoutthisamazingtalkbyDavidJPhiliponstorytelling.
查看DavidJPhilip讲述这个讲故事的精彩演讲。
AndwatchthisTedTalkbyFilmmakerAndrewStantonof‘ToyStory’.
观看由电影制片人安德鲁斯坦顿撰写的“玩具总动员”的特德谈话。
So,howdoyoutellstoryinnon-fictionworklife
那么，你如何讲述非小说作品中的故事呢？
ReadthisawesomebookStoryCraftbyJackHartandreadonhero’sjourney.Hereisamazingarticledescribingdifferentwaysofbuildinganarrativearc:
10.Collaborationisthekey
10.合作是关键
Collaborationisanotherformofinteractiondesignwheretheinteractionisbetweenhumantohuman.
协作是交互设计的另一种形式，其中交互是人与人之间的交互。
AndfrommyexperienceIhavelearnedthattalentcanonlytakeyoutoacertainlevel.Butwithgoodcollaborationandcommunicationskills,sky’stheonlylimit.Ipersonallyusedtofocuslesseronthisaspect.HencemyperformancewasplummetingingroupprojectseventhoughIwasdoingprettywellinthesoloprojects.Andbtw,mostoftheprojectsinanycompanyarewithinteams.
根据我的经验，我了解到天赋只能帮你到一定程度。但凭借良好的协作和沟通技巧，天空是唯一的限制。我过去常常很少把注意力集中在这方面。所以，即使我在单独行动中做得很好，但我的表现在小组项目中直线下降。顺便说一句，任何公司的大多数项目都在团队中。
Insuchsituations,wejustifythesituationexplainingourselvesthatco-workerhasshallowsubjectknowledgeortheiregoisticnatureisthehinderance.That’swhatmanyofusthink.But,fortunately,it’sneveranyone’s‘mistake’ratherit’sourinabilitytointeractandcollaboratewitheachotherthatwefeelunsuccessfulorexhausted.Whichwecanlearn.How
在这种情况下，我们理所当然地认为这种情况，即自己同事具才疏学浅或者他们的自私自利是我们的阻碍。这就是我们许多人的想法。但是，幸运的是，这绝不是任何人的“错”，而是我们无法与我们感到不成功或疲惫的彼此互动和协作。我们可以学到什么。怎么做？
Payattentiontowhatteammatesaresaying.Listentothem.Thinkfromtheirperspective.Giveimportancetotheiropinions.Sometimesyouneedtosacrificeyourgoodideasforthegreatergoodoftheteam.Timeisthekey,youcannotdoeverythingonyourown,atleastnotasfastasacollaborativeteamwould.1+1=11
So,ifyouareadesigner,youneedtodesign,notonlyyourproduct,butalsoyourmethodsofcommunicationwithothers.
所以，如果你是一名设计师，你不仅需要设计产品，还需要设计与他人沟通的方法。
Thetroubleis,wethinkwestillhavetime.
Designyourlife
设计你的生活
Usethesemethodsandapplythemnotonlyinyourwork,butpersonallifeandgrowth.Thinkhowcanyouprototypeyourlife.Thesedayswithfreeinternet,itissupereasytolearnbasicsaboutanyfieldallbyyourself.Dothat!Learncodingonline.Seeifitexcitesyou.Buildsomethingandseeifthisissomethingyouwanttopursue.Ifnot,discard.Learnsomethingelse,say,neuroscience,orelectronicsorbusinessmodelsortaekwondoorsnookerorpainting.Lifeistooshorttonotenjoyit!
使用这些方法，不仅适用于你的工作，还适用于个人生活和成长。想想你怎么能为你的生活做好准备。如今，通过免费上网，您可以自己学习任何领域的基础知识。开始吧！在线学习编码。看看它是否让你兴奋。设立一些东西，看看这是否是你想要追求的东西。如果没有，丢掉。学习其他东西，比如神经科学，电子学或商业模式或跆拳道或斯诺克或绘画。人生苦短，何乐不为！
Iunderstandthatitisdifficulttodigestallthisinformationinonego.Noworriesatall,takeyourtimeandgothroughallthereferencesstepbystep.Thingswillslowlystarttomakesense.Andpracticeistheonlythingthatwouldmakeyoubetter.So,alwayschallengeyourselfwithnewproblemsandimplementsthesenewtricksandtipstogetabetterholdatInteractionDesign.
Ihopeyoulearnedsomethingnewtoday.Seeyounexttime.
我希望你今天能学到新东西。下次见。
Behumble,becurious!
保持谦虚，保持好奇！
4人已收藏
视觉设计师交互设计师
你确定要举报新手交互设计师进阶的10个步骤（IxD）--包你嗨设计英语？