移动端界面设计常识规范

移动APP设计时，按钮做多大尺寸

按钮是一个普通的设计元素,不过我们基本每天或多或少接触他。除了这个,由于按钮是一个在网页或者app上创造流畅的会话流体验的必不可少的元素,所以它值得我们为按钮这样最基本的元素提供最佳的体验做出努力.为按钮做些最佳实践，让按钮看起来像按钮。

想想如何达到设计沟通的可供性吧.使用者是怎么理解一个按钮的呢?用形状和颜色是介面上的元素看起来像一个按钮.

Groupon 的登入页面关注于最主要的动作.

另外,丝路觉得手指点选的尺寸也是要在设计时仔细考虑的事情.按钮的大小在帮助使用者分辨这些元素的过程中起到了决定性的作用.不同的平台提供了热区的最小尺寸的不同设计规范.MIT Touch Lab的研究结果表明手指接触面积平均为10-14mm之间,指尖平均为8-10mm,所以. 最佳的热区尺寸应设定为10mmX10mm

位置和命令

按钮应放置在使用者能够直接找到或者他有预期能看到的地方.例如,iOS UI 设计规范给明了按钮的合理位置.

按钮要执行的命令和位置的关系.按钮要执行的命令非常重要,特别是在出现成对的选项时(就像”上一个”和”下一个”).确保设计强调了最主要或者最重要的动作.

移动app设计时，按钮做多大尺寸

小按钮比大按钮更难于操控。当设计移动介面时，最好把可点选目标的尺寸做大一点，这样更利于使用者点选。但这个“大”究竟需要多“大”，才能方便大多数使用者呢？丝路教育我相信很多移动开发者也非常想知道这个问题的答案，最后都在各平台的UI设计规范中找到了答案。

移动平台设计指导规范告诉了我们什么？

在苹果的《iPhone人机介面设计规范》中指出，最小的点选目标尺寸是44 x 44画素。微软的《Windows手机使用者介面设计和互动指南》中建议使用34 x 34画素的尺寸，最小也要26 x 26 画素。诺基亚开发指南中建议，目标尺寸应该不小于1cm x 1cm或者28 x 28 画素。

尽管这些指导规范给我们列举了各平台下可点选目标的尺寸标准，但是彼此的标准并不一致，更无法和人类手指的实际尺寸相一致，他们的建议尺寸比手指的平均尺寸要小，这会影响触控式萤幕下对于点选目标的精准度。

小的点选目标会导致大问题

可点选目标尺寸太小，对于使用者体验来说就非常糟糕，因为如果要更精确的触控。使用者需要调整手指的操作方式，从指心操作，变为指尖操作，这样才能操作尺寸较小的目标。使用指心操作通常会整个覆盖操作物件，让使用者无法分辨他们所要操作的目标，也无法收到操作过程中的视觉反馈，也就无法知晓，他们的操作是否有效。当用户不得不用指尖进行操作时，又出现了一个新问题，这种操作方式非常的慢，而且很吃力，体验很差。

问题不仅这些，目标的尺寸过小还会导致失误的触控操作。因为尺寸小，所以容易拥挤在一起，使用者容易触碰到附近的目标，导致执行结果非使用者所愿。手指太大，目标尺寸太小，一根手指的宽度大概能覆盖两个目标的宽度。如果不按压到错误的位置，就会导致错误的操作。食指容易出错，但是拇指更容易出错。因为拇指更大、更笨拙。有时候使用者会倾斜拇指，使用拇指的侧边进行操作，但是目标尺寸过小，依然失误频繁。

在移动使用者的日常操作中，拇指的使用非常频繁。有时使用者无法腾开两只手操作，只能用一只手握住手机，用拇指和食指操作。在这种场景下，使用者的操作精度有限，就需要提高目标尺寸来避免操作错误，这就是所谓的友好的触控体验。

食指操作下的平均画素宽度

MIT触控实验室的做了一项研究，以手指指尖作为调查，分析其感觉机能。研究发现，成年人的食指宽度一般是1.6——2 cm。转换成画素就是45——57 px，这比那些指导书上建议的宽度都要宽。

45——57 px的目标尺寸非常够用，使用者可以将整个手指紧贴在目标上。在操作的过程中，使用者也能看到目标的边缘。这样使用者与控制物件之间的反馈与资讯传达变的非常清晰，使用者也能知晓他们的操作是否有效。因为尺寸大，定位更快，拖移也更方便。费茨法则中提到过，目标越小，操作耗时就越长。小目标减慢了使用者的操作速度，因为需要使用者集中精力去精准定位。手指大小的目标则不一样，这种目标给予使用者足够的空间操作，容错率也很高。

拇指操作情况下的画素宽度

也有很多使用者用拇指敲击萤幕上的目标。拇指比食指要宽，平均宽度大概在2.5cm，转换成画素是72 px。

72画素的实际使用效果很棒，更容易定位、操作的舒适感更好。同样可以看到操作目标的边缘。这意味着使用者不用费力的调整手指，使用指尖去操作了。也不用倾斜拇指，用拇指侧面点选目标。

在《小型触控装置上单手操作研究：关于拇指操作的目标尺寸》这篇文章中发现，目标尺寸的增加会降低失误操作的次数。更多的空间提供了更高的容错率和更精确的操作，同时因为大型的尺寸，目标的表现力也变强。

另外一篇《移动端触控设计：关于目标选择的关键》中也表达了同样的看法。

手指大小的目标尺寸很理想，但也有特殊情况

将目标尺寸的大小，设定为跟手指大小相近，其中的好处不再赘述。但并不是适合所有的设计场景。在移动装置上，空间有限。这就意味着，如果每个目标的大小都很大，那么萤幕空间根本不够，就需要不断的翻页，这在体验上很糟糕。你需要测量萤幕尺寸，然后计算比例，搞清楚“在这种尺寸的萤幕上，合适的、最大的目标尺寸是多少？”倘若你按照手指大小进行尺寸调整，整个介面的比例很糟糕；再次按照比例调整后，最大的目标尺寸效果也不假，那么就只能使用指导规范上的建议尺寸了。

对于平板装置来说，情况就没有手机那么复杂，因为平板的空间更多。不用害怕没有空间去放置点选目标，空间足够，你可以非常悠然的通过提高尺寸来提高操作适用性。手机是最麻烦的，点选目标的尺寸非常不好拿捏。但正是因为手机的空间有限，容易操作失误，所以才需要设定真实手指大小的目标尺寸。设计师的挑战就在于，要想办法，让萤幕上大多数的目标，尺寸都跟手指大小一致。但也有好处，这迫使设计师设计时更注重功能性、风格更加极简。

为游戏应用设计拇指大小的点选物件

我们无法推测的问题是，使用者使用你的应用时，是用食指操作更多？还是用拇指更多？因此，针对这一点，我们要非常细致的做调研，然后设定合理的目标尺寸。 然而，如果你的应用是一款游戏的话，大多数使用者会使用拇指。这就是为什么很多游戏应用中，一些控制元件的尺寸一般有拇指那么大，这样使用者就能更稳固的双手持握，更精准的操作。

结论

通过调整目标尺寸的大小，结合实际的应用情况，能够有效的提高移动端的适用性，同时提高使用者体验。不管你的应用是游戏还是别的什么。触控式萤幕上的目标就是用来让使用者点选的。如果使用者需要去想“我该怎样去点选，才能完成精确的操作”，需要再互动前思考方法，需要调整操作方法，使用多种方法才能完成互动。这说明这款产品的互动设计是糟糕的。在这篇文章里，我丢掷了个人的一些观点，在触控即将成为操作方式的一统时代，如何打造友好的触控体验？这是我们将要面临的问题。期待更多的想法，以及更规范的标准。

感谢阅读！

