您的位置:首页 > 产品设计 > UI/UE

iOS 7 UI Transition Guide - Before you start | iOS 7 界面过渡指导,在你开始前

2014-03-14 10:23 549 查看


Before You Start

IMPORTANT

This is a preliminary document for an API or technology in development. Although this document has been reviewed for technical accuracy, it is not final. This Apple confidential information is for use only by registered members of the applicable Apple Developer
program. Apple is supplying this confidential information to help you plan for the adoption of the technologies and programming interfaces described herein. This information is subject to change, and software implemented according to this document should be
tested with final operating system software and final documentation. Newer versions of this document may be provided with future seeds of the API or technology.

在你开始前,需要看一下。这是一个API或技术在发展的初步文件。虽然此文件已被审查的技术的准确性,但它不是最终的。这个苹果的保密信息是只使用了适用的苹果开发者计划注册会员。苹果提供了这样的机密信息,帮助你的技术和编程接口的领养计划描述。这个信息是随时变化的,软件实施根据本文件应进行测试与最终的操作系统软件和最终文件。本文档的较新版本可能会根据未来的API和技术更新。

iOS 7 introduces many UI changes, such as borderless buttons, translucent bars, and full-screen layout for view controllers. Using Xcode 5, you can build a project for iOS 7 and run it in iOS 7 Simulator to get a first glimpse of the way the app looks with
iOS 7 UI.

iOS 7引入了许多用户界面的变化,如无框的按钮,半透明的BAR,和全屏幕布局视图控制器。使用Xcode
5,你可以建立一个项目运行iOS
7,可以用iOS
7模拟器生成的程序看一眼iOS7哦~。

For example, the only differences between the two versions of TheElements sample
project shown below are the deployment target and the simulator.

举例,可以用 TheElements 例子运行在不同的模拟器来比较
iOS 6和iOS7。

TheElements sample app in iOS 7 Simulator



TheElements sample app in iOS 6 Simulator



NOTE

iOS 7 Seed 1 is not available on iPad.

It’s tempting to dive straight into the work of updating your app, but there are a few things to think about before beginning the process.

As you interact with the built-in apps, it becomes clear that the changes in iOS 7 are both subtle and profound. Familiar UI elements are easily recognizable but look very different. Visual touches of physicality and realism are muted and refined, while realism
in motion is enhanced.

是不是迫不及待的投入到更新应用的操作了啊小样?但在开始之前,需要考虑一些事情。

当你与内置的应用程序进行交互,它变得清晰,iOS
7中的变化是微妙而深刻的。熟悉UI元素很容易辨认,但看起来很不同。肉体和现实主义的视觉接触是温和的和精致的,而现实主义运动是增强。

NOTE

Although all UI elements look different in iOS 7—and many support new functionality—the UIKit APIs you’re familiar with remain mostly the same.

注意:虽然所有的UI元素在IOS7看起来不一样,但是很多你熟悉的功能和API,都是一样的。

As you continue to explore, you begin to discern the main themes of iOS 7:

当你继续挖掘后,你会发现IOS7的主题:【重要!设计的时候要理解透这几点哦】

Deference. The UI helps users understand and interact with the
content, but never competes with it.

尊重(用户)。用户界面可以帮助用户理解和与内容交互,千万不要与之相反,绝不要搞的用户稀里糊涂的去试。(个人理解)

Clarity. Text is legible at every size, icons are precise and
lucid, adornments are subtle and appropriate, and a sharpened focus on functionality motivates the design.

清晰。文字,各个尺寸的文字都清晰;图标,精确和清晰,修饰是灵巧恰当的,敏锐的,突出的焦点在功能引导设计上。(好难翻译)

Depth. Visual layers and realistic motion heighten users’ delight
and understanding.

景深。视觉层次和现实的运动感,提高用户的喜悦和理解。。。

By bringing fundamental and pervasive changes to the iOS experience, iOS 7 provides a rare opportunity to revisit the way apps communicate their core purpose and functionality to users. Although you might not be prepared to take full advantage of this opportunity
today, keep it in mind as you update your app to run in iOS 7. (If you are ready to revisit your app design—or you’re beginning a new project—read “Designing
for iOS 7” for some guidance.)

通过将基本和普遍的iOS经验,iOS
7提供了重新的方式应用交流他们的核心目的和功能给用户一个难得的机会。虽然你可能不准备充分利用现在这个机会,记住当你更新你的应用程序运行在iOS
7。(如果你愿意重新审视你的应用程序的设计和你开始一个新的项目,阅读“iOS
7”的设计有一定的指导意义。)
(太晕了,靠了段百度翻译)


Characterizing Your App

描述你的应用程序

Whether you decide to redesign an app or update its current design, you need to know how the app’s characteristics can influence the process. First, use the following questions to help shape your strategy:

是否选择重新设计一个应用还是更新你当前的设计,你需要知道你应用的特征是如何影响过程的。首先,以下问题可以帮助你塑造你的定位:

1. Did you use Auto Layout to design the app?

If your app uses Auto Layout, your job is easier. In Xcode 5, Auto Layout can help an app accommodate new UI element metrics and respond appropriately to dynamic changes in text size. Auto Layout is particularly helpful if you’re transitioning an iOS 6 app
or you need to support both iOS 6 and iOS 7.

If you didn’t use Auto Layout, now may be the perfect time to start, especially if you need to support more than one version of an app. If you use manual or programmatic layout techniques, you're responsible for ensuring that the layout adjusts appropriately
when text size changes.

你是否使用自动布局来设计应用?

如果你的应用使用了 Auto Layout ,你的工作就简单啦亲。(可是我的应用没有,还考虑兼容IOS 5 .... 55555)。在XCODE 5里面,自动布局可以帮助应用适应新的UI元素的特性并且很好的支持字体大小的动态变化。自动布局对于从IOS 6里面移植到IOS 7或者同时支持6和7 特别的有帮助。

如果你不使用自动布局,那现在还是个很好的时机去开始,特别是如果你需要支持一个应用的多个版本。如果你使用手动或者代码布局的技术,你有责任来确保这个布局可以随着文字字体变化而适当的调整布局。

2. Does the app need to support iOS 6?

Remember that iOS users tend to be very quick to update their devices, and they expect their favorite apps to follow suit.

If business reasons require you to support iOS 6, it’s still best to begin by updating the current app for iOS 7. Then—as much as possible—apply the design changes to the iOS 6 version of the app. For some details of this process, see Supporting
iOS 6.

应用需要支持IOS 6吗?

记住IOS用户趋向于非常快的更新他们的设备,他们期望自己喜欢的应用也仅跟着适应。

如果因为商业原因,你需要支持IOS 6,这个是个最好的开始来为IOS 7更新当前的应用。然后,尽可能的应用到这些设计变化到IOS 6的应用版本。如果你想知道更多的过程,请看:Supporting
iOS 6.

The next step in shaping a transition strategy is to examine the ways in which the app is customized. The amount of customization—and the specific customization techniques you use—impact the type of work you have to do.

下一步塑造转型战略的步骤是考察应用用什么方式定制的。定制的数量和你用的定制的技术,影响了你必须要做的工作类型。

Think of app customization as being divided into the following three types:

不妨把应用的定制分为以下三种:

1. Standard. The app contains only standard, uncustomized UI
elements provided by UIKit.

标准的。应用只是用了标准的、未定制的UI元素。

2. Custom. The app presents a completely custom UI that doesn’t
include any UIKit UI elements.

自定义的。应用展示了一个全新的自定义UI,但是不包含任何UIKIT里面的UI元素。

3. Hybrid. The app contains a mix of standard and custom elements,
including standard elements that you customized using UIKit tinting and appearance-customization APIs.

混合的。应用包含了混合标准与自定义的元素,包含了标准的元素并且自定义了它们的着色和外观。

For a standard app, you need to decide whether your visual and user experience designs still make sense in the iOS 7 environment. If you decide to keep the current layout and interaction model, most of the work involves making minor adjustments and ensuring
that the app handles the new systemwide gestures correctly.

对于标准应用,你需要决定你的视觉和用户体验设计是否在IOS 7环境继续保持。如果你觉得保持当前的布局和交互模式,此时大部分工作都是一些小细节的调整,并且确定你的应用处理了系统级的手势是否正确。

Custom apps—that is, apps that use no UIKit UI elements—require a more nuanced approach. For example, if you feel that the current UI and experience of the app is still appropriate, there may be very little to do. On the other hand, if you feel that the app’s
personality and user experience should change in order to delight iOS 7 users, you have more work to do.

自定义应用。也就是应用一点都没用UIKIT的元素--需要更细致入微的方法。比如,如果你觉得当前的UI和用户体验还是可以的适当的,那这里就没有什么好做的。反之,你感觉到你必须取悦IOS 7用户而做用户体验改变,你需要更多的工作要做。

Hybrid apps vary in the amount of work required, depending on the customizations you did and how you combined custom and standard elements. In addition to revisiting the overall design of a hybrid app, you need to make sure that your customizations still work
well and look good when they’re integrated with standard elements.

混合应用程序所需的工作量有所不同,这取决于定制你和你如何结合标准的和定制的元素。除了重新混合应用的整体设计,您需要确保您的自定义在当与标准与元素一起时,仍然可以用,看起来很好。

NOTE

An app that mimics standard iOS 6 UI in a completely custom way is likely to require a lot of work because it will simply look out of date.

注:

完全模仿标准的iOS
6用户界面的自定义的方式的应用,可能需要大量的工作,因为它只会过时。都要重新做啦亲。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: