交互设计

【推荐】2019 Java 开发者跳槽指南.pdf(吐血整理) >>> 根据Axure中文官网网站发布的紧急通知：“现在（10月18日）通过官方下载地址的最新版本是3312，只有通过开发版下载链接才能下载到最新的3318版本。相信官方很快就要推送新的3318版本的升级通知了。”并且网络流传的授权码都无法验证通过，这无疑是给没有购买正版的童鞋的一大重创，当然，购买正版的朋友无需担心，跟你们屁点关系也没有，该升级的升级。“建议企业用户购买正版软件保证工作的顺利进行。个人用户除了购买正版Axure软件，也可以暂时维持当前版本不做升级，当然这也是以失去软件的稳定性为代价。学生或教师用户还可以去官网申请免费的教育版。” 使用过Axure的童鞋都知道这是一款很强大的工具，功能全面，做原型溜的不要不要的，但就是繁琐。不论是线上还是线下，Axure的培训班都如“雨后春笋”一样地冒出来，为了学习Axure，很多人投了大把的钱去报培训班，效果那就不可而知了。没有了盗版的Axure可用，国内的用户该何去何从？高价购买正版的Axure，这似乎是唯一的选择。跳出Axure的限制难道就没有别的工具可选择了吗？如果有一款更快，更简单的，而且没有任何语言障碍的国产原型工具，你们会怎么选择呢？不知大家对于国内这款- Mockplus了解多少，据说是国内做的最好的原型工具。 Mockplus

自然易懂：使用用户语言 用户获取信息的方式多样，并且对信息的理解程度也各有不同，所以使用用户平时使用和理解的表达方式去传递信息，则更加可以被用户所接受。 简洁清晰：使信息最简化 “少即是多”。应当提倡使用最少的元素来表达最多的信息。如果信息繁杂，将使用户承担大量的信息负担，造成信息过载，影响效率，不能帮助用户解决问题。 信息表述的种类 页面布局 界面中的信息布局，会直接影响用户获取信息的效率。所以，一般界面的布局因功能不同考虑的侧重点不同，并且会让用户有一种“区块感”，方便用户对信息的扫描性浏览。 页面布局设计原则 ①界面布局尽量有秩序，排列整齐，防止过紧或过松，有明显的“区块感”。切忌混乱。 ②布局要充分表现其功能性，对于每个区域所代表的功能应有所区别。如：标题区，工作区，提示/帮助区等 ③页面中最重要的信息所在的模块将是在屏幕中最明显的位置上。并且，应该是最大的。 ④布局中的信息需要有明显的标志和简单介绍，比如标题栏和标题等。 ⑤信息的位置保证一致性，让用户可以无需重新建立对页面信息分布的理解。 交互文本 交互文本指产品界面涉及交互操作中需要用户理解并反馈的所有的文字：包括标题、按钮文字、链接文字，对话框提示、各种提示信息、帮助等。这些文字直接影响用户在交互过程中对预期的理解，好的交互文本设计，可以提高用户完成任务的效率。 界面色彩 人眼一共约能区分一千万种颜色

创业公司往往意味着活力、惊喜，其别开生面的商业运营模式和独具风格的产品服务，都是其在市场中立足的根本。而创业公司的网站，则是凝聚公司产品、形象、企业文化和核心价值的橱窗，也是承载公司业务和运营的基础平台。对于初创公司来说，往往只有一次给用户留下印象的机会，网站作为公司的窗口，需要尽全力把握每次机会。 优秀的创业公司会在设计上保持极高的重视，呈现出高度个性化，每个元素都一丝不苟。这里我们来盘点2018年最令人瞩目的创业公司的网站，看看他们是如果抓住你的注意力的。 1、Hotel Tonight Hotel Tonight 是一个预订当天酒店房间的工具。着陆页的独有设计，使得网页有种独立的网页开发者们的作品风。这些图片的排版和处理有着极为清晰的处理思路，搭配好了会让你有一种探索感。并且页面运用了全局的视差滚动，呈现出颇有特色的布局。 2、Cruise Cruise构建了属于他们自己的高速公路自动驾驶系统，帮助用户驾驶汽车。这套系统包含了一组传感器和先进的机器视觉技术，让用户的车辆在行驶过程中可以和其他车辆保持安全距离，目前仅仅可以在美国加州使用。网站采用了时下热门的全屏视频，迎合了设计的大趋势，让用户第一眼就能直观感受到产品的特色。 3、Blockscore BlockScore是一个身份验证服务网站，用于解决身份盗窃的问题。网站设计同样使用了城市的俯瞰图，配合白色的文字和图标

