建立一个直观的应用程序的15个移动应用程序设计技巧

正在考虑应用程序开发的想法?在进入移动应用程序设计的实际过程之前,你需要知道这些,以确保你的应用程序不会在人群中迷失。

据最新统计数据,Android用户可以从超过210万个应用程式Play商店的选项来选择,而苹果的App Store提供近2万个应用程式给它的用户。

每天都有超过2000个应用程序被添加到应用程序商店中,尽管这些巨大的数据说明了即将推出的应用程序面临的激烈竞争,但平均每个应用程序的留存率都很低。

陈春,硅谷的企业家和作家相信普通的应用程序失去77%其每日移动用户(DAU)在推出的前三天。这一现象有多种原因。

来源:人均笔译和口译

这是移动应用程序设计来自中起到至关重要的作用。大多数这些问题都可以与您的应用程序正确的设计技术来解决。当然,这将是难以实现的,如果你想使用的应用生成像Buildfire。

有了这么多的移动应用被释放,每天一应用程序设计机构需要真正的设计脱颖而出应用。

一个伟大的概念可以吸引用户下载应用程序,但一个伟大的设计可以保留现有的用户。

这里有15名杀手级应用设计技巧的应用程序设计者应该实现的今天,以获得更多的下载和留住用户:

1.从基础开始

一个优秀的移动应用程序设计的第一步是制定移动应用程序原型相位而且对最终的界面应该是什么样一个清晰的愿景。绘制,甚至写你的原型,但不要错过这个重要的一步。

具有完全深思熟虑的用户流量线框准备去之前和设计开始就是一个明显的事情。但还是大多数应用程序开发人员往往会忽略这重要的一步。

Basecamp的设计师乔纳斯·唐尼(Jonas Downey)写道博客如何你可以写了许多变化,以嘲弄的文字基本的UI。

乔纳斯说,“来衡量一个设计师的成熟一个快速的方法是看他们在项目的开始阶段做什么。没有经验的设计师的应用程序通常是由新的工具,见效快的诱惑力击打,所以他们会在跳转到Photoshop或素描,并开始与布局和风格的探索搞乱。经验丰富的设计师知道这可能会分散注意力,因此他们可能会被做研究或绘制在纸上写生而不是开始。”

在设计原型尝试总结您的移动应用成一个功能,并使其主要功能(给它最重要的地方)。即使是最简单的应用程序应该有一个适当的深思熟虑的流量图,以帮助确保逻辑和合理的导航结构。

Jerry Cao是线框图和原型应用UXPin的用户体验内容策略师,,“你的原型不必是任何花哨的东西——你的原型可以在纸上完成,这样你就可以开始理解用户是如何在内容和动作之间流动的。”

应用程序的原型样品

来源:Next Web

应用程序设计人员还可以使用许多原型工具来简化原型设计,减少繁琐,并轻松地与客户端、开发人员和设计人员共享已完成或未完成的工作。它们包括以下内容,

  • 草图
  • 的Adobe体验设计(XD)
  • 奇迹
  • Proto.io
  • OmniGraffle

2.最佳使用的设计工具和软件

一旦你完成了应用的构思和原型设计,接下来就是实际的移动设计过程。

创建一个有价值的移动应用程序需要一流的技能、创造力,当然还有合适的工具。在构建移动应用程序设计时,你可以使用这些工具来获得想要的结果。这里有许多原型工具,下面列出了一些。

折纸工作室是一个独立的界面设计工具,由Facebook工程师开发,被Facebook用来设计Facebook应用程序,如Facebook Messenger和Instagram,现在你可以免费使用。这是一个功能强大的复杂工具。你可以将它连接到你的iOS或Android设备上来预览它,并在你使用它时看到实时的变化。

Balsamiq帮助您设计线框图和线框图单独毫不费力。你可以决定做线框草图或者做清晰的线框设计。最美妙的是,它速度很快,而且有很多UI元素来匹配你精心设计的设计。

FramerJS是一个灵活的和互动的移动应用程序设计工具,可以让你的代码或使用他们的可视化编辑工具,可以自动生成在后端,而如果你想用代码来插手,你可以重新使用相应的代码。

Zeplin对于设计师和开发人员的协作工具。它远远超出了设计和工作流程,让手机设计师创造的杰作。它可以让你从Photoshop和素描上传您的线框和视觉设计,并将它们添加到您的Zeplin项目文件夹。

3.保持简单

一些最好的界面设计的是看不见的。它们不包含UI-bling的或不必要的元素。

Jared M. Spool是可用性、软件、设计和研究领域的专家,他写了一篇有趣的文章岗位伟大的设计应该是有经验的,而不是亲眼所见的。

贾里德提到,“设计越好,它就变得越隐形。”

“这就像会议室里的空调。从来没有人打断我们的会议,告诉我们这里的温度有多舒适。他们甚至没有注意到。我们只在太冷或太热的时候才会注意会议室的温度。或者我们会注意到房间的声音是不是太大了,或者地板是不是漏水了。但当它完美地工作时,它就会变得无形。”

所以,当你想添加新的功能或元素的界面,问的问题,“这位用户是否真的需要这个?”

当罗宾汉获胜者之一是2015苹果设计大奖全球开发者大会(WWDC)。

该应用程序袋装此奖项干净,内容为中心的移动设计,美观的字体了很好的平衡应用的品牌和iOS的设计惯例。

应用程序设计技巧

4.根据操作系统进行定制

每个操作系统都有不同的用户界面,因此有不同的设计指南来解释它们独特的美学。

比如,安卓手机有一个后退按钮,可以在应用程序中使用这个按钮返回上一屏幕。而iphone没有这个按钮,所以需要有一种返回上一屏幕的方式。

类似地,在Android上,文本在导航栏中是左对齐的,而在iOS中是居中的。如果你已经或计划构建一个跨平台的应用程序,仔细阅读每个平台的指导原则是很重要的。当你不确定如何进行时,这些指导原则经常会派上用场。

以下是针对不同平台的手机app设计指南的链接:

iOS版

安卓

窗户

5.把自己在用户的鞋和获取设计灵感

对于任何应用程序来说,优化用户体验的最好方法就是专注于以用户为中心的设计。当我们花足够的时间观察用户时,我们总是能得到让他们高兴的好主意。

卡勒姆·查普曼,用户体验和界面设计师,设计师建议通过将自己在用户的鞋计划项目。他分享他在一家越野地图和GPS初创公司工作的经验,让他觉得自己站在用户的立场上是非常重要的。他问了自己三个重要的问题:

  • 他们会用这个应用做什么?
  • 他们将在哪里使用这个应用程序?
  • 多少时间,他们使用的应用程序?

他很好地总结了如何把信号从用户的反应,把他们在程序设计中,“很明显,用户要使用的应用程序导航公路和越野的踪迹,他们会使用应用在汽车和步行,有时在阳光直射下这将是(因此一个黑暗的UI可能不是合适的)。

该应用程序将用于时间长好,但在某些情况下,用户将只有有限的时间与程序(在红灯为例)交互,从而围绕导航应用必须简单,非常快。”

另一个根据用户需求定制的好例子是谷歌的Play Book应用程序,它包括一个叫做Night Light的新功能。它逐渐将手机屏幕发出的明亮蓝光换成温暖的黄色调。这款应用还将屏幕的颜色和亮度与一天的时间相匹配,以进一步减少视觉疲劳。

来源:下一个网页

6.在选择字体时考虑用户体验

到排版的任何风格的关键,任何设备上,是可读性。如果用户无法读取它,设计不起作用。

太大的文字会造成很多停顿,太小的文字会让读者感到紧张,难以集中精力阅读。

如何选择字体

的人用户测试,跑了两个移动网站有类似的布局上面的那些研究:一个具有最佳类型的大小和一个没有。不足为奇的是,用户首选使用较大的文本的站点。

嘉莉表兄弟,在设计Shack的主笔,”,在移动设计中选择文本块的字体时——考虑除了徽标或排版艺术元素以外的任何东西——选择一些简单的、标准的重量和相当一致的笔画宽度的东西。避免新颖的字体、简洁的字体和细笔画的字体。”

手机app设计

7,根据品牌的需求定制颜色

在手机应用程序设计领域,颜色的选择往往是一个至关重要的起点。当决定在你的设计中加入什么颜色时,有很多东西需要评估,因为每种颜色都代表着不同的心理。

这里有一个图表来解释色彩情感指南:

如何选择一个应用一个颜色?

来源:赫芬顿邮报

根据2016年的流行趋势,柔和的色彩对比将主宰应用程序的设计。颜色对使用者的眼睛是容易的,促进更好的阅读体验。

适度的对比是一种微妙的平衡。由于屏幕之间的巨大差异,在应用程序设计者的显示器上看起来足够暗的灰色,在用户的显示器上可能会显得更亮。

在HubSpot做数据可视化的Bethany Cartwright写了一篇有趣的文章岗位色彩理论。她让读者看下面例子中的圆圈对:

如何选择正确的颜色为您的设计

来源:HubSpot

每个圆圈的中间是相同的大小,形状和颜色。唯一的变化就是背景色。然而,中间的圆圈出现柔和或明亮取决于它背后的对比色。

Bethany说:“这是因为我们同时使用两种颜色的方式改变了我们对它的感知。所以,当你在为你的图形设计选择颜色时,要考虑整个设计中你想要多少对比。例如,如果您正在创建一个简单的条形图,您是否希望使用带有深色条的深色背景?可能不会。你很可能想在酒吧和背景之间创造一种反差,因为你想让观众关注酒吧,而不是背景。”

8.使用负空间(空白)正

空白,多次称为负的空间,是在屏幕的左部未标记,即左空白,或在一个屏幕中的空的空间的部分。当务之急是在创建应用程序接口应用设计。利用这个经常被忽略的设计元素。

“White space is to be regarded as an active element, not a passive background,” — Jan Tschichold

这里是空白的元素:

  • 围绕图形和图像空间
  • 边距、划桨和水槽
  • 文本内容中的行间距和字母间距
  • 列之间的空间

Echo & Co.的Ryan Co说:“和造型内容一样重要的是其内部和周围的空间。空间通常有助于可视化页面上元素的连通性和非连通性。但除了网格,没有很多工具可以让我们自动计算出比例。”

约翰·卡什从伦敦(英国),具有5年以上经验的设计师,建议另一种方式来使用这个空间:

屏幕标题是避免用户或冲浪者迷失方向的好方法,但如果您作为一名应用程序设计师认为这个空间可以用于其他有意义的目的,那么请继续使用!如果你有创造力和想法把这个空间变成一个有效的搜索工具,那么就不择手段。但是,不要仅仅为了节省一些额外的设计工作而牺牲标题的功能。”

Canopy应用程序是一个使用白色背景和大量空白空间的很好的例子。

应用设计趋势与指引

来源:Creativeworkline

9.设计周围的一切无形的网格,并确保一致性

隐形网格定义你的设计的基础。尽管我们可能无法赶上电网的现实的看法,但这些网格每一个移动的接口上存在。他们可以在踢真正有用的启动移动设计。

SWARM的Valerie Lisyansky,,“网格是移动应用程序设计的基础。每个表面都有一个无形的网格。你可能看不到它,但它就在那里指引着你。”

创建移动应用程序的杀手级设计技巧

来源:Creativebloq

定义元素并重复。例如,如果你的一个“go”按钮是紫色的,那么你所有的“go”按钮应该是紫色的。如果一个屏幕的每一面都有20像素的填充,那么所有的屏幕都应该保持这种一致性。

“越多的用户的期望证明是正确的,他们越会觉得系统的控制和他们就越喜欢它。”- 雅各布·尼尔森,可用性顾问。

根据树的博客文章“用户需要一致性。他们需要知道,一旦他们学会了做某件事,他们就能够再做一次。语言、布局和设计只是需要一致性的几个界面元素。一致的界面使您的用户能够更好地了解事情是如何工作的,从而提高他们的效率。”

10.使用占位符和加载元素

在设计,移动应用程序设计者不必模拟不同的加载速度的手段。即使他/她可能,机会是应用程序设计者仍然会最终设计出非常快速地应该负载接口。

我们并不总是设计用户必须等待内容显示的不舒服时刻。

哈维尔Cuello所说的那样,“墨菲定律不能作为UX设计更真实。上网速度并不总是保证。这是尤其如此,例如,当图像被下载。在这样的情况下,我们必须决定什么展现给用户分散注意力。这是占位符和加载元件进入画面,并作为临时信息的容器。”

这种做法的一个很好的例子是Facebook,它在显示其上的实际信息之前呈现一个临时布局。

来源:用户体验销

11.专注于在应用程序中流畅的导航

导航是应用程序最重要的功能之一,它不是一个可以尝试非常规方法的地方。并不是所有的设计元素都是由设计师设计的。设计师需要与设计师密切合作移动应用开发公司yabo.com下载以及它的开发团队,以确保从一个屏幕到另一个屏幕的导航更加顺畅。简单的应用导航深受大多数移动用户的喜爱。为行动提供清晰和简洁的标签,并保持你的信息简单。

这是一个伟大的提示在创建导航栏时,可以从Apple和谷歌中获取如何做导航的例子。浏览一个应用程序可能会很有美感,但不会以牺牲功能和直觉为代价。”

雅各布·卡斯是一位平面设计师,“做得好,让你的访问者和消费者更容易找到他们想要的内容、信息或服务。”简单的导航将带来顺畅、不间断、轻松和友好的最终用户体验。

