BlackBerry Tablet OS SDK (操作系统开发工具包) UI指南(一)

本文是BlackBerry Tablet OS SDK的UI设计与交互指南,涵盖了PlayBook的特点、设计原则、屏幕交互操作、通知图标以及UI组件的使用建议,旨在帮助开发者创建优秀的触控应用。
摘要由CSDN通过智能技术生成

Prosanta Bhattacherjee, 应用开发顾问                    Research In Motion
Renaun Erickson, Adobe 开发者技术宣传工程师        Adobe 系统公司

 

议程
•  前三周的内容回顾
•  BlackBerry PlayBook的特色
•  设计原则
•  通知和指示图标
•  屏幕设计
•  UI 组件


 

第1周内容回顾
•  安装过程 
    •   BlackBerry Tablet OS SDK
    •   BlackBerry PlayBook Simulator
•  设置Flash Builder 4
•  创建Hello World应用
•  将该应用部署至 BlackBerry PlayBook Simulator
•  滑动手势(Swipe Gestures)
•  Flash播放器和AIR


 

第2周内容回顾
•  开始极建我们的应用
    •  极建具有基本功能的应用
•  通过Adobe Flash Builder 4执行测试和调试
•  极建BlackBerry PlayBook应用的不同方法
    •   Flash Professional CS5
    •   命令行工具


 

第3周内容回顾
•  摄像头
•  设备传感器
•  应用的生命周期
•  滑动手势(Swipe Gestures)
•  设备信息
•  活动指示标识
•  电池电量和事件
•  SQLite
•  文件 I/O
•  对话框

 

BlackBerry PlayBook的 特色

 

BlackBerry PlayBook的特色

• 7英寸屏幕
•  多点触控界面
    •  支持多达4个触控点
•  可横屏或竖屏显示
•  虚拟键盘

 

 

 

BlackBerry PlayBook的特色

 

•   设计UI时要考虑不同的屏幕尺寸,如果将来有不同的屏幕尺寸的PlayBook 出现,您只需要进行少量的UI适配工作。
     •   使用相对尺寸(百分比),而非绝对尺寸

•   建议尽量使用默认字体和字体大小
     •   它们进行了专门设计,能够使PlayBook上的文本清晰易读

 

设计原则

 

设计原则
•   针对无限制的屏幕进行设计
     •   极建应用,要充分利用滑动手势
     •   将信息放置在一个持续显示的屏幕中,并鼓励用户在屏幕中进行探索
     •   不使用垂直层次结极的屏幕导航,而是创建水平的层次结极。


 

注重内容和简便性
•   创建互动式的、吸引人的内容
    •   使用户只需点击内容便可以使用应用,而不必点击按钮
        •   例如,轻按文章名称便可以阅读,无需高亮选中再点击打开

•   注重于应用的主要用途
    •   避免使应用附加过多其他功能,导致其偏离设计主旨
    •   根据应用的设计主旨,尽可能为用户提供最佳使用体验
        •   将附属功能从主屏幕中移除,移至菜单中

 

极建以触控为中心的应用

用户操作                                                       结果                                         类型
从屏幕顶端向中心滑动                               该操作显示菜单                               应用特定
从屏幕底部向中心滑动                              该操作显示导航栏                              系统级
从屏幕左侧或右侧向中心滑动                            该操作切换应用                                系统级

 

屏幕交互操作



 

最佳实践
•   创建互动式的、吸引人的内容
     •   使用户只需点击内容便可以使用应用,而不必点击按钮
         •   例如,轻按文章名称便可以阅读,无需高亮选中再点击打开

•   重点关注应用的主要用途
     •   避免使应用附加过多其他功能,导致其偏离设计主旨
     •   根据应用的设计主旨,尽可能为用户提供最佳使用体验
         •   将其他功能从主屏幕中移除,移至菜单中


通知和指示图标

 

通知和指示图标
•   应用通知图标显示在屏幕左上角
    •   通知用户应用特定事件,例如新的电子邮件消息

 

