图片加载中...

图片加载中... 十六年IT教育机构

图片加载中... 软件定制开发

首页>新闻动态>UI设计技术文章

移动应用UI设计梳理与思考

更新时间:2023-02-20

随着移动智能手机的普及,人们与屏幕之间的接触变得越来越频繁与亲密。而正是这一崭新的领域为UI设计的发展带来新的机遇,而这对于从事UI设计的设计师们将出现怎样的全新挑战?

目前随着数字技术与网络的飞速发展,身边的朋友都几乎人手拥有一到两台智能手机。他们每天睁开眼的第一件事,或许是点击屏幕刷新微信朋友圈的最新状态;上班在公交车上、地铁上必做的一件事,就是滑动手机屏幕。而在这些日渐熟悉并依赖的屏幕触碰行为当中,大家是否有想过微博的刷新按钮为什么会在右上角?微信的按住说话按钮为什么要设置在屏幕下面?是否有想过为什么iphone下面只有一个home键而三星手机有三个?而这些问题都是在我还没接触iDJ这个项目之前不曾主动去思考过的。

什么是移动应用UI设计

首先我们要知道什么是UI,UI即User Interface(用户界面)的简称。UI设计则是指对软件的人机交互、操作逻辑、界面美观的整体设计。在当下的数字娱乐生活中,到处都能找到UI设计的身影,如卡拉OK厅的点歌屏幕、地铁线路查询控制屏、商场电子导览屏、智能手机触控屏、平板电脑触控屏等等。而移动应用UI设计则是以移动设备如手机、平板电脑等电子媒介作为载体的设计。而一个好的移动应用UI设计不仅是让界面视觉元素变得有个性有品味,还要让界面的操作变得简单、方便、自由、舒适,需要充分体现移动产品的定位和特点。

UI 设计并不是指图标的绘制

其实说到UI设计,在刚开始执行项目之前也会把UI理解为画ICON(图标),真正的UI更多是与交互设计互相依存的,必须对人的行为有所熟悉和研究。考虑到该产品的核心特色,主要是要让用户能够轻松自如的表达个人情感。

界面设计中需要注意的小细节

常说“细节决定成败”,有些界面会让人觉得不精致,缺细节,而自己做的第一个应用界面设计初期也曾经被人这样批评过。界面设计的细节到底包括哪些呢?如何去深入呢?经过一段时间的磨练及反思,金源万博也总结了一下几个小点:

(1)对齐界面元素 很多朋友做对齐是靠半眯眼睛的。确实在布局的时候经常需要做到视觉上的对齐,而不是机械的对齐,但这并非界面元素可以随意摆放的借口,该对齐的内容还是需要对齐,其实只要显示参考线就完全可以把界面元素进行合理的对齐。

(2)精确每一个像素 虽然现在的分辨率越来越高,但是很多图标、按钮的边缘还是最好都检查一遍,保证垂直和水平边缘不会被虚化。

(3)细节方面的一致性应该包括界面元素、文字阴影、图标等的光源。假设深色的标题文字用了向下的淡色投影表现内凹效果,那正文就应该避免用深色的文字向上投深色的阴影。而按钮的设置亦然。

(4)保持图标面积的一致性 这也是一个难以避免的问题,而且有很多时候是主观感受作祟,最好的方法是设计的时候放到实际屏幕上以较远的距离查看,是不是有哪些会特别轻或特别重,然后再去调整尺寸。而且,还要特别注意在反复修改过程中可能出现的位置误差。

(5)文案 虽然这不是直接的界面设计元素,但是严谨、完整的文案也是给所有设计加分的。常见的问题有中文错别字、英文该大写的没大写、拼写错误等等。

(6)不要在ios的应用中直接使用 Windows 自带宋体 / 黑体里的英文!

(7)谨慎地使用高饱和度颜色、大差别渐变 设计师很多时候总喜欢把自己当做艺术家,想用艺术家的思维特点去设计产品,但我发现移动应用产品UI设计仍是限制很大的一门艺术。我们大部分情况下,都不会有非常大的颜色空间去发挥,所以一些醒目出跳的颜色和渐变使用起来要十分讲究,否则很容易产生“俗气”的感觉;或者说很多时候色彩的选用还是要考虑到产品的特点以及目标使用群体特点,而不能仅仅只是展现设计师本人的个性特点。

移动UI设计趋势:从拟物化到扁平化设计

移动设备的屏幕只不过是人们五指间有限的方寸之地,设计者必须考虑如何做到返璞归真,把那些花俏的修饰和多余的内容去掉,优先确保对内容和用户体验影响最大的功能呈现。从一贯喜爱引领时尚的苹果公司今年最新的ios6系统UI界面中,我们可以看到目前移动UI设计的潮流已然从拟物化的再现转为扁平化的表现。没有必要再坚持把现实生活中的对象按照原貌照葫芦画瓢地挪进数字空间中。扁平化设计并不是为了压扁而压扁的,它是一种设计理念,色块是它的外在表现形式。同样的,拟物化也是不应该是为了拟物而拟物,立体是它的外在表现形式。而采用哪一种风格的设计,这最终还是要设计师针对具体的产品需求以及用户体验分析去作出定夺!

分享到:

上一篇:移动应用弹窗设计指南


下一篇:教你快速制作线圈文字

相关课程MORE>

图片加载中

WEB前端全栈开发就业班

前端开发就是利用各种Web技术进行产品的界面开发...

图片加载中

UI全栈设计就业班

让学生快速达到一名UI界面设计师的标准...

图片加载中

PHP高级架构开发就业班

广阔的发展空间,需要新型的技术人员...

图片加载中

Python大数据分析就业班

高层次的结合了解释性、编译性、互动性和面向对象的脚本语言。...

图片加载中

Linux云计算运维就业班

云服务器是一种简单高效、处理能力可弹性伸缩的计算服务。...

图片加载中TEL:010-83650488

图片加载中