Ryan补充道:“另一件需要注意的事情是确保关键功能的屏幕靠近顶部,而不是隐藏在多层次的导航元素之下。

12.设计人的手指

麻省理工学院的触摸实验室研究研究人员发现,大多数成年人食指的平均宽度为1.6 - 2厘米(16 - 20毫米)。这可以转换为45 - 57像素,比大多数移动指南所建议的要宽。

成年人拇指的平均宽度是1英寸(2.5厘米),可以转换成72像素。

小的触摸目标会导致触摸错误。

如何设计一个应用程序

Anthony T, UX运动的创始人,“当你在设计手机界面时,最好把目标设定得大一些,这样用户就能轻松点击它们。”

13.不要排除“经验法则”

一个研究研究发现,约75%的人与智能手机的互动都是通过拇指进行的。无论是用一只手还是两只手拿着设备,都是拇指在做所有的工作。

来源:

智能手机的67%的范围为4和5.5英寸的他们在纵向使用时间的94%之间。当在横向模式下,72间%的相互作用只依靠一只拇指。

谷歌的产品总监卢克博客“当设计今天的移动,这是值得考虑4-5.5英寸的智能手机,在纵向(垂直)方向,与一个拇指使用。当然,也有许多变种很好,但确保您的移动体验,在这种情况下很好地工作是一个伟大的基线,从开始“。

来源:用户体验集体

在另一个岗位他解释道,《一个拇指能做多少事》的作者是卢克:

  1. 向上滑动,向下移动列表
  2. 按问题的两边投票
  3. 向上滑动来加载更多
  4. 向下滑动微微的露出主菜单
  5. 向下滑动more来刷新列表
  6. 整个滑动跳过问题。

考虑到趋势未来的设备将可能比目前这一代更大,所以在设计你的应用程序考虑使用拇指的手势,以改善用户体验。

最近iPhone X最大的其中有一个令人难以置信的6.5” 屏幕的版本是这样的趋势,未来移动设备很可能会遵循这个漂移以及的确认。因此,移动应用设计以并入使用拇指的优化成为需要由应用程序设计者必须牢记的一个重要因素。

14.考虑惯用左手的人,以及

左撇子占世界人口的12%。

而在应用程序中设计按钮位置,记住,当用户持握在他们手中智能手机,屏幕的下半部分由拇指很容易达到。右手的用户可以访问手机的最简单的底部,右侧和左撇子相反。


来源:碎杂志

从这个读者的建议博客指出一个解决方案,“由于用户正在右手或左手影响按钮位置,你觉得可以让用户通过某种设定的配置,因其便捷的用户界面是什么?像开关指定他们是否是右手或左手“。

15.有效利用动画作为交互设计的基础

使用动画影片突出的应用程序中的特定功能或产品已经成为一种趋势。作为用户,我们也自然地编程,以利用一个移动的物体更另行通知。

特里斯坦板材,在眨眼交互设计师,写了一博客,在那里他分享他如何付出了很多更加关注小事情,他最喜欢的应用程序在做什么,“在大多数情况下,这些小的令人愉快的细节围绕在整个应用程序穿插的动画和完善微互动,就像一个聪明的过渡从一个屏幕到下一个或一个异想天开的动画刷新,这让我窃喜(甚至更好,让我想再做一次,但只是慢一点,所以我可以看到他们是如何拼凑动画在一起)。

特里斯坦进一步提出了一个应用程序用户的观点,使用精心设计的应用程序,采用周到过渡和动画后,当我使用的是没有付出努力的其他应用程序我感到失望。当我用出汗的细节产品酒吧升起“。

动画可以与用户进行互动更好,但你应该确保过渡是无缝的。此外,克制一定程度,必须行使,以确保您不会过分与动画。

fuel的Ryan Matzner,”,当一个应用程序第一次打开时,那些有趣的小动画会非常漂亮,但重要的是不要太过火。引入动画的问题是,从技术上讲,它们只能在应用程序已经加载之后才能开始。因此,它们实际上会延迟用户访问应用程序。如果你打算使用一个,让它快速、微妙和吸引人,以值得多花一秒钟,让用户不得不等待。

作为一个应用程序加载,静止图像应该显示,然后过渡到的动画。一些贫困的实现有一个跳跃或干扰;从静止图像加载到介绍动画应用过渡,这是不好玩。”

空白
    Vinati Kamani

    Vinati Kamani博士撰写了关于新兴技术及其跨行业应用的文章Arkenea。她是一个狂热的读者,并自称是一个爱读书的人。当维纳蒂不在她的办公桌上写文章或阅读最近的趋势,她可以发现她旅行到遥远的地方,吸收不同的文化体验。