•   状态指示图标显示在屏幕右上角
    •   显示电池电量和无线连接等系统状态信息

 

通知和指示图标
•   应用通知提示用户有新的事件或新的信息
•   您可以在出现新的信息、并且您希望用户了解该信息时触发一个应用通知
•   用户可以通过点击图标查看通知详情
•   最佳实践
     •   请审慎使用通知。尽力保证所显示的通知是用户真正希望注意的信息。
     •   请勿使用通知提供反馈(例如,表格提交的确认结果)


屏幕设计

 

屏幕设计
•   保守地使用标题栏
     •   仅在用户访问应用中复杂的层次化数据时使用标题栏作为导航。不要在单屏幕应用或者简单的平面应用中使用标题栏。
•   尽量将UI组件放在菜单中,而不是放在屏幕中
•   应用菜单可以包括主菜单或二级菜单
     •   当手指从屏幕顶部向中心滑动时显示菜单
•   为选中的项目提供弹出菜单,让用户可以快速访问最常用的功能 
     •   当用户用手指按住屏幕中的一个项目时,显示一个弹出菜单

 

UI 组件

 

按钮
•   使用清晰、简明的标签
•   尽可能使用一个单词的标签
•   使用动词来描述相关操作(例如,“取消”、“删除”或“保存”)
•   如果空间有限,并且在特定的上下文环境中图标可以被轻松理解,请使用图标而不是文本。

 

 

复选框
•   当用户选择一个复选框时,请勿触发一个操作
     •   例如,请勿打开一个新的屏幕
•   垂直排列复选框
•   对复选框进行逻辑分组和排序
•   避免按字母顺序对复选框排序
     •   字母排序是针对语言的特定排序方式

                                       选项


 

 BlackBerry Tablet OS SDK (操作系统开发工具包) UI指南(二)请见:http://blog.csdn.net/BBturials/archive/2011/02/22/6199745.aspx

本次更新内容主要是BUG修复和功能改进,相隔4个月又发布了新版本,这次更新更像是例行公事,不过好在修复了很多BUG,另外需要说一下,EasyUI框架当中其实官方还隐藏了不少API没有开放出来,有些朋友建议我把整理一下,将一些好用的API及其用法也更新到中文API中,这里我想说的是,有些API或许是因为不稳定、尚有BUG、未完全实现或者是未经过完整测试的,所以官方并未公布出来,因此我也不建议大家大面积的去使用,这样会带来很多不稳定因素,甚至是致命的BUG,这也是我没有将这些API写入中文API文档的原因,所以有能力并且需要的人就自行去源代码中挖掘吧,我这里只同步官网的API(外加少许的变动或者不影响稳定性和安全性的新增内容)。 jQuery EasyUI 1.4.4版本更新内容: Bug(修复) filebox:修复“clear”和“reset”方法在IE9下无法正常工作的问题; messager:修复调用无参的$.messager.progress()方法之后,再调用$.messager.progress('close')方法时无法正常工作的问题; timespinner:修复在IE8中点击微调按钮时无法正确显示值的问题; window:修复在“onMove”事件中调用“options”方法时无法正常显示的问题; treegrid:修复“getLevel”方法无法接受为0的参数值的问题。 Improvement(改进) layout:改进后的“collapsedContent”、“expandMode”和“hideExpandTool”属性可以支持区域面板; layout:改进后的“hideCollapsedContent”属性可以在折叠面板上设置显示垂直标题栏; layout:新增“onCollapse”、“onExpand”、“onAdd”、“onRemove”事件; datagrid:在排序列的标题上显示↑↓图标; datagrid:新增“gotoPage”方法; propertygrid:新增“groups”方法,以允许获取所有数据租; messager:在显示长消息的的时候支持对消息进行自动滚动; tabs:“disabled”属性支持定义一个被禁用的选项卡面板; tabs:支持百分比大小。
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值