网站首页站长博客下载中心域名交易站长论坛域名主机免费电邮免费域名中文排行排名查询站长书库书籍教程下载
设为首页
加入收藏
总编信箱
投稿或申请专栏请先 [登 陆]
学院首页 网络编程 网页设计 图形图象 数 据 库 服 务 器 网络媒体 网络安全 个人专栏 站长CLUB 业界新闻 信息公告
 当前位置:首页 >> 图形图象 >> 其他相关 >> 正文
公告通知
返回上级列表
资料搜索
相关文章
提高页面显示速度的秘技
模仿QQ和MSN消息提示的效果
CSS实用教程(三)
CSS实用教程(二)
CSS实用教程(一)
社区类网站得一般设计思路
html编辑器的回车换行问题解决方
以Flash为核心
百度的38个我预示互联网2.0的崛起
CSS技术在网页设计中的运用
手机GUI二级菜单设计说明
[ 来源:中国站长学院,网易学院 | 作者: | 时间:2005-8-11 16:15:32 | 浏览:人次 ]
收藏到新浪ViVi 收藏到365KEY 收藏到我摘  字号选择〖    〗/ 双击滚屏 单击停止  

随着移动通信类产品的发展,手机从以前的罕有用品快速发展到大众消费类用品。手机所提供的服务内容模式也在深刻地变化当中,手机的人机交互界面也随之不断升级发展变化中。手机的GUI也渐渐形成了自己特有的不成文的标准和设计习惯。

手机GUI的二级菜单的设计是MMI过程当中较为特殊的一个设计子项。二级的菜单的设计不同于主菜单和其它大副面的GUI设计一样,它必需要严格考虑到MMI的可实现性、用户的使用习惯,以及确保美观实用。目前最为流行的解决方案是以列表式为基础所恒生出来的菜单,这种方案的好处是保证用户在使用上不会产生陌生感,也增强了二级菜单的内容表现力。

下面就128*160的LCD显示屏为例做一个二级菜单的设计。

首先我们要确定基本的整体布局框架,一般情况下,根据我们上面的分析,二级菜单应该的大致框架应该是:标题栏(title bar)、列表内容栏(list content)、功能键栏(soft key)。

框架结构组合方式如下图:


标题栏(title bar) 用来显示和说明当前所处的二级菜单的功能与作用,流行的常用表达方式为小图标+文字说明+数字序列号。比如说电话本就是这种表达方式


二菜单要实现功能的选择项,包含有背景、序列小图标、菜单文字。GUI设计部分一般有背景、序列小图标、选中状态图片、确定状态图片、滚动条等。

功能键栏(soft key) 用来定义手机键盘功能键的用法。大部分是使用:确定键、方向键、取消键的组合方式。GUI设计部分为:确定键按下状态、方向键、取消键按下状态。建议三个部件排列起来的宽度为128 pix 。

下面把一些要注意的数字参数的定义讲一下。

功能键栏的区域大小为 128 pix * 20 pix

列表内容栏 行高为20 pix

序列小图标大小为 18 pix * 18 pix 或 16 pix * 16 pix

滚动条 宽度为4 pix

二级菜单的设计更关键的部分应该是如何把握标题栏与列表内容栏。功能键栏的长宽大小基本上是比较传统的设计方法。标题栏与列表内容栏则可以提供创意设计更大的部分,标题栏与列表内容栏的框架搭配组合如何可以直接关系到美观程度,也就是说,二级菜单的GUI美观基本上是通过这两个部分来表现出来的,当然也包括功能键栏在内的整体效果。

通常下,标题栏与列表内容栏的组合设计应该是这样子。

为了最大地显示出二级菜单的列表内容,目前主流都是显示6行列表。列表内容栏的高度定义在120 pix 。

标题栏根据屏的分辩率就只能定义在20 pix

列表内容栏应该有背景、序列小图标、菜单文字、选中状态图片。

标题栏给设计师留下来发挥的空间不是很大,但是我们可以用从列表内容栏借空间的方案来弥补设计空间不足的问题,这样可以促使设计师多从如何把标题栏与列表内容栏更好地融洽在一起这个方面去思考。

最后来说,其实在手机GUI的设计过程中,如何根据MMI的需求来更融洽、更适当的表达出设计出的GUI,才是设计GUI的根本道理。


[发送给好友]  [打印本页]  [关闭窗口]  [返回顶部]   转载请注明来源:http://edu.chinaz.com   
特别声明: 本站除部分特别声明禁止转载的专稿外的其他文章可以自由转载,但请务必注明出处和原始作者。文章版权归文章原始作者所有。对于被本站转载文章的个人和网站,我们表示深深的谢意。如果本站转载的文章有版权问题请联系编辑人员,我们尽快予以更正。
栏目编辑: 设计风 责任编辑: 设计风,郁郁小蝎
原始作者: 录入时间: 2005-8-11 16:15:32
信息来源: 中国站长学院,网易学院 投稿信箱: Edu#chinaz.com
设为首页 - 加入收藏 - 关于我们 - 广告服务 - 版权申明 - 友情链接 - 联系方式 - 总编信箱 - 会员投稿