看完这篇丝路提醒你只要记住2点， 食指点选目标尺寸是44 x 44画素，拇指是72 x72画素。所以在画介面的时候，要注意这2个尺寸 。

小技巧：在汇出ICON的时候，假如你的ICON实际尺寸是32×32，那么你可以汇出50x50PNG透明背景的ICON，重点是加了透明区域。这样就更方便点选了。

打印出来多大尺寸ps设计就做多大尺寸么

按理说是对的。。如果你要列印A4大小的，就尺寸是A4也就是 297X210mm解析度300

如果你要做喷画类的，比如3米X6米，那你档案大小也要3米X6米，解析度可以低些30就可以了。

移动app设计多少钱？

app设计现在做的很多。

建议你去特微特网站看下，里面有很多参考。移动端的app重要的是互动体验。

用photoshop做名片设计多大尺寸

1、名片标准尺寸：90mmX54mm 90mmX50mm 90mmX45mm。但是加上出血上下左右各2mm，所以制作尺寸必须设定为：94 x 58mm 94mmX54mm 94mmX48mm。

2、如果您的成品尺寸超出一张名片的大小，请注明您要的正确尺寸，上下左右也是各2mm的出血。

3、色彩模式应为 CMYK 。影像档 350dpi 以上

4、稿件完成时不需画十字线及裁切线。

消防手动报警按钮配管应多大尺寸

消防手动报警按钮只需要一根管连线报警线即可，如果带电话插孔的，还需要有电话线路的管线，一般是16的管线即可满足要求的。

Android设计尺寸应该做多大

你好，android中分别有如下几个资料夹，是不同萤幕下图片尺寸问题

应用程式图示大小分别对应为

　m 48x48

　hdpi 72x72

　xh 96x96

　xxh 144x144

web 512x512

一般需要这5个尺寸的应用程式图示，如果是个人，做一个48x48就可以了

希望可以帮助到你

用PS设计名片，设计时应该新建多大尺寸的文件？

名片标准尺寸：90mmX54mm 90mmX50mm 90mmX45mm。但是加上出血上下左右各2mm，所以

制作尺寸必须设定为：94 x 58mm 94mmX54mm 94mmX48mm。

新建的时候单位选 mm ,画素300以上。新建后看起来比较大，没关系因为列印时是按你设定的大小来列印

当下app设计时，ios设计尺寸一般是基于以下哪个

