△ 交互设计五要素图解

　　本文不计算讲 Axure、xmind 怎么用，因为软件完全可以自学，也不计算科普交互设计是什么，就似乎解释篮球是什么并不克不及教会他们打篮球。我欲望能教给大年夜家一些器械，能立时应用起来真正解决问题。交互设计画布恰是如许的好对象，它能赞助设计师从全局对待一个需求，找到真正的问题，综合所怀孕分提出可行的解决筹划。

　　一、交互设计核心要素

　　起首从一个实际的问题开端。

　　小明是外埠人，28岁，能闇练应用智妙手机，第一次来北京，他想去得实大年夜厦见一个同伙，但上午10:00到西二旗地铁站后不知道怎么走，假如你是一个地图App 的设计师，请设计一个步行导航功能赞助他顺利的达到得实大年夜厦。

　　△ 小明若何才能达到得实大年夜厦

　　我们可以这么思虑，小明的起点是西二旗地铁站，他如今目标是去得实大年夜厦，其实这个目标隐含了3个前提：

　　精确，是到了得实大年夜厦，不是到了其他处所。安然，不克不及在路上走着走着出车祸了。比较有效力，得实大年夜厦本来不远，用户肯定不欲望绕远路，能快点更好。

　　从起点到目标，肯定会经由一些步调，我们把关键步调列出来，如下图所示。

　　△ 需求、目标和关键步调

　　△ 交互设计画布1.0

　　如今我们一个一个步调来分析和设计，起首是手机启动 App，有个启动界面，我们可以放一些宣传语，安抚一下小明因为迷路产生的烦躁心境，比如：「步行导航，找偏向不再难」。

　　△ 启动界面

　　接下来输入起点，应用手机的 GPS 定位功能把当前所处的地位主动显示在地图上，为了预防定位不准，把起点做到输入框内包管随时可以修改。下一个步调是输入终点，显然这里也须要一个输入框。之后开端导航这个步调肯定须要一个按钮来触发，这三步接洽异常慎密，是以做到了一个界面里。

　　△ 导航设置界面

　　△ Airbnb 的贸易模式画布，来源：http://blog.sina.com.cn/s/blog_8a9e31500102wszx.html

　　小明跟着导航路线行走是最为关键的步调，除了在地图上显示当前地位、线路以及得实大年夜厦的地位，还有其他身分可能影响此次导航的成败。

　　比如气象，一下雨地铁站邻近的路不太好走，所以我们须要根据气象赐与用户不合的路径。第二是光线，小明是日间去得实大年夜厦，不是晚上，日间光线很强，色彩太浅的界面可能会有点看不清，所以设计的时刻应当用反差比较大年夜的色彩，还要主动把手机的亮度调高。第三是用户的行动，稍微不雅察就会发明，用户在应用地图导航的时刻，是先看会儿地图，再走，然后不雅察地图确认本身是否走得对，以此来去。有可能小明走过火了才看地图，所以碰到关键的路线变更，比如转弯的时刻，我们可以设置一个震动或者语音，提示用户及时打开手机查看线路，及时改变行走偏向。此外我们最好设计一个残剩时光和路程，降低小明的焦炙，不然他不知道什么时刻才能到，心理会比较浮躁。

　　△ 导航界面的设计

　　最后是达到了得实大年夜厦。这里大年夜家可以回想一下，你到了一个预定地点，你是怎么肯定本身到了呢？一种办法是问邻近的人「这里是得实大年夜厦吗？」还有不雅察楼房上有没有很大年夜的文字招牌。很可惜，得实大年夜厦貌似没有。所以我们在界面上可以把得实大年夜厦的图片放在上面，便应用户与实际情况辨认比对，再提示用户导航完成，给个退出按钮，全部步行导航的初步设计就完成了。