一场说走就走的旅行少不了一家精挑细选的酒店。出门在外，没有一个舒适的住处，恐怕旅行的记忆也并不是那么美好。大牌酒店住不起，小众酒店性价比高，但哪家最合适？网上攻略必不可少。 作为主观性非常强的视觉性动物，选择酒店的时候除了看价格，当然也会更看重酒店的网页设计风格。如果酒店的网站设计都乱糟糟，那酒店自身可想而知。作为提升酒店形象的门户，酒店网站设计一定不能马虎。 如何设计具有现代感的酒店网站？个人分析可以从以下几点要素出发： 1. 响应式设计：网站必须支持跨设备浏览。 2. 卓越的用户体验：简化的网站浏览流程可以带来很好的用户体验。因为如果难以找到常见的页面或到达预订页面完成购买，很可能就会导致用户的流失。 3. 讲故事：你的网站是否了解一旦客人入住酒店会怎样？它是否可以为接下来的行程做指引？ 4. 便捷预定：尽可能简化预订过程以获得最大回报。繁琐的用户信息和付款信息填写都有可能造成用户的流失。 5. 视觉逼真：最好和最有效的网站是吸引访问者花时间探索的网站。专业摄影和视频都是讲故事的绝佳媒介，尤其是对于酒店和度假村。 9款优秀的小众酒店网站设计 1. 赤坂觉醒酒店 酒店所在地：日本 网站设计特色：动态天气图标 ，酒店内部背景图 Hotel Risveglio Akasaka酒店是一家2015年开业的酒店，据住过的用户反馈是一家处处体现设计感的酒店

工欲善其事必先利其器。天天和产品打交道，无可避免的要做一些页面原型，当然也离不开各种工具。好的原型工具软件可以大大提高工作效率，但是每款工具各有优劣。之前写过一篇基于不同平台的原型工具介绍，分别是基于网页、基于桌面端、和原型手机预览APP. 为了更好的帮助大家做出正确的判断，少走弯路，今天我分别为大家介绍一下几款常用软件的产品特色。 1. Axure RP 尽管近年来各种原型工具层出不穷，且功能及使用性方面也在不断的发展，但Axure仍旧是原型设计工具中的佼佼者，稳坐大牛之位。可以说Axure是Windows上一款非常出色的原型设计软件，亦是网络产品前期设计的首选工具之一。 价格： 前期提供30天试用，试用期结束后需购买。 专业版 $495一个注册码 团队版 $895一个注册码 企业版$99/月 产品特色： 1、老牌原型工具，用户群体庞大 2、丰富的视频教程 3、自带组件库，以及强大的第三方组件库 4、强大的交互功能 5、完整的教程和支持文档 预览： 预览方式既可以支持直接F5在线预览，也可以通过移动端预览： 导出HTML,在Safari中打开 通过Axure share直接打开桌面端上传的项目 导出： 支持导出文件类型：HTML, DOCX, PNG 2. Mockplus 作为新兴的快速原型设计工具， Mockplus提供了大量组件和图标，方便用户快速上手进行设计

纸上原型设计，作为传统的原型设计方式，简单快速，成本低廉，为大部分设计师所喜爱。而桌面原型工具设计，作为伴随电脑科技发展而出现的原型设计方式，快速全面，高效保真，动效灵敏，专业优质，一经推出，就备受青睐，迅速在设计师群体之中普及。但作为网页或移动端应用UX/UI设计的你，更喜欢或更愿意使用他们中的哪一种来完成你的UX/UI设计呢？为方便大家选择，这里分别为设计师朋友们介绍两种原型设计方式的优缺点，希望对大家有所帮助： 首先，什么是纸上原型设计？ 一般而言，纸上原型设计指的是UX/UI设计师们广泛采用的一种通过纸，笔，剪刀，便利贴之类办公用具来展示出设计理念的一种设计方式。换句话说，就是设计师们在纸上绘制出各种网页或手机端应用部件，（例如软件界面，按钮和各组件之类）完成原型设计，并检测其设计理念是否可行且适用的的一个过程。所以，从这当面而言，它也是设计师们创建原型，尽快获得真是用户或设计师关于设计实用性反馈的重要方式之一。 什么是桌面原型工工具设计？ 而不同于纸上原型设计，桌面原型工具设计是一种基于桌面原型工具，实现网页或移动端软件应用原型设计的设计方式。而桌面原型工具是一种能够安装在电脑桌面上，帮助UX/UI 设计师独自或以团队协作的方式创建和提升应用原型设计的设计工具。而且，通过优秀原型设计工具制作的软件原型一般细节详尽，交互灵敏且转化多样，能够更加全面的展现软件真实的界面和交互

如今是一个快节奏的社会，每一天都会有无数的软件发布，每一款软件的制作过程不可避免的需要使用原型设计工具。而 MockPlus 就是一款原型设计软件，可以用于移动端，PC端以及WEB的原型设计。它也符合如今快速设计的潮流，旨在帮助设计师在最短时间内设计出令人满意的软件原型。 现在市面上有很多的原型设计软件，而为什么选择 MockPlus 呢？我是因为它快速且高效，简单而不简陋的特点，专注于原型设计这件事本身的理念。如果把原型设计软件中的巨头Axure比作是一个武学宗师，那么MockPlus就是一个刺客，它远没有宗师那样华丽的招式，更没有宗师那样威力无穷且见于细微的内力。它只是一个刺客，它的招式不多，出手很快，每一招一式都是为了获得一个成功的结果。这就是MockPlus,它简单，没有太多繁复的操作，几乎每个人都可以轻易的上手；它快速，可以通过简单的拖拽设置等操作来实现其中大部分的功能。 MockPlus提供了很多的基础组件，交互组件，布局组件等常用的组件。而对于这些组件的使用也都是很简单的，每一个组件及其中的事件都会提供一个链接点，而通过链接点链接到其他的页面或者组件上就可以实现事件的功能或者页面的跳转，可以很方便的进行软件的交互设计。同时软件界面的右下方也会提供每个组件的属性，通过这些属性可以快速的设计出自己想要的组建模式。布局，页链接的属性可以很方便的对进行设计。