设计是一个漫长和痛苦的过程，期间可以用点技巧来减少痛苦，30+ tips to improve your iOS design workflow (in Photoshop)一文总结30个实用的技巧可以借鉴和学习。 ————–以下为译文——————- 在本文中我(英文原作者)总结了在photoshop中设计ios软体时所遵守的方法。许多的技巧适用于一般的UI设计。注意：文中所提到的快捷键针对于WindowsMac 使用者可，Cmd对应Crtl键，Opt对应Alt键。 1.保持尺寸为偶数 你是首先针对Retina萤幕设计然后再对标准解析度的进行缩小是吧?为了在标准解析度下画素仍然保持完美的呈现，你需要保证大小和距离为偶数。具体的做法便是：基于2ps的网格设计。在编辑（Edit）〉首选项（Preference）〉参考线、网格和切片（Cuides,Grids&Slices） 。更改网格线间隔（Gridline）和子网格（Subdivisions） 来是使得网格间隔线为2px。例如：设定网格线间隔为64px，子网格为32。 2.混合模式只使用正常模式 在设定直接处于其他元素上面的图层效果时，混合模式只使用正常 (例如：在混合选项中投影和外发光 )。使用其他的混合模式或许在Photoshop中看起来很好，但是也可能会在在储存为PNG格式之后出现不良的效果。 3.更方便的改变渐变颜色 想要更改渐变按钮的色调(色相)，而不必每次都去改变渐变的起始颜色值?下面介绍两个方法，均可达到完全一样的效果。 方法1：在渐变图层混合选项中使用颜色叠加 建立一个渐变图层 。起始颜色设为浅灰和深灰色，也可以在之后调整。 为按钮建立向量蒙版 。 复制 向量蒙版贴上 到渐变图层(选择向量蒙版〉Ctrll+ C〉选择渐变图层〉Ctrl + V ) 设定图层〉向量蒙版〉当前路径 设定渐变图层混合选项〉颜色叠加 更改混合模式为颜色 。 现在便可以只是更改此处的颜色来更改渐变。 方法2：在纯色图层使用渐变叠加 用你想要的颜色，建立一个纯色的图层。 和方法1相同。 和方法1相同。 和方法1相同。 在纯色模版混合选项〉渐变叠加，设定混合模式为明度(Luminosity)。 现在只是改变纯色模版的颜色即可改变渐变。 译者注：上述使用了向量蒙版，其实使用剪下蒙版也可达到相应的效果，个人认为还简单点。 4.更多的使用径向渐变 在导航条上叠加径向渐变层，让导航栏变得更为有趣。 方法1：径向渐变工具 在导航条图层上方新建图层 。 复制导航条图层的向量蒙版到刚才新建的图层(按住Ctrl + Alt同时按滑鼠左键拖动 向量蒙版到新图层)。 选择径向渐变 工具(设定渐变为中心白色末端全透明)。 在图层中从中心到边缘绘制渐变。 改变图层混合模式为叠加（Overlay） 设定不透明度为25% 。 方法2：斜面和浮雕 同样也可以使用图层混合选项中的斜面和浮雕。可以按下图所示来设定。通过调整设定来达到你想要的效果。通常调整的越为精妙效果也越为好看。 5.更多的使用阴影变形 Photoshop中阴影(任何的其他图层效果)和它对应图层可以分开。这样便可独立操作阴影。 选择图层〉图层样式〉建立图层 (译者注：必须在对图层使用了混合选项中的效果才能使用此命令，此步目的即是将效果和图层分离)。 转换图层为智慧物件 (在混合选项中勾选透明形状图层。右击图层〉选择转换为智慧物件)，这样你就可以在之后编辑效果。 Ctrl + T 选择变形 。 点选和拖动 手柄来改变形状。手柄不会对其网格，但可以使用网格作为参考对其他的手柄进行重复同样的拖动。 往上轻移 图层直到像下图效果。 6.使用内发光更容易的增加精细的纹理 像下图所示通过内发光快速的增加纹理。

iphone6的尺寸是750x1334px的，安卓手机的话，因为品牌比较多，设计规范也没有具体的定义，只要符合审美美观就好，ios设计标准还是比较严格的，包括状态列40px和导航栏88px，标签栏98px等都是有严格要求的，其他的适配就好，ps有外挂可以直接适配。

设计xy移动平台的配置基本就是你说的那样，在选择方面可做以下参考。

1、螺旋传动一般有滚珠丝杠和滑动丝杠两种。如果精度和寿命没有太高要求，可以用滑动丝杠。如果要求很高精度及寿命就必须使用精密滚珠丝杠，当然价格会高不少。

2、精密导轨有滚珠导轨，交叉滚子导轨还有滑动导轨。滑动导轨价格便宜承载力大，但加工精度要求高寿命短，适合低速动作不频繁的场合。滚珠导轨价格便宜阻力小，但在3种导轨中承载力最低。由于有较大的测隙也会降低平台的精度。因此在使用滚珠导轨时要么采用双滑台要么使用双滑轨设计，以便减少测隙的影响。在3种导轨中综合性能最好精度最高的就是交叉滚子导轨（直线度，和跳动可达到μ级），当然它的价格是最贵的。

3、伺服电机。从你给出的要求看不需要太大动力，因此最好用步进电机。因为在小动力时步进电机性价比最高。如果要很大的驱动力和高速就要用直流或交流伺服电机，此时需要加旋转编码器。此外电机与丝杠的连接要加弹性联轴器，平台两个方向的0位和电机的0位要加位置传感器，以便平台归位。

