国外干货!6个方法助你设计出优秀的APP
伟大的设计来源于一致性和细致化,而其实只要有足够的纪律,每个团队都可以实现这一点。
品牌(源码:http://www.jinhusns.com/Products/Download/?type=xcj)
品 牌是应用设计的基石。它回答了“用户使用应用时应该获得何等感受”这个问题。首先,你应该确定你的主要目标人群或者产业是哪些:儿童,青少年,专业人士, 妈妈,学生,医生,设计师,老年人,等等。应用的设计风格必须与品牌相一致,这样才能建立更强的品牌认知,并消除用户疑虑。例如,为老年人设计的社交应用 就应该用大号字体,而股票交易应用就得有策略地使用安全锁图标来让用户有安全感。如果可能,你还该考虑为品牌找一个吉祥物。吉祥物可以将品牌拟人化,同时 强化应用留给用户的印象。
颜色方案
颜 色方案决定了应用的形象,它应该是品牌主题色的扩展。它是视觉设计的核心,因为应用所有可见的地方都会使用这些颜色。首先,你需要选择一个能增强品牌形象 的主题色。例如,Evernote的主题色是绿色。然后,你应该围绕这个主题色来创建颜色方案。亮色可以吸引人的目光,所以适合那些消费导向的应用;中间 色可以让人把精力集中在信息本身,所以更适合专业性的应用。Parable的主题色是“Tangelo橙”,因此我们选择了灰度作为主要颜色方案,这也符 合我们一贯的时尚创意。另一个例子是SnapChat,它使用了华丽的亮色方案来吸引青少年用户。
直观
在 高度竞争的应用市场,根本没时间让用户仔细品味你的应用——我们讲究的是“一见钟情”。能让你第一眼就明白其功能的应用才是最好的应用。有一个管用的小方 法,就是去研究一下那些热门应用是怎么做的,尽量别让用户产生困惑。然后,要全面地测试所有的交互环节,充分优化应用。到达最重要的交互环节之前,用户的 操作步骤不能超过三个,例如,发布到Meerkat上只用点一下,发布到Instagram上只用点三下。一些用户熟知的平台上有特定的交互方式,使用它 们往往会效果拔群。
发布到Meerkat上只用点一下,发布到Instagram上只用点三下
愉悦感
用 户评价应用的首要标准是体验。想要获得死忠用户,你必须得提供一些意料之外的愉悦感。随着时间的推移,这些愉悦的体验就会给用户留下深刻印象,从而让应用 成为他们日常生活必要的一部分。像Pinterest和Parable里点击分享时候出现的动画,还有刷新SnapChat时候的动画,都是很好的例子。
Pinterest的分享动画,SnapChat的刷新动画,Parable的分享动画
精炼
卓 越的视觉设计都是细节为王,每一个像素都要完美无缺。首先是排版。字体是应用的脸面,一个好的字体可以让你的应用脱颖而出。你可以从50多个iOS字体中 精心挑选一个来;当然,如果你能购买并制作属于自己的字体那就更好了——总之,千万别吊死在默认字体这棵树上。Serif字体适合长文章;san- serif字体可以使用更多字体大小而不让页面看起来拥挤。紧凑型字体可以让屏幕上显示更多文字,但它跟普通字体放一起就会很奇怪。接下来,我们来谈谈图 标的问题。能准确传达情绪的图标才是最好的。你可以利用一些免费的图标资源,然后在Photoshop里面稍加修改,把它们变成自己的图标。当创建纯色图 标时,坚持使用单一色彩可以避免让用户感到拥挤和混乱。最后,让我们把重点放在视觉资源上。Post-skeuomorphic时代让资源开发变简单了。 我们应当尽量在代码中进行渲染,以尽可能地缩小应用包。添加资源时需要确保它们能正确匹配屏幕大小;粗制劣造的一大表现就是资源的像素化。
Path和Flipboard是每个像素都趋近完美的典范。不过要注意,如果一个段落混合了粗体紧凑型的san-serif字体与serif字体,它会在Flipboard上表现得不平衡。
Path和Flipboard
简化(体验站:http://demo.jinhusns.com/?type=xcj)
开 发者总喜欢添加一些复杂的导航界面或者用无关的信息,结果把界面搞得一团糟。这简直让用户崩溃。让一切保持简单!屏幕布局应当保持整洁,信息应该分层排 列,重要的在上面,不重要的在下面。只显示相关度高的细节,用统计工具分析有哪些动作是没用的,然后把它们删掉。可以借鉴苹果的理念:无赘物即为完美。分 析下面这个简洁的Pinterest个人主页。它把用户和分块展示区放在一起,最重要的关注和点赞按钮被小心地放在了合适的位置。要做最佳应用则需更深刻 地贯彻这一原则,让内容动态化,例如在滚动浏览时导航栏要随着动画隐藏,再如在多步骤的交互中要隐藏按钮。
Pinterest的个人主页界面
转载自:近乎
国外干货!6个方法助你设计出优秀的APP的更多相关文章
- 如何设计出优秀的Restful API?
https://mp.weixin.qq.com/s?__biz=MzU0OTE4MzYzMw==&mid=2247485240&idx=1&sn=b5b9c8c41659d2 ...
- 9个步骤:教你设计出优秀的MMORPG副本关卡
转自:http://www.gameres.com/664485.html 副本的定义 以一张场景地图为原型,针对单个玩家.队伍或者团队生成的一个实例,包含完整的开启关闭.怪物刷新.进度记录等逻辑. ...
- ASP.NET Web API实践系列11,如何设计出优秀的API
本篇摘自:InfoQ的微信公众号 在设计API的时候考虑的问题包括:API所使用的传输协议.支持的消息格式.接口的控制.名称.关联.次序,等等.我们很难始终作出正确的决策,很可能是在多次犯错之后,并从 ...
- 浅谈 underscore 内部方法 group 的设计原理
前言 真是天一热什么事都不想干,这个月只产出了一篇文章,赶紧写一篇压压惊! 前文(https://github.com/hanzichi/underscore-analysis/issues/15)说 ...
- 国外一些好用的UX/UI设计工具和资源分享
国外一些好用的UX/UI设计工具和资源分享 你今天使用的设计工具也许不再适合以后的网页和APP设计项目了.新的工具不断的推出市场,目标只有一个,让你的工作更快.更容易而且工作成效更好.今天分享的这些U ...
- 前端资讯周报 2.27 - 3.5: 如何设计一个优秀的HTML接口,深入理解line-height
从本周起,每周一我都会分享上一周我订阅的技术站点中,和解决问题的过程中阅读到的值得分享的文章,或者视频教程,又或者图书. 个人认为国外的技术文章质量较高,而且发布的技术资讯也走在行业前沿,所以比较关注 ...
- 如何设计出优美的Web API?
概述 WEB API的应用场景非常丰富,例如:将已有系统的功能或数据开放给合作伙伴或生态圈:对外发布可嵌入到其他网页的微件:构建前后端分离的WEB应用:开发跨不同终端的移动应用:集成公司内部不同系统等 ...
- 如何设计一个优秀的API(转载)
最近在整理框架的一些 API,觉得很有必要总结一下 API 兼容性的设计.下图是我自己当下的一些总结,慢慢维护: 网上搜索了一下,一个多月前,“标点符”已经发布了下面这篇文章,觉得写得非常不错,转载于 ...
- 12个学习 CSS3 网站布局设计的优秀案例
网络上有很多的 CSS 画廊站点供大家对各类网站作品进行打分和评论,每天有数以百计的优秀网站被推荐上面,这对于网页设计师来说是很好的灵感来源.今天,我们选择了15赢得 CSS 设计大奖的优秀作品,帮助 ...
随机推荐
- 用队列模拟jquery的动画算法
Aaron最近疯狂的爱上了算法研究,估计又要死伤不少脑细胞了,我喜欢捡现成的,可以省些力气.发现他写的一段源码,运行一下,还蛮好玩的,于是拿来分析一下,一来吸收下里边的营养,二来加深一下源码学习的功力 ...
- 【记录】JS 获取图片原始尺寸-防止图片溢出
示例代码: <div id="div_content"> <img src="http://static.cnblogs.com/images/logo ...
- 基于android studio编译工具下的android开发之IBeacon 例子
想直接看主要内容的请调到红字下面. 之所以会接触到android下的IBeacon,是因为我自己导师给的任务.一个网址http://estimote.com/和一句话:看看这个网站,然后试下在安卓手机 ...
- canvas 图片拖拽旋转之二——canvas状态保存(save和restore)
引言 在上一篇日志“canvas 图片拖拽旋转之一”中,对坐标转换有了比较深入的了解,但是仅仅利用坐标转换实现的拖拽旋转,会改变canvas坐标系的状态,从而影响画布上其他元素的绘制.因此,这个时候需 ...
- 不在 sudoers 文件中。此事将被报告。
使用Linux,初学使用root不要太方便,工作中却不会给你这样的,必须要用自己的账号.新账号需要添加sudo的权限. su 使用root登陆 visudo 在root下添加自己的用户名 root A ...
- 编写高质量代码:改善Java程序的151个建议(第2章:基本类型___建议26~30)
建议26:提防包装类型的null值 我们知道Java引入包装类型(Wrapper Types)是为了解决基本类型的实例化问题,以便让一个基本类型也能参与到面向对象的编程世界中.而在Java5中泛型更是 ...
- 将Json数据转换为ADO.NET DataSet对象
Json数据转换为ADO.NET DataSet其实方法有很多,Newtonsoft.Json也提供了DataSet的Converter用以转换Json数据.但是有些情况下DataSet Conver ...
- 创建ASP.NET Core MVC应用程序(2)-利用MySQL Connector NET连接到MySQL
创建ASP.NET Core MVC应用程序(2)-利用MySQL Connector NET连接到MySQL 用惯.NET的研发人员都习惯性地使用SQLServer作为数据库.然而.NET Core ...
- C#播放wav文件
C#使用HWQPlayer类播放wav文件 类的代码: using System.IO; using System.Runtime.InteropServices; namespace HoverTr ...
- C#测试题若干,都是基础阿
类的以下特性中,可以用于方便地重用已有的代码和数据的是( ). A.多态B.封装C.继承D.抽象 答案:http://hovertree.com/tiku/bjaf/a3k6pgq5.htm 可用 ...