佛山网页设计:移动UI设计初学者的5条简易规则

2019.08.15 mf_web

103

多年来,智能手机的使用一直在稳步增长,目前世界上超过三分之一的人口使用智能手机。移动应用程序的创建也可以理解,但是为了设计一个好的移动应用程序,我们需要考虑几个不适用于桌面环境的规则。佛山网页设计

移动ui

1.尺寸就是一切

听起来很明显,但智能手机屏幕的大小是创建移动应用程序时的主要UI约束。尺寸会影响视觉设计,人体工程学甚至用户旅程。 

随着屏幕尺寸的增加,智能手机用户主要使用手指而不是鼠标光标进行交互这一事实对界面设计产生了巨大影响。设计师需要识别“舒适区域”以及放置“行动呼吁”时要避免的区域。将拇指区是由拇指智能手机屏幕上包揽了广泛定义的区域。这是用一只手触摸时最舒适的区域。

拇指区
资料来源:usabilla.com

在Envato Elements上获得移动UI和UX套件的开端

如果有帮助,Envato Elements目前拥有专门针对移动布局的2.5K UI / UX套件。看看,订阅下载您需要的所有资产!

移动UI和UX套件
元素上的移动UI和UX工具包

2.空白也是一切

屏幕的大小会影响 显示的组件的大小,以及它们周围的空白。

以公共按钮为例。按钮必须足够大才能轻松查看和点击。移动行业的所有主要参与者(Apple,Android,甚至是谷歌的Search Console团队)都提供了准确的指标。空白也很重要。通过并排放置两个按钮,两者之间的空间不足,用户可能会点击错误的按钮,从而对用户体验产生负面影响。

按钮哪个更好
这两个中哪一个是更好的用户界面?

3.请参阅接口指南

关于屏幕上不同元素的布局,明智的做法是支持垂直和简单的布局,同时遵守iOS和Android制定的指南(我们已经提到过)。这些指南说明了每个操作系统要做什么和不做什么。它们由图形样式(目前是iOS的平面设计和Android的材料设计)和常见的组件(按钮,导航,排版,卡片,标签)组成。 

来自iOS和Android的通用界面
分别在iOS和Android上的Instagram界面

以下是您需要的指南; 给他们加书签

  • 用户界面指南 Android

  • 人机界面指南 iOS

4.使用一个行动方案

为了优化用户体验,目标是使每个屏幕仅包含一条核心信息和一个动作。将上游视为信息层次和用户旅程。在启动应用程序的设计层之前,必须花时间分析用户的需求及其在应用程序中的路径。

UI

5.考虑使用智能手机的位置

最后,不要忘记考虑使用您的应用程序的环境。智能手机在任何地方都被使用:内部和外部,公共交通,步行,跑步......如果我们以亮度变化(室内与室外)为例,对比度变得更加重要。确保您的设计在阳光下可以正确阅读!请参考对比检查工具,例如:

  • contrast-ratio.com

  • contrastchecker  (来自webaim.org)

  • contrastchecker.com

结论

对你而言,要有创意!

佛山网页设计

最新案例

联系电话 400-6065-301

留言