ux 设计的问题，metro style和Ios style

概述iOS 是一个受欢迎的平台，用于在触摸第一、 分享乐趣，并参与的情况下创建应用程序。Windows 8 消费者预览的引入，使设计师和开发者都有一个新的平台，以发挥他们的创意。 在此案例中，我们的研究想要帮助熟悉 iOS的设计人员和开发人员改造他们的应用程序使用Metro样式设计原则。我们向您展示了如何翻译iPad 应用程序通用用户界面和体验，在Windows 8 Metro样式应用程序中找到对应的

iOS 是一个受欢迎的平台，用于在触摸第一、 分享乐趣，并参与的情况下创建应用程序。windows 8 消费者预览的引入，使设计师和开发者都有一个新的平台，以发挥他们的创意。

在此案例中，我们的研究想要帮助熟悉 iOS的设计人员和开发人员改造他们的应用程序使用Metro样式设计原则。我们向您展示了如何翻译iPad 应用程序通用用户界面和体验，在windows 8 Metro样式应用程序中找到对应的模式。我们利用我们为 iPad 和 windows 8 建设相同的应用程序的经验。我们用来显示如何利用 windows 8 的平台和纳入Metro样式设计原则的共同设计和发展方案。

要了解有关 windows 8 的商业机遇。

应用

我们看的应用是关于连接旅行的图册／视频纪录，可以通过时间轴来管理.我们先看到的是ipad上的layout，简单分析：

我们就是在win8 pad上复制该应用，首先看看最终设计效果图，我们把comment和vIDeo-photo放在一起了没有Tab的概念了。接下来我们看看如何把以上的icon／功能转化为对应的Metro功能：

1. Layout and navigation ／／基本功能，包括navigation可以使用现有的grIDvIEw等

2. Commands and actions ／／ *** 作

3. Contracts: search,share,and others ／／搜索分享等，通过system panel来实现的

4. touch ／／触摸，系统支持

5. OrIEntation and vIEws ／／方向和呈现

6. Notifications  ／／本地通知或远程push notification，基本原理是一致的

 

接下来逐一分析：

布局与导航：

聚焦在功能上，理解应用的目的，才能简化，简化是 metro风格的一个核心思想，然后我们看：我们创建一个Metro风格的程序，第一个问题就是删除一切不必要的UI，非直接关联到应用功能的，一律不要。

这样，ipad 的 ABCD就只有一项了APP content 和logo／导航中的一些功能通过system panel来实现。

通过简单 *** 作来实现导航：

简单 *** 作允许用户与内容快速交互，导航到不同区域，不同场景。通常我们在设计Metro风格应用时候，尽可能使用简单交互，例如使用自带控件pivot，还有Semanticzoom，使得zoom具有不同的含义，当缩小放大可以带来更多的效果，例如改变成另外一个layout：

 

 

iPad app A. top navigation bar B. App content C. Pagination UI D. Bottom tab bar

／／

Ipad的选择方式，使用action sheet／alert，带来导航功能

使用了语义缩放，缩小后，呈现的是日历方式选择／

 

我们对比这两种设计，前者通过选择导航栏的year按钮，带出popover，然后选择年，导航。

Metro风格app：

在主页上，pinch两个手指，可以看到所有年和月份，这样可以快速导航到某个年月，并且通过icon的底色可以显示是否有图片供浏览。

 

上下文关联的command和action：

Metro style app

A. The app bar is hIDden by default toprovIDe users the immersive experIEnce. A user can swipe from the bottom or topof the screen to open the app bar.

B. When a user selects objects on the page,contextual actions for the selected items appear on the bar. The actions changedepending on whether there are objects selected and where the user is in theapp. Global commands are usually placed on the right sIDe of the app bar.Commands that come and go should be placed on the left sIDe of the app bar.

 

通知

iOS 5 引入，新的通知迅速出现在屏幕的顶部，并从中心查看所有邮件上，用户可以从顶部swap刷，查看通知中心。此外，在 iOS 的springboard的应用图标可以有编号的徽章，他们表示附加到有新的消息。在 windows 8 启动屏幕上的瓷砖Tile结合这两个功能即数字的徽章和通知，应用程序的图标上和通知中心在 iPad 上的功能。用户可以启动应用程序和读取的通知所有从一个位置。此外，在 iOS 有固定的格式的通知，不像Metro风格 appMetro 样式 app 瓷砖有丰富的设计师们从选择的模板的集合。

 

iPad A. App icon with numeric badge on iPad Springboard. B. Notification center with Photo journal notification. windows 8 C. Tile on the Start screen with both numeric badge and notifications that users. Many tile templates are available.

总结

以上是内存溢出为你收集整理的ux 设计的问题，metro style和Ios style全部内容，希望文章能够帮你解决ux 设计的问题，metro style和Ios style所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。