Devices, methods, and graphical user interfaces for providing notifications and application information
By introducing faster and more efficient touch-sensitive surface interaction methods in electronic devices, the problem of inefficient user interface manipulation in the prior art is solved, and a more efficient human-machine interface and longer battery life is achieved.
Patent Information
- Application Number
- CN202510165482.4
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- Priority Date
- 2022-09-20
- Filing Date
- 2023-05-08
- Publication Date
- 2025-06-06
AI Technical Summary
In the prior art, methods for performing user interface manipulation are troublesome and inefficient, especially when using mouse-based input, resulting in a large and time-consuming cognitive burden on the user.
By introducing faster and more efficient methods and interfaces into electronic devices, users can interact with the graphical user interface through touch-sensitive surfaces, reducing the amount and complexity of user input, and providing a more efficient human-machine interface.
A faster and more efficient way to view status information and access application controls on electronic devices, reduce user input needs, improve user experience, and extend battery life in battery-driven devices.
Smart Images

Figure CN120104031A_ABST
Abstract
Description
[0001] This application is a divisional application of the invention patent application with application number 202380051940.0, application date May 8, 2023, and name “Device, method and graphical user interface for providing notification and application information”.
[0002] Related patent applications
[0003] This application is a continuation of U.S. patent application serial number 17 / 949,128 filed on September 20, 2022, which claims priority to U.S. provisional application serial number 63 / 349,128 filed on June 5, 2022 and U.S. provisional application serial number 63 / 340,388 filed on May 10, 2022. Technical Field
[0004]
[0013] This document generally relates to electronic devices with touch-sensitive surfaces, including but not limited to electronic devices with touch-sensitive surfaces that display notifications and application information for applications of the electronic device. Background Art
[0005] The use of touch-sensitive surfaces as input devices for computers and other electronic computing devices has grown significantly in recent years. Exemplary touch-sensitive surfaces include trackpads and touch screen displays. Such surfaces are widely used to manipulate user interfaces on displays and objects therein.
[0006] Exemplary manipulations include adjusting the position and / or size of one or more user interface objects, or activating a button or opening a file / application represented by a user interface object, as well as associating metadata with one or more user interface objects or otherwise manipulating the user interface. Exemplary user interface objects include digital images, videos, text, icons, control elements (such as buttons), and other graphics.
[0007] However, methods for performing these manipulations are cumbersome and inefficient. For example, using a sequence of mouse-based inputs to select one or more user interface objects and perform one or more actions on the selected user interface objects is tedious and imposes a significant cognitive burden on the user. In addition, these methods take longer than necessary, thereby wasting energy. This latter consideration is particularly important in battery-powered devices. Summary of the invention
[0008] Therefore, there is a need for electronic devices to have faster, more efficient methods and interfaces to view status information and access controls for controlling applications. Such methods and interfaces optionally supplement or replace conventional methods for viewing status information and accessing controls for controlling applications. Such methods and interfaces reduce the amount, degree, and / or nature of input from the user and produce a more efficient human-machine interface. For battery-powered devices, such methods and interfaces can save power and increase the time between battery charges.
[0009] The above-mentioned defects and other problems associated with the user interface of an electronic device with a touch-sensitive surface can be reduced or eliminated by means of the disclosed device. In some embodiments, the device is a desktop computer. In some embodiments, the device is portable (e.g., a laptop, a tablet computer, or a handheld device). In some embodiments, the device is a personal electronic device (e.g., a wearable electronic device, such as a watch). In some embodiments, the device has a touchpad. In some embodiments, the device has a touch-sensitive display (also referred to as a "touch screen" or a "touch screen display"). In some embodiments, the device has a graphical user interface (GUI), one or more processors, a memory, and one or more modules, a program or instruction set stored in the memory for performing multiple functions. In some embodiments, the user interacts with the GUI mainly through stylus and / or finger contact and gestures on the touch-sensitive surface. In some embodiments, these functions optionally include image editing, drawing, presentation, word processing, spreadsheet creation, playing games, making and receiving calls, video conferencing, sending and receiving emails, instant messaging, fitness support, digital photography, digital video recording, web browsing, digital music playback, note-taking and / or digital video playback. Executable instructions for performing these functions are optionally included in a non-transitory computer-readable storage medium or other computer program product configured for execution by one or more processors.
[0010] According to some embodiments, a method is performed at a computer system in communication with a display generation component. The method includes displaying a first version of a first user interface corresponding to a restricted state of the computer system via the display generation component. Displaying the first version of the first user interface includes displaying a first plurality of user interface objects displayed simultaneously with a first background according to a first configuration. The first plurality of user interface objects correspond to a first plurality of applications and include corresponding content from the first plurality of applications, and are periodically updated as the information represented by the first plurality of user interface objects changes. The method also includes detecting a first input when displaying the first version of the first user interface. The method also includes: in response to detecting the first input, according to determining that the first input meets a first standard, wherein the first standard requires that the first input includes a first movement in a first direction in order to meet the first standard, replacing the display of the first version of the first user interface with a display of a second user interface including corresponding representations of a second plurality of applications, wherein the corresponding representations of the second plurality of applications, when activated, cause the computer system to launch the corresponding applications of the corresponding representations; and according to determining that the first input meets a second standard, wherein the second standard requires that the first input includes a second movement in a second direction different from the first direction in order to meet the second standard, replacing the display of the first version of the first user interface with a display of a second version of the first user interface, wherein displaying the second version of the first user interface includes displaying a second plurality of user interface objects simultaneously with a second background according to a second configuration. The second plurality of user interface objects corresponds to a third plurality of applications and includes corresponding content from the third plurality of applications, and is periodically updated as information represented by the second plurality of user interface objects changes. The first background is different from the second background, the first plurality of user interface objects are different from the second plurality of user interface objects, and / or the first configuration is different from the second configuration.
[0011] According to some embodiments, a method is performed at a computer system that communicates with a display generation component. The method includes detecting a request to change a wake-up user interface of a computer system. The wake-up user interface is a user interface displayed when the computer system is turned on or transitions from a low-power state to a higher-power state, and corresponds to a restricted operating mode of the computer system. The method also includes, in response to detecting a request to change the wake-up user interface of the computer system, displaying a first user interface for changing the wake-up user interface of the computer system via a display generation component. The method also includes, when displaying the first user interface, simultaneously displaying a first representation of the wake-up user interface and a first representation of the main user interface, wherein the main user interface is a user interface displayed when the wake-up user interface is released and the computer system has exited the restricted operating mode. The first representation of the wake-up user interface corresponds to a first set of one or more wake-up user interface settings including a first wake-up user interface background. The first representation of the main user interface corresponds to a first set of one or more main user interface settings including a first main user interface background. The method also includes displaying a second representation of the wake-up user interface. The second representation of the wake-up user interface corresponds to a second set of one or more wake-up user interface settings including a second wake-up user interface background different from the first wake-up user interface background. The method also includes detecting from the first user interface a sequence of one or more inputs corresponding to a selection of a corresponding representation of the wake-up user interface of the computer system. The method also includes: in response to detecting a sequence of one or more inputs, according to determining that a first representation of a wake-up user interface is selected based on the sequence of one or more inputs, setting the wake-up user interface of the computer system based on a first group of one or more wake-up user interface settings associated with the first representation of the wake-up user interface, including using a first wake-up user interface background as a corresponding background for the wake-up user interface, and setting the main user interface of the computer system based on a first group of one or more main user interface settings, including using the first main user interface background as the corresponding background for the main user interface; and according to determining that a second representation of the wake-up user interface is selected based on the sequence of one or more inputs, setting the wake-up user interface of the computer system based on a second group of one or more wake-up user interface settings associated with the second representation of the wake-up user interface, including using the second wake-up user interface background as the background for the wake-up user interface.
[0012] According to some embodiments, a method is performed at a computer system that communicates with a display generation component. The method includes displaying a first user interface for configuring a wake-up user interface via the display generation component. The corresponding version of the wake-up user interface includes a corresponding background and a corresponding plurality of editable user interface objects covering the corresponding background. The first user interface displays at least a first representation of the first version of the wake-up user interface, and the first representation shows a first plurality of editable user interface objects covering the first background. The method also includes: when the first user interface is displayed, a first input pointing to the first user interface is detected. The method also includes: in response to detecting the first input pointing to the first user interface, according to determining that the first input meets a first standard, displaying a second user interface for editing a first user interface object in the first plurality of editable user interface objects, wherein the first user interface object is selected according to the position of the first input; and according to determining that the first input meets a second standard different from the first standard, updating the first user interface to replace the display of the first version of the wake-up user interface with the display of the second representation of the second version of the wake-up user interface. The second representation of the second version of the wake-up user interface includes a second plurality of editable user interface objects covering a second background different from the first background. The second plurality of editable user interface objects are different from the first plurality of editable user interface objects.
[0013] According to some embodiments, a method is performed at a computer system having a display generation component and one or more input devices. The method includes: displaying a first user interface including a plurality of notifications via the display generation component, including: displaying the representations of the plurality of notifications in a first configuration in a first area of the first user interface based on determining that the computer system has enabled a first mode for displaying notifications; and displaying the representations of the plurality of notifications in a second configuration in a second area of the first user interface that is smaller than the first area of the first user interface based on determining that the computer system has enabled a second mode for displaying notifications. The method also includes: when displaying the first user interface, detecting a first user input at a corresponding position on the first user interface corresponding to the representations of the plurality of notifications. The method also includes: in response to detecting the first user input, and while continuing to detect the first user input: scrolling the notifications in the first area of the first user interface based on determining that the first user input meets the first standard and based on determining that the representations of the plurality of notifications are displayed in the first configuration; and scrolling the notifications in the plurality of notifications in the third area of the first user interface based on determining that the first user input meets the first standard and based on determining that the representations of the plurality of notifications are displayed in the second configuration.
[0014] According to some embodiments, a method is performed at a computer system that communicates with a display generation component. The method includes: detecting one or more inputs for subscribing to updates for a first event from a first application and subscribing to updates for a second event from a second application. The method also includes: displaying a first user interface. The first user interface includes a first area at a first position in the first user interface. Displaying the first user interface includes: based on determining that the first event is active and the second event is not active, displaying a first representation of the first event in a first area of the first user interface, and updating the first information contained in the first representation of the first event based on the update for the first event received from the first application; and based on determining that the second event is active and the first event is not active, displaying a second representation of the second event in the first area of the first user interface, and updating the second information contained in the second representation of the second event based on the update for the second event received from the second application.
[0015] According to some embodiments, a method is performed at a computer system having a display generation component and one or more input devices. The method includes: when displaying a wake-up user interface including a representation of a first plurality of notifications in a first configuration, wherein the wake-up user interface is a user interface displayed when the computer system wakes up from a low-power state, a first user input is detected via one or more input devices. The method also includes: in response to detecting the first user input: displaying the representation of the first plurality of notifications in a second configuration on the wake-up user interface based on determining that the first user input meets the first standard, wherein the second configuration is different from the first configuration; and maintaining the display of the representation of the first plurality of notifications in the first configuration on the wake-up user interface based on determining that the first user input does not meet the first standard. The method also includes: after detecting the first user input, detecting the occurrence of a condition that causes the computer system to redisplay the wake-up user interface. The method also includes: in response to detecting the occurrence of a condition that causes the computer system to redisplay the wake-up user interface, displaying the representation of the second plurality of notifications in a second configuration based on determining that the first user input meets the first standard; and displaying the representation of the second plurality of notifications in the first configuration based on determining that the first user input does not meet the first standard.
[0016] According to some embodiments, a method is performed at a computer system having a display generation component. The method includes: displaying a first user interface for configuring a system user interface via the display generation component, the system user interface having a first background and a first group of one or more system user interface objects covering the first background, wherein: when the system user interface is displayed, the computer system automatically randomly plays two or more media items selected from a set of media items in the first background over time; the first user interface includes corresponding selectable representations of multiple categories of media items associated with the computer system, including at least a first selectable representation of a first category and a second selectable representation of a second category; based on the first plurality of media items containing automatically detected first type of content, automatically selecting the first plurality of media items associated with the computer system to be included in the first category; and based on the second plurality of media items containing automatically detected second type of content, automatically selecting the second plurality of media items associated with the computer system to be included in the second category. The method also includes: when displaying a first user interface for configuring a system user interface, detecting a first input selecting a group of one or more categories among a plurality of categories; and after the group of one or more categories among the plurality of categories are selected by the first input, displaying the system user interface, wherein displaying the system user interface includes: displaying multiple versions of the system user interface with a first background over time, the multiple versions of the first background respectively including media items selected from media items in corresponding categories among the group of one or more categories among the plurality of categories, wherein: based on determining that the group of one or more categories among the plurality of categories includes a first category but not a second category, the multiple versions of the first background include media items from the first category but not media items from the second category; based on determining that the group of one or more categories among the plurality of categories includes the second category but not the first category, the multiple versions of the first background include media items from the second category but not media items from the first category; and based on determining that the group of one or more categories among the plurality of categories includes the first category and the second category, the multiple versions of the first background include one or more media items from the first category and one or more media items from the second category.
[0017] According to some embodiments, a method is performed at a computer system having a display generation component. The method includes: displaying a first representation of a system user interface via the display generation component, wherein the corresponding version of the system user interface includes a corresponding background and a corresponding group of one or more system user interface objects covering the corresponding background, and wherein the first representation of the system user interface corresponds to a first version of the system user interface, and the first version of the system user interface shows a first group of one or more system user interface objects covering the first background. The method also includes: when displaying the first representation of the system user interface corresponding to the first version of the system user interface, detecting the occurrence of a first condition, the first condition causing the computer system to change the appearance of the system user interface based on a first combination of a first background media item and a first filter for the system user interface. The method includes: in response to detecting the occurrence of a first condition that causes the computer system to change the appearance of the system user interface based on a first combination of a first background media item and a first filter for the system user interface: based on determining that the first combination of the first background media item and the first filter satisfies a first criterion, wherein the first criterion requires that a first set of one or more visual attributes of the first background media item satisfy a first requirement so that the first combination of the first background media item and the first filter satisfies the first criterion, applying a first version of the first filter to the first background media item to create a second version of the system user interface by modifying the first background media item in a first manner; and based on determining that the first combination of the first background media item and the first filter satisfies a second criterion, wherein the second criterion requires that a first set of one or more visual attributes of the first background media item satisfy a second requirement different from the first requirement so that the first background media item satisfies the second criterion, applying the second version of the first filter to the first background media item to create a second version of the system user interface by modifying the first background media item in a second manner different from the first manner.
[0018] According to some embodiments, a method is performed at a computer system having a display generation component. The method includes: displaying a wake-up screen user interface corresponding to a restricted state of the computer system via the display generation component, including displaying a first background and a plurality of system user interface objects covering at least a portion of the first background, wherein the first background includes a plurality of graphic elements arranged according to a first spatial configuration. The method also includes: when displaying the wake-up screen user interface corresponding to the restricted state of the computer system, a first user input including a request to release the wake-up screen user interface is detected. The method includes: in response to detecting a first user input including a request to release the wake-up screen user interface: moving the plurality of graphic elements in a first direction according to the first user input, while increasing the spatial gap between the plurality of graphic elements; and replacing the display of the wake-up screen user interface corresponding to the restricted state of the computer system with the display of a second user interface different from the wake-up screen user interface according to determining that the request to release the wake-up screen user interface included in the first user input meets the first criterion, including displaying a plurality of graphic elements in the second user interface, while reducing the spatial gap between the plurality of graphic elements.
[0019] According to some embodiments, an electronic device includes: a display, a touch-sensitive surface, one or more sensors for detecting the intensity of contact with the touch-sensitive surface, one or more tactile output generators, one or more processors, and a memory storing one or more programs; the one or more programs are configured to be executed by the one or more processors, and the one or more programs include instructions for performing or causing the execution of the operations of any of the methods described herein. According to some embodiments, a computer-readable storage medium stores therein instructions that, when executed by an electronic device having a display, a touch-sensitive surface, one or more sensors for detecting the intensity of contact with the touch-sensitive surface, and one or more tactile output generators, cause the device to perform the operations of any of the methods described herein or cause the operations of any of the methods described herein to be performed. According to some embodiments, a graphical user interface on an electronic device having a display, a touch-sensitive surface, one or more sensors for detecting the intensity of contact with the touch-sensitive surface, one or more tactile output generators, a memory, and one or more processors for executing one or more programs stored in the memory includes one or more elements displayed in any of the methods described herein, and the one or more elements are updated in response to input, as described in any of the methods described herein. According to some embodiments, an electronic device includes: a display, a touch-sensitive surface, one or more sensors for detecting the intensity of contact with the touch-sensitive surface, and optionally one or more tactile output generators; and a component for performing or causing the operation of any of the methods described herein. According to some embodiments, an information processing device used in an electronic device having a display, a touch-sensitive surface, one or more sensors for detecting the intensity of contact with the touch-sensitive surface, and optionally one or more tactile output generators includes a component for performing or causing the operation of any of the methods described herein to be performed.
[0020] Therefore, electronic devices having a display, a touch-sensitive surface, optionally one or more sensors for detecting contact intensity with the touch-sensitive surface, optionally one or more tactile output generators, optionally one or more device orientation sensors, and optionally an audio system are provided with improved methods and interfaces for modifying user interfaces and displaying notifications and / or status information, thereby improving the effectiveness, efficiency, and user satisfaction of these devices. Such methods and interfaces can supplement or replace conventional methods for modifying user interfaces and displaying notifications and / or status information. BRIEF DESCRIPTION OF THE DRAWINGS
[0021] For a better understanding of the various described embodiments, reference should be made to the following detailed description taken in conjunction with the following drawings, wherein like reference numerals designate corresponding parts throughout the several views.
[0022] Figure 1A is a block diagram illustrating a portable multifunction device with a touch-sensitive display according to some embodiments.
[0023] Figure 1B is a block diagram illustrating example components for event processing according to some embodiments.
[0024] Figure 2 A portable multifunction device with a touch screen according to some embodiments is shown.
[0025] Figure 3 is a block diagram of an exemplary multifunction device with a display and a touch-sensitive surface according to some embodiments.
[0026] Figure 4A An exemplary user interface for an application menu on a portable multifunction device according to some embodiments is shown.
[0027] Figure 4B An exemplary user interface for a multifunction device having a touch-sensitive surface separate from the display is shown according to some embodiments.
[0028] FIG. 5A to FIG. 5CB Example user interfaces for navigating and editing corresponding types of user interfaces are shown according to some embodiments.
[0029] FIG. 6A to FIG. 6AR An example user interface for an extended interface panel switcher according to some embodiments is shown.
[0030] Figure 7A to Figure 7V-3 Representations of multiple notifications in different configurations and user input for switching between different configurations are shown according to some embodiments.
[0031] FIG. 8A to FIG. 8AN An example user interface is shown for a session area for displaying ongoing events according to some embodiments.
[0032] FIG. 9A to FIG. 9I is a flowchart of a process for changing a user interface based on user input according to some embodiments.
[0033] FIG. 10A to FIG. 10I is a flowchart of a process for selecting and / or modifying a user interface according to some embodiments.
[0034] FIG. 11A to FIG. 11H is a flowchart of a process for modifying a user interface according to some embodiments.
[0035] FIG. 12A to FIG. 12Eis a flowchart of a process for displaying representations of multiple notifications in different configurations according to some embodiments.
[0036] FIG. 13A to FIG. 13G is a flowchart of a process for displaying status information in a session area based on a subscription according to some embodiments.
[0037] FIG. 14A to FIG. 14G is a flowchart of a process for changing between different configurations that may be used to display multiple notifications according to some embodiments.
[0038] FIG. 15A to FIG. 15I is a flowchart of a process for automatically randomly playing media items as a background according to some embodiments.
[0039] FIG. 16A to FIG. 16J is a flow diagram of a process for applying different versions of a filter to a background media item, according to some embodiments.
[0040] 17A to 17D is a flowchart of a process for providing feedback on a system user interface according to some embodiments. DETAILED DESCRIPTION
[0041] Many electronic devices have a graphical user interface that allows a user to navigate between an application user interface and / or a system user interface. Some methods for navigating between user interfaces enable multitasking so that even after navigating away from the corresponding application user interface, the corresponding application continues to update in the background. Some methods for providing a system user interface limit the customization of the system user interface, which may obscure certain elements and / or status information displayed on the system user interface. For example, with these methods, a user may need to navigate back to the corresponding application user interface in order to view updates. In the embodiment described below, an improved method for providing status updates for multiple applications in a persistent session area is provided. The method simplifies the ability of a user to view real-time status information of an active session, thereby eliminating the need for an additional, separate step of navigating back to the corresponding user interface of the corresponding application to view status updates.
[0042] The methods, devices, and GUIs described herein use tactile feedback in a variety of ways to improve user interface interaction. For example, they make it easier to indicate hidden thresholds and to indicate user interface components that represent selectable options.
[0043] The processes described below enhance the operability of the device and make the user-device interface more efficient (e.g., by helping the user provide appropriate input and reducing user errors when operating / interacting with the device) through various techniques, including by providing improved visual, auditory, and / or tactile feedback to the user, reducing the number of inputs required to perform an operation, providing additional control options without cluttering the user interface with additional displayed controls, performing an operation without further user input when a set of conditions have been met, and / or additional techniques. These techniques also reduce power usage and extend the battery life of the device by enabling the user to use the device more quickly and more efficiently.
[0044] under, Figure 1A to Figure 1B , Figure 2 and Figure 3 A description of an exemplary apparatus is provided. FIG. 4A to FIG. 4B and FIG. 5A to FIG. 5CB Example user interfaces for navigating and editing corresponding types of user interfaces are shown. FIG. 6A to FIG. 6AR An example user interface for an extended interface panel switcher is shown. Figure 7A to Figure 7V-3 Representations of multiple notifications in different configurations and user input for switching between the different configurations are shown. FIG. 8A to FIG. 8AN An example user interface for displaying a session area of an ongoing event is shown. FIG. 9A to FIG. 9I A flow chart of a method of changing a user interface based on user input is shown. FIG. 10A to FIG. 10I A flow chart of a method of selecting and / or modifying a user interface is shown. FIG. 11A to FIG. 11H A flow chart of a method of modifying a user interface is shown. FIG. 12A to FIG. 12E A flow diagram of a method of displaying representations of multiple notifications in different configurations is shown. FIG. 13A to FIG. 13G A flow chart of a method for displaying status information in a session area based on a subscription is shown. FIG. 14A to FIG. 14G A flow diagram of a method of changing between different configurations of representations that may be used to display multiple notifications is shown. FIG. 15A to FIG. 15I is a flowchart of a process for automatically randomly playing media items as a background according to some embodiments. FIG. 16A to FIG. 16J is a flow diagram of a process for applying different versions of a filter to a background media item, according to some embodiments. 17A to 17D is a flowchart of a process for providing feedback in a system user interface according to some embodiments. FIG. 5A to FIG. 5CB , FIG. 6A to FIG. 6AR , Figure 7A to Figure 7V-3 and FIG. 8A to FIG. 8AN The user interface in FIG. 9A to FIG. 9I , FIG. 10A to FIG. 10I , FIG. 11A to FIG. 11H , FIG. 12A to FIG. 12E , FIG. 13A to FIG. 13G , FIG. 14A to FIG. 14G, FIG. 15A to FIG. 15I , FIG. 16A to FIG. 16J and 17A to 17D process.
[0045] Exemplary Devices
[0046] Reference will now be made in detail to the embodiments, examples of which are illustrated in the accompanying drawings. Many specific details are shown in the following detailed description in order to provide a full understanding of the various described embodiments. However, it will be apparent to one of ordinary skill in the art that the various described embodiments can be practiced without these specific details. In other cases, well-known methods, processes, components, circuits, and networks are not described in detail, so as not to unnecessarily obscure various aspects of the embodiments.
[0047] It will also be understood that, although in some cases, the terms "first", "second", etc. are used to describe various elements in this article, these elements should not be limited by these terms. These terms are only used to distinguish one element from another element. For example, the first contact can be named as the second contact, and similarly, the second contact can be named as the first contact without departing from the scope of the various described embodiments. The first contact and the second contact are both contacts, but they are not the same contact unless the context clearly indicates otherwise.
[0048] The terms used in the description of various described embodiments herein are only for the purpose of describing specific embodiments, and are not intended to be limited. As used in the description of various described embodiments and in the appended claims, the singular forms "one" and "the" are intended to also include plural forms, unless the context clearly indicates otherwise. It will also be understood that the term "and / or" used herein refers to and encompasses any and all possible combinations of one or more items in the associated listed items. It will also be understood that the terms "including" and / or "comprising" when used in this specification specify the presence of stated features, integers, steps, operations, elements and / or components, but do not exclude the presence or addition of one or more other features, integers, steps, operations, elements, components and / or their grouping.
[0049] As used herein, the term "if" is optionally interpreted to mean "when" followed by "upon" or "in response to determining" or "in response to detecting," depending on the context. Similarly, the phrases "if it is determined that" or "if [a stated condition or event] is detected" are optionally interpreted to mean "upon determining that" or "in response to determining that" or "upon detecting [a stated condition or event]" or "in response to detecting [a stated condition or event]," depending on the context.
[0050] Embodiments of electronic devices, user interfaces for such devices, and associated processes for using such devices are described herein. In some embodiments, the device is a portable communication device, such as a mobile phone, that also includes other functions, such as a PDA and / or a music player function. Exemplary embodiments of portable multifunction devices include, but are not limited to, the Apple Watch from Apple Inc., Cupertino, California. iPod and Device. Other portable electronic devices, such as laptop computers or tablet computers with touch-sensitive surfaces (e.g., touch screen displays and / or trackpads) are optionally used. It should also be understood that in some embodiments, the device is not a portable communication device, but a desktop computer with a touch-sensitive surface (e.g., touch screen displays and / or trackpads).
[0051] In the following discussion, an electronic device including a display and a touch-sensitive surface is described. However, it should be understood that the electronic device optionally includes one or more other physical user interface devices, such as a physical keyboard, mouse and / or joystick.
[0052] The device typically supports a variety of applications, such as one or more of the following applications: a note-taking application, a drawing application, a presentation application, a word processing application, a website creation application, a disk editing application, a spreadsheet application, a gaming application, a telephony application, a video conferencing application, a mail application, an instant messaging application, a fitness support application, a photo management application, a digital camera application, a digital video camera application, a web browsing application, a digital music player application, and / or a digital video player application.
[0053] Various applications executed on the device optionally use at least one common physical user interface device, such as a touch-sensitive surface. One or more functions of the touch-sensitive surface and corresponding information displayed on the device are optionally adjusted and / or varied for different applications, and / or adjusted and / or varied within the respective applications. In this way, the common physical architecture of the device (such as a touch-sensitive surface) optionally supports a variety of applications with a user interface that is intuitive and clear to the user.
[0054] Attention is now turned to embodiments of portable devices having touch-sensitive displays. Figure 1A1 is a block diagram illustrating a portable multifunction device 100 with a touch-sensitive display system 112 according to some embodiments. The touch-sensitive display system 112 is sometimes referred to as a "touch screen" for convenience, and is sometimes simply referred to as a touch-sensitive display. The device 100 includes a memory 102 (which optionally includes one or more computer-readable storage media), a memory controller 122, one or more processing units (CPUs) 120, a peripheral device interface 118, an RF circuit 108, an audio circuit 110, a speaker 111, a microphone 113, an input / output (I / O) subsystem 106, other input, or control devices 116, and an external port 124. The device 100 optionally includes one or more optical sensors 164. The device 100 optionally includes one or more intensity sensors 165 for detecting the intensity of contact on the device 100 (e.g., a touch-sensitive surface, such as the touch-sensitive display system 112 of the device 100). Device 100 optionally includes one or more tactile output generators 167 for generating tactile output on device 100 (e.g., generating tactile output on a touch-sensitive surface such as touch-sensitive display system 112 of device 100 or touch pad 355 of device 300). These components optionally communicate via one or more communication buses or signal lines 103.
[0055] As used in this specification and claims, the term "tactile output" refers to a physical displacement of a device relative to a previous position of the device, a physical displacement of a component of the device (e.g., a touch-sensitive surface) relative to another component of the device (e.g., a housing), or a displacement of a component relative to the center of mass of the device, which will be detected by a user using the user's sense of touch. For example, in the case where a device or a component of the device is in contact with a user's touch-sensitive surface (e.g., a finger, palm, or other part of the user's hand), the tactile output generated by the physical displacement will be interpreted by the user as a tactile sensation corresponding to a perceived change in the physical properties of the device or component of the device. For example, movement of a touch-sensitive surface (e.g., a touch-sensitive display or trackpad) is optionally interpreted by the user as a "press click" or "release click" to a physical actuation button. In some cases, the user will feel a tactile sensation, such as a "press click" or "release click", even when the physical actuation button associated with the touch-sensitive surface that is physically pressed (e.g., displaced) by the user's movement does not move. As another example, even when the smoothness of the touch-sensitive surface does not change, the movement of the touch-sensitive surface may be optionally interpreted or sensed by the user as the "roughness" of the touch-sensitive surface. Although such interpretation of touch by the user will be limited by the user's individualized sensory perception, many sensory perceptions of touch are common to most users. Therefore, when a tactile output is described as corresponding to a specific sensory perception of a user (e.g., "press click", "release click", "roughness"), unless otherwise stated, the generated tactile output corresponds to a physical displacement of the device or its components that will generate the sensory perception of a typical (or ordinary) user. Providing tactile feedback to the user using tactile output enhances the operability of the device and makes the user-device interface more efficient (e.g., by helping the user provide appropriate input and reducing user errors when operating / interacting with the device), which further reduces power usage and extends the battery life of the device by enabling the user to use the device more quickly and efficiently.
[0056] In some embodiments, the tactile output pattern specifies characteristics of the tactile output, such as the amplitude of the tactile output, the shape of the motion waveform of the tactile output, the frequency of the tactile output, and / or the duration of the tactile output.
[0057] When a device (e.g., one or more tactile output generators that generate tactile output via moving a movable mass) generates tactile output with different tactile output patterns, the tactile output can produce different tactile sensations in a user holding or touching the device. Although the user's senses are based on the user's perception of the tactile output, most users will be able to recognize changes in the waveform, frequency, and amplitude of the tactile output generated by the device. Therefore, the waveform, frequency, and amplitude can be adjusted to indicate to the user that different operations have been performed. Therefore, a tactile output with a tactile output pattern designed, selected, and / or arranged to simulate the characteristics (e.g., size, material, weight, stiffness, smoothness, etc.) of an object in a given environment (e.g., a user interface including graphical features and objects, a simulated physical environment with virtual boundaries and virtual objects, a real physical environment with physical boundaries and physical objects, and / or a combination of any of the above); behavior (e.g., oscillation, displacement, acceleration, rotation, extension, etc.); and / or interaction (e.g., collision, adhesion, repulsion, attraction, friction, etc.) will provide helpful feedback to the user in some cases, which reduces input errors and improves the efficiency of the user's operation of the device. In addition, tactile output is optionally generated to correspond to feedback that is independent of simulated physical properties (such as input threshold or object selection). Such tactile output will provide helpful feedback to the user in some cases, which reduces input errors and improves the efficiency of the user's operation of the device.
[0058] In some embodiments, the tactile output with a suitable tactile output mode serves as a prompt for an event of interest in the user interface or behind the screen in the device. Examples of events of interest include activation of affordances (such as real or virtual buttons or toggle switches) provided on the device or in the user interface, the success or failure of the requested operation, reaching or crossing a boundary in the user interface, entering a new state, switching input focus between objects, activating a new mode, reaching or crossing an input threshold, detecting or identifying a type of input or gesture, etc. In some embodiments, a tactile output is provided to serve as a warning or prompt for an upcoming event or result that will occur unless a change in direction or interruption input is detected in time. Tactile output is also used in other contexts to enrich user experience, improve accessibility of devices for users with visual or motor difficulties or other accessibility needs, and / or improve the efficiency and functionality of user interfaces and / or devices. Optionally, the tactile output is compared with audio input and / or visual user interface changes, which further enhances the user's experience when the user interacts with the user interface and / or device, and is conducive to better transmission of information about the state of the user interface and / or device, and this reduces input errors and improves the efficiency of user operations on the device.
[0059] It should be understood that device 100 is merely one example of a portable multifunction device, and that device 100 optionally has more or fewer components than shown, optionally combines two or more components, or optionally has a different configuration or arrangement of the components. Figure 1A The various components shown are implemented in hardware, software, firmware, or any combination thereof, including one or more signal processing circuits and / or application specific integrated circuits.
[0060] The memory 102 optionally includes high-speed random access memory, and optionally also includes non-volatile memory, such as one or more disk storage devices, flash memory devices or other non-volatile solid-state memory devices. Access to the memory 102 by other components of the device 100 (such as the CPU 120 and the peripheral device interface 118) is optionally controlled by a memory controller 122.
[0061] Peripheral interface 118 may be used to couple the device's input and output peripherals to CPU 120 and memory 102. One or more processors 120 run or execute various software programs and / or instruction sets stored in memory 102 to perform various functions of device 100 and process data.
[0062] In some embodiments, peripherals interface 118, CPU 120, and memory controller 122 are optionally implemented on a single chip, such as chip 104. In some other embodiments, they are optionally implemented on separate chips.
[0063] RF (radio frequency) circuit 108 receives and sends RF signals, also referred to as electromagnetic signals. RF circuit 108 converts electrical signals into / from electromagnetic signals and communicates with a communication network and other communication devices via electromagnetic signals. RF circuit 108 optionally includes well-known circuits for performing these functions, including but not limited to an antenna system, an RF transceiver, one or more amplifiers, a tuner, one or more oscillators, a digital signal processor, a codec chipset, a subscriber identity module (SIM) card, memory, and the like. RF circuit 108 optionally communicates with networks and other devices via wireless communications, such as the Internet (also referred to as the World Wide Web (WWW)), an intranet, and / or a wireless network (such as a cellular telephone network, a wireless local area network (LAN), and / or a metropolitan area network (MAN)). The wireless communication optionally uses any of a variety of communication standards, protocols and technologies, including, but not limited to, Global System for Mobile Communications (GSM), Enhanced Data GSM Environment (EDGE), High Speed Downlink Packet Access (HSDPA), High Speed Uplink Packet Access (HSUPA), Evolution-Data-only (EV-DO), HSPA, HSPA+, Dual Cell HSPA (DC-HSPA), Long Term Evolution (LTE), Near Field Communication (NFC), Wideband Code Division Multiple Access (W-CDMA), Code Division Multiple Access (CDMA), Time Division Multiple Access (TDMA), Bluetooth, Wireless Fidelity (Wi-Fi) (e.g., IEEE 802.11a, IEEE 802.11ac, IEEE 802.11ax, IEEE 802.11b, IEEE 802.11d), IEEE 802.11d, IEEE 802.11d, IEEE 802.11d, IEEE 802.11d, IEEE 802.11d, IEEE 802.11d, IEEE 802.11d, IEEE 802.11d, IEEE 802.11d, IEEE 802.11d, IEEE 802.11g and / or IEEE 802.11n), Voice over Internet Protocol (VoIP), Wi-MAX, email protocols (e.g., Internet Message Access Protocol (IMAP) and / or Post Office Protocol (POP)), instant messaging (e.g., Extensible Messaging and Presence Protocol (XMPP), Session Initiation Protocol for Instant Messaging and Presence Utilizing Extensions (SIMPLE), Instant Messaging and Presence Service (IMPS)), and / or Short Message Service (SMS), or any other suitable communication protocol including communication protocols that have not been developed on the date of filing of this document.
[0064] The audio circuit 110, speaker 111, and microphone 113 provide an audio interface between a user and the device 100. The audio circuit 110 receives audio data from the peripheral device interface 118, converts the audio data into electrical signals, and transmits the electrical signals to the speaker 111. The speaker 111 converts the electrical signals into sound waves audible to humans. The audio circuit 110 also receives electrical signals converted from sound waves by the microphone 113. The audio circuit 110 converts the electrical signals into audio data and transmits the audio data to the peripheral device interface 118 for processing. The audio data is optionally retrieved from and / or transmitted to the memory 102 and / or the RF circuit 108 by the peripheral device interface 118. In some embodiments, the audio circuit 110 also includes a headset jack (e.g., Figure 2 The headset jack provides an interface between the audio circuit 110 and a removable audio input / output peripheral device, such as an output-only headset or a headset having both output (e.g., a single or dual-ear headset) and input (e.g., a microphone).
[0065] The I / O subsystem 106 couples input / output peripherals on the device 100, such as a touch-sensitive display system 112 and other input or control devices 116, to a peripheral device interface 118. The I / O subsystem 106 optionally includes a display controller 156, an optical sensor controller 158, an intensity sensor controller 159, a tactile feedback controller 161, and one or more input controllers 160 for other input or control devices. The one or more input controllers 160 receive / send electrical signals from / to other input or control devices 116. Other input control devices 116 optionally include physical buttons (e.g., push buttons, rocker buttons, etc.), dials, slide switches, joysticks, click wheels, etc. In some alternative embodiments, the one or more input controllers 160 are optionally coupled to any (or none) of the following: a keyboard, an infrared port, a USB port, a stylus, and / or a pointer device such as a mouse. One or more buttons (e.g., Figure 2 208) optionally includes an up / down button for volume control of the speaker 111 and / or the microphone 113. The one or more buttons optionally include a push button (e.g., Figure 2 206).
[0066] The touch-sensitive display system 112 provides an input interface and an output interface between the device and the user. The display controller 156 receives electrical signals from the touch-sensitive display system 112 and / or sends electrical signals to the touch-sensitive display system. The touch-sensitive display system 112 displays visual output to the user. The visual output optionally includes graphics, text, icons, videos, and any combination thereof (collectively referred to as "graphics"). In some embodiments, some visual outputs or all of the visual outputs correspond to user interface objects. As used herein, the term "indicator" refers to a user-interactive graphical user interface object (e.g., a graphical user interface object configured to respond to input directed to a graphical user interface object). Examples of user-interactive graphical user interface objects include, but are not limited to, buttons, sliders, icons, selectable menu items, switches, hyperlinks, or other user interface controls.
[0067] The touch-sensitive display system 112 has a touch-sensitive surface, sensor, or sensor group that accepts input from a user based on tactile and / or haptic contact. The touch-sensitive display system 112 and display controller 156 (together with any associated modules and / or instruction sets in memory 102) detect contact (and any movement or interruption of that contact) on the touch-sensitive display system 112 and convert the detected contact into interaction with a user interface object (e.g., one or more soft keys, icons, web pages, or images) displayed on the touch-sensitive display system 112. In some embodiments, the point of contact between the touch-sensitive display system 112 and the user corresponds to the user's finger or stylus.
[0068] The touch-sensitive display system 112 optionally uses LCD (liquid crystal display) technology, LPD (light emitting polymer display) technology, or LED (light emitting diode) technology, although other display technologies are used in other embodiments. The touch-sensitive display system 112 and display controller 156 optionally use any of a variety of touch sensing technologies now known or later developed, including but not limited to capacitive, resistive, infrared, and surface acoustic wave technologies, as well as other proximity sensor arrays or other elements for determining one or more points of contact with the touch-sensitive display system 112 to detect contact and any movement or interruption thereof. In some embodiments, projected mutual capacitance sensing technology is used, such as the . iPod and Technology found in.
[0069] The touch-sensitive display system 112 optionally has a video resolution of more than 100 dpi. In some embodiments, the touch screen video resolution exceeds 400 dpi (e.g., 500 dpi, 800 dpi or greater). The user optionally uses any suitable object or attachment such as a stylus, finger, etc. to contact the touch-sensitive display system 112. In some embodiments, the user interface is designed to work with finger-based contacts and gestures, which may not be as accurate as stylus-based input due to the larger contact area of the finger on the touch screen. In some embodiments, the device converts rough finger-based input into precise pointer / cursor positioning or commands for performing the actions desired by the user.
[0070] In some embodiments, in addition to the touch screen, the device 100 optionally includes a touchpad for activating or deactivating specific functions. In some embodiments, the touchpad is a touch-sensitive area of the device that, unlike the touch screen, does not display visual output. The touchpad is optionally a touch-sensitive surface that is separate from the touch-sensitive display system 112, or an extension of the touch-sensitive surface formed by the touch screen.
[0071] Device 100 also includes a power system 162 for powering the various components. Power system 162 optionally includes a power management system, one or more power sources (e.g., batteries, alternating current (AC)), a recharging system, power fault detection circuits, power converters or inverters, power status indicators (e.g., light emitting diodes (LEDs)), and any other components associated with the generation, management, and distribution of power in a portable device.
[0072] Device 100 optionally also includes one or more optical sensors 164 (eg, as part of one or more cameras). Figure 1A An optical sensor coupled to an optical sensor controller 158 in the I / O subsystem 106 is shown. One or more optical sensors 164 optionally include a charge coupled device (CCD) or a complementary metal oxide semiconductor (CMOS) phototransistor. One or more optical sensors 164 receive light projected through one or more lenses from the environment and convert the light into data representing an image. In conjunction with an imaging module 143 (also called a camera module), one or more optical sensors 164 optionally capture static images and / or videos. In some embodiments, an optical sensor is located on the rear portion of the device 100 opposite to the touch-sensitive display system 112 on the front of the device, so that the touch screen can be used as a viewfinder for static image and / or video image acquisition. In some embodiments, another optical sensor is located on the front of the device to obtain an image of the user (e.g., for self-portraits, for video conferencing when the user is watching other video conference participants on the touch screen, etc.).
[0073] Device 100 optionally also includes one or more contact intensity sensors 165 . Figure 1A A contact force sensor coupled to a force sensor controller 159 in the I / O subsystem 106 is shown. One or more contact force sensors 165 optionally include one or more piezoresistive strain gauges, capacitive force sensors, electrical force sensors, piezoelectric force sensors, optical force sensors, capacitive touch-sensitive surfaces, or other force sensors (e.g., sensors for measuring the force (or pressure) of contact on a touch-sensitive surface). One or more contact force sensors 165 receive contact force information (e.g., pressure information or a surrogate for pressure information) from the environment. In some embodiments, at least one contact force sensor is juxtaposed or adjacent to a touch-sensitive surface (e.g., touch-sensitive display system 112). In some embodiments, at least one contact force sensor is located on the rear of the device 100 opposite to the touch-sensitive display system 112 located on the front of the device 100.
[0074] Device 100 optionally also includes one or more proximity sensors 166 . Figure 1A A proximity sensor 166 is shown coupled to the peripherals interface 118. Alternatively, the proximity sensor 166 is coupled to the input controller 160 in the I / O subsystem 106. In some embodiments, when the multifunction device is placed near the user's ear (e.g., when the user is on a phone call), the proximity sensor turns off and disables the touch-sensitive display system 112.
[0075] Device 100 optionally also includes one or more tactile output generators 167 . Figure 1AA tactile output generator coupled to a tactile feedback controller 161 in the I / O subsystem 106 is shown. In some embodiments, the tactile output generator 167 includes one or more electroacoustic devices such as a speaker or other audio component; and / or an electromechanical device for converting energy into linear motion such as a motor, solenoid, electroactive polymer, piezoelectric actuator, electrostatic actuator, or other tactile output generating component (e.g., a component for converting an electrical signal into a tactile output on the device). The tactile output generator 167 receives tactile feedback generation instructions from the tactile feedback module 133 and generates a tactile output on the device 100 that can be felt by a user of the device 100. In some embodiments, at least one tactile output generator is arranged in juxtaposition or proximity to a touch-sensitive surface (e.g., a touch-sensitive display system 112), and optionally generates a tactile output by moving the touch-sensitive surface vertically (e.g., inward / outward of the surface of the device 100) or laterally (e.g., backward and forward in the same plane as the surface of the device 100). In some embodiments, at least one tactile output generator sensor is located on a rear portion of the device 100 opposite the touch-sensitive display system 112 located on the front of the device 100.
[0076] Device 100 optionally also includes one or more accelerometers 168 . Figure 1A An accelerometer 168 is shown coupled to the peripheral device interface 118. Alternatively, the accelerometer 168 is optionally coupled to the input controller 160 in the I / O subsystem 106. In some embodiments, information is displayed in a portrait view or a landscape view on the touch screen display based on an analysis of data received from the one or more accelerometers. The device 100 optionally includes a magnetometer and a GPS (or GLONASS or other global navigation system) receiver in addition to the accelerometer 168 for obtaining information about the position and orientation (e.g., portrait or landscape) of the device 100.
[0077] In some embodiments, the software components stored in memory 102 include an operating system 126, a communication module (or instruction set) 128, a contact / motion module (or instruction set) 130, a graphics module (or instruction set) 132, a tactile feedback module (or instruction set) 133, a text input module (or instruction set) 134, a global positioning system (GPS) module (or instruction set) 135, and an application (or instruction set) 136. In addition, in some embodiments, memory 102 stores device / global internal state 157, as shown in FIG. 1A and FIG. Figure 3. The device / global internal state 157 includes one or more of the following: an active application state, which indicates which applications (if any) are currently active; a display state, which indicates what applications, views, or other information occupy various areas of the touch-sensitive display system 112; a sensor state, which includes information obtained from the device's various sensors and other input or control devices 116; and position and / or location information about the device's position and / or posture.
[0078] The operating system 126 (e.g., iOS, Darwin, RTXC, LINUX, UNIX, OS X, WINDOWS, or an embedded operating system such as VxWorks) includes various software components and / or drivers for controlling and managing general system tasks (e.g., memory management, storage device control, power management, etc.), and facilitates communication between various hardware and software components.
[0079] The communication module 128 facilitates communication with other devices through one or more external ports 124, and also includes various software components for processing data received by the RF circuit 108 and / or the external port 124. The external port 124 (e.g., Universal Serial Bus (USB), FireWire, etc.) is suitable for coupling directly to other devices, or indirectly through a network (e.g., the Internet, wireless LAN, etc.). In some embodiments, the external port is a device that is compatible with some of Apple Inc. (Cupertino, California). iPod and In some embodiments, the external port is a multi-pin (e.g., 30-pin) connector that is the same as or similar to and / or compatible with the 30-pin connector used in Apple Inc. (Cupertino, California). iPod and In some embodiments, the external port is a USB Type-C connector that is the same as, similar to, and / or compatible with the Lightning connector used in Apple Inc. (Cupertino, California) electronic devices.
[0080] The contact / motion module 130 optionally detects contact with the touch-sensitive display system 112 (in conjunction with the display controller 156) and other touch-sensitive devices (e.g., a touchpad or physical click wheel). The contact / motion module 130 includes various software components for performing various operations related to contact detection (e.g., by a finger or stylus), such as determining whether contact has occurred (e.g., detecting a finger press event), determining the strength of the contact (e.g., the force or pressure of the contact, or a substitute for the force or pressure of the contact), determining whether there is movement of the contact and tracking the movement across the touch-sensitive surface (e.g., detecting one or more finger drag events), and determining whether the contact has stopped (e.g., detecting a finger lift event or contact disconnection). The contact / motion module 130 receives contact data from the touch-sensitive surface. Determining the movement of a contact point optionally includes determining a rate (magnitude), velocity (magnitude and direction), and / or acceleration (change in magnitude and / or direction) of the contact point, the movement of which is represented by a series of contact data. These operations are optionally applied to a single point of contact (e.g., a single finger contact or stylus contact) or multiple points of simultaneous contact (e.g., "multi-touch" / multi-finger contact). In some embodiments, contact / motion module 130 and display controller 156 detect contact on a touch pad.
[0081] The contact / motion module 130 optionally detects gesture input by the user. Different gestures on the touch-sensitive surface have different contact patterns (e.g., different motions, timings, and / or intensities of the detected contacts). Therefore, gestures are optionally detected by detecting specific contact patterns. For example, detecting a single-finger tap gesture includes detecting a finger press event, and then detecting a finger lift (lift-off) event at the same location (or substantially the same location) as the finger press event (e.g., at an icon location). As another example, detecting a finger swipe gesture on the touch-sensitive surface includes detecting a finger press event, then detecting one or more finger drag events, and then detecting a finger lift (lift-off) event. Similarly, taps, swipes, drags, and other gestures of the stylus are optionally detected by detecting a specific contact pattern of the stylus.
[0082] In some embodiments, detecting a finger tap gesture depends on detecting the length of time between a finger press event and a finger lift event, but is independent of the strength of the finger contact between the finger press event and the finger lift event. In some embodiments, a tap gesture is detected based on determining that the length of time between the finger press event and the finger lift event is less than a predetermined value (e.g., less than 0.1 seconds, 0.2 seconds, 0.3 seconds, 0.4 seconds, or 0.5 seconds), regardless of whether the strength of the finger contact during the tap reaches a given strength threshold (greater than a nominal contact detection strength threshold), such as a light press or deep press strength threshold. Therefore, a finger tap gesture can meet a specific input criterion that does not require the characteristic strength of the contact to meet a given strength threshold to meet the specific input criterion. For clarity, the finger contact in a tap gesture is generally required to meet a nominal contact detection strength threshold to detect a finger press event, and the contact will not be detected when it is below the nominal contact detection strength threshold. A similar analysis applies to detecting a tap gesture by a stylus or other contact. In the case where the device is capable of detecting contact with a finger or stylus hovering over the touch-sensitive surface, the nominal contact detection intensity threshold optionally does not correspond to physical contact between the finger or stylus and the touch-sensitive surface.
[0083] The same concepts apply in a similar manner to other types of gestures. For example, a swipe gesture, a pinch gesture, an expand gesture, and / or a long press gesture may be optionally detected based on satisfying criteria that are independent of the strength of the contacts included in the gesture or that do not require one or more contacts performing the gesture to reach a strength threshold in order to be recognized. For example, a swipe gesture is detected based on the amount of movement of one or more contacts; a pinch gesture is detected based on the movement of two or more contacts toward each other; an expand gesture is detected based on the movement of two or more contacts away from each other; and a long press gesture is detected based on the duration of a contact on a touch-sensitive surface having less than a threshold amount of movement. Thus, the statement that a particular gesture recognition criterion does not require the strength of the contacts to satisfy a corresponding strength threshold in order to satisfy the particular gesture recognition criterion means that the particular gesture recognition criterion can be satisfied when the contacts in the gesture do not reach the corresponding strength threshold, and can also be satisfied when one or more contacts in the gesture reach or exceed the corresponding strength threshold. In some embodiments, a tap gesture is detected based on determining that a finger down event and a finger up event are detected within a predefined time period, regardless of whether the contact is above or below a corresponding strength threshold during the predefined time period, and a swipe gesture is detected based on determining that the contact moves greater than a predefined amount, even if the contact is above the corresponding strength threshold at the end of the contact movement. Even in specific implementations where detection of gestures is affected by the strength of the contact performing the gesture (e.g., the device detects a long press more quickly when the strength of the contact is above the strength threshold, or the device delays detection of a tap input when the strength of the contact is higher), detection of these gestures does not require the contact to reach a particular strength threshold (e.g., even if the amount of time required to recognize the gesture varies), as long as the criteria for recognizing the gesture can be met without the contact reaching the particular strength threshold.
[0084] In some cases, the contact intensity threshold, duration threshold, and movement threshold are combined in various combinations to create a heuristic algorithm to distinguish between two or more different gestures for the same input element or area, so that multiple different interactions with the same input element can provide a richer set of user interactions and responses. The statement that a particular set of gesture recognition criteria does not require the intensity of one or more contacts to meet the corresponding intensity threshold in order to meet the particular gesture recognition criteria does not exclude the simultaneous evaluation of other intensity-related gesture recognition criteria to identify other gestures with criteria that are met when the gesture includes a contact with an intensity above the corresponding intensity threshold. For example, in some cases, a first gesture recognition criterion for a first gesture (which does not require the intensity of the contact to meet the corresponding intensity threshold to meet the first gesture recognition criterion) competes with a second gesture recognition criterion for a second gesture (which depends on the contact reaching the corresponding intensity threshold). In such a competition, if the second gesture recognition criterion for the second gesture is met first, the gesture is optionally not recognized as satisfying the first gesture recognition criterion for the first gesture. For example, if the contact reaches the corresponding intensity threshold before the contact moves a predefined amount of movement, a deep press gesture is detected instead of a swipe gesture. Conversely, if the contact moves the predefined amount of movement before the contact reaches the corresponding intensity threshold, a swipe gesture is detected instead of a deep press gesture. Even in such cases, the first gesture recognition criteria for the first gesture still does not require the intensity of the contact to satisfy the corresponding intensity threshold to satisfy the first gesture recognition criteria because if the contact remains below the corresponding intensity threshold until the gesture ends (e.g., a swipe gesture with an intensity of the contact that does not increase above the corresponding intensity threshold), the gesture will be recognized as a swipe gesture by the first gesture recognition criteria. Thus, a particular gesture recognition criterion that does not require the intensity of the contact to satisfy the corresponding intensity threshold to satisfy the particular gesture recognition criterion will (A) in some cases ignore the intensity of the contact relative to the intensity threshold (e.g., for a tap gesture) and / or (B) in some cases fail to satisfy the particular gesture recognition criterion (e.g., for a long press gesture) if a set of competing intensity-related gesture recognition criteria (e.g., for a deep press gesture) recognizes the input as corresponding to an intensity-related gesture before the particular gesture recognition criterion recognizes the gesture corresponding to the input, and in this sense still depends on the intensity of the contact relative to the intensity threshold (e.g., for a long press gesture competing with the deep press gesture for recognition).
[0085] Graphics module 132 includes various known software components for rendering and displaying graphics on touch-sensitive display system 112 or other displays, including components for changing the visual impact (e.g., brightness, transparency, saturation, contrast, or other visual attributes) of displayed graphics. As used herein, the term "graphics" includes any object that can be displayed to a user, including, without limitation, text, web pages, icons (such as user interface objects including soft keys), digital images, videos, animations, etc.
[0086] In some embodiments, the graphics module 132 stores data representing graphics to be used. Each graphic is optionally assigned a corresponding code. The graphics module 132 receives one or more codes for specifying the graphics to be displayed from an application program, etc., and also receives coordinate data and other graphic attribute data together if necessary, and then generates screen image data to be output to the display controller 156.
[0087] Haptic feedback module 133 includes various software components for generating instructions (e.g., instructions used by haptic feedback controller 161) to generate tactile output at one or more locations on device 100 using tactile output generator 167 in response to user interaction with device 100.
[0088] Text input module 134, which is optionally a component of graphics module 132, provides a soft keyboard for entering text in various applications (e.g., contacts 137, email 140, IM 141, browser 147, and any other application requiring text input).
[0089] The GPS module 135 determines the location of the device and provides this information for use in various applications (e.g., to the phone 138 for location-based dialing; to the camera 143 as picture / video metadata; and to applications that provide location-based services such as a weather widget, local yellow pages widget, and a map / navigation widget).
[0090] The application 136 optionally includes the following modules (or instruction sets) or a subset or superset thereof:
[0091] ● Contacts module 137 (sometimes called address book or contact list);
[0092] ● Telephone module 138;
[0093] ● Video conferencing module 139;
[0094] ● Email client module 140;
[0095] ●Instant messaging (IM) module 141;
[0096] ●Fitness support module 142;
[0097] ● Camera module 143 for still images and / or video images;
[0098] ●Image management module 144;
[0099] ●Browser module 147;
[0100] ●Calendar module 148;
[0101] A widget module 149, which optionally includes one or more of the following: a weather widget 149-1, a stock market widget 149-2, a calculator widget 149-3, an alarm widget 149-4, a dictionary widget 149-5, and other widgets acquired by the user, and a user-created widget 149-6;
[0102] A widget creator module 150 for forming a user-created widget 149-6;
[0103] ●Search module 151;
[0104] ● A video and music player module 152, optionally consisting of a video player module and a music player module;
[0105] ●Note module 153;
[0106] ● Map module 154; and / or
[0107] ●Online video module 155.
[0108] Examples of other applications 136 optionally stored in memory 102 include other word processing applications, other image editing applications, drawing applications, rendering applications, JAVA-enabled applications, encryption, digital rights management, voice recognition, and voice replication.
[0109] In conjunction with the touch-sensitive display system 112, display controller 156, contact module 130, graphics module 132, and text input module 134, the contact module 137 includes executable instructions for managing an address book or contact list (e.g., stored in the application internal state 192 of the contact module 137 in memory 102 or memory 370), including: adding names to the address book; deleting names from the address book; associating phone numbers, email addresses, physical addresses, or other information with names; associating images with names; categorizing and classifying names; providing phone numbers and / or email addresses to initiate and / or facilitate communications via telephone 138, video conferencing 139, email 140, or IM 141; etc.
[0110] In conjunction with RF circuitry 108, audio circuitry 110, speaker 111, microphone 113, touch-sensitive display system 112, display controller 156, contact module 130, graphics module 132, and text input module 134, phone module 138 includes executable instructions for entering a sequence of characters corresponding to a phone number, accessing one or more phone numbers in address book 137, modifying an entered phone number, dialing a corresponding phone number, conducting a conversation, and disconnecting or hanging up when the conversation is complete. As described above, wireless communications optionally use any of a variety of communication standards, protocols, and technologies.
[0111] In combination with RF circuitry 108, audio circuitry 110, speaker 111, microphone 113, touch-sensitive display system 112, display controller 156, one or more optical sensors 164, optical sensor controller 158, contact module 130, graphics module 132, text input module 134, contact list 137, and phone module 138, video conferencing module 139 includes executable instructions for initiating, conducting, and terminating a video conference between a user and one or more other participants in accordance with user instructions.
[0112] In conjunction with RF circuit 108, touch-sensitive display system 112, display controller 156, contact module 130, graphics module 132, and text input module 134, email client module 140 includes executable instructions for creating, sending, receiving, and managing emails in response to user instructions. In conjunction with image management module 144, email client module 140 makes it very easy to create and send emails with still images or video images captured by camera module 143.
[0113] In conjunction with the RF circuit 108, the touch-sensitive display system 112, the display controller 156, the contact module 130, the graphics module 132, and the text input module 134, the instant messaging module 141 includes executable instructions for performing the following operations: inputting a character sequence corresponding to an instant message, modifying previously input characters, transmitting the corresponding instant message (e.g., using a short message service (SMS) or multimedia message service (MMS) protocol for phone-based instant messaging or using XMPP, SIMPLE, Apple Push Notification Service (APNs) or IMPS for Internet-based instant messaging), receiving instant messages, and viewing received instant messages. In some embodiments, the transmitted and / or received instant messages optionally include graphics, photos, audio files, video files, and / or other attachments supported in MMS and / or enhanced messaging services (EMS). As used herein, "instant messaging" refers to both phone-based messages (e.g., messages sent using SMS or MMS) and Internet-based messages (e.g., messages sent using XMPP, SIMPLE, APNs or IMPS).
[0114] In combination with RF circuitry 108, touch-sensitive display system 112, display controller 156, contact module 130, graphics module 132, text input module 134, GPS module 135, map module 154, and video and music player module 152, fitness support module 142 includes executable instructions for creating workouts (e.g., with time, distance, and / or calorie burn goals); communicating with fitness sensors (in sports equipment and smart watches); receiving fitness sensor data; calibrating sensors for monitoring fitness; selecting and playing music for a workout; and displaying, storing, and transmitting fitness data.
[0115] In conjunction with touch-sensitive display system 112, display controller 156, one or more optical sensors 164, optical sensor controller 158, contact module 130, graphics module 132, and image management module 144, camera module 143 includes executable instructions for capturing still images or videos (including video streams) and storing them in memory 102, modifying characteristics of still images or videos, and / or deleting still images or videos from memory 102.
[0116] In conjunction with touch-sensitive display system 112, display controller 156, contact module 130, graphics module 132, text input module 134, and camera module 143, image management module 144 includes executable instructions for arranging, modifying (e.g., editing), or otherwise manipulating, labeling, deleting, displaying (e.g., in a digital slide show or album), and storing still images and / or video images.
[0117] In combination with the RF circuit 108, the touch-sensitive display system 112, the display controller 156, the contact module 130, the graphics module 132 and the text input module 134, the browser module 147 includes executable instructions for browsing the Internet in accordance with user instructions (including searching, linking to, receiving and displaying web pages or portions thereof, as well as attachments and other files linked to web pages).
[0118] In combination with the RF circuit 108, the touch-sensitive display system 112, the display controller 156, the contact module 130, the graphics module 132, the text input module 134, the email client module 140 and the browser module 147, the calendar module 148 includes executable instructions for creating, displaying, modifying and storing calendars and data associated with the calendar (e.g., calendar entries, to-do items, etc.) in accordance with user instructions.
[0119] In conjunction with RF circuit 108, touch-sensitive display system 112, display controller 156, contact module 130, graphics module 132, text input module 134, and browser module 147, widget module 149 is a mini-application that is optionally downloaded and used by a user (e.g., weather widget 149-1, stock market widget 149-2, calculator widget 149-3, alarm widget 149-4, and dictionary widget 149-5) or a mini-application created by a user (e.g., user-created widget 149-6). In some embodiments, a widget includes an HTML (Hypertext Markup Language) file, a CSS (Cascading Style Sheets) file, and a JavaScript file. In some embodiments, a widget includes an XML (Extensible Markup Language) file and a JavaScript file (e.g., Yahoo! widget).
[0120] In conjunction with the RF circuit 108, the touch-sensitive display system 112, the display controller 156, the contact module 130, the graphics module 132, the text input module 134, and the browser module 147, the widget creator module 150 includes executable instructions for creating a widget (e.g., transferring a user-specified portion of a web page into a widget).
[0121] In conjunction with the touch-sensitive display system 112, display controller 156, contact module 130, graphics module 132 and text input module 134, the search module 151 includes executable instructions for searching the memory 102 for text, music, sound, images, videos and / or other files that match one or more search criteria (e.g., one or more user-specified search terms) in accordance with user instructions.
[0122] In conjunction with touch-sensitive display system 112, display controller 156, contact module 130, graphics module 132, audio circuitry 110, speaker 111, RF circuitry 108, and browser module 147, video and music player module 152 includes executable instructions that allow a user to download and play back recorded music and other sound files stored in one or more file formats (such as, MP3 or AAC files), as well as executable instructions for displaying, presenting, or otherwise playing back video (e.g., on touch-sensitive display system 112, or on an external display connected wirelessly or via external port 124). In some embodiments, device 100 optionally includes the functionality of an MP3 player such as an iPod (trademark of Apple Inc.).
[0123] In conjunction with the touch-sensitive display system 112, display controller 156, contact module 130, graphics module 132, and text input module 134, the note module 153 includes executable instructions for creating and managing notes, to-do lists, etc. according to user instructions.
[0124] In combination with RF circuitry 108, touch-sensitive display system 112, display controller 156, contact module 130, graphics module 132, text input module 134, GPS module 135, and browser module 147, map module 154 includes executable instructions for receiving, displaying, modifying, and storing maps and data associated with the maps (e.g., driving directions; data about stores and other points of interest at or near a particular location; and other location-based data) in accordance with user instructions.
[0125] In conjunction with touch-sensitive display system 112, display controller 156, contact module 130, graphics module 132, audio circuit 110, speaker 111, RF circuit 108, text input module 134, email client module 140, and browser module 147, online video module 155 includes executable instructions that allow a user to access, browse, receive (e.g., by streaming and / or downloading), play back (e.g., on touch screen 112, or on an external display connected wirelessly or via external port 124), send emails with links to specific online videos, and otherwise manage online videos in one or more file formats such as H.264. In some embodiments, instant messaging module 141 is used instead of email client module 140 to send a link to a specific online video.
[0126] Each module and application identified above corresponds to a set of executable instructions for performing one or more functions and methods described in the present application (e.g., computer-implemented methods and other information processing methods described herein). These modules (e.g., instruction sets) do not have to be implemented as independent software programs, processes or modules, so various subsets of these modules are optionally combined or otherwise rearranged in various embodiments. In some embodiments, memory 102 optionally stores subsets of the above modules and data structures. In addition, memory 102 optionally stores other modules and data structures not described above.
[0127] In some embodiments, the device 100 is a device where the operation of a predefined set of functions on the device is performed exclusively through a touch screen and / or a touch pad. By using a touch screen and / or a touch pad as the primary input control device for operating the device 100, the number of physical input control devices (e.g., push buttons, dials, etc.) on the device 100 is optionally reduced.
[0128] A predefined set of functions that are performed exclusively through the touch screen and / or touchpad optionally includes navigation between user interfaces. In some embodiments, the touchpad, when touched by the user, navigates the device 100 to a main menu, a home menu, or a root menu from any user interface displayed on the device 100. In such embodiments, a "menu button" is implemented using the touchpad. In some other embodiments, the menu button is a physical push button or other physical input control device, rather than a touchpad.
[0129] Figure 1B is a block diagram illustrating exemplary components for event processing according to some embodiments. In some embodiments, memory 102 ( Figure 1A ) or memory 370 ( Figure 3 ) includes an event classifier 170 (e.g., in the operating system 126) and a corresponding application 136-1 (e.g., any one of the aforementioned applications 136, 137 to 155, 380 to 390).
[0130] The event classifier 170 receives event information and determines the application 136-1 and the application view 191 of the application 136-1 to which the event information is to be delivered. The event classifier 170 includes an event monitor 171 and an event distributor module 174. In some embodiments, the application 136-1 includes an application internal state 192, which indicates one or more current application views displayed on the touch-sensitive display system 112 when the application is active or executing. In some embodiments, the device / global internal state 157 is used by the event classifier 170 to determine which application(s) is currently active, and the application internal state 192 is used by the event classifier 170 to determine the application view 191 to which the event information is to be delivered.
[0131] In some embodiments, the application internal state 192 includes additional information, such as one or more of the following: resumption information to be used when the application 136-1 resumes execution, user interface state information indicating that information is being displayed or is ready to be displayed by the application 136-1, a state queue for enabling a user to return to a previous state or view of the application 136-1, and a repeat / undo queue of previous actions taken by the user.
[0132] Event monitor 171 receives event information from peripherals interface 118. Event information includes information about sub-events (e.g., a user touch on touch-sensitive display system 112 as part of a multi-touch gesture). Peripherals interface 118 transmits information it receives from I / O subsystem 106 or sensors such as proximity sensor 166, one or more accelerometers 168, and / or microphone 113 (through audio circuit 110). The information received by peripherals interface 118 from I / O subsystem 106 includes information from touch-sensitive display system 112 or a touch-sensitive surface.
[0133] In some embodiments, event monitor 171 sends requests to peripheral device interface 118 at predetermined intervals. In response, peripheral device interface 118 transmits event information. In other embodiments, peripheral device interface 118 transmits event information only when there is a significant event (e.g., receiving an input above a predetermined noise threshold and / or receiving an input for more than a predetermined duration).
[0134] In some embodiments, the event classifier 170 also includes a hit view determination module 172 and / or an active event identifier determination module 173.
[0135] When the touch-sensitive display system 112 displays more than one view, the hit view determination module 172 provides software procedures for determining where within one or more views a sub-event has occurred. A view consists of controls and other elements that a user can see on the display.
[0136] Another aspect of the user interface associated with an application is a set of views, sometimes also referred to herein as application views or user interface windows, in which information is displayed and touch-based gestures occur. The application views (of the respective application) in which a touch is detected optionally correspond to a programmatic level within the programmatic or view hierarchy of the application. For example, the lowest level view in which a touch is detected is optionally referred to as a hit view, and the set of events that are recognized as correct input is optionally determined at least in part based on the hit view of the initial touch that started the touch-based gesture.
[0137] Hit view determination module 172 receives information related to sub-events of touch-based gestures. When an application has multiple views organized in a hierarchy, hit view determination module 172 identifies the hit view as the lowest view in the hierarchy that should handle the sub-events. In most cases, the hit view is the lowest level view in which the initiating sub-event (e.g., the first sub-event in a sequence of sub-events that form an event or potential event) occurs. Once a hit view is identified by the hit view determination module, the hit view typically receives all sub-events related to the same touch or input source for which it was identified as the hit view.
[0138] Active event recognizer determination module 173 determines which view or views within the view hierarchy should receive a particular sequence of sub-events. In some embodiments, active event recognizer determination module 173 determines that only the hit view should receive a particular sequence of sub-events. In other embodiments, active event recognizer determination module 173 determines that all views that include the physical location of the sub-event are actively participating views, and therefore determines that all actively participating views should receive a particular sequence of sub-events. In other embodiments, even if a touch sub-event is completely confined to an area associated with one particular view, higher views in the hierarchy will still remain as actively participating views.
[0139] Event distributor module 174 distributes event information to event recognizers (e.g., event recognizers 180). In embodiments including active event recognizer determination module 173, event distributor module 174 delivers the event information to the event recognizers determined by active event recognizer determination module 173. In some embodiments, event distributor module 174 stores the event information in an event queue, which is retrieved by corresponding event receiver module 182.
[0140] In some embodiments, operating system 126 includes event classifier 170. Alternatively, application 136-1 includes event classifier 170. In yet another embodiment, event classifier 170 is a standalone module or is part of another module stored in memory 102, such as contact / motion module 130.
[0141] In some embodiments, application 136-1 includes multiple event handlers 190 and one or more application views 191, each of which includes instructions for handling touch events occurring within a corresponding view of the user interface of the application. Each application view 191 of application 136-1 includes one or more event recognizers 180. Typically, the corresponding application view 191 includes multiple event recognizers 180. In other embodiments, one or more event recognizers in event recognizers 180 are part of an independent module, which is a higher-level object such as a user interface toolkit or application 136-1 from which methods and other properties are inherited. In some embodiments, the corresponding event handler 190 includes one or more of the following: data updater 176, object updater 177, GUI updater 178 and / or event data 179 received from event classifier 170. Event handler 190 optionally utilizes or calls data updater 176, object updater 177 or GUI updater 178 to update application internal state 192. Alternatively, one or more of the application views in application view 191 include one or more corresponding event handlers 190. In addition, in some embodiments, one or more of data updater 176, object updater 177, and GUI updater 178 are included in the corresponding application view 191.
[0142] A corresponding event identifier 180 receives event information (e.g., event data 179) from event classifier 170 and identifies an event from the event information. Event identifier 180 includes an event receiver 182 and an event comparator 184. In some embodiments, event identifier 180 also includes metadata 183 and at least a subset of event delivery instructions 188 (which optionally include sub-event delivery instructions).
[0143] Event receiver 182 receives event information from event classifier 170. Event information includes information about sub-events such as touch or touch movement. Depending on the sub-event, the event information also includes additional information, such as the location of the sub-event. When the sub-event involves the movement of the touch, the event information optionally also includes the speed and direction of the sub-event. In some embodiments, the event includes the device rotating from one orientation to another orientation (for example, from a longitudinal orientation to a transverse orientation, or vice versa), and the event information includes corresponding information about the current orientation of the device (also referred to as the device posture).
[0144] Event comparator 184 compares event information with predefined event or sub-event definitions, and determines an event or sub-event based on the comparison, or determines or updates the state of an event or sub-event. In some embodiments, event comparator 184 includes event definition 186. Event definition 186 includes the definition of an event (e.g., a predefined sub-event sequence), such as event 1 (187-1), event 2 (187-2), and others. In some embodiments, sub-events in event 187 include, for example, touch start, touch end, touch move, touch cancel, and multi-touch. In one example, the definition of event 1 (187-1) is a double-click on a displayed object. For example, a double-click includes a first touch (touch start) of a predetermined duration on a displayed object, a first lift (touch end) of a predetermined duration, a second touch (touch start) of a predetermined duration on a displayed object, and a second lift (touch end) of a predetermined duration. In another example, the definition of event 2 (187-2) is a drag on a displayed object. For example, dragging includes a touch (or contact) of a predetermined duration on a displayed object, movement of the touch on the touch-sensitive display system 112, and lifting of the touch (touch end). In some embodiments, the event also includes information for one or more associated event handlers 190.
[0145] In some embodiments, event definition 187 includes definitions of events for corresponding user interface objects. In some embodiments, event comparator 184 performs a hit test to determine which user interface object is associated with a sub-event. For example, in an application view displaying three user interface objects on touch-sensitive display system 112, when a touch is detected on touch-sensitive display system 112, event comparator 184 performs a hit test to determine which of the three user interface objects is associated with the touch (sub-event). If each displayed object is associated with a corresponding event handler 190, the event comparator uses the result of the hit test to determine which event handler 190 should be activated. For example, event comparator 184 selects an event handler associated with the sub-event and the object that triggered the hit test.
[0146] In some embodiments, the definition of the corresponding event 187 also includes delay actions that delay the delivery of the event information until after it has been determined that the sub-event sequence does or does not correspond to the event type of the event identifier.
[0147] When a corresponding event recognizer 180 determines that a sequence of sub-events does not match any event in event definition 186, the corresponding event recognizer 180 enters an event impossible, event failed, or event ended state, after which subsequent sub-events of the touch-based gesture are ignored. In this case, other event recognizers (if any) that remain active for the hit view continue to track and process sub-events of the ongoing touch-based gesture.
[0148] In some embodiments, the corresponding event recognizers 180 include metadata 183 with configurable properties, flags, and / or lists that indicate how the event delivery system should perform sub-event delivery to actively participating event recognizers. In some embodiments, metadata 183 includes configurable properties, flags, and / or lists that indicate how event recognizers interact or can interact with each other. In some embodiments, metadata 183 includes configurable properties, flags, and / or lists that indicate whether sub-events are delivered to different levels in a view or programmatic hierarchy.
[0149] In some embodiments, when one or more specific sub-events of an event are identified, the corresponding event recognizer 180 activates an event handler 190 associated with the event. In some embodiments, the corresponding event recognizer 180 delivers event information associated with the event to the event handler 190. Activating the event handler 190 is different from sending (and deferred sending) the sub-events to the corresponding hit view. In some embodiments, the event recognizer 180 throws a tag associated with the identified event, and the event handler 190 associated with the tag obtains the tag and executes a predefined process.
[0150] In some embodiments, the event delivery instructions 188 include a sub-event delivery instruction that delivers event information about a sub-event without activating an event handler. Instead, the sub-event delivery instruction delivers the event information to an event handler associated with a sub-event sequence or to an actively participating view. The event handler associated with the sub-event sequence or with an actively participating view receives the event information and executes a predetermined process.
[0151] In some embodiments, data updater 176 creates and updates data used in application 136-1. For example, data updater 176 updates phone numbers used in contact module 137 or stores video files used in video or music player module 152. In some embodiments, object updater 177 creates and updates objects used in application 136-1. For example, object updater 177 creates new user interface objects or updates the positioning of user interface objects. GUI updater 178 updates the GUI. For example, GUI updater 178 prepares display information and sends the display information to graphics module 132 for display on a touch-sensitive display.
[0152] In some embodiments, event handler 190 includes or has access to data updater 176, object updater 177, and GUI updater 178. In some embodiments, data updater 176, object updater 177, and GUI updater 178 are included in a single module of the corresponding application 136-1 or application view 191. In other embodiments, they are included in two or more software modules.
[0153] It should be understood that the above discussion of event processing of user touches on a touch-sensitive display also applies to other forms of user input that utilize input devices to operate the multifunction device 100, and not all user input is initiated on the touch screen. For example, mouse movement and mouse button presses, optionally in conjunction with single or multiple keyboard presses or hold; contact movement on a touch pad, such as tapping, dragging, scrolling, etc.; stylus input; movement of the device; verbal commands; detected eye movement; biometric input; and / or any combination thereof are optionally used as input corresponding to sub-events that define the event to be distinguished.
[0154] Figure 2 A device having a touch screen (e.g., Figure 1AThe portable multifunction device 100 of the embodiment of the present invention is a touch-sensitive display system 112 of the present invention. The touch screen optionally displays one or more graphics in the user interface (UI) 200. In these embodiments and in other embodiments described below, the device detects an input corresponding to a request to select one or more graphics in the graphics by detecting a gesture on the graphics, for example, the gesture uses one or more fingers 202 (not drawn to scale in the figure) or one or more styluses 203 (not drawn to scale in the figure). In some embodiments, when the user interrupts contact with the one or more graphics, selection of the one or more graphics will occur. In some embodiments, the gesture optionally includes one or more taps, one or more swipes (from left to right, from right to left, up and / or down) and / or rolling of the fingers that have been in contact with the device 100 (from right to left, from left to right, up and / or down). In some specific implementations or in some cases, inadvertent contact with the graphics will not select the graphics. For example, when the gesture corresponding to the selection is a tap, a swipe gesture that sweeps over the application icon optionally does not select the corresponding application.
[0155] The device 100 optionally also includes one or more physical buttons, such as a "home" or menu button 204. As previously described, the menu button 204 is optionally used to navigate to any application 136 in a set of applications that are optionally executed on the device 100. Alternatively, in some embodiments, the menu button is implemented as a soft key in a GUI displayed on the touch screen display.
[0156] In some embodiments, the device 100 includes a touch screen display, a menu button 204 (sometimes referred to as a home button 204), a push button 206 for powering the device on / off and for locking the device, a volume adjustment button 208, a user identity module (SIM) card slot 210, an earphone jack 212, and a docking / charging external port 124. The push button 206 is optionally used to turn the device on / off by pressing the button and keeping the button pressed for a predefined time interval; lock the device by pressing the button and releasing the button before the predefined time interval passes; and / or unlock the device or initiate an unlocking process. In some embodiments, the device 100 also accepts voice input for activating or deactivating certain functions through a microphone 113. The device 100 also optionally includes one or more contact strength sensors 165 for detecting the strength of contact on the touch-sensitive display system 112, and / or one or more tactile output generators 167 for generating tactile output for a user of the device 100.
[0157] Figure 3300 is a block diagram of an exemplary multifunction device with a display and a touch-sensitive surface according to some embodiments. Device 300 does not have to be portable. In some embodiments, device 300 is a laptop, a desktop computer, a tablet computer, a multimedia player device, a navigation device, an educational device (such as a children's learning toy), a game system, or a control device (e.g., a home controller or an industrial controller). Device 300 typically includes one or more processing units (CPUs) 310, one or more network or other communication interfaces 360, a memory 370, and one or more communication buses 320 for interconnecting these components. The communication bus 320 optionally includes circuits (sometimes referred to as a chipset) that interconnect system components and control communications between system components. Device 300 includes an input / output (I / O) interface 330 with a display 340, which is typically a touch screen display. The I / O interface 330 also optionally includes a keyboard and / or a mouse (or other pointing device) 350 and a touchpad 355, a tactile output generator 357 for generating tactile output on the device 300 (e.g., similar to the above reference). Figure 1A The one or more tactile output generators 167 described above), sensors 359 (e.g., optical sensors, acceleration sensors, proximity sensors, touch sensors, and / or sensors similar to those described above) Figure 1A The memory 370 may include one or more storage devices located away from the CPU 310. In some embodiments, the memory 370 stores information related to the portable multifunction device 100 ( Figure 1A ) or a subset thereof. In addition, memory 370 optionally stores additional programs, modules, and data structures not present in memory 102 of portable multifunction device 100. For example, memory 370 of device 300 optionally stores a drawing module 380, a presentation module 382, a word processing module 384, a website creation module 386, a disk editing module 388, and / or a spreadsheet module 390, while portable multifunction device 100 ( Figure 1A )'s memory 102 optionally does not store these modules.
[0158] Figure 3Each element in the above-mentioned identified element is optionally stored in one or more memory devices in the previously mentioned memory device. Each module in the above-mentioned identified module corresponds to the instruction set for performing the above-mentioned functions. The above-mentioned identified module or program (that is, instruction set) need not be implemented as an independent software program, process or module, so the various subsets of these modules are optionally combined or otherwise rearranged in various embodiments. In some embodiments, memory 370 optionally stores the subgroup of the above-mentioned modules and data structures. In addition, memory 370 optionally stores additional modules and data structures not described above.
[0159] Attention is now turned to an embodiment of a user interface (“UI”) that is optionally implemented on portable multifunction device 100 .
[0160] Figure 4A An exemplary user interface of an application menu on portable multifunction device 100 is shown according to some embodiments. A similar user interface is optionally implemented on device 300. In some embodiments, user interface 400 includes the following elements, or a subset or superset thereof:
[0161] ● one or more signal strength indicators of one or more wireless communications such as cellular signals and Wi-Fi signals;
[0162] ● Time;
[0163] Bluetooth indicator;
[0164] Battery status indicator;
[0165] A tray 408 with icons for commonly used applications, such as:
[0166] o an icon 416 of the phone module 138 labeled “Phone”, which optionally includes an indicator 414 of the number of missed calls or voicemails;
[0167] o an icon 418 of the email client module 140 labeled “Mail”, which optionally includes an indicator 410 of the number of unread emails;
[0168] o an icon 420 labeled "Browser" of the browser module 147; and
[0169] o Icon 422 labeled “Music” of the video and music player module 152;
[0170] as well as
[0171] ● Icons for other applications, such as:
[0172] o Icon 424 labeled “Messages” of IM module 141;
[0173] o Icon 426 labeled “Calendar” of calendar module 148;
[0174] o Icon 428 labeled “Photos” of the image management module 144;
[0175] o Icon 430 labeled “Camera” of camera module 143;
[0176] o Icon 432 labeled “Online Video” of the online video module 155;
[0177] o Icon 434 labeled “Stock Market” of the stock market widget 149 - 2 ;
[0178] o an icon 436 labeled “MAP” of the map module 154;
[0179] o Icon 438 labeled “Weather” of the weather widget 149 - 1 ;
[0180] o Icon 440 labeled “Clock” of the alarm clock widget 149 - 4 ;
[0181] o an icon 442 labeled “Fitness Support” of the fitness support module 142;
[0182] o an icon 444 labeled "Notes" of the notes module 153; and
[0183] o An icon 446 for a settings application or module that provides access to settings for the device 100 and its various applications 136 .
[0184] It should be noted that Figure 4A The icon labels shown in are exemplary only. For example, other labels are optionally used for various application icons. In some embodiments, the label of the corresponding application icon includes the name of the application corresponding to the corresponding application icon. In some embodiments, the label of a particular application icon is different from the name of the application corresponding to the particular application icon.
[0185] Figure 4B A touch-sensitive surface 451 (eg, Figure 3 A device (e.g., a tablet or touchpad 355) Figure 3 Although many of the examples that follow will be given with reference to input on a touch screen display 112 (where a touch-sensitive surface and a display are combined), in some embodiments, the device detects input on a touch-sensitive surface that is separate from the display, such as Figure 4BIn some embodiments, the touch-sensitive surface (e.g., Figure 4B 451) has a main axis (e.g., Figure 4B 453) corresponding to the main axis (for example, Figure 4B According to these embodiments, the device detects contact with touch-sensitive surface 451 at a location corresponding to a corresponding location on the display (e.g., Figure 4B 460 and 462) (e.g., in Figure 4B 460 corresponds to 468 and 462 corresponds to 470). Thus, on a touch-sensitive surface (e.g., Figure 4B 451) and a display of a multi-function device (e.g., Figure 4B 450 in ) is separated, the user input detected by the device on the touch-sensitive surface (e.g., contacts 460 and 462 and their movement) is used by the device to manipulate the user interface on the display. It should be understood that similar methods are optionally used for other user interfaces described herein.
[0186] Additionally, although the following examples are primarily given with reference to finger inputs (e.g., finger contacts, single-finger tap gestures, finger swipe gestures, etc.), it should be understood that in some embodiments, one or more of these finger inputs are replaced by input from another input device (e.g., mouse-based input or stylus input). For example, a swipe gesture is optionally replaced by a mouse click (e.g., instead of contact), followed by movement of the cursor along the path of the swipe (e.g., instead of movement of the contact). As another example, a tap gesture is optionally replaced by a mouse click when the cursor is over the location of the tap gesture (e.g., instead of detecting contact, followed by ceasing to detect contact). Similarly, when multiple user inputs are detected simultaneously, it should be understood that multiple computer mice are optionally used simultaneously, or a mouse and finger contact are optionally used simultaneously.
[0187] In some embodiments, gestures include air gestures. An air gesture is a gesture detected without the user touching an input element that is part of a device (e.g., computer system 101, one or more input devices 125, and / or hand tracking device 140) (or independent of an input element that is part of a device) and based on detected movement of a part of the user's body (e.g., head, one or more arms, one or more hands, one or more fingers, and / or one or more legs) through the air (including movement of the user's body relative to an absolute reference (e.g., the angle of the user's arm relative to the ground or the distance of the user's hand relative to the ground), movement relative to another part of the user's body (e.g., movement of the user's hand relative to the user's shoulder, movement of one of the user's hands relative to the user's other hand, and / or movement of a user's finger relative to another finger or part of the user's hand), and / or absolute movement of a part of the user's body (e.g., a tap gesture in which the hand moves a predetermined amount and / or speed in a predetermined posture, or a shake gesture including a predetermined speed or amount of rotation of a part of the user's body)).
[0188] In some embodiments, according to some embodiments, the input gestures used in the various examples and embodiments described herein include air gestures for interacting with an XR environment (e.g., a virtual or mixed reality environment) performed by movement of a user's fingers relative to other fingers or parts of the user's hand. In some embodiments, an air gesture is a gesture detected without the user touching an input element that is part of the device (or independent of an input element that is part of the device) and based on detected movement of a part of the user's body through the air (including movement of the user's body relative to an absolute reference (e.g., the angle of the user's arm relative to the ground or the distance of the user's hand relative to the ground), movement relative to another part of the user's body (e.g., movement of the user's hand relative to the user's shoulder, movement of one of the user's hands relative to the user's other hand, and / or movement of the user's fingers relative to another finger or part of the user's hand), and / or absolute movement of a part of the user's body (e.g., a tap gesture in which the hand moves a predetermined amount and / or speed in a predetermined posture, or a shake gesture including a predetermined speed or rotation amount of a part of the user's body)).
[0189] In some embodiments where the input gesture is an in-air gesture (e.g., in the absence of physical contact with an input device that provides information to the computer system about which user interface element is the target of the user input, such as contact with a user interface element displayed on a touch screen, or contact with a mouse or trackpad to move a cursor to a user interface element), the gesture takes into account the user's attention (e.g., gaze) to determine the target of the user input (e.g., for direct input, as described below). Thus, in embodiments involving in-air gestures, for example, the input gesture is detection of attention (e.g., gaze) toward a user interface element combined with movement of the user's fingers and / or hand (e.g., simultaneously) to perform a pinch and / or tap input, as described in more detail below.
[0190] In some embodiments, an input gesture pointing to a user interface object is performed directly or indirectly with reference to the user interface object. For example, user input is performed directly on the user interface object based on performing input with the user's hand at a position corresponding to the position of the user interface object in the three-dimensional environment (e.g., as determined based on the user's current viewpoint). In some embodiments, when the user's attention (e.g., gaze) to the user interface object is detected, the input gesture is indirectly performed on the user interface object based on the position of the user's hand not being at the position corresponding to the position of the user interface object in the three-dimensional environment while the user performs the input gesture. For example, for a direct input gesture, when the user initiates a gesture at or near a position corresponding to the display position of the user interface object (e.g., within 0.5 cm, 1 cm, 5 cm, or a distance between 0-5 cm measured from the outer edge of the option or the center portion of the option), the device responds to the user's input to the user interface object. For indirect input gestures, when a user directs his or her attention to a user interface object (e.g., by gazing at the user interface object), and while focusing on the object, the user initiates an input gesture (e.g., at any location detectable by the computer system) (e.g., at a location that does not correspond to the displayed location of the user interface object), the device responds to the user's input to the user interface object.
[0191] In some embodiments, according to some embodiments, the input gestures (e.g., air gestures) used in various examples and embodiments described herein include pinch input and tap input for interacting with a virtual or mixed reality environment. For example, the pinch input and tap input described below are performed as air gestures.
[0192] In some embodiments, the pinch input is part of an air gesture that includes one or more of the following: a pinch gesture, a long pinch gesture, a pinch and drag gesture, or a double pinch gesture. For example, a pinch gesture as an air gesture includes movement of two or more fingers of a hand to contact each other, that is, optionally followed by an immediate (e.g., within 0 to 1 second) interruption of contact with each other. A long pinch gesture as an air gesture includes movement of two or more fingers of a hand in contact with each other for at least a threshold amount of time (e.g., at least 1 second) before an interruption of contact with each other is detected. For example, a long pinch gesture includes the user maintaining a pinch gesture (e.g., in which two or more fingers are in contact), and the long pinch gesture continues until an interruption of contact between the two or more fingers is detected. In some embodiments, a double pinch gesture as an air gesture includes two (e.g., or more) pinch inputs (e.g., performed by the same hand) that are detected consecutively immediately (e.g., within a predefined time period) with each other. For example, the user performs a first pinch input (e.g., a pinch input or a long pinch input), releases the first pinch input (e.g., interrupts contact between two or more fingers), and performs a second pinch input within a predefined time period after releasing the first pinch input (e.g., within 1 second or within 2 seconds).
[0193] In some embodiments, the pinch and drag gesture as an air gesture includes a pinch gesture (e.g., a pinch gesture or a long pinch gesture) performed in conjunction with (e.g., following) a drag input that changes the position of the user's hand from a first position (e.g., the start position of the drag) to a second position (e.g., the end position of the drag). In some embodiments, the user maintains the pinch gesture while performing the drag input, and releases the pinch gesture (e.g., opens their two or more fingers) to end the drag gesture (e.g., at the second position). In some embodiments, the pinch input and the drag input are performed by the same hand (e.g., the user pinches two or more fingers to contact each other and moves the same hand to a second position in the air using the drag gesture). In some embodiments, a pinch input is performed by a first hand of a user, and a drag input is performed by a second hand of the user (e.g., the second hand of the user moves from a first position to a second position in the air while the user continues to pinch input with the first hand of the user. In some embodiments, the input gesture as an air gesture includes input performed using both hands of the user (e.g., pinch and / or tap input). For example, the input gesture includes two (e.g., or more) pinch inputs performed in conjunction with each other (e.g., concurrently or within a predefined time period). For example, a first pinch gesture (e.g., a pinch input, a long pinch input, or a pinch and drag input) is performed using the first hand of the user, and in conjunction with the pinch input performed using the first hand, a second pinch input is performed using another hand (e.g., a second hand of the user's two hands). In some embodiments, movement between the two hands of the user (e.g., increasing and / or decreasing the distance or relative orientation between the two hands of the user).
[0194] In some embodiments, a tap input performed as an air gesture (e.g., pointing to a user interface element) includes movement of a user's finger toward the user interface element, movement of a user's hand toward the user interface element (optionally, extension of the user's finger toward the user interface element), downward movement of a user's finger (e.g., mimicking a mouse click motion or a tap on a touch screen), or other predefined movement of a user's hand. In some embodiments, a tap input performed as an air gesture is detected based on movement characteristics of the finger or hand performing the tap gesture movement of the finger or hand, which is a movement of the finger or hand away from the user's viewpoint and / or toward an object that is the target of the tap input, followed by an end of the movement. In some embodiments, the end of the movement is detected based on a change in the movement characteristics of the finger or hand performing the tap gesture (e.g., the end of the movement away from the user's viewpoint and / or toward an object that is the target of the tap input, a reversal of the direction of movement of the finger or hand, and / or a reversal of the acceleration direction of the movement of the finger or hand).
[0195] As used herein, the term "focus selector" refers to an input element used to indicate the current portion of a user interface that a user is interacting with. In some implementations that include a cursor or other position marker, the cursor acts as a "focus selector" such that when the cursor is over a particular user interface element (e.g., a button, window, slider, or other user interface element), a focus selector is displayed on a touch-sensitive surface (e.g., Figure 3 Touchpad 355 or Figure 4B In the event that an input (e.g., a press input) is detected on the touch-sensitive surface 451 in the display, the particular user interface element is adjusted according to the detected input. In the case that the touch-sensitive surface 451 in the display includes a touch-screen display (e.g., Figure 1A A touch-sensitive display system 112 or Figure 4A In some implementations of a touch screen in a touch screen display, a contact detected on the touch screen acts as a "focus selector" such that when an input (e.g., a press input by a contact) is detected at the location of a particular user interface element (e.g., a button, window, slider, or other user interface element) on the touch screen display, the particular user interface element is adjusted according to the detected input. In some implementations, the focus moves from one area of the user interface to another area of the user interface without a corresponding movement of a cursor or movement of a contact on the touch screen display (e.g., by using a tab key or arrow keys to move the focus from one button to another); in these implementations, the focus selector moves according to the movement of the focus between different areas of the user interface. Regardless of the specific form taken by the focus selector, the focus selector is typically a user interface element (or contact on the touch screen display) that is controlled by the user to convey the user's desired interaction with the user interface (e.g., by indicating to the device the element of the user interface with which the user desires to interact). For example, when a press input is detected on a touch-sensitive surface (e.g., a touchpad or touch screen), the position of a focus selector (e.g., a cursor, contact, or selection box) over a corresponding button will indicate that the user desires to activate the corresponding button (rather than other user interface elements shown on the device display).
[0196] User interface and associated processes
[0197] Attention now turns to embodiments of a user interface ("UI") and associated processes that may be implemented on an electronic device such as portable multifunction device 100 or device 300 having a display, a touch-sensitive surface, (optionally) one or more tactile output generators for generating tactile output, and (optionally) one or more sensors for detecting intensity of contact with the touch-sensitive surface.
[0198] According to some embodiments, FIG. 5A to FIG. 5CBshows an example user interface for navigating and editing a corresponding type of user interface, FIG. 6A to FIG. 6AR showing an example user interface for an extended interface panel switcher, Figure 7A to Figure 7V-3 showing representations of a plurality of notifications in different configurations and a user input for switching between the different configurations, and FIG. 8A to FIG. 8AN An example user interface for displaying a session area of an ongoing event is shown. The user interfaces in these figures are used to illustrate the process described below, including FIG. 9A to FIG. 9I , FIG. 10A to FIG. 10I , FIG. 11A to FIG. 11H , FIG. 12A to FIG. 12E , FIG. 13A to FIG. 13G , FIG. 14A to FIG. 14G , FIG. 15A to FIG. 15I , FIG. 16A to FIG. 16J and 17A to 17D For ease of explanation, some embodiments in the implementation scheme will be discussed with reference to operations performed on a device with touch-sensitive display system 112. In such embodiments, the focus selector is optionally: a corresponding finger or stylus contact, a representative point corresponding to the finger or stylus contact (e.g., the center of gravity of the corresponding contact or a point associated with the corresponding contact), or the center of gravity of two or more contacts detected on touch-sensitive display system 112. However, in response to detecting a contact on touch-sensitive surface 451 when the user interface shown in the figure is displayed on display 450 together with the focus selector, similar operations are optionally performed on a device with display 450 and a separate touch-sensitive surface 451.
[0199] FIG. 5A to FIG. 5CB Example user interfaces for navigating and editing corresponding types of user interfaces are shown according to some embodiments.
[0200] Figure 5AA user interface 500 of device 100 is shown when the display of device 100 is in a low power state. In some embodiments, when the display is in a low power state, the "always on" display optionally displays an indication of the time and / or date. In some embodiments, in the low power state, the display of device 100 does not display any information (e.g., the display is turned off). In some embodiments, after a predetermined inactive time during which no user interaction with device 100 is detected, the display enters a low power state. In some embodiments, in response to a user input such as locking device 100 and / or putting the device to sleep by pressing a physical or virtual button on device 100, the display enters a low power state. In some embodiments, the display of device 100 ends the low power state based on receiving an incoming alarm (e.g., a system alarm and / or a notification from an application). For example, the display of device 100 lights up and ends the low power state to display an indication of an alarm. In some embodiments, the display of device 100 lights up in response to user input (e.g., user input detected on the display, user picking up the device and / or user input on a physical or virtual button of the device).
[0201] As used herein, a wake screen user interface is a user interface that is displayed after the display of device 100 has entered a low power state, during which the display is at least partially turned off. In some embodiments, the wake screen user interface is also referred to herein as an "interface panel." For example, actions described as being performed relative to the wake screen user interface may also be described as being performed relative to the interface panel (e.g., "switching between wake screen user interfaces" may also be stated as "switching between interface panels," and "editing the wake screen user interface" may also be stated as "editing the interface panel"). In some embodiments, the "extended interface panel switcher" user interface includes display of one or more interface panels (e.g., one or more wake screen user interfaces), wherein the size of the corresponding interface panel (e.g., the wake screen user interface) is smaller than the full size of the display area (e.g., as Figure 5U). In some embodiments, in the low-power state, the display optionally displays a "constantly on" indicator of the time and / or date, and when the device is prompted to end the low-power state, the device displays a wake-up screen user interface. In some embodiments, optionally in response to user input and / or in response to the passage of a threshold amount of time, the device enters a locked state, in which a password, passcode, and / or biometric authentication is required to unlock the device, wherein the device has limited functionality in the locked state and must be unlocked before accessing the corresponding application and / or data stored on the device 100. In some embodiments, the wake-up screen user interface is displayed regardless of whether the device is in a locked state or has been unlocked (e.g., the wake-up screen user interface is displayed when the device is woken up before the user accesses the home screen user interface and / or other application user interfaces). In some embodiments, as used herein, a cover user interface includes the same features as a wake-up screen user interface, but the device optionally displays the cover user interface without entering a locked and / or low-power state of the device. In some embodiments, one or more alerts (e.g., system alerts and / or notifications) are displayed on the wake screen user interface and / or cover user interface, optionally in response to user input (e.g., an upward swipe gesture in the middle of the display or another gesture).
[0202] As used herein, a home screen user interface includes icons for navigating to multiple applications executed by the device 100. In some embodiments, the device 100 detects and responds to interactions with the home screen user interface using one or more gestures (including touch input). For example, a tap input or other selection input on a corresponding application icon causes the corresponding application to start, or otherwise opens the user interface of the corresponding application on the display area of the device 100. In some embodiments, multiple views of the home screen user interface are available. For example, the device detects and responds to user input, such as a swipe gesture or other input corresponding to a request to navigate between multiple views (e.g., an input pointing to a currently displayed view of the home screen user interface), wherein each view of the home screen user interface includes different application icons for different applications. In some embodiments, the application icons are of different sizes, such as an application widget that displays information for the corresponding application, wherein the application widget is larger than the application icon.
[0203] As used herein, mini-application objects (or widgets) are user interface objects that provide a limited subset of functions and / or information available from their corresponding applications without the need to launch an application. In some embodiments, the mini-application object (or widget) contains application content that is dynamically updated based on the current context. In some embodiments, a tap input or other selection input on a mini-application object (widget) causes the corresponding application to be launched. In some embodiments, the corresponding mini-application operates as a standalone application that resides in the memory of the device, which is different from the associated application that also resides in the memory of the device. In some embodiments, the corresponding mini-application operates as an extension or component of the associated application on the device. In some embodiments, the corresponding mini-application object has a dedicated memory portion for temporarily storing information. In some embodiments, the memory portion can be accessed by the corresponding full-function application of the corresponding mini-application object. In some embodiments, the mini-application object is configured to perform a subset (less than all) of the functions of the corresponding application. In some embodiments, the mini-application object displays an identifier of the corresponding application. In some embodiments, the mini-application object displays a portion of the content from the corresponding application. For example, a map mini-application object displays a portion of a map corresponding to the map mini-application object displayed in a map application. For example, a calendar mini-app object displays a portion of a calendar displayed in a corresponding calendar application. In some embodiments, a predefined input on a mini-app object launches the corresponding application. In some embodiments, the mini-app operates as a standalone application residing in the memory of the device, different from an associated application also residing in the memory of the device. For example, a mini-app object corresponding to a social networking application operates as a single-purpose or simplified application with less than a full subset of the corresponding application's functions, but is associated with a fully functional social networking application. In this example, the mini-app object operates independently of the social networking application, and in a scenario where the social networking application is not running, the mini-app continues to operate. In some embodiments, the mini-app operates as an extension or component of an associated application on the device. For example, a mini-app object of a calendar application is a single feature or operating component of a full-featured calendar application. In this example, if the calendar application is not running (e.g., in the background), the calendar mini-app object is also not running. In some embodiments, the mini-app object has a dedicated memory portion for temporarily storing information. In some embodiments, the memory portion is accessible by the corresponding full-featured application. For example, a mini-app of an instant messaging application has a memory portion for temporarily storing a portion of a written reply message.In this example, if the user opens the corresponding application in the middle of writing a reply message, the contents of the reply message are retrieved from the temporary storage location and used by the full-function application to allow the user to complete their reply message.
[0204] In some embodiments, when the device wakes up to end the low power state, an animation is displayed to transition the device from being off (e.g., displaying a black background optionally with a "steady" time and / or date) to displaying a wake screen user interface 501 (also referred to herein as a lock screen user interface). In some embodiments, the wake screen user interface 501 is a user interface that includes an indication of the time and / or date, optionally includes one or more complex function blocks corresponding to corresponding applications and updated with current state information of the corresponding applications (e.g., fitness complex function block 502-1, weather complex function block 502-2, and calendar complex function block 502-3), optionally includes one or more alarms (e.g., message notification 503-1 and social media notification 503-2), optionally includes shortcuts to one or more applications (e.g., a flashlight and / or camera), and a background (e.g., an image, pattern, color, and / or photo). In some embodiments, as explained in more detail below, the device detects and responds to user input corresponding to a request to change one or more settings of the wake screen user interface (e.g., pointing to a lock screen user interface). Figure 5W1 Editing user interface 565-a in or Figure 5X 565 in the wake-up screen user interface), such as changing the font color and / or style of the time and / or date indication and / or changing the complex function blocks included in the wake-up screen user interface. In some embodiments, the device 100 stores multiple wake-up screen user interfaces and rotates and / or randomly plays (optionally periodically and / or when entering / ending a low power state) multiple wake-up screen user interfaces.
[0205] In some embodiments, the animation displayed to transition the device from off to displaying the wake screen user interface is based on the wake screen user interface to be displayed. For example, FIG. 5E to FIG. 5L1 Examples of different animated transitions for different wake screen user interfaces are shown.
[0206] Figure 5B A wake screen user interface 501 is shown having a gradient background having dark gray at the top of the user interface background, medium gray in the middle of the user interface background, and light gray at the bottom of the user interface background. In some embodiments, user input is detected to replace display of the wake screen user interface with a home screen user interface, where the home screen user interface includes representations of multiple applications executed by device 100.
[0207] In some embodiments, in response to user input 504, the wake-up screen user interface 505 is displayed as sliding up and away from the display area while maintaining one or more features of the wake-up screen user interface (e.g., time and / or date, one or more complex function blocks, and / or indications of flashlight and camera shortcuts), such as Figure 5C In some embodiments, when the wake-up screen user interface slides off the display area, the gradient background changes in a cycle like a carousel, so that the dark gray originally at the top of the user interface background slides up from the bottom of the screen, while the medium gray in the middle of the user interface background slides up and off the display, and the light gray slides up into the display area. In some embodiments, the gradient background completes a full cycle based on the home screen user interface 506 being displayed.
[0208] Figure 5D Shown is a home screen user interface 506 with a gradient background having different shades of gray arranged in the same arrangement as on the wake screen user interface. Thus, in response to the user swiping up to navigate to the home screen user interface, the animation of changing shades of gray completes a full cycle.
[0209] FIG. 5E to FIG. 5F An example of an animated transition when the device 100 transitions from a low power state to display the wake screen user interface 507-2 is shown. For example, user interface 507-1 is an intermediate wake screen user interface displayed during the animated transition. In some embodiments, the intermediate wake screen user interface 507-1 does not include one or more features of the wake screen user interface 507-2 (e.g., no complex function blocks, notifications, and / or flashlight or camera shortcuts). In some embodiments, the wake screen user interface 507-2 includes an image, such as a plurality of colored lines (e.g., a rainbow flag or a pride flag). In some embodiments, the animated transition includes increasing the size of the image. In some embodiments, the animated transition includes changing one or more font attributes of an indication of the time and / or date. In some embodiments, the animated transition includes optionally displaying one or more complex function blocks by fading in one or more complex function blocks, and optionally displaying one or more alarms by fading in one or more complex function blocks.
[0210] Figure 5G to Figure 5HAn example of an animated transition of a wake screen user interface 508-2 including a portrait-style photo is shown. In some embodiments, the portrait-style photo includes a subject (e.g., a person and / or a face) that is optionally displayed with a simulated depth effect so that the subject appears closer in view than one or more background objects (e.g., clouds) in the photo. In some embodiments, the animated transition of the wake screen user interface with the portrait-style photo includes increasing the size of the subject from user interface 508-1 to wake screen user interface 508-2, and optionally displaying the subject overlaid with an indication of the time and / or date. In some embodiments, the animated transition includes applying a depth effect (e.g., the photo appears closer in view than the background objects (e.g., clouds) in the photo. Figure 5G It appears flat in Figure 5H In some embodiments, the wake-up screen user interface including the portrait-style photo does not include one or more complex function blocks (optionally, the device allows the user to edit the wake-up screen user interface (e.g., using Figure 5X to Figure 5Y , or a selectable option in user interface element 570 in the editing user interface 565 shown in FIG. 5 to add one or more complex function blocks).
[0211] FIG. 5I to FIG. 5J An example of an animated transition of a wake screen user interface 509-2 including one or more emojis is shown. In some embodiments, the wake screen user interface 509-2 includes one or more emojis arranged in a predefined pattern. For example, FIG. 5I to FIG. 5J In some embodiments, the animated transition includes changing a shadow effect applied to the smiley face emoji as displayed in user interface 509-1 to a different shadow effect as displayed in wake screen user interface 509-2. In some embodiments, in at least one of user interfaces 509-1 or 509-2, no shadow effect is displayed. For example, the size and / or opacity of the shadow increases or decreases during the animation.
[0212] Figure 5K to Figure 5L1An example of an animated transition of a wake-up screen user interface 510-2 including an astronomical background is shown. In some embodiments, the astronomical background includes celestial and / or planetary bodies (e.g., the Earth, the Moon, stars, the solar system, and / or galaxies). In some embodiments, the animated transition includes changing the cropping and / or changing the perspective of the astronomical background from the user interface 510-1 to the wake-up screen user interface 510-2. In some embodiments, the animated transition includes applying visual effects, such as reducing and / or moving a shadow displayed on the background. For example, the Earth appears to be rotating, and the shadow on the left side of the Earth appears to rotate with the Earth, minimizing the shadow to the right side of the user interface. In some embodiments, the astronomical background 510-2 also includes an indication of the current location of the device 100 (e.g., a point that appears on the Earth displayed in the user interface 510-2, indicating the location of the device).
[0213] Figure 5L2 to Figure 5L3 An example of an animated transition from a wake screen user interface 510-3 including an astronomical background to a home screen user interface 510-4 including an astronomical background is shown. In some embodiments, the wake screen user interface 510-3 includes representations of one or more celestial bodies, such as Figure 5L2 . In some embodiments, in response to user input 515 requesting to dismiss the wake screen user interface 510-3, the device 100 displays an animated transition and displays the home screen user interface 510-4. In some embodiments, the home screen user interface 510-4 is displayed with a background that includes representations of the one or more celestial bodies that are different from the representations of the one or more celestial bodies displayed on the wake screen user interface 510-3. For example, during the animated transition, the representation of the earth is displayed as rotating and shifting to different parts of the display, and the representation of the sun is displayed as shifting according to the rotation of the representation of the earth, such as Figure 5L3 For example, the representation of the sun is displaced to be displayed relatively closer to the representation of the earth and / or is displaced to be displayed directly behind the representation of the earth (e.g., with Figure 5L2 In some embodiments, during the animated transition, the representation of the Earth is shifted to increase in size (e.g., as if getting closer), and the representation of the Sun is updated in size relative to the increase in size of the representation of the Earth.
[0214] Figure 5MAn example of a wake-up screen user interface 511 is shown. In some embodiments, the wake-up screen user interface 511 is an example of an astronomical background (e.g., including the moon). In some embodiments, the device detects a user interaction with the wake-up screen user interface 511, which causes the device 100 to perform a corresponding operation (e.g., selecting a corresponding complex function block to display its corresponding application, navigating to the home screen user interface, displaying multiple previously received and / or stored notifications, and / or navigating to another system user interface, such as a system search user interface, a widget screen, or a control panel user interface). For example, the wake-up screen user interface 511 includes a music complex function block 502-4, a health complex function block 502-5, a weather complex function block 502-6, and a breathing complex function block 502-7. In some embodiments, at least one complex function block is updated using state information corresponding to an application associated with the complex function block. For example, the music complication tile 502-4 is updated with progress information (e.g., in a circular, curved, or linear shape) indicating the amount of time the currently playing media item is being played back, and the weather complication tile 502-6 is updated to indicate the real-time AQI level (e.g., "32") based on the state of the weather application.
[0215] In some embodiments, in response to a first type of user input (such as user input 512) selecting a corresponding complication, device 100 displays an application user interface for an application associated with the corresponding complication. In some embodiments, the first type of user input is a tap input. For example, in response to user input 512 pointing to health complication 502-5, device 100 displays a user interface for a health / fitness application associated with health complication 502-5.
[0216] In some embodiments, in response to a second type of user input 514, such as a swipe input or a drag gesture in a first direction (e.g., up, down, right, or left) detected within a predefined portion of the wake screen user interface 511 (e.g., within the middle of the wake screen and / or not on an edge of the wake screen), the device 100 performs a swipe input or a drag gesture, such as in Fig.5O Multiple notifications are displayed in the user interface 532 shown in FIG.
[0217] In some embodiments, in response to a third type of user input 516, such as a swipe input or a drag gesture in a second direction (e.g., up, down, right, or left), which is optionally the same direction as the second type of user input 514, the device displays a home screen user interface 518. In some embodiments, the third type of user input 516 is received at a user interface element that, when selected (optionally by initiating a swipe gesture over the user interface element), causes the device 100 to display a home screen user interface 518.
[0218] Figure 5N A home screen user interface 518 (also referred to as a home user interface) is shown. In some embodiments, the home screen user interface includes icons for navigating to multiple applications executed by the device 100. In some embodiments, the device detects and responds to user interaction with the home screen user interface using one or more gestures (including touch input), which causes the device to perform a corresponding operation (e.g., select a corresponding application icon to display the corresponding application, and / or navigate to another system user interface, such as a cover user interface, a system search user interface, a control panel user interface, or a wake-up screen user interface). For example, a tap input (e.g., user input 524) on a corresponding application icon causes the corresponding application to start, or otherwise opens the user interface of the corresponding application on the display area of the device 100. In some embodiments, multiple views of the home screen user interface are available. For example, the device detects one or more swipe gestures or other types of navigation inputs pointing to a currently displayed view of the home screen user interface to navigate between the multiple views, wherein each view of the home screen user interface includes different application icons for different applications. In some embodiments, the application icons are of different sizes, such as an application widget that displays information for the corresponding application, wherein the application widget is larger than the application icon.
[0219] In some embodiments, user input 520 is a swipe user input in a third direction (e.g., downward or another direction) initiated at a top corner edge of the display of device 100. In some embodiments, in response to user input 520, device 100 displays a control user interface for modifying one or more settings.
[0220] In some embodiments, user input 522 is a swipe user input in a fourth direction (e.g., from right to left) and corresponds to a request to switch to another view of the home screen user interface. For example, different representations of different applications are displayed on different views of the home screen user interface.
[0221] In some embodiments, user input 524 is a user input (e.g., a tap input or other selection input) selecting application icon 422 for a music application. In some embodiments, in response to user input 524, device 100 displays a user interface for the application associated with application icon 422 (e.g., a music application user interface).
[0222] In some embodiments, user input 525 (e.g., a tap input or other selection input) on another application icon 440 for a clock application causes the device 100 to open the clock application and display the user interface of the clock application.
[0223] In some embodiments, user input 526 is detected at a predefined portion of the user interface (e.g., an upward swipe gesture initiated at an edge of the display of device 100). In some embodiments, in response to user input 526, the device displays a multitasking user interface with an indication of one or more open applications, optionally executing in the background of device 100.
[0224] In some embodiments, different types of input, such as user input 528 (e.g., a left-to-right swipe input or other gesture initiated at the left edge of the display of device 100), cause device 100 to display a user interface that includes a search bar and, optionally, one or more widgets and / or shortcuts that display information for a subset of applications.
[0225] In some embodiments, user input 530 is detected (e.g., a downward swipe input or other gesture initiated at the top edge of the display of device 100), and in response to user input 530, user interface 532 is displayed ( Fig.5O ). Thus, device 100 detects different types of inputs and / or gestures (e.g., pointing to Figure 5N 530, 520, 525, 528, 522, 526, and 524) of the home screen user interface 518 in the home screen, including opening applications, navigating between views of the home screen user interface, and accessing other user interfaces for modifying settings and / or accessing shortcuts.
[0226] Fig.5OA cover user interface 532 is shown that includes information that is also displayed on the wake screen user interface 511. For example, user interface 532 optionally includes an indication of the time and / or date, one or more complex function blocks, shortcut options for a flashlight and / or camera, and / or multiple notifications. In some embodiments, the device detects and responds to user input directed to user interface 532 in the same manner as user input directed to wake screen user interface 511, such as detecting a tap input on a complex function block and opening a corresponding application associated with the complex function block, or detecting a swipe input initiated on the right edge of the display of device 100 (such as user input 534) and displaying user interface 536 for a camera application ( Figure 5P ), where the device provides functionality for capturing and / or viewing photographs using a camera application.
[0227] Figure 5P A user input 538 corresponding to a request to return to the wake screen user interface is shown. In some embodiments, in response to the user input 538, a user interface 540-1 is displayed, such as Figure 5Q In some embodiments, the wake-up screen user interface 540-1 includes the wake-up screen user interface 511 ( Figure 5M ) one or more different attributes. In some embodiments, at least one complication block is changed from wake screen user interface 511 to wake screen user interface 540-1. For example, music complication block 502-4 ( Figure 5M ) is replaced by the weather complication block 502-9 ( Figure 5Q ), while optionally maintaining one or more other complex function blocks (e.g., health complex function block 502-5, weather complex function block 502-6, and breathing complex function block 502-7). In some embodiments, the complex function blocks are updated according to the state of the application. For example, in Figure 5M , the weather complex function block 502-6 indicates an air quality index (AQI) of 32, and Figure 5Q , the weather complication block 502 - 6 indicates an AQI of 30. In some embodiments, the background of the wake screen (eg, an image of the moon) is maintained.
[0228] In some embodiments, such as Figure 5QAs shown, a user input 541 such as a right-to-left swipe input detected within a predefined area of the display of the device 100 (e.g., within a predefined distance of the bottom edge of the display) causes the device 100 to cycle the wake-up screen user interface 540-1 to another wake-up screen user interface 540-2. In some embodiments, the device 100 cycles between a predefined group of wake-up screen user interfaces. In some embodiments, the predefined group of wake-up screen user interfaces are related. For example, for an astronomical wake-up screen user interface (e.g., a lunar image), cycling between a predefined group of astronomical wake-up screen user interfaces includes displaying different phases of the moon. In some embodiments, the predefined group of wake-up screen user interfaces is defined by the user so that the user selects a set of wake-up screen user interfaces to cycle, regardless of whether the wake-up screens are related. For example, the user selects an album as the background image, and the wake-up screen user interface cycles through photos in the album or photos automatically selected by the device based on user-specified criteria.
[0229] In some embodiments, the user swipes on the wake screen user interface to change to the next wake screen user interface. In some embodiments, the wake screen user interface automatically changes periodically (e.g., every 2 minutes, every day, or every week). In some embodiments, the wake screen user interface automatically changes after the device has entered and / or exited a low power state (e.g., after the display has been turned off, the wake screen user interface is updated the next time the display wakes up).
[0230] Figure 5R A wake-up screen user interface 540-2 is shown that replaces the wake-up screen user interface 540-1 in response to user input 541. In some embodiments, the wake-up screen user interface 540-2 includes at least one feature that is different from the wake-up screen user interface 540-1. For example, the font of the indication of the time and / or date is changed to a bold font, and the color of the background image and the background changes. In some embodiments, one or more other features of the wake-up screen user interface do not change, such as the type of complex function block. It should be understood that any combination of features can be updated between the first wake-up screen user interface and the second wake-up screen user interface, including a subset (less than all) or all changes of complex function blocks, and / or font attributes of the indication of the time and / or date.
[0231] Figure 5RAlso shown is a user input 544 corresponding to a request to switch to another wake screen user interface via the wake screen selector user interface. In some embodiments, the user input 544 is a long press or other selection input in which the user input maintains contact with the display for a predetermined threshold amount of time (e.g., 2 seconds, 3 seconds, or 5 seconds) at a predefined portion of the user interface 540-2 (e.g., a portion of the user interface that does not correspond to a complex function block, a shortcut to a flashlight and / or camera, or an indication of a time and / or date). In some embodiments, in response to the user input 544, the device 100 displays the wake screen selector user interface 548-1. In some embodiments, when the wake screen selector user interface 548-1 is displayed, the user input 544 maintains contact with the device, and the timing and / or positioning of the lift of the user input 544 causes the device 100 to perform a corresponding operation (e.g., a long press that is released after a timer without moving the positioning causes the device to display the extended interface panel switcher user interface 561 ( Figure 5U ), while a long press with a change in contact positioning (e.g., swiping to an adjacent interface panel without lifting off) causes the device to transition to an adjacent wake screen user interface without entering the expanded interface panel switcher user interface 561).
[0232] In some embodiments, based on determining that the device 100 is in a locked state, before displaying the wake screen selector user interface 548-1, the device 100 requires authentication to unlock the device and displays the password user interface 547, such as Figure 5S In some embodiments, device 100 prompts the user to enter a password and / or use a fingerprint, face, or other biometric identifier for authentication.
[0233] Figure 5T In some embodiments, the wake screen selector user interface 548 includes representations of multiple wake screen user interfaces, including a representation 552 of a portion of a first wake screen user interface (e.g., wake screen user interface 540-1), a representation 550 of a second wake screen user interface (e.g., wake screen user interface 540-2), and a representation 551 of a third wake screen user interface (e.g., wake screen user interface 507-1). Figure 5W )) is a representation 554 of a portion of the wake screen selector user interface. In some embodiments, the wake screen selector user interface 548-1 displays a representation of a set of wake screen interfaces stored by the device 100, and optionally cycles through them, as described above.
[0234] In some embodiments, wake screen selector user interface 548-1 provides a user with multiple options for interacting with representations of wake screen user interfaces. For example, in response to user input 556 on a "+" button (e.g., a tap input or other selection input), the device initiates a process of adding a new wake screen user interface to the set of wake screen user interfaces.
[0235] In some embodiments, in response to detecting a user input selecting a corresponding representation of a corresponding wake-up screen user interface in a wake-up screen selector interface that displays corresponding representations of multiple instances of the wake-up screen user interface, the device 100 displays the corresponding wake-up screen user interface as the current wake-up screen user interface. For example, in response to a user input 560 (such as a tap input or other selection input) on or pointing to the representation 550 of the second wake-up screen user interface, the device stops displaying the wake-up screen selector user interface 548-1 and redisplays the wake-up screen user interface 540-2 ( Figure 5R In some embodiments, in response to user input 558 such as a tap input or other input, the device scrolls to the right so that representation 554 is centered in wake screen selector user interface 548-2 ( Figure 5V ).
[0236] In some embodiments, based on determining that user input 544 is maintained for a threshold amount of time (e.g., a long press user input maintained from wake screen user interface 540-2 while wake screen selector user interface 548-1 is displayed) and is lifted without moving (e.g., swiped left or right), device 100 displays expanded interface panel switcher user interface 561, as shown in FIG. Figure 5U shown.
[0237] Figure 5U The extended interface panel switcher user interface 561 is shown to include a representation 550 of a wake-up screen user interface (e.g., in the center of the extended interface panel switcher user interface 561) and at least a portion of a representation of a home screen user interface 551 associated with the representation 550 of the wake-up screen user interface. For example, one or more of the corresponding wake-up screen user interfaces have a corresponding corresponding home screen user interface. In some embodiments, changing the display of the wake-up screen user interface from the first wake-up screen to the second wake-up screen automatically updates the home screen user interface from the first home screen associated with the first wake-up screen to the second home screen associated with or corresponding to the second wake-up screen. Therefore, in response to the user navigating from the wake-up screen to the home screen (e.g., by swiping up or performing another gesture), the displayed home screen is related to the currently displayed wake-up screen. In some embodiments, the color, pattern, and / or image of the home screen is selected based on the color, pattern, and / or image of the wake-up screen associated with the home screen.
[0238] In some embodiments, extended interface panel switcher user interface 561 optionally also displays at least a portion of representations 552 and / or representations 554 of other wake screen user interfaces. In some embodiments, only the wake screen user interface currently centered in extended interface panel switcher user interface 561 is displayed with representations of its associated home screen user interface. For example, representations 552 and 554 of the wake screen user interface are not displayed with corresponding representations of the home screen user interface.
[0239] In some embodiments, the extended interface panel switcher user interface 561 includes a user-selectable button 564 for adding a new wake screen and / or home screen to the set of wake screens and home screens stored and displayed in the extended interface panel switcher user interface 561. In some embodiments, the computer system detects and responds to user input directed to the extended interface panel switcher user interface 561, the user input corresponding to a request to scroll left and / or right to navigate between wake screen and home screen options in the set of wake screens and home screens in the extended interface panel switcher user interface 561. In some embodiments, the extended interface panel switcher user interface 561 also includes a user-selectable option 553 for customizing the wake screen centered on the extended interface panel switcher user interface 561. For example, a user selection input on option 553 will open an editing user interface (e.g., editing user interface 565, Figure 5X ). In some embodiments, the extended interface panel switcher user interface 561 includes an option 555 for changing the background image of the wake screen background corresponding to the representation 550. In some embodiments, in response to a user selection input on option 555, a photo picker is displayed, wherein the computer system detects and responds to the user input corresponding to a request to select a photo or image to be used as the wake screen background corresponding to the representation 550.
[0240] Figure 5VThe update of wake screen selector user interface 548-1 to wake screen selector user interface 548-2 is shown, which causes representation 554 of the wake screen user interface to be centered in the wake screen selector user interface. In some embodiments, wake screen selector user interface 548-2 is displayed in response to user input 558 (such as a tap input or other selection input on representation 554, or a swipe input or other scroll input from right to left), which causes the device to shift the representation of the wake screen user interface within the view so that representation 554 of the wake screen user interface is centered, and move the previously centered representation 550 of the wake screen user interface to the left of wake screen selector user interface 548-2 (optionally sliding a portion of representation 550 off the display).
[0241] In some embodiments, the wake-up screen selector user interface 548-2 includes a user-selectable option for editing the currently centered wake-up screen. For example, in response to user input 568 on the edit button (e.g., a tap input or other selection input), the device 100 displays an edit user interface 565 for the wake-up screen, such as Figure 5X shown.
[0242] Figure 5W A wake-up screen user interface 563 is shown in response to a user input corresponding to a request to quickly switch the wake-up screen user interface (e.g., user input 562). In some embodiments, the user input requesting a quick switch of the wake-up screen user interface includes a long press input (e.g., user input 544, Figure 5R ), where the long press input (e.g., continued input contact) is maintained while the wake screen selector user interface 548-1 is displayed ( Figure 5T ), and while the long press input is in progress, the input changes position (e.g., swipes in the first direction), such as user input 562 swiping from right to left. In some embodiments, based on determining that the user input is lifted off, the wake-up screen displayed in the center of the wake-up screen selector user interface 548-1 is switched so that the wake-up screen is displayed as the current wake-up screen. For example, in Figure 5T , the user swipes left until representation 554 is centered (or substantially centered) in wake screen selector user interface 548-1, and then lifts off the user input to display wake screen 563 associated with representation 554, as shown. Figure 5W In some embodiments, the quick switch of the wake screen user interface does not display the extended interface panel switcher user interface 561.
[0243] In some embodiments, such as Figure 5WAs shown, in response to user input 564 on an indication of the time and / or date displayed in the wake-up screen user interface 563, the device 100 displays an edit user interface 565-a ( Figure 5W1 ) or edit user interface 565 ( Figure 5X ). In some embodiments, user input 564 is a tap input, a long press input, or another selection input. In some embodiments, Figure 5W1 The illustrated editing user interface 565-a includes a guideline 572 for displaying a complex functional block behind or at least partially obscured by a subject of a background image (e.g., stars). In some embodiments, in response to a user interaction to edit one or more visual attributes of the wake screen user interface, such as a user input 571-a pointing to the guideline 572, the guideline 572 is displayed in front of the subject of the background image (e.g., stars).
[0244] Figure 5X Editing user interface 565 is shown, which, as described above, can be accessed via user input 564 on wake screen user interface 563, or by selecting an edit button via user input 568. In some embodiments, editing user interface 565 is also accessible via a settings application on device 100, or while a user is creating a wallpaper, which is optionally displayed in a share menu that appears in response to a user request to share a selected image (e.g., from a photos application).
[0245] In some embodiments, the editing user interface 565 includes multiple markings indicating customizable portions of the wake screen user interface. For example, markings 568 near the date and markings 569 near the time indicate that the date and time are editable (e.g., in text font and / or type of information displayed), and markings 572 indicate that one or more complex function blocks are customizable (e.g., the computer system detects and responds to user input directed to markings 572, which corresponds to a request to initiate a process of adding, removing, and editing complex function blocks displayed on the wake screen user interface 563). In some embodiments, it is indicated 574 that other views (e.g., pre-generated views that change hue, apply visual effects, and / or change background views) are available for the selected wake screen user interface 563. In some embodiments, the editing user interface 565 includes a user-selectable option for canceling 567 editing the wake screen user interface and / or a user-selectable option for saving any changes to the wake screen user interface and exiting the editing user interface 565 (in response to selection of the "Done" option 566).
[0246] Figure 5XA user input 571, such as a tap input or other selection input, is shown to add a complex function block to the wake screen user interface 563. In some embodiments, in response to the user input 571, the device displays a display including Figure 5Y A user interface element 570 of a plurality of available and / or recommended complication blocks is shown, and the device detects and responds to user input selecting the displayed complication block to add the selected complication block to the wake screen user interface 563. For example, in response to user input 572 (e.g., a tap input or other selection input) selecting a recommended set of complication blocks (including a health complication block, a breathing complication block, and a calendar complication block), the device adds the set of complication blocks to a predefined portion of the wake screen user interface, optionally below a time indication.
[0247] In some embodiments, user interface element 570 includes multiple complex function blocks, each of which is associated with an application executed on device 100. In some embodiments, an indication of the application associated with each complex function block is displayed (e.g., a "calendar" application, a "health" application, a "weather" application, and a "breathing" application). In some embodiments, an application provides multiple complex function blocks (e.g., multiple options with different designs and / or different status information of the complex function blocks of the corresponding application). In some embodiments, a third-party provider providing the corresponding application optionally designs one or more complex function blocks for the corresponding application (e.g., using an API, programming guide, and / or toolkit), which receive permission to be displayed by the operating system on one or more system user interfaces. In some embodiments, each complex function block includes status information of the corresponding application. For example, the calendar complex function block includes an upcoming event saved on the user's calendar ("11:00 am event"). In some embodiments, the health complex function block includes an indication of the current fitness distance and / or daily activity amount. In some embodiments, the weather application is associated with multiple complex function blocks, including a complex function block that provides a current air quality index (AQI) and / or a complex function block that indicates the current weather (e.g., sun on a clear day or clouds on a rainy day).
[0248] In some embodiments, the computer system detects and responds to user input directed to user interface element 570, which corresponds to a request to select one or more individual complication tiles, as opposed to a recommended group, such as user input 574 selecting calendar complication tile 502-10, as shown in FIG. Figure 5Y In some embodiments, in response to user input 574, the device adds calendar complication tile 502-10 to a predefined area in the wake screen user interface for complication tiles, such as Figure 5Z In some embodiments, the device detects and responds to a user input directed to the editing user interface 565, which corresponds to a request to change the position of the predefined area in the wake screen user interface (e.g., from below the time indication to above the date indication). In some embodiments, if there is additional space in the predefined area, an indication to add a complex function block (e.g., button 572 and / or button 576) is optionally displayed. In some embodiments, an indication to add a complex function block is optionally displayed only when there is no complex function block in the predefined area.
[0249] Figure 5Z User input 578 is shown selecting the health complex function block 502-11. Figure 5AA 5. In some embodiments, as shown, in response to user input 578, device 100 adds health complication tile 502-11 to a predefined area in the wake screen user interface for complication tiles (e.g., next to calendar complication tile 502-10). Figure 5AA to Figure 5AB As shown, the device detects and responds to user input directed to a predefined area corresponding to a request to change the positioning of a complication tile, such as input 580 directed to complication tile 502-11 to place health complication tile 502-11 to the left of calendar complication tile 502-10.
[0250] Figure 5AA User input 580 is shown selecting health complication tile 502-11, such as a tap input or other selection input. In some embodiments, user input 580 also indicates that health complication tile 502-11 moves from right to left (e.g., via a drag and / or swipe gesture). In some embodiments, in response to user input 580, complication tiles are rearranged in user interface 565, with health complication tile 502-11 to the left of calendar complication tile 502-10, such as Figure 5AB shown.
[0251] Figure 5AB User input 582 is shown selecting a breathing complication 502-12 from a set of complication blocks displayed in user interface element 570, the breathing complication block being associated with a breathing application for reminding a user to periodically take deep breaths. In some embodiments, user interface element 570 is scrollable, and the device detects and responds to user input directed to user interface element 570 corresponding to a request to scroll and view additional complication blocks available for addition to the wake screen user interface.
[0252] Figure 5AC502-12. In some embodiments, the predefined area for displaying complex function blocks has a maximum size and / or a maximum number of complex function blocks that fit within the predefined area. For example, the predefined area fits at most four complex function blocks of a first size (e.g., a single slot size), or two complex function blocks of a second size (e.g., each having a double slot size). In some embodiments, one or more complex function blocks are automatically removed in response to user input to add a complex function block to the predefined area based on a determination that the additional complex function block does not fit within the predefined area. In some embodiments, in Figure 5AC In the embodiment, user interface element 570 is optionally minimized or closed. In some embodiments, the device reopens user interface element 570 in response to detecting a user input that taps or otherwise selects a complex function block in editing user interface 565.
[0253] Figure 5AD Shown is a user interface element 586 displayed in response to detecting a user input 584 at a location within a marking line 569 near the time. In some embodiments, the user interface element 586 includes an option for modifying the attributes of the time. For example, the device detects user input pointing to different font colors, fonts, and display styles in the user interface element 586, and modifies the text style (e.g., font, font size, and / or font color) and / or modifies how to display the time (e.g., as a 24-hour indication or as a 12-hour indication). In some embodiments, the marking line 568 near the date is optionally not displayed. In some embodiments, in response to the user input that changes the text style, the text style of both the date and time is updated. In some embodiments, the device detects a separate user input for selecting different text styles for the date and time (e.g., selecting the text style of the date when selecting the marking line near the date, and selecting the text style of the time when selecting the marking line near the time).
[0254] In some embodiments, the device detects and responds to a user input corresponding to a request to modify the color of the time directed to the user interface element 586. In some embodiments, a suggested color for the time (e.g., Figure 5AEAs shown). In some embodiments, the recommended colors include bright colors, black and / or white (e.g., depending on the background color) and / or one or more colors derived from the background (e.g., colors that match or complement the colors in the photo used as the background). In some embodiments, the device provides one or more user interface objects in the user interface element 586 to customize the color (e.g., modify one or more aspects of the currently displayed color options (e.g., color, hue and / or saturation)) and / or select another color not included in the recommended colors (e.g., by selecting a color from a color wheel and / or sampling a color from a background media item) to apply to the time. In some embodiments, in response to detecting a user selection of a user interface object that corresponds to a user request to customize the color by sampling a portion of the background, the device stops displaying the user interface element 586 and reveals the background of the wake-up screen user interface. In some embodiments, the device displays a color sampling object that moves on the currently displayed background according to the user's movement input, and updates the color of the color sampling object according to the background color at the current position of the color sampling object. When user confirmation that color sampling is complete is received, user interface element 586 is redisplayed using a sampled color included in the set of available font colors, and optionally, the selected color (and the displayed color of the time element) is matched to the sampled color obtained from the background.
[0255] In some embodiments, in response to user input 588 selecting "Style 5", the text style of the date and time is updated to be displayed in text style 5, such as Figure 5AE In some embodiments, in response to user input 590, the color of the text is updated to the color selected by the user input 590, such as Figure 5AE In some embodiments, in response to a request to change the color of the text, the color scheme of one or more other wake screen user interface elements (e.g., one or more complex function blocks and / or background images) is also updated. Figure 5AE , the health complex function block 502-13 and the respiratory complex function block 502-14 are displayed in different color schemes. In some embodiments, the color of the complex function block is selected to match and / or supplement the selected color of the text. Figure 5AE Also shown is a user input 592 (e.g., a tap input or other selection input) selecting a date indication, optionally without displaying a guideline 568 near the date. In some embodiments, in response to the user input 592, a user interface element 594 is displayed for changing the type of information displayed for the date indication. In some embodiments, in response to the user input 592, the guideline 568 is optionally redisplayed to indicate that the user is modifying one or more properties of the date indication, such as Figure 5AF shown.
[0256] Figure 5AF User input 596 is shown selecting to modify information displayed as a date indication to include the day of the week (e.g., instead of the day of the week and the current month and date). In some embodiments, user interface element 594 optionally includes one or more text attributes (e.g., font and / or color options) that, when selected, cause the device to modify the text attributes of the date indication (e.g., separate from the text attributes of the modification time indication described above). Figure 5AG 598, the indication of the date is updated to display the day of the week (e.g., "Friday") instead of the current month and date. In some embodiments, user input 598 selects a done option 566 for exiting the editing user interface 565. In some embodiments, in response to user input 598 selecting done option 566, device 100 stops displaying the editing user interface 565 and displays a wake screen user interface 5001 with the attributes selected by the user in the editing user interface, such as Figure 5AH shown.
[0257] Figure 5AI A portrait-style wake-up screen user interface 5001 is shown, which optionally includes multiple complex function blocks, including a health complex function block 502-15, a weather complex function block 502-16, a breathing complex function block 502-17, and a motion complex function block 502-18, and includes a background photo of a subject (e.g., an individual). In some embodiments, the portrait-style wake-up screen user interface 5001 is displayed with a simulated depth effect, as shown in reference Figure 5H described.
[0258] In some embodiments, a photo is included as a background image (e.g., such as Figure 5AI The device 100 may also display a wake screen user interface (e.g., a portrait-style background image shown in FIG. 1 ) with an aspect ratio different from an aspect ratio of a stored photo (e.g., as stored in a photo application). For example, the device 100 may automatically center, scale, and / or crop a photo stored in the photo application to be displayed as the background of the wake screen user interface.
[0259] In some embodiments, a photo-style wake-up screen user interface (including Figure 5AI The portrait-style wake-up screen user interface (shown in the wake-up screen user interface 5001) includes a live photo that is animated over time or, optionally, in response to user input on the wake-up screen user interface. For example, the photo-style wake-up screen user interface includes multiple interpolated frames so that the photo appears to be animated (e.g., to show movement of an individual displayed in the wake-up screen user interface 5001).
[0260] In some embodiments, in response to a first type of user input 5002, such as a tap input or a press and hold input on an indication of a time and / or date (or, optionally, on a complex function block among multiple complex function blocks) that satisfies a threshold amount of time (e.g., at least 1 second, 3 seconds, or 5 seconds), the device 100 displays an editing user interface 565-2 for waking up the screen user interface 5001.
[0261] like Figure 5AJ As shown, in some embodiments, the editing user interface 565-2 includes the same set of features as the editing user interface 565, such as a rule 568 and / or 569 for date and / or time indication, a cancel option 567, a completion option 566, and an indication 574 that additional views of the user interface are available. In some embodiments, a cropping indication 5003 is optionally displayed to indicate that the device will adjust the size and / or proportion of the background image for the wake-up screen user interface in response to a user input pointing to the cropping indication 5003. In some embodiments, the cropping indication 5003 optionally includes a textual indication, such as "Pinch to crop", to inform the user that a pinch gesture or other type of gesture will cause the device 100 to crop the photo used as the background of the wake-up user interface 5001.
[0262] Figure 5AJ Also shown is a pinch gesture 5004 or other user input for changing the crop of the background photo being detected. In some embodiments, pinch gesture 5004 includes moving two contact points apart and / or closer together. In some embodiments, an inward pinch gesture that moves the contact points closer together causes the size of the subject in the background photo to decrease (e.g., as if zooming out), and an outward pinch gesture that moves the contact points farther apart causes the size of the subject in the background photo to increase (e.g., as if zooming in) and / or optionally crops the photo. For example, pinch gesture 5004 is an outward pinch gesture that zooms in on the subject, such as Figure 5AK As shown, the pinch gesture 5006 (e.g., an inward pinch gesture) causes the subject to shrink, as shown Figure 5AL shown.
[0263] In some embodiments, when a user input that changes the cropping of the background photo is detected, the guide lines 568 and / or 569 are optionally not displayed. In some embodiments, based on determining that the main body of the portrait-style user interface has a size that overlaps a portion of the time and / or date indication, the main body is optionally displayed as covering the time and / or date indication. In some embodiments, the main body is optionally displayed as covering multiple complex function blocks. In some embodiments, multiple complex function blocks are optionally displayed on the main body of the portrait-style wake-up screen user interface.
[0264] Figure 5ALUser input 5008 is shown selecting a guideline 569 for a time indication. In some embodiments, in response to user input 5008, a user interface element 586 for editing a time indication is displayed. In some embodiments, user input 5010 for changing the text style of a time and / or date indication to "Style 2" is detected. In some embodiments, in response to user input 5010, device 100 changes the time and, optionally, the date indication to be displayed in text style "Style 2", such as Figure 5AN shown.
[0265] Figure 5AN User input 5012 is shown corresponding to a request to minimize or close user interface element 586. In some embodiments, user input 5012 includes a downward swipe gesture, or another input selecting a close option.
[0266] Figure 5AO The editing user interface 565-2 is shown after the user interface element 586 is minimized or closed in response to user input 5012. In some embodiments, multiple views of the wake-up screen user interface are available, as indicated by indicator 574. In some embodiments, each of the multiple views corresponds to a different set of visual attributes, optionally without changing the content of the background of the wake-up screen user interface. For example, for an emoji-style wake-up screen user interface, the multiple views include different patterns or arrangements of one or more selected emojis used in the background, and / or change the color effect (e.g., monochrome, sepia, or neon) and / or shading level displayed with the emojis in the background of the wake-up screen user interface. In some embodiments, for a portrait-style wake-up screen or other wake-up screen user interface that includes a photo as a background image, the multiple views include a background image with different visual effects (e.g., grayscale, sepia, or another filter) applied. In some embodiments, for an astronomical-style wake-up screen, the multiple views include different versions of a background image, such as different phases of the moon.
[0267] In some embodiments, the available multiple views optionally include different groups of complex function blocks, different styles of text for time and / or date indication (e.g., including font style and / or color), and / or different background colors for photos (e.g., replacing the background color while maintaining the subject in the photo). In some embodiments, the multiple views are views automatically generated and / or selected by device 100 without user input.
[0268] In some embodiments, when the device 100 displays the editing user interface 565-2, the device detects user input pointing to a currently displayed view in the multiple views to scroll the multiple views in the editing user interface 565-2. Figure 5AO User input 5014-1 is shown, such as a swipe input or other input (e.g., tapping on the corresponding side of the user interface to scroll in the corresponding direction). In some embodiments, user input 5014-1 is initiated with a contact detected at a first location, and the contact moves in a first direction (e.g., from right to left or from left to right). In some embodiments, based on user input 5014-1, which optionally continues in the same direction as user input 5014-2, device 100 updates the view in the editing user interface to display at least a portion of the second view of the wake screen user interface. In some embodiments, a portion of the second view is gradually displayed, appearing as if the second view slides onto the display, and the first view is gradually removed from the display, as if sliding off the display.
[0269] Figure 5AP A portion of the second view is shown, which slides onto the display, while the first view slides away from the display. In some embodiments, one or more visual elements in the first view are optionally maintained in both the first view and the second view. In some embodiments, the one or more visual elements maintained are optionally not moved within the user interface. In some embodiments, the one or more visual elements maintained correspond to the visual elements of the wake-up screen user interface that the user has previously modified (e.g., in the current editing session and / or in the previous editing session). For example, the user has modified the date and time indication, and the user has modified the size of the subject in the background photo. In some embodiments, when the second view slides onto the display, the date and time indication and the subject in the background photo do not move. In some embodiments, a group of visual elements that are optionally not modified by the user in the current editing session and / or in the previous editing session move away from the display with the first view and are replaced by another group of visual elements. For example, according to user input 5014-2, complex function blocks and background colors appear to slide away from the display.
[0270] Figure 5AQ 5014-2. In some embodiments, user input 5014-3 is optionally a continuation of user inputs 5014-1 and 5014-2, where user input 5014-3 has maintained contact with the display and changed to a swipe in another direction. In some embodiments, based on user input 5014-3, sliding to Figure 5AP Thus, user input 5014 (e.g., 5014-1, 5014-2, and 5014-3) controls bringing views to and / or removing views from editing user interface 565-2.
[0271] Figure 5AR User input 5014-4 is shown, optionally as a continuation of user input 5014-3, swiping in the same direction as user interface 5014-2 to slide a second view of the wake screen user interface onto the display. Figure 5AS As shown, as user input 5014-5 continues to swipe from right to left, a larger portion of the second view of the wake screen user interface slides onto the display, optionally until the second view of the wake screen user interface is displayed in the editing user interface 565-2 without displaying the first view of the wake screen user interface, as shown in FIG. Figure 5AT shown.
[0272] Figure 5AT A second view of the wake screen user interface is shown, in which the complex function block has been changed relative to the first view of the wake screen user interface, and / or the background color of the second view has been changed. In some embodiments, the background color selected for the view in the portrait-style wake screen user interface is selected based on the content in the photo. For example, the original background of the photo is replaced with a monochrome or color gradient, where the color is selected to match and / or complement the color that appears in the original background of the photo and / or appears in the main body of the portrait-style wake screen user interface.
[0273] In some embodiments, when a user switches between views of the wake screen user interface (e.g., via user input 5014), one or more editing options are optionally not displayed. For example, guide lines, a completion option, a cancel option, and / or indications of additional views are optionally not displayed until a single view is displayed. For example, in Figure 5AT The second view is displayed, the first view is no longer displayed, and the one or more editing options are redisplayed.
[0274] In some embodiments, user input 5016 is detected on a complex function block displayed in the second view of the editing user interface 565-2. In some embodiments, in response to the user input 5016, a user interface element 570 for changing the complex function block is displayed, such as Figure 5AU In some embodiments, user input 5018 selects a health complication tile, and device 100 replaces display of the weather complication tile with the selected health complication tile.
[0275] Figure 5AV User input 5020 is shown requesting to switch views in the editing user interface after editing a complex function block.
[0276] Figure 5AWShown is that, in response to user input 5020, the view switches from a second view to a third view (e.g., having a different background color and / or pattern) without changing the time indication, date indication, body, or complication block, based on whether each of these features has been manually edited by the user during the current (or, optionally, a previous) editing session. Figure 5AW User input 5022 is shown selecting the "Done" option to exit the editing user interface.
[0277] Figure 5AX1 A wake screen user interface 5024 is shown displayed along with the visual features selected by the user during the editing process.
[0278] Figure 5AX2 An editing user interface 565-3 for editing a wake-up screen user interface is shown, which includes a text indication of a date, a text indication of a time, and a plurality of complex function blocks. In some embodiments, a plurality of complex function blocks are displayed together with corresponding enable indications for removing the complex function blocks. For example, a minus sign, "x", or another removal enable indication that partially overlaps the complex function block is optionally displayed at a corner of the complex function block; and selection of a minus sign, "x", or other removal enable indication causes the device to remove the complex function block from the wake-up screen user interface.
[0279] In some embodiments, device 100 detects user input 5080 (e.g., a tap input or other selection input) selecting complex function block 5089-1. In some embodiments, in response to user input 5080, device 10 displays a user interface element 5082 for changing the size of the selected complex function block 5089-1. For example, device 100 provides multiple size options for displaying information of complex function block 5089-1. In some embodiments, the multiple size options correspond to different text sizes. In some embodiments, user input 5084 is detected as selecting a first size option for complex function block 5089-1, and in response to the user input, complex function block 5089-1 is updated to the selected size, such as Figure 5AX4 shown.
[0280] Figure 5AX3 Device 100 is shown detecting user input 5086 selecting affordance 5089-2 for removing a complex function block. In some embodiments, in response to user input 5086, complex function block 5089-2 is removed from the wake screen user interface, such as Figure 5AX4 shown.
[0281] Figure 5AX3Also shown is user input 5088 corresponding to selection of a line for the text indication of the date. In some embodiments, in response to user input 5088, device 100 displays user interface element 5090 for changing the content displayed in the area above the text indication of the time. For example, the device displays multiple complex function blocks in user interface element 5090 and detects user input corresponding to a request to select a complex function block from the multiple complex function blocks displayed in user interface element 5090. In some embodiments, the multiple complex function blocks that can be selected to be displayed above the text indication of the time are a group of complex function blocks that can be selected to be displayed below the text indication of the time (e.g., a group of complex function blocks displayed in user interface element 570, as shown in reference to FIG. 5 ). Figure 5AA to Figure 5AC For example, a complication to be displayed above a textual indication of the time is a text-based complication and / or has a different size (e.g., height and / or length) than a complication to be displayed below a textual indication of the time.
[0282] Figure 5AX4 5092 is shown selecting a complex function block to be displayed above the text indication of the time. In some embodiments, in response to user input 5092, such as Figure 5AX5 As shown, the selected complication is displayed above the textual indication of the time, in the marking line 5094, and replaces the display of the textual indication of the date. Figure 5AF More details are described regarding selecting a complex function block to display above time and / or selecting different information sets to display in a complex function block. For example, device 100 optionally displays user interface element 594 ( Figure 5AF ) and the content of user interface element 5090, enabling a user to select text information and / or complex function blocks to be displayed above the indication of time. Figure 5AY to Figure 5BD Another example of editing a wake screen user interface is shown, including switching between multiple views for editing a corresponding wake screen user interface in the user interface. Figure 5AY Device 100 is shown displaying wake screen user interface 5026 and receiving user input 5028 selecting a calendar complication tile. In some embodiments, if user input 5028 is a first type of input (e.g., a tap input or other selection input), device 100 displays an application user interface for an application associated with the selected complication tile (e.g., a calendar application). In some embodiments, if user input 5028 is a second type of input (e.g., a press and hold or another gesture), device 100 displays an editing user interface 565-3 for editing visual features of wake screen user interface 5026.
[0283] Figure 5AZ A user interface element 570 for editing a complication block is shown displayed in editing user interface 565-3 in response to user input 5028. In some embodiments, user input 5030 for minimizing or closing user interface element 570 is detected, optionally without detecting user input for changing or selecting a complication block. In some embodiments, user input 5032 is detected as selecting a complication block (e.g., a weather complication block) from user interface element 570, and device 100 updates the wake screen user interface to include the selected complication block before minimizing user interface element 570.
[0284] Figure 5BA Editing user interface 565-3 is shown after user interface element 570 has been minimized or closed. In some embodiments, user input 5034 is detected to change the current view of the wake screen user interface. In some embodiments, user input 5034 is a swipe gesture (e.g., from left to right or from right to left). In some embodiments, in response to user input 5034, editing user interface 565-3 displays a second view of the wake screen user interface.
[0285] Figure 5BB A second view of the wake screen user interface is shown. In some embodiments, the background image of the wake screen user interface is updated, for example, for an astronomical wake screen user interface, different phases of the moon are included in different views of the wake screen user interface. In some embodiments, a palette or other virtual effects change between different views of the wake screen user interface. In some embodiments, the second view of the wake screen user interface includes different text styles for date and / or time indications. In some embodiments, a subset (less than all) of complex function blocks are updated from the first view to the second view. For example, a complex function block manually selected by a user (e.g., a weather complex function block) does not change between the first view and the second view, while other complex function blocks change. In some embodiments, an animated transition is displayed while the display is changing from the first view to the second view, such as a reference to a transition. Figure 5AP The described sliding animation.
[0286] In some embodiments, in response to user input 5036 corresponding to a request to redisplay the first view of the wake screen user interface (e.g., a swipe user input in a direction opposite to user input 5034), the first view of the wake screen user interface is redisplayed in the editing user interface 565-3, such as Figure 5BC shown.
[0287] In some embodiments, in response to detecting user input 5038, such as user input in a direction different from user input 5034, device 100 displays a third view of the wake screen user interface, such as Figure 5BD In some embodiments, the third view of the wake-up screen user interface optionally displays a different lunar phase than the first view of the wake-up screen user interface, and / or optionally displays the same complex function block as the first view of the wake-up screen user interface.
[0288] In some embodiments, in response to user input 5040 selecting the “Done” option, device 100 stops displaying the edit user interface 565 - 3 and displays a view of the wake screen user interface that was displayed when user input 5040 was detected as the current wake screen user interface.
[0289] Figures 5BE to 5BF An example of navigating from a wake screen user interface to a home screen user interface is shown. In some embodiments, in response to a user input 5042 requesting navigation away from the wake screen user interface 5041 to the home screen user interface (e.g., a swipe input or other selection input initiated on a home icon, such as on a home button), the device 100 displays an animated transition 5043, wherein the wake screen user interface is visually weakened (e.g., using a blur effect and / or by changing the level of translucency) when the wake screen user interface is animated to slide away from the display (optionally in an upward direction). In some embodiments, one or more application icons on the home screen user interface are optionally animated to enter the display and / or are at least partially visible behind the visually weakened wake screen user interface during the animation.
[0290] Figure 5BG to Figure 5BH An example of navigating from a wake screen user interface to an application's user interface is shown. In some embodiments, in response to a request to navigate away from the wake screen user interface (e.g., via user input 5042 and / or user input 5044), the displayed user interface is based on the user interface displayed before the wake screen user interface was displayed (e.g., before entering a low power state and / or lock mode). For example, if the device 100 displays an application user interface as the most recently displayed user interface before the device enters a low power state and / or lock mode, then in response to a user input requesting navigation away from the wake screen user interface 5041, the previously displayed application user interface is redisplayed. Similarly, in some embodiments, if the device 100 displays a home screen user interface as the most recently displayed user interface before the device enters a low power state and / or lock mode, then in response to a user input requesting navigation away from the wake screen user interface 5041, the previously displayed home screen user interface is redisplayed.
[0291] In some embodiments, in response to user input 5044 requesting navigation away from wake screen user interface 5041 to home screen user interface (e.g., a swipe input or other selection input initiated on a home icon, such as on a home button), device 100 displays animated transition 5045, wherein the wake screen user interface is optionally not visually deemphasized, or is visually deemphasized in a different manner than animated transition 5043 (e.g., with a different blur effect and / or with a different level of translucency), while the wake screen user interface is animated to slide away from the display, optionally in an upward direction. In some embodiments, the user interface of the application is optionally displayed on a portion of the display that is not covered by the wake screen user interface when the wake screen user interface slides away from the display.
[0292] Figure 5BI A home screen user interface 5046 is shown. In some embodiments, the home screen user interface 5046 includes one or more application icons and is displayed with a background image. In some embodiments, the background image displayed in the home screen user interface 5046 is based at least in part on the wake-up screen user interface that the user navigated away from. For example, the wake-up screen user interface 5041 includes a star image as a background, and the associated home screen user interface 5046 also includes a star image. In some embodiments, the backgrounds of the home screen and the wake-up screen do not need to share content, but the corresponding home screen is stored in association with the corresponding wake-up screen, so that if the current wake-up screen changes from the first wake-up screen to the second wake-up screen, the home screen displayed in response to user input on the corresponding wake-up screen is associated with the corresponding wake-up screen.
[0293] Figure 5BI A user input 5048 corresponding to a request to view a cover user interface is shown, which cover user interface optionally includes the same visual features as the wake-up screen user interface. In some embodiments, a user input 5050 is detected on a power button (e.g., pressing button 206) to cause the device 100 to enter a low-power state and / or a locked mode. In some embodiments, when the device 100 is woken up from a low-power state and / or a locked mode, the wake-up screen user interface 5041 is optionally redisplayed. In some embodiments, when the device 100 is woken up from a low-power state and / or a locked mode, the wake-up screen user interface is updated to the next wake-up screen user interface in the stored set of wake-up screen user interfaces (e.g., where the device 100 optionally cycles between the stored set of wake-up screen user interfaces periodically and / or when woken up).
[0294] Figure 5BJUser input 5051 is shown, optionally a swipe user input in a first direction (e.g., from left to right or from right to left). In some embodiments, user input 5051 is detected within a predefined area of wake screen user interface 5041. In some embodiments, input within the predefined area of wake screen user interface 5041 causes device 100 to change to another wake screen user interface. For example, Figure 5BK As shown, the wake-up screen user interface is updated to display the wake-up screen user interface 5052.
[0295] In some embodiments, after the wake screen user interface is updated to the wake screen user interface 5052, a user input 5054 requesting navigation away from the wake screen user interface is detected. In some embodiments, in response to the user input 5054, the device 100 displays a home screen user interface 5056 related to the wake screen user interface 5052.
[0296] Figure 5BL User interaction with the home screen user interface is shown in a manner similar to that with respect to home screen user interface 5046 ( Figure 5BI For example, user input 5058 causes device 100 to display a cover user interface (e.g., having visual attributes of wake screen user interface 5052), and user input 5060 causes device 100 to enter a low power state and / or a locked mode.
[0297] Figure 5BM to Figure 5BN An example of a user input selecting a complication tile displayed on wake screen user interface 5062 is shown. In some embodiments, user input 5064 is a tap input or other selection input on the breathing complication tile, and causes device 100 to display an application user interface for a breathing application associated with the breathing complication tile. In some embodiments, user input 5066 (e.g., a tap input or other selection input) is detected on the weather complication tile, and in response to user input 5066, device 100 displays an application user interface 5068 for a weather application associated with the weather complication tile, such as Figure 5BN In some embodiments, device 100 optionally requires the user to unlock the device (eg, using biometric authentication and / or a password) before displaying the corresponding application user interface associated with the selected complex function block.
[0298] Figure 5BO to Figure 5BPAn example of an animated transition is shown when the device 100 transitions from a low-power state to display a wake screen user interface 5070-2. For example, user interface 5070-1 is displayed in a normally-on (or dimmed) display (e.g., in a low-power state). In some embodiments, user interface 5070-1 includes multiple colored strips (or lines) that are animated when the device transitions between different user interfaces. For example, the colored strips are representations of ribbons, ropes, threads, or fabrics. In some embodiments, each strip has a different color (e.g., like a rainbow, a pride flag, or another set of strips). In some embodiments, the colored strips are arranged as if wrapped around an object (such as a cylinder). In some embodiments, the animated transition includes increasing the size of the strips and / or decreasing the distance between the strips. For example, in Figure 5BO In some embodiments, each of the colored stripes has a first size and there is space between the stripes. In some embodiments, according to the device 100 relieving the low power state to display Figure 5BP In the wake-up screen user interface 5070-2 in FIG. 4 , the strips are animated to converge together (eg, so that there is no space or the space is smaller between the strips), and the size of the strips increases to a second size that is larger than the first size.
[0299] Figure 5BQ to Figure 5BS An example of animating a background including colored strips in response to one or more user inputs is shown. In some embodiments, the device 100 detects user input 5072 (e.g., a swipe input or other input in a first direction). In some embodiments, in response to user input 5072, the colored strip is animated to be pulled in the same direction (or the opposite direction) as the user input 5072. For example, when the user input 5072 moves in an upward direction, the colored strip is animated to move upward, optionally while being displayed as being wrapped around an object (e.g., a cylinder). In some embodiments, the animation includes reducing the size of one or more of the colored strips and / or increasing the distance between at least two of the colored strips. In some embodiments, the topmost strip is animated to separate from its adjacent strips and increase the distance from its adjacent strips. For example, first the topmost strip separates from the group of strips, and then the second topmost strip separates from the remaining strips, optionally until there is space between each strip in the group of strips. For example, in Figure 5BR , the top three strips are shown separated from the remaining lower three strips in the set of strips, as indicated by the black space.
[0300] In some embodiments, animation is displayed based on user input 5072. For example, in Figure 5BRIn some embodiments, based on determining that user input 5072 does not meet the dismissal criteria, wake screen user interface 5070-3 is not dismissed, and in response to user input 5074, the animation is reversed, such as Figure 5BS For example, relative to Figure 5BR The strip in Figure 5BS , the strips have increased in size and the top strip has moved back down to remove distance between the set of strips. In some embodiments, the topmost strip is the last strip to rejoin the set of strips. In some embodiments, after detecting user input 5074, e.g., in response to lifting off 5076 of the user input, the user input is no longer detected. In some embodiments, the reversal animation continues until the wake screen user interface 5078 returns to its original state (e.g., Figure 5BQ , before detecting user input 5072), such as Figure 5BT shown.
[0301] Figure 5BU User input 5080-1 is shown, such as a swipe input in an upward direction. In some embodiments, user input 5080-1 satisfies the dismissal criteria for dismissing wake screen user interface 5070-7. For example, the dismissal criteria is satisfied based on determining that user input 5080-1 satisfies a threshold swipe speed and / or a threshold swipe distance. For example, the dismissal criteria is satisfied based on continuing to detect user input 5080-2 (e.g., a continuation of input 5080-1) as the user continues the upward swipe input. In some embodiments, in response to user input 5080-1, device 100 displays reference Figure 5BR The animation includes separating the colored strips and / or reducing the size of the colored strips, such as Figure 5BV shown.
[0302] In some embodiments, based on determining that user input 5080 (e.g., including user input 5080-1 and user input 5080-2) meets the dismissal criteria, device 100 displays a complete animation as device 100 transitions from displaying wake screen user interface 5070-7 to displaying home screen user interface 5070-10. Figure 5BW As shown, an intermediate user interface 5070-9 is displayed that includes colored strips that move upward and twist (e.g., around an invisible object, such as a cylinder), while the colored strips are displayed as separated, as indicated by the black space between the strips, and / or displayed with a smaller width than the strips displayed on the wake screen user interface 5070-7.
[0303] In some embodiments, after showing the animation of twisting and moving the strip upward, such as Figure 5BX As shown, the strip is displayed at a smaller width (optionally, the narrowest width displayed during the animation) as a background of the home screen user interface 5070-10, which also includes one or more application icons in the foreground. In some embodiments, the strip displayed in the background of the home screen user interface 5070-10 is optionally displayed at a width that is different from the width displayed in the wake screen user interface 5070-7 ( Figure 5BU ) is displayed with the same width as the width of the strip displayed in the background of the home screen user interface 5070-10, and is optionally displayed as being displaced upward from the strip displayed in the wake screen user interface 5070-7. For example, the strip in the background of the home screen user interface 5070-10 is displayed as the same size but in a different positioning than the strip in the background of the wake screen user interface 5070-7.
[0304] Figure 5BY and Figure 5BZ An example of changing the orientation of the strip of the wake-up screen user interface 5070-11 to the orientation of the strip of the wake-up screen user interface 5070-12 is shown. For example, the direction in which the strip is wrapped around an invisible object is updated to the opposite direction (e.g., clockwise or counterclockwise). In some embodiments, the orientation of the strip of the wake-up screen user interface 5070 is selected according to user input. For example, the user is provided with an option for selecting the orientation of the strip to be used as the background of the wake-up screen user interface. In some embodiments, the orientation of the strip is automatically determined without user input. In some embodiments, the orientation of the strip is periodically alternated, for example, whenever the wake-up screen user interface is called, the orientation of the strip changes from the previous orientation displayed when the wake-up screen user interface was previously called. For example, when locking and unlocking the cycle and / or when releasing the low-power state, the wake-up screen user interface alternates the orientation of the strip.
[0305] Figure 5CA to Figure 5CB An example of changing the background color of wake-up screen user interfaces 5070-13 to 5070-14 is shown. In some embodiments, the background color of the wake-up screen user interface is automatically selected according to the current operating mode of the device 100. For example, when the device 100 is in a first operating mode (such as a light mode), a background is selected for the light operating mode (e.g., a white background is selected), such as Figure 5CA In some embodiments, when the device 100 is in a second operating mode (such as a dark mode), a background is selected for the dark operating mode (e.g., a black background is selected), as shown. Figure 5CBAs shown. In some embodiments, the current operating mode is selected according to the time of day (e.g., light mode is selected during daytime and / or a predefined time period (e.g., from 6 a.m. to 8 p.m. or another time period), and dark mode is selected at night and / or outside the predefined time period (e.g., from 8 p.m. to 6 a.m.)). In some embodiments, the light mode and dark mode have corresponding sets of visual characteristics that increase or decrease the overall brightness of the user interface displayed by the display generation component. For example, in dark mode, the user interface elements and / or the background disk of the user interface elements displayed in the user interface are made darker (e.g., the brightness is reduced) than their counterparts displayed in light mode to reduce the average brightness of the user interface (e.g., to suit a particular time of day, function, and / or mood). In some embodiments, when the device switches from light mode to dark mode, text displayed in a dark color or black on a light background in light mode is optionally converted to text displayed in a light color or white on a dark background. In some embodiments, when the device switches from dark mode to light mode, text shown in dark mode on a light background in a dark color or black is optionally converted to text shown in a light color or white on a dark background. In some embodiments, the user is provided with an option to manually select a background color.
[0306] Fig. 6A Detection of user input 602 (e.g., a tap input, a long press input, or another selection input) on the wake screen user interface 600 is shown. In some embodiments, the user input 602 is detected at a portion of the wake screen user interface 600 that does not correspond to a date and / or time indication, a complication tile, or a flashlight and / or camera shortcut.
[0307] In some embodiments, based on determining that device 100 is in locked mode (e.g., optionally indicated by a lock indicator above the date), device 100 displays user interface 604 ( Figure 6B ), or otherwise prompt the user to authenticate before allowing the user to access applications or data stored on device 100.
[0308] In some embodiments, the user authenticates using a password entered in the user interface 604, such as Figure 6C In some embodiments, in response to user input 602, device 100 displays an extended interface panel switcher user interface 606, such as Fig.6D In some embodiments, as shown in reference Figure 5UAs described, the extended interface panel switcher user interface (e.g., user interface 561) includes multiple representations of the wake-up screen user interface (e.g., representation 611 of the wake-up screen user interface), wherein a centered wake-up screen user interface 615 is displayed simultaneously with a portion of the associated main screen user interface.
[0309] Fig.6D Multiple user interactions with the extended interface panel switcher user interface 606 are shown. In some embodiments, user input 608 selecting the plus button causes the device 100 to display a user interface (e.g., an editing user interface) for creating a new wake screen user interface to be added to the group of wake screen user interfaces. In some embodiments, user input 610 selecting a portion of the representation 611 of the second wake screen user interface causes the device 100 to display an editing user interface for the second wake screen user interface corresponding to the representation 611 of the second wake screen user interface. In some embodiments, user input selecting user interface element 609a ("Focus") enables the user to set a restricted notification mode for the wake screen corresponding to the representation 615 of the wake screen (e.g., in which certain types of notifications are suppressed and / or delayed). In some embodiments, user input selecting option 609b enables the user to view a gallery view (e.g., user interface 652, Figure 6K ) to create a new wake screen user interface to be added to the set of user interfaces. In some embodiments, user input 614 such as a swipe input (e.g., from right to left) causes the device to center the representation 611 of the second wake screen user interface in the extended interface panel switcher user interface 606, such as Fig. 6F shown.
[0310] In some embodiments, the device detects a user input directed to the extended interface panel switcher user interface 606 and responds to the user input, the user input corresponding to a request to rearrange the order of the set of wake screen user interfaces in the extended interface panel switcher user interface 606. For example, in response to a long press user input, a touch hold and drag input, or another type of user input directed to a corresponding representation of the wake screen user interface in the extended interface panel switcher user interface 606, the device selects the corresponding representation of the wake screen user interface and optionally drags the corresponding representation to the left and / or right of other representations of the wake screen user interface to change the order in which the device 100 cycles through the set of wake screen user interfaces.
[0311] In some embodiments, one or more wake-up screen user interfaces in the set of wake-up screen user interfaces are associated with a corresponding type or theme of the wake-up screen user interface. For example, the corresponding wake-up screen user interface is identified as a photo style, an emoji style, a portrait style, or another style that is optionally pre-generated. For example, the device 100 optionally generates one or more themes or styles for the wake-up screen user interface, such as a smart album that rotates images and / or photos stored on the device 100; a weather style that includes a representation of the weather forecast at the current location of the device 100; an astronomical, earth, or other celestial style; and / or a style that represents a lifestyle or other event (e.g., pride, women's history month, or other events). Figure 6K An example of a wakeup user interface having a theme or style and optionally automatically generated by device 100 without user input is shown.
[0312] In some embodiments, user input 612 such as a swipe gesture (e.g., up or down) causes device 100 to provide the user with the option of applying a delete centered wake screen user interface 615. For example, Fig. 6E As shown, the device 100 displays a delete icon 616. In some embodiments, in response to the user input 612 continuing (e.g., the swipe gesture continues in the same direction), the device 100 optionally displays a representation of the wake screen user interface 615 sliding off the display and removes the wake screen user interface 600 from the set of wake screen user interfaces. In some embodiments, a second user input 618 (e.g., a tap input or other selection input) selects the delete icon 616, and in response to the user input 618, the device 100 removes the wake screen user interface 600 from the set of wake screen user interfaces and stops displaying the representation of the wake screen user interface 615.
[0313] Fig. 6F A representation 611 of a second wake screen user interface is shown centered on the display (e.g., in response to user input 614). In some embodiments, when the representation 611 of the second wake screen user interface is centered on the display, a portion (less than all) of the associated main screen user interface representation 620 is optionally displayed as partially obscured behind the representation 611 of the second wake screen user interface. In some embodiments, the representation 611 of the second wake screen user interface is displayed simultaneously with a portion (less than all) of two or more other representations of the wake screen user interfaces (e.g., a representation 615 of the wake screen user interface on the left and a representation 613 of the wake screen user interface on the right).
[0314] Fig. 6FA plurality of user inputs are shown that enable a user to interact with the extended interface panel switcher user interface 606. For example, in response to user input 608-1 on the “+” button, the device 100 initiates a process for adding (optionally including designing and / or editing) a new wake screen user interface to be added to the set of wake screen user interfaces, such as Figure 6K In some embodiments, in response to user input 610-1 (e.g., a tap input or other selection input), the device centers the representation 613 of the wake screen user interface in the extended interface panel switcher user interface. In some embodiments, the user input 610-1 corresponds to a swipe input that causes the device 100 to scroll through the available representations of the wake screen user interfaces in the set of wake screen user interfaces.
[0315] In some embodiments, in response to user input 622 selecting a “Customize” button, device 100 displays an edit user interface 626 (or a user interface 627) for a representation of the wake screen that is currently in the center of extended interface panel switcher user interface 606 when user input 622 is detected. Figure 6G to Figure 6H1 ).
[0316] In some embodiments, in response to user input 624 selecting the representation 624 of the home screen user interface, the extended interface panel switcher user interface displays the representation of the home screen user interface in the center area of the user interface 638, such as Fig.6I shown.
[0317] Figure 6G to Figure 6H1 An editing user interface 626 for a wake-up screen user interface corresponding to the representation 611 of the wake-up screen user interface is shown. In some embodiments, the editing user interface 626 is optionally enabled to have a corresponding to the editing user interface 565 ( Figure 5X ). In some embodiments, the editing user interface 626 includes a user-selectable option for changing the font color of the user interface. In some embodiments, the editing user interface 626 includes a user-selectable option for applying a visual filter (e.g., applying a color filter, blur, transparency filter, and / or gradient filter) to the wake screen user interface. In some embodiments, in response to user input 628 selecting a first color, the font color of the date and / or time indication is updated to the selected first color, such as Figure 6H1 628 and / or in response to a user input 629. Figure 6G The user input on the "Font Color" button in the Figure 6H1 User interface element 630 is shown.
[0318] In some embodiments, the background of the wake-up screen user interface is an emoji-style background (e.g., a smiley face emoji), in which one or more facial emojis are arranged in a certain pattern (e.g., a geometric pattern). In some embodiments, different views of the emoji user interface include changing the size and / or arrangement (e.g., pattern) of the emojis in the background of the wake-up screen user interface. In some embodiments, an option 628b for selecting additional and / or alternative emojis (e.g., using an emoji picker) is displayed in the editing user interface 626. For example, the device displays multiple slots for the selected emoji to allow the user to select up to a threshold number of emojis (e.g., 3 or 4 emojis) from the emoji keyboard 629, and the device displays the selected emoji in a predefined pattern (e.g., a grid pattern, a swirl pattern, or another pattern) in the background of the wake-up screen user interface.
[0319] In some embodiments, user input 627 is detected as a selection of option 628b for selecting an emoji, and in response to user input 627, an emoji keyboard 629 is displayed in editing user interface 626, such as Figure 6H2 In some embodiments, the emoji keyboard 629 includes a user interface element that displays the currently selected emoji used in the pattern. Figure 6H2 , a smiley face emoji is selected, and the grid pattern includes a smiley face emoji. In some embodiments, while displaying the editing user interface 626 with the emoji-style background, the device 100 detects a user input 631-1, such as a swipe input in a first direction (e.g., from right to left). In some embodiments, in response to the user input 631-1, the device 100 updates the editing user interface 626 to display the emoji-style background in a different pattern (and optionally, arrange the same emoji in a different pattern). For example, the emoji Figure 6H2 are arranged in a first pattern (e.g., a grid pattern) in Figure 6H3 The layers are arranged in a second pattern (eg, a swirl pattern).
[0320] Figure 6H3 User input 633-1 selecting a first emoji (e.g., a thumbs-up emoji) and user input 633-2 selecting a second emoji (e.g., a heart emoji) are shown. In some embodiments, in response to user input 633-1 and / or 633-2, the emojis displayed in the background are updated according to the user selections. In some embodiments, the order in which the emojis are selected is the order in which the emojis are displayed (e.g., and alternate in the background pattern). For example, in Figure 6H4, a thumbs up emoji and a heart emoji are added after the smiley face emoji, and the pattern displays the selected emojis in an alternating pattern. For example, Figure 6H4 The vortex pattern in includes a smiling face emoji, a thumbs up emoji, and a heart emoji. In some embodiments, the device sets an upper limit (e.g., 3 emojis, 5 emojis, or 10 emojis) on the number of emojis that the user is allowed to select to be included in the same background, for example, by showing a threshold number of input slots at the top of the emoji keyboard 629. Although only a small number of fixed emojis are shown to be selected in this example, in some embodiments, the user optionally selects a different number of different emojis to generate an emoji pattern for the wake-up screen user interface, and / or a large number of different patterns are available for the user to choose to arrange the selected emojis in the background of the wake-up screen user interface. In some embodiments, in response to and according to the group of emojis that the user has selected for inclusion in the background of the wake-up screen user interface, the group of emoji patterns available for the user to select is automatically updated. For example, when the user has selected a first group of emojis, the device optionally displays a first group of available patterns, and when the user has selected a second group of emojis, the device optionally displays a second group of available patterns that are different from the first group of available patterns. In some embodiments, in response to one or more inputs directed to the emoji keyboard (e.g., a swipe input and / or a tap input on a category symbol for an emoji category), the device scrolls or replaces the emojis currently displayed in the emoji keyboard 629 to show additional emojis that are available for selection.
[0321] In some embodiments, in response to user input 631-2 (e.g., a swipe input), device 100 updates the background to display a third pattern that is different from the first pattern (e.g., a grid pattern) and the second pattern (e.g., a swirl pattern). Figure 6H5 As shown, selected emojis (including a smiling face emoji, a thumbs up emoji, and a heart emoji) are arranged in a geometric pattern that includes a diagonal arrangement of the emojis.
[0322] Figure 6H1 A user interface element 630 is shown for viewing and / or selecting a font color. In some embodiments, the user interface element 630 includes a Figure 6GIn some embodiments, the device selects and / or changes the font color for system-generated text (e.g., date and time elements) in response to detecting that a user selects a color sample in a list of color samples displayed in user interface element 630. For example, in response to user input 632, the device 100 updates the color to the color of the sample color selected by user input 632, and in response to user input 634, the device 100 updates the color of the font to the sample color selected by user input 634. In some embodiments, in response to user input 636 on a "Done" button, the device 100 exits the editing user interface 626 and optionally returns to the extended interface panel switcher user interface 606, or displays a wake screen user interface (e.g., using the edited wake screen user interface as the current wake screen user interface). Figure 6H6 In response to selecting user input 631-3 of the completion affordance, device 100 displays corresponding user-selectable options for also using the newly edited background of the wake screen user interface as the background of the home screen user interface associated with the wake screen user interface (e.g., "Use as Home Screen") or customizing the home screen user interface (e.g., modifying one or more aspects of the home screen user interface and / or using a different background from the wake screen user interface for the home screen user interface). For example, in response to selecting user input 635-1 of the first affordance for using the newly edited background of the wake screen user interface as the background of the home screen user interface, device 100 presses Figure 6H5An emoji user interface including a smiley face emoji, a thumbs-up emoji, and a heart emoji arranged in the pattern shown is set as the background of the home screen user interface, and representations of multiple applications are displayed as overlaid on the background of the home screen user interface. After setting the wake screen and home screen backgrounds, the device displays the wake screen user interface and the home screen user interface, respectively, wherein the same set of selected emojis are arranged in the same or substantially similar pattern in the backgrounds of the two user interfaces. In some embodiments, in response to user input 635-1, the device 100 exits the editing user interface and displays the home screen user interface and / or the wake screen user interface with the newly edited background. In some embodiments, in response to user input 635-2 selecting a second enabling representation of a customized home screen user interface (e.g., "Customize Home Screen"), the device 100 does not immediately use the newly edited background of the currently selected wake screen user interface as the background of the home screen user interface associated with the wake screen user interface; instead, the device provides the user with the opportunity to further customize one or more aspects of the home screen user interface (including but not limited to the background of the home screen user interface). In some embodiments, in response to a user request to customize the home screen user interface, the device 100 displays an editing user interface for the home screen user interface (e.g., similar to Figure 6J The editing user interface 642 shown in the figure allows the user to customize the home screen user interface (e.g., without first navigating to Fig.6I , and does not require the user to select the "Customize" button in the user interface 638). In some embodiments, the editing user interface for the home screen user interface is initially displayed as having the attributes of the newly edited background of the currently selected wake screen user interface (e.g., having the same set of selected emojis as the background of the wake screen user interface, and / or having the same or substantially the same emoji pattern as the background of the wake screen user interface), so that customization of the home screen user interface uses the newly edited background of the wake screen user interface as a starting point. In some embodiments, the device provides one or more selectable options for editing one or more aspects of the background of the home screen user interface (such as background media items, filters, emoji patterns, selected emojis, colors, font colors, fonts, legibility blur of the background of the home screen user interface). In some embodiments, the editing user interface 642 of the home screen user interface optionally changes the visual attributes of the application icons and / or widgets (e.g., making them more translucent, dimmed, and / or less saturated) to indicate that the editing user interface does not support selection and arrangement of application icons and / or widgets on the home screen user interface. In some embodiments, representations of application icons and / or widgets are displayed in the editing user interface 642 in place of the application icons and widgets that actually exist in the home screen user interface.
[0323] Fig.6I A representation of a home screen user interface in a center area of an extended interface panel switcher user interface 638 is shown (e.g., in response to user input 624). Fig.6I Upon user input selecting a “Customize” button via user input 640 , the device initiates a process of editing or customizing the home screen user interface.
[0324] Figure 6J An editing user interface 642 for editing the home screen user interface is shown. In some embodiments, user input 644 selects an option to change the color and / or gradient of the background of the home screen user interface. In some embodiments, in response to user input 646 selecting photo picker 628c, user interface 668 ( Figure 6N ), wherein in response to user input selecting a photo from user interface 668, the device changes the photo to include in the home screen user interface. In some embodiments, in response to a user request to further edit the home screen user interface after selecting a completion affordance in the edit user interface for customizing the wake screen user interface (e.g., in response to user input 635-2 selecting a “Customize Home Screen” affordance, as described in reference to FIG. Figure 6H6 ), showing Figure 6J In some embodiments, if editing user interface 642 is displayed in response to input selecting a “custom home screen affordance” after the wake screen editing process ends, editing user interface 642 includes the newly edited background of the wake screen user interface. In some embodiments, if editing user interface 642 is displayed in response to input selecting a “custom” affordance in user interface 638, editing user interface 642 includes a default background corresponding to the background of the wake screen user interface currently selected in user interface 638. In some embodiments, Figure 6J One or more of the application icons and / or widgets displayed in the home screen user interface being edited in the device 100 are optionally replaced with translucent objects that do not include indications of the applications associated with the objects. In some embodiments, the application icons and / or widgets are optionally displayed in a default arrangement (e.g., the application icons and / or widgets optionally do not correspond to the arrangement of the home screen user interface currently set for the device 100). In some embodiments, the application icons and / or widgets are replaced with translucent shapes that correspond to the shapes of the icons and / or widgets, but maintain the same arrangement (e.g., in size and / or positioning) as the arrangement of the application icons and / or widgets in the home screen user interface currently set for the device 100.
[0325] In some embodiments, in the editing user interface 642, the device switches "legibility blur" on and / or off in response to a user input (e.g., a tap input) directed to a legibility blur toggle control shown in the editing user interface 642. In some embodiments, the legibility blur, when activated, provides a visual attenuation (e.g., a blur effect) on the background, making text (e.g., a text label optionally displayed with an icon of an application) easier to read (e.g., legible) when displayed on top of the background.
[0326] In some embodiments, the editing user interface 642 includes an indication 647 that additional views of the home screen user interface are available. For example, the additional views correspond to one or more different visual effects applied to the background, including changing the color, hue, or another visual effect that changes the background. In some embodiments, the additional views include one or more different patterns or arrangements of the background of the home screen user interface. For example, smiley emoticons are rearranged in different patterns and / or displayed in different sizes in one or more additional views. In some embodiments, user input 648 (e.g., a swipe input or other gesture) corresponds to a request to change the currently displayed view of the home screen user interface, and in response to the user input 648, the device 100 displays a different view of the home screen user interface (e.g., changing the background of the home screen user interface).
[0327] In some embodiments, in response to user input 650 selecting a “Done” button, the device 100 exits the editing user interface 642 for the home screen user interface.
[0328] Figure 6K A user interface 652 is shown for creating a new wake screen user interface (also referred to herein as an interface panel) to be added to the set of wake screen user interfaces. In some embodiments, user interface 652 includes multiple options for creating a new interface panel based on a portrait (e.g., including a photo of a main subject or individual), based on a photo (optionally selected from a photo library stored on device 100), and / or based on one or more emoticons (optionally, up to a threshold number of emoticons can be included in the interface panel). In some embodiments, in response to user input 656 selecting to create a new interface panel based on a photo, device 100 displays a photo picker user interface 668 ( Figure 6N ) for the user to select a photo to be used as the background of the new interface panel, and enables the user to modify other characteristics of the new interface panel, including font characteristics, after selecting the photo.
[0329] In some embodiments, the user interface 652 includes one or more "thematic interface panels" corresponding to a wake screen user interface that has been automatically generated (e.g., by the device 100) without user input. For example, the thematic interface panel optionally includes a "smart album" that identifies multiple images (e.g., photos) to be included in the wake screen user interface, and optionally displays the multiple images in rotation when the "smart album" interface panel is selected as the wake screen user interface. In some embodiments, the device 100 enables the user to select individuals, pets, locations, and / or subsets of albums for inclusion in the "smart album" wake screen user interface. In some embodiments, the device 100 provides the user with (e.g., in an editing user interface) the option of setting the frequency of changing between corresponding photos in the "smart album" to be used as the current wake screen user interface. In some embodiments, in response to user input 6002 selecting the "smart album" interface panel, the device 100 displays a user interface 6004 ( Figure 6U ) for the user to select and / or deselect categories to be included in the smart album and optionally set the frequency with which changes are made between photos.
[0330] In some embodiments, the thematic interface panel includes an emoji user interface that includes pre-selected emojis and / or emoji patterns. In some embodiments, the thematic interface panel includes a weather user interface that creates a visual effect corresponding to the current weather forecast, a globe user interface that includes an image of a sphere, an astronomy user interface that includes one or more celestial bodies, and / or a pride user interface that includes a symbol representing pride. In some embodiments, each of the automatically generated user interfaces optionally includes a set of complex function blocks that are automatically selected and included in the corresponding wake screen user interface.
[0331] For example, in response to user input 654 selecting the emoticon user interface, device 100 displays an editing user interface 660 for editing the emoticon user interface having the set of attributes generated by device 100, such as Figure 6L For example, device 100 selects a complex function block, a date indication, and a font attribute for the time and date without user input. In some embodiments, the device provides a method for the user to modify one or more attributes in the set of attributes (e.g., to correspond to the font attribute). Figure 6G to Figure 6H5 In some embodiments, the device provides a method for (e.g., with respect to Figures 5X to 5AB and Figures 5AC to 5AHIn some embodiments, in response to user input 662 selecting the “Done” button, device 100 stops display of the editing user interface, displays the emoji user interface as the current wake-up screen user interface, and optionally adds the emoji user interface to the set of wake-up screen user interfaces.
[0332] In some embodiments, in response to user input 658 (selecting a weather user interface) Figure 6K ), the device 100 displays an editing user interface 664 for editing the weather user interface. In some embodiments, the weather user interface is initially displayed with the set of attributes generated by the device 100, and the device provides a method for (e.g., with respect to Figure 6G to Figure 6H5 , Figures 5X to 5AB and Figures 5AC to 5AH In response to user input 666 selecting the “Done” button, device 100 stops display of the editing user interface and displays the weather user interface as the current wake screen user interface, and optionally adds the weather user interface to the set of wake screen user interfaces.
[0333] Figure 6N A photo picker user interface 668 is shown for selecting a photo to be used as a background image for the wake screen user interface. In some embodiments, in response to user input 670 selecting a photo 672, device 100 displays a user interface 674 ( Figure 6O1 ) is displayed as the background of the wake-up screen user interface. In some embodiments, the device provides a Figure 6O1 The user input of selecting the “Customize” button via user input 676 allows the user to further edit or customize the user interface elements and selectable options of the wake screen user interface (e.g., Figure 6O2 678-a in the editing user interface.
[0334] In some embodiments, in response to Figure 6O1In response to user input 676 as shown, device 100 displays an editing user interface 678-a including at least one guide (e.g., guide 572 for editing one or more complex function blocks, and optionally guides for time and / or date indication) displayed behind or at least partially obscured by a portion of the background image (e.g., the main body of the background image (e.g., the airplane)). In some embodiments, in response to user input 682-a pointing to guide 569 for editing the time indication, guides including guide 572, guide 569, and guide 568 are displayed in front of the main body of the background image, such as Figure 6P shown.
[0335] Figure 6P An editing user interface 678 is shown for editing a wake-up screen user interface with a photo 672 as a background in response to user input 676. In some embodiments, the device edits the wake-up screen user interface in response to a user request to add one or more complex function blocks to the wake-up screen user interface, such as Figure 6P to Figure 6Q For example, in response to Figure 6P In response to a user input 682 selecting the plus button in the edit user interface 678, the device 100 displays a user interface element 680 for adding a complex function block, such as Figure 6Q shown.
[0336] Figure 6Q 684 is shown selecting a set of complication tiles 686 to be added to the wake screen user interface. In some embodiments, in response to the user input 684, the device 100 displays the set of complication tiles 686 ( Figure 6R ). In some embodiments, the device detects corresponding user input pointing to the group of recommended complex function blocks 686 displayed below the time indication, and moves the group of complex function blocks 686, for example, above and / or next to the date and / or time indication in response to the corresponding user input.
[0337] Figure 6Q Also shown is user input 685 selecting a guideline for a time indication, and in response to user input 685, device 100 displays a user interface element 687 for modifying one or more attributes (e.g., color and / or font style) of a time and / or date indication.
[0338] Figure 6R User input 688 is shown selecting a different style for the font of the time. In some embodiments, in response to user input 688, device 100 updates the time and / or date indication to be displayed using "Style 2". Figure 6RAlso shown is user input 690 of selecting a “Done” button, which causes the device 100 to exit the editing user interface 678 and display the user interface with the photo 672 as the background as the current user interface, and optionally add a new user interface with the photo 672 as the background to the group of wake-up screen user interfaces.
[0339] FIG. 6S to FIG. 6T An example of a portrait-style wake-up screen user interface is shown. In some embodiments, a portrait-style wake-up screen user interface 692 and a portrait-style wake-up screen user interface 694 are included in the group of wake-up screen user interfaces that the device 100 automatically cycles over time. For example, in some embodiments, the device 100 automatically changes the wake-up screen user interface from the first wake-up screen user interface to the second wake-up screen user interface from the group of wake-up screen user interfaces, optionally without detecting user input. In some embodiments, the device 100 automatically changes the wake-up screen user interface periodically (e.g., every 5 minutes, every day, every week). In some embodiments, the device 100 automatically changes the wake-up screen user interface based on determining that the device 100 has entered a locked state and / or a low-power state. For example, when the device 100 leaves a low-power state, the wake-up screen user interface is updated to the next wake-up screen user interface in the group of wake-up screen user interfaces. Figure 6T User input 696 requesting dismissal of wake screen user interface 694 is shown, and in response to user input 696 , device 100 displays a home screen user interface related to (or otherwise associated with) wake screen user interface 694 .
[0340] Figure 6U A user interface 6004 for selecting one or more categories of photos to be included in the smart album is shown, as well as an option for selecting the frequency of changing the background when the smart album is selected as the background of the wake screen user interface. In some embodiments, the smart album identifies a set of images or photos that are optionally stored on the device 100 or otherwise associated with the user of the device 100, and periodically rotates the images as the wake screen user interface. In some embodiments, visual attributes (e.g., complex function blocks and textual indications of time and / or date) also change as the image changes from one wake screen user interface to another wake screen user interface. In some embodiments, the frequency with which the images are refreshed or rotated is selected by the user.
[0341] In some embodiments, user interface 6004 provides options for selecting or deselecting one or more categories of photos, including a people category (e.g., corresponding to media items with people or, optionally, people's faces as prominent subjects), a pets category (e.g., corresponding to media items with one or more animals or specific types of animals (such as, cats and dogs) as prominent subjects), a nature category (e.g., corresponding to media items with one or more items found in nature as prominent subjects), and / or an urban category (e.g., corresponding to media items with one or more items found in urban environments as prominent subjects). In some embodiments, a photo is determined to belong to a corresponding category based on the content of the photo, which is optionally automatically identified by device 100 without the user manually tagging the photo with a category.
[0342] In some embodiments, user interface 6004 includes a representation of a wake-up screen user interface included in the smart album, including representation 6003-1. In some embodiments, the device displays selectable representations corresponding to different categories of background media items, and the device updates the selected / unselected state of the corresponding selectable representation according to user input directed to the corresponding representation. For example, in Figure 6U , user input 6006 selects a check mark to unselect the category "Nature". In some embodiments, based on determining that the category "Nature" is deselected, the smart album does not include photos that have been identified as having nature-related content (e.g., trees, flowers, sunsets, or other scenery). In some embodiments, the currently selected category is indicated by a check mark next to the category.
[0343] In some embodiments, in response to the user deselecting the “Nature” category, representation 6003-1 including the flower image is no longer included in the smart album, and device 100 optionally stops displaying representation 6003-1, such as Figure 6V 6008 in the user interface. In some embodiments, the device detects and / or processes media items (such as photos and videos) stored in the user's media library and / or online accounts to determine whether they should be included in the "natural" category. In some embodiments, in addition to the media items stored in the user's media library and / or online accounts, the device also detects and / or processes icons and / or stock images (e.g., stored on the device or online).
[0344] In some embodiments, such as Figure 6VAs shown, based on user input 6010 pointing to one or more currently unselected categories (such as the category "urban"), the device will include one or more categories in the set of user-selected categories. In some embodiments, in response to user input 6010, the device 100 displays a representation 6003-2 of a wake-up screen user interface included in the urban category (e.g., including an image of a house or building). In some embodiments, when the urban category is selected, images or photos of content related to cities (e.g., skyscrapers, buildings, skyline views, cityscapes, billboards, or other urban images) are included.
[0345] In some embodiments, the device responds to detecting user input 6012 (e.g., Figure 6V ) to stop displaying user interface 6008, the user input corresponding to a request to close or otherwise stop displaying category selections for the smart album. In some embodiments, in response to user input 6012, device 100 returns to Figure 6K The user interface shown in .
[0346] Figure 6W A user input 6016 is shown selecting a “Pick…” option that enables the user to select which people to include in the smart album. For example, in response to the user input 6016, the device 100 displays a user interface 6018 ( Figure 6X In some embodiments, the one or more persons displayed in the user interface 6018 are automatically selected based on a media library of the device 100 (e.g., a private or personal media library associated with a user of the device, which includes photos and / or videos taken by the user (e.g., using the device or another device different from the device)).
[0347] Figure 6X Multiple user inputs are shown for selecting one or more people to be included in the smart album. For example, user input 6020 (e.g., a tap input or other selection input) selects representation 6026-2 of a first person, user input 6022 selects representation 6026-3 of a second person, and user input 6024 selects representation 6026-1 of a third person. In some embodiments, based on determining that the corresponding person is selected, one or more photos including the corresponding person are included in the photo collection of the smart album. In some embodiments, options are provided for viewing and selecting other people not displayed in user interface 6018 (e.g., "More...").
[0348] In some embodiments, the representation shown in the user interface 6028 includes a representation of a wake-up screen user interface that includes a background corresponding to the selected person, such as Figure 6YFor example, representation 6003-3 includes a representation of a person associated with representation 6026-2.
[0349] Figure 6Y A user input 6030 detected on an option for selecting a frequency for changing photos in a smart album is shown. In some embodiments, a menu of user-selectable options is displayed to the user in response to the user input 6030. In some embodiments, the menu of user-selectable options includes one or more options for changing the frequency based on a time period (e.g., every 1 hour, every 5 hours, or every 1 day), and / or includes one or more options for changing the frequency based on a detected event of the device 100 (e.g., when unlocked, in a corresponding focus mode, or when charging is initiated).
[0350] Figure 6Y Also shown is a user input 6032 selecting an option for automatically selecting an image corresponding to the currently selected category. For example, in response to user input 6032, device 100 identifies one or more images associated with the selected corresponding category (e.g., people, pets, and / or urban) and displays the one or more images as background media items of the wake screen user interface. In some embodiments, the device provides the user with an option to manually select an image. For example, in response to user input selecting the manual selection option (e.g., in the example Figure 6Y 6028), the device 100 displays a photo gallery or photo picker (e.g., user interface 668, Figure 6N ), where the device responds to user input corresponding to a request to browse and select specific photos to be included in the smart album context.
[0351] In some embodiments, in response to user input 6032, device 100 stops display of user interface 6028. In some embodiments, device 100 optionally displays an editing user interface for the first wake-up screen user interface of the smart album, such as Figure 6Z In some embodiments, the device 100 responds to the FIG. 6F to FIG. 6G The one or more interactions to display the editing user interface 6034-1 ( Figure 6Z ). For example, the device provides access to the edit user interface 6034-1 using any of the methods described herein. In some embodiments, the edit user interface 6034-1 can be accessed from a settings user interface that provides options for editing the wake screen user interface and / or options for editing the home screen user interface.
[0352] Figure 6ZAn editing user interface 6034-1 for a first wake-up screen user interface is shown, which includes a first person, optionally including a person selected in a smart album. In some embodiments, the original photo (or "Natural" view) used as the background of the first wake-up screen user interface is displayed. In some embodiments, based on determining that the selected wake-up screen user interface for editing is within the smart album, an option to shuffle or view another photo in the smart album is provided (e.g., "Tap to Shuffle"). In some embodiments, the original photo (or "Natural" view) is processed by the device 100, and an initial hue is determined. For example, the initial hue represents the amount of brightness and / or brightness of the background (and / or foreground) of the original photo. In some embodiments, based on the calculated brightness level satisfying a threshold brightness amount, the original photo (or "Natural" view) is displayed. Figure 6Z In some embodiments, the editing user interface 6034-1 includes a photo picker 6033 for selecting a different background photo. For example, in response to user input 6042 ( Figure 6AA ), device 100 displays a photo gallery or photo picker user interface (e.g., as shown in reference Figure 6N In some embodiments, the editing user interface 6034-1 includes indicators 6035 of additional views of the wake screen user interface, such as the same foreground of the photo (e.g., subject or individual) and a different background and / or different filters applied to the photo (e.g., as described with reference to the swipe input 6040, Figure 6AA ).
[0353] In some embodiments, in response to user input 6036 selecting a menu option, menu 6037 is displayed. In some embodiments, menu 6037 provides multiple options for modifying the wake screen user interface displayed in editing user interface 6034-2, including an option to issue an error report (radar), an option to change to low and / or high key, an option to change the frequency (e.g., switching background photos in a smart album), and / or an option to disable the depth effect of photos. For example, user input 6038 selecting the option to change the frequency of the background enables the user to modify when the device 100 changes the wake screen user interface (e.g., based on time and / or based on device events).
[0354] In some embodiments, in response to detecting the swipe input 6040, the device 100 displays the editing user interface 6034-3 ( Figure 6AB), the editing user interface includes another view of the photo (e.g., a duotone view). In some embodiments, based on determining that the original photo is identified as a low-key brightness level, the duotone view is generated as a low-key version of the duotone. For example, device 100 automatically displays a set of views with brightness levels selected based on the brightness level of the original photo.
[0355] Figure 6AB User input 6046 is shown, and in response to user input 6046, menu 6037 is displayed. In some embodiments, device 100 detects user input 6044 selecting to switch to a high-key version of the currently displayed view. In some embodiments, in response to user input 6044, device 100 updates the display to display the duotone view (also referred to herein as a duotone filter) as the high-key version, such as Figure 6AC For example, a duotone view is represented by horizontal stripes, but a high-key version of the duotone view (in Figure 6AC ) has a lower profile than the two-tone view (shown in Figure 6AB Thus, the device 100 automatically generates a corresponding version of each view based on the identified hue of the original photo. For example, because Figure 6AA The original photo in is identified as a low-key photo (e.g., the brightness is less than a threshold brightness amount), so multiple low-key views (e.g., a low-key duotone view, a low-key studio view and / or a low-key black and white view) are provided for the photo.
[0356] Figure 6AC A user input 6048 (e.g., a swipe input) corresponding to a request to switch to another view is shown. In some embodiments, a low-key black and white view of the photo is displayed in the user interface 6034-5, such as Figure 6AD In some embodiments, after the user has manually switched from the low-key version of the view to the high-key version (e.g., as shown in reference Figures 6AB to 6AC ), the device 100 continues to recommend or automatically provide low-profile versions of other views. Figure 6AD In the example, device 100 provides a low-key version of the black and white view (e.g., because the original photo is a low-key photo). Thus, the user is enabled to manually change the specific view or filter to switch between low-key and / or high-key without changing the automatically generated and presented recommended views, which may be visually pleasing because they maintain the brightness (or other tones) presented in the original photo.
[0357] Figure 6AE6050-1. For example, the original photo satisfies a threshold brightness level that makes the photo relatively bright or high-key. In some embodiments, in response to user input 6052, device 100 displays another view of the photo. In some embodiments, the next view shown in user interface 6050-2 is a high-key version of the view, such as Figure 6AF A high-key version of the two-tone view shown.
[0358] In some embodiments, in response to user input 6054, device 100 replaces display of the user interface with another view (a high-key version of the studio view), such as Figure 6AG As shown in user interface 6050-3. Figure 6AG User input 6056 is shown selecting a menu icon, and in response to user input 6056, device 100 displays menu 6037. In some embodiments, user input 6058 selects an option within menu 6037 for switching the current view to a low-profile version. For example, in response to user input 6058, device 100 displays Figure 6AH User interface 6050-4 corresponding to a low-profile version of the studio view.
[0359] Figure 6AH A user input 6060 is shown requesting a switch to another view. In some embodiments, in response to the user input 6060, the device 100 displays a high-key version of the black and white view (e.g., because the original photo is determined to be a high-key photo), such as Figure 6AI As shown in user interface 6050-5.
[0360] Figure 6AI A user input 6062 corresponding to a request to switch to another view is shown. In some embodiments, in response to the user input 6062, the device 100 displays a colored view (also referred to herein as a color filter), such as Figure 6AJ. In some embodiments, the hue of the color selected for the colored view matches the hue identified in the original photo. For example, the overall hue (or brightness) of the original photo is calculated, and the color selected for the colored view has the same overall hue (or brightness) as the original photo. In some embodiments, in the colored view, the background of the photo is updated to include the selected color. In some embodiments, the selected color is applied to the entire photo (e.g., background and foreground), optionally including applying different levels of the selected color (e.g., with different transparency or brightness) to various parts of the photo. For example, the selected color is optionally applied to the entire photo, wherein the selected color is only faintly applied to the foreground including the subject of the photo (e.g., as a filter), and the background is replaced with a solid fill or a more opaque version of the selected color.
[0361] Figure 6AJ User input 6064 corresponding to a request to modify the background of the wake screen user interface is shown. In some embodiments, in response to user input 6064, device 100 displays a color picker 6066 for changing the color applied to the photo. In some embodiments, the initially selected color is selected to have a hue that matches the hue of the original photo. For example, Figure 6AK , the selected color has a high brightness level (e.g., for a high-key original photo), as indicated by the selector being located to the left on slider 6068, which indicates the brightness level defining the hue of the currently selected color. For example, if the original photo is a low-key original photo, the hue of the color will be automatically set to a low-key hue (e.g., located to the right of slider 6068).
[0362] In some embodiments, user input 6070 corresponds to a request to change the hue of the selected color. Figure 6AL As shown, in response to user input 6070, Figure 6AK The background of user interface 6050-8 is displayed in a darker (eg, more low-key) tone of the same color as the background of user interface 6050-7.
[0363] In some embodiments, each of the colors provided in color picker 6066 is displayed with the same hue (e.g., a hue that matches the hue of the original photo). For example, when the colors are different (e.g., purple, green, red, yellow, or another color), the brightness level and / or hue of each color is optionally automatically selected based on the hue of the original photo. In some embodiments, one or more colors displayed as options in the color picker are not selected to have the hue of the original photo.
[0364] Figure 6ALUser input 6069 is shown selecting another color displayed in color picker 6066. In some embodiments, in response to user input 6069, the background of the user interface is updated to display the selected color. In some embodiments, one or more of these views are used as a wake screen user interface in a smart album, such as Figure 6AM shown.
[0365] Figure 6AM The wake screen user interface 6072-1 is shown with a housing 6073 of the device 100 nearby. In some embodiments, the housing 6073 is a protective housing that is physically placed over at least a portion of the device 100. In some embodiments, when the housing 6073 is located on the device 100, the device 100 detects one or more attributes associated with the housing 6073. For example, the device 100 recognizes the color of the housing 6073.
[0366] Figure 6AN The housing 6073 is shown when placed on the device 100. In some embodiments, the device 100 determines that the housing 6073 is placed on the device 100, and in response to determining that the housing 6073 is located on the device 100, the device 100 optionally displays a prompt 6074 that asks the user whether the device 100 should update the background color (e.g., of the wake screen user interface 6072-2) to match the housing color (e.g., as detected by the device 100). In some embodiments, the prompt 6074 includes an option for selecting "yes" and an option for selecting "no".
[0367] In some embodiments, the device 100 detects user input 6076 selecting "yes" for prompt 6074, and in response to the user input 6076, the device 100 updates the user interface 6072-3 to be displayed in a color (e.g., a color filter) that matches (or complements) the color of the housing 6073. In some embodiments, the color is applied only to the background of the wake screen user interface 6072-3. In some embodiments, the color is applied to the foreground and background of the wake screen user interface 6072-3 (optionally, different portions are displayed with different transparency or brightness levels of the color).
[0368] Figure 6AP A user interface 652 is shown (eg, as shown in FIG. Figure 6KIn some embodiments, the user interface 652 for creating a new wake screen includes a recommendation interface panel 6078 based on the color of the housing detected as being located on the device 100. For example, based on determining that the housing is located on the device 100, the user interface 652 is updated to automatically include a thematic wake screen user interface that matches (or complements) the color of the housing. It should be understood that additional recommendations can be provided to the user based at least in part on the color of the housing detected as being located on the device 100.
[0369] Figure 6AQ to Figure 6AR An example of displaying a smart album as a wake-up screen user interface is shown. Figures 6AA to 6AJ One or more views of the wake-up screen user interface are displayed as the wake-up screen user interface. In some embodiments, the first view of the first photo is displayed as the wake-up screen user interface 6080, and according to the selected frequency of the smart album, the wake-up screen user interface is automatically updated to display a second wake-up screen user interface 6084 including a second view of the second photo without additional user input. In some embodiments, user input 6082 is optionally detected, and in response to user input 6082, the wake-up screen user interface is updated from the wake-up screen user interface 6080 to the wake-up screen user interface 6084.
[0370] Figure 7A to Figure 7V-3 Representations of multiple notifications in different configurations are shown, along with user input that can be used to switch between the different configurations.
[0371] Fig. 7A A representation of a first plurality of notifications in a first configuration 7000-a is shown. For ease of description, the representation of the first plurality of notifications will be referred to as "representation 7000" (e.g., regardless of the configuration in which the representation of the first plurality of notifications is displayed), and the letter following the number 7000 (e.g., 7000-a, 7000-b, or 7000-c) refers to the specific configuration used to display representation 7000 (e.g., 7000-a refers to a first configuration, 7000-b refers to a second configuration that is different from the first configuration 7000-a, and 7000-c refers to a third configuration that is different from both the first configuration 7000-a and the second configuration 7000-b). In various cases, representation 7000 may represent (e.g., include) different notifications (e.g., based on notification settings for an active mode for portable multifunction device 100).
[0372] The plurality of notifications represented by representation 7000 include at least notification 7002 associated with application A, notification 7004 associated with application Z, notification 7006 associated with application S, notification 7008 associated with application D, and notification 7010 associated with application M. When representation 7000 is displayed in a first configuration 7000-a (e.g., a “list” configuration), each notification in the plurality of notifications is displayed separately from other notifications in the plurality of notifications (e.g., displayed in a list format with no overlap between adjacent notifications).
[0373] In some embodiments, representation 7000 is aligned with the bottom of the display of portable multifunction device 100 (e.g., if notifications 7006, 7008, and 7010 are the only notifications to be displayed, they will still be displayed as shown). Fig. 7A , but without notifications 7002 and 7004). In some embodiments, notifications are displayed in reverse chronological order (e.g., as shown in FIG. Fig. 7A ), but in other embodiments, the order of notifications can be different (e.g., chronological order or a user-defined order). In some embodiments, the first configuration 7000-a is a default configuration for displaying notifications.
[0374] The user can interact with notifications in the first plurality of notifications through different gestures. For example, in response to tap input 7012 on notification 7002, portable multifunction device 100 opens application A corresponding to notification 7002. Alternatively, in response to tap input 7012, portable multifunction device 100 instead displays additional content associated with notification 7002 (e.g., by expanding the area occupied by notification 7002). In response to right swipe input 7014, portable multifunction device 100 displays one or more affordances for interacting with notification 7006, and in response to left swipe input 7016, portable multifunction device 100 displays one or more affordances for configuring display options for notification 7010 (e.g., for dismissing a notification, deferring a notification, and / or adjusting the prominence of a notification).
[0375] Figure 7BRepresentation 7000 is shown in a second configuration 7000-b when a "work" mode of portable multifunction device 100 is active. In some embodiments, portable multifunction device 100 displays a visual indication, such as "work" indicator 7022, when a corresponding mode (e.g., "work" mode) is active. The "work" mode of portable multifunction device 100 can control how notifications are displayed. For example, when "work" mode is active, some notifications for certain applications (e.g., social media application S associated with notification 7006) are suppressed, while work-related applications (e.g., instant messaging application A associated with notification 7002) are not suppressed. Additionally, in some embodiments, the "work" mode of portable multifunction device 100 controls in which configurations notifications are displayed (e.g., activating "work" mode activates second configuration 7000-c and / or changes portable multifunction device 100 from displaying notifications in first configuration 7000-b to displaying notifications in second configuration 7000-c).
[0376] When representation 7000 is displayed in second configuration 7000-b (e.g., a "stacked" configuration), some notifications (e.g., notification 7002) are partially overlaid on other notifications. For example, notification 7002 is partially overlaid on notification 7018, and notification 7018 is partially overlaid on notification 7020. In some embodiments, when in second configuration 7000-b, representation 7000 is aligned with the bottom of the display of portable multifunction device 100. In such embodiments, some portion of the display is maintained available for displaying user interface elements other than notifications, thereby increasing the visibility of a background image or wallpaper (e.g., such as Figure 7B Configuration 7000-b also compresses the display area used for notifications to allow for better visibility (e.g., visibility of context-sensitive or emergency notifications and / or system user interfaces, as described below with reference to Figure 7N as described), or positioning the user interface element closer to the user's hand (e.g., because the user's hand is often positioned closer to the bottom of the display of portable multifunction device 100).
[0377] Figure 7C Similar to Figure 7B , but shows representation 7000 in second configuration 7000-b when a “personal” mode of portable multifunction device 100 is active (as indicated by “personal” indicator 7026). “Personal” mode may have different notification settings than “work” mode (e.g., allowing notifications from personal contacts but not work contacts, whereas “work” mode allows notifications from work contacts but not personal contacts), and visually, representation 7000 includes a different set of notifications (e.g., different from Figure 7B). Notification 7002 is displayed when either “work” mode or “personal” mode is active, but notification 7004 that is suppressed when “work” mode is active is displayed when “personal” mode is active. Notification count 7024 displays additional information about notifications that are not displayed (e.g., information about the number of notifications represented by the first representation of the multiple notifications but not currently displayed, information about applications associated with the undisplayed notifications, and / or information about senders associated with the undisplayed notifications). In some embodiments, notification count 7024 does not include a count of suppressed notifications (e.g., due to settings for “personal” mode). In other embodiments, notification count 7024 includes a count of all notifications represented by representation 7000 (e.g., even notifications that are not visually displayed due to notification settings for “personal” mode). In some embodiments, notification count 7024 includes separate indications for the number of notifications allowed by notification settings for “personal” mode and the number of notifications suppressed according to notification settings for “personal” mode.
[0378] Fig.7D Representation 7000 is shown in a third configuration 7000-c. In the third configuration 7000-c (eg, a "string" configuration), the first representation of the plurality of notifications includes a count of the number of notifications in the plurality of notifications without displaying individual visual representations of notifications in the plurality of notifications.
[0379] Fig. 7E Side-by-side views of representation 7000 are shown in a first configuration 7000-a, a second configuration 7000-b, and a third configuration 7000-c. Each configuration is shown to represent a different set of notifications to highlight different contexts where a different configuration may be beneficial and / or desirable.
[0380] exist Fig. 7E , the plurality of notifications includes 5 notifications. When there are a small number of notifications to display, portable multifunction device 100 can display the entire representation 7000 in first configuration 7000-a, which allows content from all notifications to be displayed simultaneously. Even in the event that there are more notifications than can be simultaneously fitted on the display (e.g., 6 to 8 notifications), portable multifunction device 100 can still display notification content for at least some of the plurality of notifications. Thus, first configuration 7000-a allows a user to efficiently view notifications because no additional input is required to expand a notification for viewing, and typically, the number of notifications is low enough that no (or very little) scrolling is required to view additional notification content.
[0381] exist Fig. 7EAs the number of notifications increases, first configuration 7000-a may become less desirable because it may be difficult to display a large number of notifications on the display of portable multifunction device 100 (e.g., without changing the text size, without changing the overall size of the representation of each respective notification, and / or without scrolling). In such cases, second configuration 7000-b allows some notification content to remain displayed without cluttering the display with a large amount of detail (e.g., as would occur if representation 7000 were displayed in first configuration 7000-a).
[0382] exist Fig. 7E , the plurality of notifications includes 11 notifications. In some scenarios, the third configuration 7000-c may be useful (e.g., in combination with a "do not disturb" or other reduced notification mode) in order to avoid distractions (e.g., from incoming notifications that would be displayed in the first configuration 7000-a or the second configuration 7000-b), or simply because the number of notifications is so great that neither the first configuration 7000-a or the second configuration 7000-b is desirable because viewing a particular notification (e.g., the oldest notification at the end or bottom of the presentation 7000) would require a lot of scrolling.
[0383] Since different configurations are advantageous in different contexts, the user can use different user inputs to efficiently switch between configurations. These user inputs allow the user to select the appropriate configuration as the situation changes, and are referred to below. FIG. 7F to FIG. 7U Described in further detail.
[0384] exist Figure 7F In, the multiple notifications include 7 notifications (in Figure 7F In response to detecting the upward swipe gesture 7028, the portable multifunction device scrolls the displayed notifications. Figure 7G As shown, notification 7002 and notification 7004 have been scrolled off the display. Figure 7F Notification 7030 associated with application W and notification 7032 associated with application N that were not displayed in Figure 7G middle.
[0385] In response to detecting a pinch gesture 7034 or a swipe down gesture 7036 at a location corresponding to representation 7000 (e.g., on a notification in the plurality of notifications represented by representation 7000), portable multifunction device 100 transitions to display representation 7000 in a second configuration 7000-b, such as Figure 7H shown.
[0386] Figure 7H 7000-b, in response to an upward swipe gesture 7038, notifications in the plurality of notifications in the second configuration 7000-b may be scrolled. Fig.7I As shown, notification 7002 has been scrolled off the display, and notification 7004 is now displayed at the top of representation 7000 (e.g., at the top of a "stack" of notifications). Notification count 7024 is updated to reflect that four additional notifications may be displayed if the user continues to scroll, and at least one of the four additional notifications is associated with application D.
[0387] Figure 7J 7004. It is shown that the user can interact with the displayed notification, for example, by a tap gesture 7040 on notification 7004. Since notification 7004 is the top notification among the multiple notifications, as shown in FIG. Figure 7K As shown, therefore, in response to detecting tap gesture 7040, portable multifunction device 100 displays an affordance 7042 for opening application Z associated with notification 7004. In some embodiments, in response to detecting tap gesture 7040, portable multifunction device 100 instead launches application Z and displays a user interface for application Z.
[0388] Figure 7L Similar to Figure 7H , but shows notification 7006 instead of tap input 7044 on notification 7004. Since notification 7006 is not the topmost notification among the multiple notifications, as shown in FIG. Figure 7M As shown, therefore, in response to detecting tap gesture 7044, portable multifunction device 100 scrolls the notifications in the plurality of notifications so that notification 7006 is displayed as the topmost notification (e.g., portable multifunction device 100 scrolls notification 7004 off the display). After scrolling the notifications (e.g., and without further user input), portable multifunction device 100 displays affordance 7046 for opening application S associated with notification 7006. Alternatively, in some embodiments, portable multifunction device 100 does not respond to tap gesture 7044 (e.g., because notification 7006 is not the topmost notification). In such embodiments, only the topmost notification (e.g., notification 7004) is available for interaction.
[0389] In some embodiments, when representation 7000 is displayed in second configuration 7000-b, neither notification 7004 nor notification 7006 is available for interaction. In some embodiments, when representation 7000 is displayed in second configuration 7000-b, none of the notifications visible in representation 7000 is available for interaction. In such embodiments, a user changes the configuration for representation 7000 (e.g., via various user inputs, such as reference 7000). Figure 7G , Figure 7P , Figure 7R and Figure 7S ) to interact with the notifications represented in representation 7000.
[0390] Figure 7N The user-selected configuration is shown to be persistent. For example, as time progresses from 9:41 to 11:31, even if the display of portable multifunction device 100 enters a sleep state or a low-power state (e.g., after a threshold period of user inactivity, or in response to user input), the first representation of the plurality of notifications remains displayed in second configuration 7000-b (e.g., the next time the portable multifunction device is awakened).
[0391] Figure 7N Also shown is a conversation 7048 that has been received / generated. Conversation 7048 is a context-sensitive user interface and is displayed separately from the representation of the plurality of notifications in second configuration 7000-b (e.g., for clarity and / or ease of access). Examples of context-sensitive user interfaces include urgent (e.g., time-sensitive) notifications, boarding passes, music player controls (e.g., when music is playing on portable multifunction device 100), or user interfaces associated with ongoing events (e.g., a user interface displaying status information for an ongoing food delivery order, a user interface displaying the score of an ongoing sports game, or a user interface displaying fitness information when the user is exercising).
[0392] In some embodiments, session 7048 is visually distinct from other notifications (e.g., the notification represented by representation 7000). Figure 7N As shown, conversation 7048 has a bold border to draw attention to conversation 7048 and to distinguish conversation 7048 from other user interface elements that are not contextually relevant (e.g., non-urgent notifications, non-time-sensitive notifications, and / or old or older notifications).
[0393] like Figure 7NAs shown, the user has ordered food from application F, and session 7048 displays information related to the user's food delivery order. Session 7048 remains "contextually relevant" in that session 7048 can provide updates to the user throughout the food delivery process. Thus, before the user receives the food delivery, session 7048 is displayed on top of the displayed notification (e.g., above and separate from representation 7000 in second configuration 7000-b) and provides the user with relevant information about the user's food delivery.
[0394] Fig.7O Conversation 7048 is shown being updated with new information as time progresses to 11:45. Fig.7O Also shown is that a new notification 7050 has been received / generated associated with application C. Although notification 7050 is more recent (e.g., would normally be displayed above older notifications based on reverse chronological order), because conversation 7048 is contextually relevant, the conversation remains displayed on top of the displayed notifications.
[0395] In some embodiments, newly received notifications (e.g., notifications received after the user has changed the configuration for representation 7000) (such as notification 7050) are initially displayed separately from the first representation of the plurality of notifications in the second configuration 7000-b. This provides visual feedback as to which notifications are new (e.g., the user has not previously viewed and / or interacted with them). For example, in Fig.7O , notification 7050 is not displayed in a stack with notification 7002 and notification 7004 (e.g., is not at least partially overlaid on notification 7002 and notification 7004).
[0396] like Figure 7P As shown, after a threshold amount of time (e.g., 30 seconds, 1 minute, 5 minutes, or 15 minutes), not...
Claims
1. A method, include: At a computer system in communication with a display generating component: detecting one or more inputs of subscribing to updates for a first event from a first application and subscribing to updates for a second event from a second application; displaying a first user interface, wherein the first user interface includes a first area at a first location in the first user interface, and wherein displaying the first user interface includes: Based on determining that the first event is active and the second event is not active, displaying a first representation of the first event in the first area of the first user interface, and updating first information included in the first representation of the first event based on updates received from the first application for the first event; and Based on determining that the second event is active and the first event is not active, display a second representation of the second event in the first area of the first user interface, and update second information contained in the second representation of the second event based on an update for the second event received from the second application.
2. The method according to claim 1, in: The first user interface is a wake-up screen user interface; displaying the first representation of the first event in the first area when the first event is active; as well as The second representation of the second event is displayed in the first area of the wake screen user interface while the second event is active.
3. The method according to claim 2, include: When the first event is active: displaying, at a first time, in the first area of the wake screen user interface, the wake screen user interface having the first representation of the first event; as well as at a second time after the first time, stopping display of the wake-up screen user interface in response to detecting that a first condition is satisfied; as well as At a third time after the second time, in response to detecting that a second condition is satisfied, the wake-up screen user interface having the first representation of the first event is redisplayed in the first area of the wake-up screen user interface.
4. The method according to any one of claims 1 to 3, include: When the first event is active: at a fourth time, displaying the first user interface having the first representation of the first event in the first area of the first user interface, wherein the first user interface does not include a notification; and At a fifth time later than the fourth time, one or more notifications are displayed in the first user interface in response to a third condition being satisfied, and the first representation of the first event is maintained displayed in the first user interface.
5. The method according to any one of claims 1 to 3, include: When the first event is active: at a sixth time, displaying the first user interface having the first representation of the first event in the first area of the first user interface; as well as At a seventh time after the sixth time: In response to detecting that a fourth condition is satisfied, replacing display of the first user interface with display of a second user interface, the second user interface comprising a plurality of application icons that, when selected, cause display of corresponding applications; as well as Display of the first representation of the first event in the first area of the first user interface is replaced with display of a third representation of the first event in the second area of the second user interface.
6. The method according to any one of claims 1 to 3, wherein detecting the one or more inputs subscribing to updates from the first application for the first event include: While displaying a first notification corresponding to the first application, detecting a first set of inputs directed to the first notification, wherein the first set of inputs meets corresponding criteria for subscribing to updates for the first event from the first application.
7. The method of claim 6, wherein detecting a first set of inputs directed to the first notification comprises detecting a selection of a first affordance displayed with the first notification.
8. The method according to any one of claims 1 to 3, wherein detecting the one or more inputs subscribing to updates from the second application for the second event include: While displaying one or more search results corresponding to a search input, detecting a second set of inputs pointing to first search results corresponding to the second application, the one or more search results including the first search results, wherein the second set of inputs meets corresponding criteria for subscribing to updates for the second event from the second application.
9. The method according to any one of claims 1 to 3, include: detecting, while displaying a corresponding user interface for a third application, a selection of a corresponding enable representation for subscribing to updates for a third event from the third application, the corresponding user interface including the corresponding enable representation for subscribing to updates for the third event from the third application; as well as Based on determining that the third event is active, a third representation of the third event is displayed in the first area of the first user interface, and information contained in the third representation of the third event is updated based on updates received from the third application for the third event.
10. The method according to any one of claims 1 to 3, include: Based on determining that a user of the computer system has enabled an option for automatic subscription, automatically subscribing to updates for a fourth event from the fourth application in response to detecting that a fifth condition has been met.
11. The method of any one of claims 1 to 3, automatically subscribing to updates for a fifth event from a fifth application based on determining that past user behavior meets one or more subscription criteria.
12. The method according to any one of claims 1 to 3, in: the first application is a ride-sharing application, and the first event is an instance of a respective ride requested in the ride-sharing application; as well as The first information contained in the first representation of the first event, updated according to updates received from the first application for the first event, includes location information of the instance of the corresponding ride requested in the ridesharing application.
13. The method according to any one of claims 1 to 3, in: the first application is a delivery application, and the first event is an instance of a corresponding delivery requested in the delivery application; as well as The first information contained in the first representation of the first event, updated according to updates received from the first application for the first event, includes delivery information for the corresponding delivery requested in the delivery application.
14. The method according to any one of claims 1 to 3, in: the second application is a sports application, and the second event is an instance of a game reported by the sports application; as well as The second information contained in the second representation of the second event, updated according to updates received from the second application for the second event, includes score information for the instance of the game.
15. The method according to any one of claims 1 to 3, in: the second application is a fitness application, and the second event is an instance of a fitness exercise recorded by the fitness application; as well as The second information contained in the second representation of the second event, updated according to updates received from the second application for the second event, includes activity information for the instance of the fitness.
16. The method according to any one of claims 1 to 3, include: When the first user interface is displayed: Based on determining that the first representation of the first event is currently displayed in the first area of the first user interface: Based on determining that the first event is still active, maintaining display of the first representation of the first event in the first area of the first user interface; as well as Based on determining that the first event is no longer active, ceasing to display the first representation of the first event in the first area of the first user interface.
17. The method according to any one of claims 1 to 3, include: When the first user interface is displayed: Based on determining that the first event is in an inactive state and determining that the first representation of the first event was last displayed or is currently displayed in the first area of the first user interface: Based on determining that a sixth condition is not satisfied, displaying the first representation of the first event in the first area of the first user interface, the first representation of the first event including the first information that has been updated based on a first final update for the first event received from the first application; as well as Based on determining that the sixth condition is satisfied, displaying the first representation of the first event in the first area of the first user interface is abandoned.
18. The method according to any one of claims 1 to 3, include: When the first user interface is displayed: Based on determining that both the first event and the second event are active, the first representation of the first event and the second representation of the second event are simultaneously displayed in the first user interface.
19. The method according to any one of claims 1 to 3, wherein the first application and the second application are the same application.
20. The method of any one of claims 1 to 3, wherein the first application is different from the second application.
21. The method according to any one of claims 1 to 3, include: When the first user interface is displayed: Based on determining that the number of currently active subscription events is less than a first threshold number of events, displaying corresponding representations of the subscription events in the first user interface in a first manner, wherein the corresponding representations of the subscription events displayed in the first manner are displayed simultaneously without being obscured; as well as Based on determining that the number of subscription events that are currently active is equal to or greater than a first threshold number of events, the corresponding representations of the subscription events are displayed in a second manner, wherein one or more of the corresponding representations of the subscription events displayed in the second manner are obscured in the first user interface.
22. The method according to claim 21, include: When the corresponding representation of the subscription event is displayed in the second manner, detecting a corresponding user input directed to an area of the first user interface corresponding to the corresponding representation of the subscription event; and In response to detecting the corresponding user input and based on determining that the corresponding user input corresponds to a request to expand the display of the corresponding representation of the subscription event, an expanded view of the corresponding representation of the subscription event is displayed, in which content corresponding to the subscription event that was not previously displayed is displayed.
23. The method according to any one of claims 1 to 3, include: detecting, in the first user interface, a first user input directed to the first representation of the first event; as well as In response to detecting the first user input: Based on determining that the first user input is directed to the first portion of the first representation of the first event, displaying a corresponding user interface for the first application; and Based on determining that the first user input points to a second portion of the first representation of the first event, an expanded representation of the first event is displayed, the second portion being different from the first portion of the first representation of the first event, the expanded representation including more frequent updates and / or information than the first representation of the first event.
24. The method according to any one of claims 1 to 3, include: detecting, in the first user interface, a sequence of one or more inputs directed to the first representation of the first event; as well as In response to detecting the sequence of the one or more inputs, ceasing to display the first representation of the first event in the first area of the first user interface while maintaining display of the first user interface.
25. The method according to claim 24, in: Detecting the sequence of one or more inputs includes detecting, in the first user interface, a second user input directed to the first representation of the first event; In response to detecting the second user input: Based on determining that the second user input corresponds to a request to hide the first representation of the first event, displaying an affordance for hiding the first representation of the first event; as well as detecting a third user input selecting the affordance to hide the first representation of the first event; as well as In response to detecting the third user input selecting the affordance for hiding the first representation of the first event, ceasing to display the first representation of the first event in the first area of the first user interface while maintaining display of the first user interface.
26. The method according to any one of claims 1 to 3, include: A media control object including an indication of a currently playing media item and one or more media playback controls are simultaneously displayed in the first user interface while displaying the first representation of the first event or the second representation of the second event in the first user interface.
27. The method of claim 26, wherein the first representation of the first event is displayed in the first user interface between the media control object and the one or more notifications when the media control object and the one or more notifications are to be displayed simultaneously with the first representation of the first event.
28. The method according to claim 26, include: detecting a fourth user input directed to a predetermined portion of the media control object; as well as In response to detecting the fourth user input directed to the predefined portion of the media control object, changing a background of the first user interface from a first background to a second background, wherein the second background is selected based on content in the predefined portion of the media control object.
29. The method of claim 28, wherein changing the background of the first user interface from the first background to the second background comprises gradually stopping displaying the first background.
30. The method of claim 28, wherein the second background is selected based on album art for the currently playing media item.
31. The method of claim 28, wherein the second background is selected based on one or more colors in the content in the predefined portion of the media control object.
32. The method of claim 26, wherein the media control object includes the one or more media playback controls for controlling playback of the currently playing media item and content representing the currently playing media item.
33. A computer system in communication with a display generation component, include: one or more processors; as well as A memory storing one or more programs, wherein the one or more programs are configured to be executed by the one or more processors, the one or more programs comprising instructions for performing the following operations: detecting one or more inputs for subscribing to updates from a first application for a first event and for subscribing to updates from a second application for a second event; Displaying a first user interface, wherein the first user interface includes a first area at a first location in the first user interface, and wherein displaying the first user interface includes: Based on determining that the first event is active and the second event is not active, displaying a first representation of the first event in the first area of the first user interface, and updating first information included in the first representation of the first event based on updates received from the first application for the first event; as well as Based on determining that the second event is active and the first event is not active, display a second representation of the second event in the first area of the first user interface, and update second information contained in the second representation of the second event based on an update for the second event received from the second application.
34. The computer system of claim 33, wherein the one or more programs are configured to be executed by the one or more processors, the one or more programs comprising instructions for performing any of the methods of claims 2 to 32.
35. A computer-readable storage medium storing one or more programs, the one or more programs comprising instructions that, when executed by a computer system in communication with a display generation component, cause the computer system to: detecting one or more inputs for subscribing to updates from a first application for a first event and for subscribing to updates from a second application for a second event; Displaying a first user interface, wherein the first user interface includes a first area at a first location in the first user interface, and wherein displaying the first user interface includes: Based on determining that the first event is active and the second event is not active, displaying a first representation of the first event in the first area of the first user interface, and updating first information included in the first representation of the first event based on updates received from the first application for the first event; as well as Based on determining that the second event is active and the first event is not active, display a second representation of the second event in the first area of the first user interface, and update second information contained in the second representation of the second event based on an update for the second event received from the second application.
36. A computer system according to claim 35, wherein the one or more programs include instructions which, when executed by a computer system in communication with a display generation component, cause the computer system to perform any of the methods of claims 2 to 32.