Presentation is loading. Please wait.

Presentation is loading. Please wait.

MBL302 设计Windows Mobile应用程序的用户界面

Similar presentations


Presentation on theme: "MBL302 设计Windows Mobile应用程序的用户界面"— Presentation transcript:

1 MBL302 设计Windows Mobile应用程序的用户界面
2019年5月10日5时21分 MBL302 设计Windows Mobile应用程序的用户界面 张欣 Team Lead US-MDD-Test 微软有限公司 © 2005 Microsoft Corporation. All rights reserved. This presentation is for informational purposes only. Microsoft makes no warranties, express or implied, in this summary.

2

3 议程 屏幕的方位性 分辨率 界面布局 软键和菜单 输入

4 导语:Mobile设备的人机界面的发展 LED 单色屏幕 灰度屏幕 彩色屏幕 手写 。。。。。。

5 Windows Mobile UI设计 常规的概念
常见的一些概念的转换 鼠标--〉触笔 键盘--〉硬件按钮 Mobile? Mobility? 用户输入 界面保持简洁

6 Windows Mobile UI设计 设计原则
简单易操作 记忆负担小 符合用户认知习惯

7 屏幕的方位性 What is it? Landscape Square Portrait

8 屏幕的方位性 考虑如下问题 用户会在运行时旋转屏幕 三种主要的策略 改变内容的大小 动态的对内容进行重新布局 改变内容 保持用户体验的一致性

9 屏幕的方位性 程序主界面 策略1: 改变内容的大小

10 屏幕的方位性 程序主界面 策略2: 动态的对内容进行重新布局

11 屏幕的方位性 程序主界面 策略3: 改变内容

12 屏幕的方位性 对话框 设计成正方形的区域 动态的对内容重新布局

13 屏幕的方位性 对话框 策略1: 设计成正方形的区域

14 屏幕的方位性 对话框 策略2: 动态的对内容重新布局

15 屏幕的方位性 托管代码中如何处理 使用控件的Anchor属性 在运行时对内容重新布局 捕获屏幕的旋转事件 Form.OnResize事件
Microsoft.WindowsMobile.Status.SystemState

16 2019年5月10日5时21分 处理屏幕的旋转 © 2005 Microsoft Corporation. All rights reserved. This presentation is for informational purposes only. Microsoft makes no warranties, express or implied, in this summary.

17 分辨率 What is it? 96 DPI 131 DPI

18 分辨率 考虑如下问题 绝大部分的设备的屏幕的物理大小是一样的 字体应该比较大而且可读性要好 每一个点击区域应该容易被点击
分辨率越高,则每个象素越小 字体应该比较大而且可读性要好 每一个点击区域应该容易被点击 不要过于靠近屏幕边沿和角落 触笔:5.04mm(21像素);手指:9.12mm(38像素)

19 分辨率 位图和图标 位图不管是放大还是缩小,效果都会失真 为你所支持的分辨率分别处理位图和图标

20 分辨率 分辨率的支持以及图标的大小 Pocket PC Smartphone 图标 96 DPI 240x320 176x220

21 界面布局 设计原则 避免不相关的/冗余的信息 合理组织信息的展现顺序 提供易见且易理解的提示信息 保持界面布局的一致性 提供一定的快捷操作
提供友好的错误提示信息

22 界面布局 三种主要视图 列表视图 信息视图 编辑视图

23 软键和菜单 What is it? Smartphone Pocket PC

24 软键和菜单 软键 以前只是在Smartphone上有 在Pocket PC上是一个新的功能 方便了单手操作

25 软键和菜单 软键设计原则 常用的且无损害性的命令放在SK1上 SK2可以是一个命令或者是个菜单 软键上的命令提示字符要简短,限制在一个词
让菜单尽可能的小 SK1的命令不要在SK2的子菜单中重复 尽可能的不要使用子菜单 将相似的命令进行分组

26 软键和菜单 菜单设计原则 让菜单尽可能的小 将相似的命令进行分组 适当的禁用与移除菜单项 不同界面中保持一致的菜单顺序
SK1的命令不要在SK2的子菜单中重复 尽可能的不要使用子菜单 将相似的命令进行分组 适当的禁用与移除菜单项 不同界面中保持一致的菜单顺序 为Smartphone的菜单助记键调整菜单顺序

27 软键和菜单 菜单的顺序 SK1:最有可能的无危害的操作 SK2 次要操作命令 编辑类命令 视图类命令 其他支持性命令 选项类命令

28 File Explorer的菜单的演变 2019年5月10日5时21分
© 2005 Microsoft Corporation. All rights reserved. This presentation is for informational purposes only. Microsoft makes no warranties, express or implied, in this summary.

29 软键和菜单 菜单的变化 Today屏幕上没有了“新建”菜单命令 菜单栏上没有图标 更加容易访问

30 软键和菜单 在.NET CF中访问 System.Windows.Forms.MainMenu
MenuItem.Click event handler

31 输入 考虑如下问题(一) 尽量单击触发而不要使用双击 尽可能的减少用户的点击的次数 使用命令加速键 支持常用的快捷键 剪切、复制、粘贴
选择全部 粗体、斜体、下划线

32 输入 考虑如下问题(二) 尽量支持单手操作 使用键盘时 Softkeys 编辑类控件 硬件按钮 使用触笔时 按钮 超链接 上下文菜单

33 输入 Input Panel

34 2019年5月10日5时21分 输入面板的状态 © 2005 Microsoft Corporation. All rights reserved. This presentation is for informational purposes only. Microsoft makes no warranties, express or implied, in this summary.

35 MSDN:Mobile Developer Center OpenNETCF Smartphone Developer Network
OpenNETCF Smartphone Developer Network Pocket PC Developer Network

36


Download ppt "MBL302 设计Windows Mobile应用程序的用户界面"

Similar presentations


Ads by Google