移动平台的设计与传统的网页有许多不同之处,如独特的交互体验、不同光线下的视觉效果以及移动终端的资源有限。这些都考验着开发者的技术。
通过对设计移动界面的点滴记录,本文为读者介绍了对界面的规划的设计原则以及相关案例,并且推荐了自己中意的设计工具。
一、减少空间占用
与面向桌面电脑的网页设计不同,移动平台的设计中,屏幕空间是一个不可忽视的限制因素。设计需要符合移动平台用户的使用习惯,以更佳的状态呈现屏幕信息。
接下来以当前正在工作的UI做为sample,实战空间优化。
改进原则
去除不必要的提示信息:
合理减少界面中的文字信息,图形化界面直观的使用户可以完成操作任务。
控制字号,使用高亮/对比方式突出类似条目信息 :
有需要充分利用单屏的空间,在不影响文字显示底线,采用多途径的设计方式描述内容。
合理布局功能控件:
减少显示中的控件使用,学会聪明的隐藏低优先级的功能,对于用户熟悉操作与产品开发都将是有益的。
如在iphone平台善用标准化的action sheet,在Android中的collapsed menu。
限制因素
平台操作习惯
遵循不同平台的设计准则(你可以从官方的UI开发指南获取这些帮助教程),避免将错误的理念带给特定的平台。如你不会在Iphone的设计中使用Android/Symbian的Options。熟悉这些原则不仅会使产品易用,善用组合的设计也将提升操作体验。
屏幕物理属性
不同尺寸的屏幕不同的UI。要考虑的产品在所有目标用户的不同屏幕的显示效果。如果要做一个通版的UI设计,需要重点考虑带来的负面影响。触摸屏是另外一个需要考虑的情况,滑动使得翻页变的容易,可点击的元素尺寸是否有必要增大以适应大的手指……要知道, mutli-touch 目前只是apple的专利。
我们需要为特定的这个页面做些什么
这个是一个Android平台的程序。一个优惠券列表页面,优惠券是我们最重要的显示内容。用户需要在单屏中预览更多的优惠券信息,商店信息次之,而tab导航将被保持以保证用户不会迷路。
1.移除标题。
2.默认收起商店信息,点击可弹下显示。
3.为保证用户对商店信息的初步了解与注意,加入商店名称。
接下来我们将得到下面的界面。
UI不只是皮肤,请用心使界面更加好用。
更多关于 云服务器, 域名注册, 虚拟主机的问题,请访问 西部数码官网: www.west.cn一个大学生的建站创业之路 1999年,来北京上大学之前从未见过计算机的苏杨,很快对计算机和互联网着了迷,半年后便利用学到的知识来负担自己的学费和生活费。2002年,用手里仅有的几千元钱买了服务器做虚拟主机、网站,开始创业,2003年初成立公司,进入IDC行业。 到2005年,当在IDC行...
各位网友朋友大家好,看到admin5的(草根站长故事征集活动),无意之间就有心里一种冲动,看着网络上的故事真是太多了,大千世界,无奇不有。现在还是饿着肚子,也没有什么事情可做,天天添加内容,都快累死了,有太多的时候都是这样度过的,早上10点起床,来到公司一天就是2顿饭,天天关注自...
编者:蓝色理想 www.blueidea.com 成立于1999年的10月,作为国内最大的设计类站点之一,以建设网站设计与开发人员之家为宗旨,以介绍网络开发技术与网站创作设计交流为主要内容。其网站内容制作精良,每天都会有会员精心制作的教程发布,无私地对网友进行帮助,而且还举办过不少设计比赛并...
前言 &nb...
仅以此文献给在PR上挣扎的站长们 google拥有世界上领先的搜索引擎技术,他们有最大的资金后盾,有最强的技术团队,有着别的公司无法比拟的公司文化底蕴。google全球最大的搜索引擎,搜索引擎界的大哥大。  ...
--- 仿<刘和珍君>版 &n...