上面这些因素可以根据使用要求和价格定位取舍。

如果平台的刚度足够，那么就可以当作均步荷载考虑。自然，每平方米的荷载就是1吨力除以面积喽。

如果是个移动平台，你所需要重点关心的恐怕还不是这个问题，而是承载这个移动平台的梁上的荷载将是动循环荷载，要查规范看吊车梁荷载规定。

界面的大小不一样

UI即User Interface（用户界面）的简称。泛指用户的操作界面，包含移动APP，网页，智能穿戴设备等。UI设计主要指界面的样式，美观程度。而使用上，对软件的人机交互、操作逻辑、界面美观的整体设计则是同样重要的另一个门道。好的UI不仅是让软件变得有个性有品味，还要让软件的操作变得舒适、简单、自由，充分体现软件的定位和特点。

随着科技进步和市场的变化，一个型号的产品生命周期越来越短，大批量生产方式逐渐变得不能适应竞争。在80年代，产生了一种称为逗汽车平台地的概念，逗汽车平台地是由汽车制造厂商设计的，几个车型共用的产品平台。汽车平台与车辆的基本结构相关，出自于同一平台的不同车辆具有相同的结构要素，例如车门立柱、翼子板、车顶轮廓等。同一平台的车型的轴距一般情况下是相同的，同时一些配件是通用的。有时候很多种不同品牌的车在一个平台，而同一品牌的不同年度车型反而不在一个平台（比如宝来与现在的新宝来就不在一个平台）。

在逗模块化地生产方式下，汽车技术创新的重心在零部件方面，零部件要超前发展，并参与汽车厂商的产品设计。例如德尔福系统公司相继推出了座舱、接口盘制动、车门、前端、集成空气/燃油等模块。而汽车厂商方面则以全球范围作为空间，进行汽车模块的选择和匹配设计，优化汽车设计方案，将汽车装配生产线上的部分装配劳动转移到装配生产线以外的地方去进行。采用逗模块化地生产方式有利于提高汽车零部件的品种、质量和自动化水平，提高汽车的装配质量，并缩短汽车的生产周期。几个自主品牌包括通用的凯越等其实走的就是这条路。

给你举个简单的例子，英菲尼迪QX60和途乐Y62是两款完全不同的品牌和车型，但是确实同一平台生产的，所以你会看到他们有相似之处，却又不尽相同，再说的通俗一点，有点像同母异父的亲兄弟的既视感

1、移动应用界面的设计趋势——所有平台(Android/IOS/HTML5/WEB)的标准设计语言几乎是一样的

有些本机控件仅在样式上不同，对用户没有显著影响。

材料设计不会蓬勃发展，也无法抗拒(IOS使用的是用材料设计的应用程序)。IOS的实际设计将对材料设计产生重大影响。

桌面常见的交互形式也会对移动终端产生较大的影响。IOS/Android将被优化以兼容桌面场景，以支持生产级设备，如iPad Pro。

(来源:谷歌+在Android中也有底部导航交互)

2、移动应用界面的设计趋势——设计规范和平台特性将受到越来越多的关注

大型供应商更务实，更符合平台的设计规范，只有在需求无法满足时才会重新设计。考虑到实施、适应、用户学习成本等因素，自创交互效果可能并不理想。

(IOS上的应用应该很适合iPhone 5/6/6+， iPad/iPad Pro 25%， 50%， 75%， 100%宽分辨率)

3、移动应用界面的设计趋势——使用动态效应更为常见，但在微观相互作用中更为常见

过于华丽的动画，往往容易引起厌恶，并会导致用户等待太久。

动画和微交互的逻辑形式将在2016年作为一种新的平台规范出现。(例如，以前很难检测动态效果，如下拉刷新、浮动标签等)

以上便是关于移动应用界面的设计趋势介绍了，要使应用程序成功，用户体验必须是产品战略的重要组成部分。如果您想了解更多关于ui设计的相关设计技巧及素材等，也可以点击本站其他文章进行学习。