一部手机，电量充足，网络通畅，就足以让我们打发一天的时光，尽情沉浸在手机时代的缤纷世界里。这个信息资源无穷尽的手机网络世界，是设计师和开发者们在不停的探索中一路一步精心打造。如何进一步美化这个世界，优化用户体验？如何在手机有限的屏幕上呈现清晰的UI和UX？这里太多因素需要考虑，文本排版设计就是其中不可或缺的一部分。今天，我将从文本排版设计角度出发，谈谈如何实现完美的 手机UI界面 。 首先，有必要了解一下基础知识。 国内一些设计师，或者开发人员，可能从来都没有接触过文本排版设计的培训或学习。 1，什么是文本排版？ “文本排版，“又称“文字设计”，是一种涉及对字体、字号、缩进、行间距、字符间距进行设计、安排等方法来进行排版的一种工艺。在数码技术普及之前，文本排版是一项专业的工作，数码时代的来临使字体排印不像从前仅由排字印刷方面的技术工人完成，而更被图形艺术家、艺术指导、文书人员甚至儿童广泛使用。” ---维基百科 2，为什么文本版排版在手机端设计中很重要？ 手机端设计比网页设计要求更精致细腻，这个方寸之间的屏幕上，每个元素的选择都更加谨慎，不仅美观，更要实用。用户对手机端文本排版设计的体验要求也更高，于设计师而言，让用户能满足于手机的文本排版设计是极具挑战性的。 想象一下，一个完全没有任何文字的手机网页是怎样的呢？不现实吧。同样，在手机界面上随意的放置文本元素，会有意义吗

原型工具中Wireframe, Mockup和prototype之间的有什么不同？ 无论你是一名刚入行的UX/UI设计师，还是入行多年的老手，在制作原型的过程中一定接触或听说过其中很重要的三个原型术语：“ wireframe （线框图）”， “ Mockup ” 或“prototype”。但扪心自问，你真的能够明明白白的分清他们吗？ 事实上，就我而言，更多的是将他们当做是产品软件迭代设计的三个阶段： 第一阶段: 绘制线框图（wireframe） 当设计师或产品经理在了解到用户需求和产品本身特色及性能之后，会理所当然的对于产品软件主要界面，布局和功能分配之类要素有个全局把握，为了测试这些想法的可行性，他们常常会使用一些手绘的原型工具绘制出一些没有太多产品细节的原型草图，而这些草图一般被称作线框图（wireframe）。 第二阶段：编辑调整线框图创建具有更多细节的Mockup 然后，当设计师们与其他的设计师或产品经理讨论并听取他们的意见之后，会对线框图做出调整和完善，即添加更多的部件，颜色，图层，布局和排版之类的细节之后，创建更真实和高保真的Mockup。 第三阶段：添加动画交互创建prototype项目 之后，为了让网页或移动端原型更生动，直观且接近最终应用, 设计师会对原型添加各种动画，交互以及转化设计，从而创建prototype项目。 总之，线框图（wireframe

本月下旬，更快更简单的优秀原型设计工具制造者 Mockplus 联合杭州产品经理社群堇创社在杭州举办了产品经理沙龙，邀请了三位老资格的产品经理，带来了干货满满的分享，为大家讲解产品经理如何提升专业力。 活动开始前，大家陆续签到，并且领取了Mockplus精美笔记本。 主持人开场后，首先，由云衣库CEO朱军华分享了《不可或缺的产品经理》。 他指出了产品经理的角色、定位及价值，产品经理应解决当下产品发展过程中遇到的问题，推动公司以产品为主导；产品经理应担当产品研发的源头、随时关注竞品及行业动态、去业务一线做调研，以提高产品力；应加强业务流程分析、产品设计和用户体验的能力，以提高专业力；应培养团队氛围、制定产品迭代计划，以提高协同力。他总结道，产品经理的专业性更多体现在分析的思路、分析的过程以及分析的结果上。 其次，由前如涵电商产品总监、现爱医康产品负责人沈丹分享了《项目中如何体现专业力》。 他指出，产品经理要在项目中体现专业性，首先应该搞清楚产品的定位、做好产品调研：通过做竞品分析和了解竞品的企业架构，来弄清楚产品边界；通过定义产品，来弄清楚产品的使用价值；通过分析用户使用场景和搭建用户画像，来制定产品的商业模式。其次在项目启动中：应加强团队文化氛围的管理；通过产品分层和业务分层来梳理项目；工作务必从细节开始做好，PRD文档和会议纪要十分重要；通过基础数据整合