Device, method, and graphical user interface for managing electronic communications

An electronic device: displays a conversation view of a plurality of messages within a first pane of a messaging application, where the conversation view includes a first message region of a portion of a first message and a second message region of a portion of a second message; and detects a user input selecting the first message region within the conversation view. In response to detecting the user input selecting the first message region, and in accordance with a determination that the user input satisfies first input criteria, the device displays one or more affordances provided to perform corresponding actions on the first message. In response to detecting the user input selecting the first message region, and in accordance with a determination that the user input satisfies second input criteria, the device replaces display of the conversation view with a message view that corresponds to the first message.

TECHNICAL FIELD

This relates generally to electronic devices with touch-sensitive surfaces, including but not limited to electronic devices with touch-sensitive surfaces that manage electronic communications.

BACKGROUND

The use of touch-sensitive surfaces as input devices for computers and other electronic computing devices has increased significantly in recent years. Example touch-sensitive surfaces include touchpads and touch-screen displays. Such surfaces are widely used to manipulate user interface objects on a display.

Example manipulations include adjusting the position and/or size of one or more user interface objects or activating buttons or opening files/applications represented by user interface objects, as well as associating metadata with one or more user interface objects or otherwise manipulating user interfaces. Example user interface objects include digital images, video, text, icons, control elements such as buttons and other graphics. A user will, in some circumstances, need to perform such manipulations on user interface objects in a file management program (e.g., Finder from Apple Inc. of Cupertino, Calif.), an image management application (e.g., Aperture, iPhoto, Photos from Apple Inc. of Cupertino, Calif.), a digital content (e.g., videos and music) management application (e.g., iTunes from Apple Inc. of Cupertino, Calif.), a drawing application, a presentation application (e.g., Keynote from Apple Inc. of Cupertino, Calif.), a word processing application (e.g., Pages from Apple Inc. of Cupertino, Calif.), a website creation application (e.g., iWeb from Apple Inc. of Cupertino, Calif.), a disk authoring application (e.g., iDVD from Apple Inc. of Cupertino, Calif.), or a spreadsheet application (e.g., Numbers from Apple Inc. of Cupertino, Calif.).

But 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 creates a significant cognitive burden on a user. In addition, these methods take longer than necessary, thereby wasting energy. This latter consideration is particularly important in battery-operated devices.

SUMMARY

Accordingly, there is a need for electronic devices with faster, more efficient methods and interfaces for managing electronic communications. Such methods and interfaces optionally complement or replace conventional methods for managing electronic communications. Such methods and interfaces reduce the cognitive burden on a user and produce a more efficient human-machine interface. For battery-operated devices, such methods and interfaces conserve power and increase the time between battery charges.

In accordance with some embodiments, a method is performed at a device with one or more processors, non-transitory memory, a display, and an input device. The method includes displaying, on the display, an inbox view of a messaging application that includes a plurality of rows representing electronic communications, the plurality of rows including a first row representing a first plurality of messages that satisfy one or more conversation criteria that indicate that each of the first plurality of messages are a part of a same respective conversation, and a second row representing a second plurality of messages that satisfy a first category criterion but are not part of a same conversation. The method also includes detecting an input, via the input device, corresponding to selection of a respective row from among the plurality of rows in the inbox view. In response to detecting the input, and in accordance with a determination that the respective row corresponds to the first row, the method further includes displaying, on the display, additional information corresponding to two or more messages from the conversation of related messages that are represented by the first row. In response to detecting the input, and in accordance with a determination that the respective row corresponds to the second row, the method further includes displaying, on the display, additional information corresponding to two or more messages from among the plurality of messages that are represented by the second row, including a first message and a second message that both satisfy the first category criterion but not part of a same conversation.

In accordance with some embodiments, a method is performed at a device with one or more processors, non-transitory memory, a display, and an input device. The method includes concurrently displaying, on the display, a plurality of representations of electronic communications associated with a first grouping and a filter affordance, where the filter affordance corresponds to a set of one or more filter criteria. While concurrently displaying the plurality of representations of electronic communications and the filter affordance, the method also includes detecting a selection input, via the input device, that corresponds to selection of the filter affordance. In response to detecting the selection input, and in accordance with a determination that the selection input corresponds to a first input type, the method further includes: ceasing to display a first set of representations of electronic communications from among the plurality of representations of electronic communications associated with the first grouping that do not match the set of one or more filter criteria; displaying a second set of representations of electronic communications from among the plurality of representations of electronic communications associated with the first grouping that match the set of one or more filter criteria; and displaying an indication of the set of one or more filter criteria that have been applied to the electronic communications associated with the first grouping.

In accordance with some embodiments, a method is performed at a device with one or more processors, non-transitory memory, a display, and an input device. The method includes: displaying, on the display, a conversation view of a plurality of messages within a first pane of a messaging application, where the conversation view includes a first message region of a portion of a first message of the plurality of messages and a second message region of a portion of a second message of the plurality of messages; and detecting a user input, via the input device, that corresponds to selecting the first message region within the conversation view. In response to detecting the user input selecting the first message region, and in accordance with a determination that the user input satisfies a first set of input criteria, the method also includes displaying, on the display, one or more affordances provided to perform corresponding actions on the first message. In response to detecting the user input selecting the first message region, and in accordance with a determination that the user input satisfies a second set of input criteria, the method further includes replacing display of the conversation view with a message view that corresponds to the first message.

In accordance with some embodiments, an electronic device includes a display unit configured to display a user interface, one or more input units configured to received user inputs, and a processing unit coupled with the display unit and the one or more input units. The processing unit is configured enable display of, on the display unit, an inbox view of a messaging application that includes a plurality of rows representing electronic communications, the plurality of rows including a first row representing a first plurality of messages that satisfy one or more conversation criteria that indicate that each of the first plurality of messages are a part of a same respective conversation, and a second row representing a second plurality of messages that satisfy a first category criterion but are not part of a same conversation. The processing unit is also configured to detect an input, via the one or more input units, corresponding to selection of a respective row from among the plurality of rows in the inbox view. In response to detecting the input, the processing unit1008is further configured to enable display of, on the display unit, additional information corresponding to two or more messages from the conversation of related messages that are represented by the first row in accordance with a determination that the respective row corresponds to the first row. In response to detecting the input, the processing unit is further configured to enable display of, on the display unit, additional information corresponding to two or more messages from among the plurality of messages that are represented by the second row, including a first message and a second message that both satisfy the first category criterion but not part of a same conversation in accordance with a determination that the respective row corresponds to the second row.

In accordance with some embodiments, an electronic device includes a display unit configured to display a user interface, one or more input units configured to received user inputs, and a processing unit coupled with the display unit and the one or more input units. The processing unit is configured to enable concurrent display of, on the display unit, a plurality of representations of electronic communications, and a filter affordance, where the filter affordance corresponds to a set of one or more filter criteria. The processing unit is also configured to detect a selection input, via the one or more input units, that corresponds to selection of the filter affordance while concurrently displaying the plurality of representations of electronic communications and the filter affordance. In response to detecting the selection input, and in accordance with a determination that the selection input corresponds to a first input type, the processing unit is further configured to: cease display of, on the display unit, a first set of representations of electronic communications from among the plurality of representations of electronic communications associated with the first grouping that do not match the set of one or more filter criteria; enable display, on the display unit, a second set of representations of electronic communications from among the plurality of representations of electronic communications associated with the first grouping that match the set of one or more filter criteria; and display of, on the display unit, an indication of the set of one or more filter criteria that have been applied to the electronic communications associated with the first grouping.

In accordance with some embodiments, an electronic device includes a display unit configured to display a user interface, one or more input units configured to received user inputs, and a processing unit coupled with the display unit and the one or more input units. The processing unit is configured to: enable display of, on the display unit, a conversation view of a plurality of messages within a first pane of a messaging application, where the conversation view includes a first message region of a portion of a first message of the plurality of messages and a second message region of a portion of a second message of the plurality of messages; and detect a user input, via the one or more input units, that corresponds to selecting the first message region within the conversation view. In response to detecting the user input selecting the first message region, and in accordance with a determination that the user input satisfies a first set of input criteria, the processing unit is further configured to enable display of, on the display unit, displaying one or more affordances provided to perform corresponding actions on the first message. In response to detecting the user input selecting the first message region, and in accordance with a determination that the user input satisfies a second set of input criteria, the processing unit is further configured to replace display of the conversation view with a message view that corresponds to the first message.

In accordance with some embodiments, an electronic device includes a display, an input device, one or more processors, non-transitory memory, and one or more programs; the one or more programs are stored in the non-transitory memory and configured to be executed by the one or more processors and the one or more programs include instructions for performing or causing performance of the operations of any of the methods described herein. In accordance with some embodiments, a non-transitory computer readable storage medium has stored therein instructions which when executed by one or more processors of an electronic device with a display and an input device, cause the device to perform or cause performance of the operations of any of the methods described herein. In accordance with some embodiments, a graphical user interface on an electronic device with a display, an input device, a memory, and one or more processors to execute one or more programs stored in the non-transitory memory includes one or more of the elements displayed in any of the methods described above, which are updated in response to inputs, as described in any of the methods described herein. In accordance with some embodiments, an electronic device includes: a display, an input device; and means for performing or causing performance of the operations of any of the methods described herein. In accordance with some embodiments, an information processing apparatus, for use in an electronic device with a display and an input device, includes means for performing or causing performance of the operations of any of the methods described herein.

Thus, electronic devices with displays, touch-sensitive surfaces and optionally one or more sensors to detect intensity of contacts with the touch-sensitive surface are provided with faster, more efficient methods and interfaces for managing electronic communications, thereby increasing the effectiveness, efficiency, and user satisfaction with such devices. Such methods and interfaces may complement or replace conventional methods for managing electronic communications.

DESCRIPTION OF EMBODIMENTS

The use of electronic devices with touch-based user interfaces (e.g., devices such as the iPhone®, iPod Touch®, iPad®, MacBook®, and iMac® devices from Apple Inc. of Cupertino, Calif.) has increased significantly in recent years. These devices use touch-sensitive surfaces, such as a touch screen display or a touch pad, as the main input for manipulating user interface objects on a display and/or controlling the device. These devices may also have contact intensity sensor for determining a force or pressure of contacts with the touch-sensitive surfaces.

Described below are devices and methods that enable messages that are not part of a conversation to be grouped into a bundle that is represented as a row in an inbox view. Also, described below are devices and methods that provide an affordance to quickly toggle a filter for messages in an inbox view. Further, described below are devices and methods that enable a user to access a set of affordances for performing actions on a message within a conversation view.

Below,FIGS. 1A-1B, 2-3, and 4A-4Bprovide a description of example devices.FIGS. 5A-5R, 6A-6F, and 7A-7Pillustrate example user interfaces for managing electronic communications.FIGS. 8A-8Cillustrate a flow diagram of a method of bundling electronic communications.FIGS. 9A-9Cillustrate a flow diagram of a method of filtering electronic communications.FIGS. 10A-10Cillustrate a flow diagram of a method of displaying affordances for performing corresponding actions within a conversation view. The user interfaces inFIGS. 5A-5R and 6A-6Fare used to illustrate the processes inFIGS. 8A-8C, 9A-9C, and 10A-10C.

Example Devices

Embodiments of electronic devices, user interfaces for such devices, and associated processes for using such devices are described. In some embodiments, the device is a portable communications device, such as a mobile telephone, that also contains other functions, such as PDA and/or music player functions. Example embodiments of portable multifunction devices include, without limitation, the iPhone®, iPod Touch®, and iPad® devices from Apple Inc. of Cupertino, Calif. Other portable electronic devices, such as laptops or tablet computers with touch-sensitive surfaces (e.g., touch-screen displays and/or touchpads), are, optionally, used. It should also be understood that, in some embodiments, the device is not a portable communications device, but is a desktop computer with a touch-sensitive surface (e.g., a touch-screen display and/or a touchpad).

Memory102optionally includes high-speed random access memory and optionally also includes non-volatile memory, such as one or more magnetic disk storage devices, flash memory devices, or other non-volatile solid-state memory devices. Access to memory102by other components of device100, such as CPU(s)120and the peripherals interface118, is, optionally, controlled by memory controller122.

In some embodiments, peripherals interface118, CPU(s)120, and memory controller122are, optionally, implemented on a single chip, such as chip104. In some other embodiments, they are, optionally, implemented on separate chips.

I/O subsystem106couples input/output peripherals on device100, such as touch-sensitive display system112and other input or control devices116, with peripherals interface118. I/O subsystem106optionally includes display controller156, optical sensor controller158, intensity sensor controller159, haptic feedback controller161, and one or more input controllers160for other input or control devices. The one or more input controllers160receive/send electrical signals from/to other input or control devices116. The other input or control devices116optionally include physical buttons (e.g., push buttons, rocker buttons, etc.), dials, slider switches, joysticks, click wheels, and so forth. In some alternate embodiments, input controller(s)160are, optionally, coupled with any (or none) of the following: a keyboard, infrared port, USB port, stylus, and/or a pointer device such as a mouse. The one or more buttons (e.g.,208,FIG. 2) optionally include an up/down button for volume control of speaker111and/or microphone113. The one or more buttons optionally include a push button (e.g.,206,FIG. 2).

Touch-sensitive display system112provides an input interface and an output interface between the device and a user. Display controller156receives and/or sends electrical signals from/to touch-sensitive display system112. Touch-sensitive display system112displays visual output to the user. The visual output optionally includes graphics, text, icons, video, and any combination thereof (collectively termed “graphics”). In some embodiments, some or all of the visual output corresponds to user-interface objects.

Touch-sensitive display system112has a touch-sensitive surface, sensor or set of sensors that accepts input from the user based on haptic/tactile contact. Touch-sensitive display system112and display controller156(along with any associated modules and/or sets of instructions in memory102) detect contact (and any movement or breaking of the contact) on touch-sensitive display system112and converts the detected contact into interaction with user-interface objects (e.g., one or more soft keys, icons, web pages or images) that are displayed on touch-sensitive display system112. In an example embodiment, a point of contact between touch-sensitive display system112and the user corresponds to a finger of the user or a stylus.

Touch-sensitive display system112optionally has a video resolution in excess of 100 dpi. In some embodiments, the touch screen video resolution is in excess of 400 dpi (e.g., 500 dpi, 800 dpi, or greater). The user optionally makes contact with touch-sensitive display system112using any suitable object or appendage, such as a stylus, a finger, and so forth. In some embodiments, the user interface is designed to work with finger-based contacts and gestures, which can be less precise than stylus-based input due to the larger area of contact of a finger on the touch screen. In some embodiments, the device translates the rough finger-based input into a precise pointer/cursor position or command for performing the actions desired by the user.

Device100optionally also includes one or more optical sensors164.FIG. 1Ashows an optical sensor coupled with optical sensor controller158in I/O subsystem106. Optical sensor(s)164optionally include charge-coupled device (CCD) or complementary metal-oxide semiconductor (CMOS) phototransistors. Optical sensor(s)164receive light from the environment, projected through one or more lens, and converts the light to data representing an image. In conjunction with imaging module143(also called a camera module), optical sensor(s)164optionally capture still images and/or video. In some embodiments, an optical sensor is located on the back of device100, opposite touch-sensitive display system112on the front of the device, so that the touch screen is enabled for use as a viewfinder for still and/or video image acquisition. In some embodiments, another optical sensor is located on the front of the device so that the user's image is obtained (e.g., for selfies, for videoconferencing while the user views the other video conference participants on the touch screen, etc.).

Device100optionally also includes one or more contact intensity sensors165.FIG. 1Ashows a contact intensity sensor coupled with intensity sensor controller159in I/O subsystem106. Contact intensity sensor(s)165optionally include one or more piezoresistive strain gauges, capacitive force sensors, electric force sensors, piezoelectric force sensors, optical force sensors, capacitive touch-sensitive surfaces, or other intensity sensors (e.g., sensors used to measure the force (or pressure) of a contact on a touch-sensitive surface). Contact intensity sensor(s)165receive contact intensity information (e.g., pressure information or a proxy for pressure information) from the environment. In some embodiments, at least one contact intensity sensor is collocated with, or proximate to, a touch-sensitive surface (e.g., touch-sensitive display system112). In some embodiments, at least one contact intensity sensor is located on the back of device100, opposite touch-screen display system112which is located on the front of device100.

Device100optionally also includes one or more proximity sensors166.FIG. 1Ashows proximity sensor166coupled with peripherals interface118. Alternately, proximity sensor166is coupled with input controller160in I/O subsystem106. In some embodiments, the proximity sensor turns off and disables touch-sensitive display system112when the multifunction device is placed near the user's ear (e.g., when the user is making a phone call).

Device100optionally also includes one or more accelerometers167, gyroscopes168, and/or magnetometers169(e.g., as part of an inertial measurement unit (IMU)) for obtaining information concerning the position (e.g., attitude) of the device.FIG. 1Ashows sensors167,168, and169coupled with peripherals interface118. Alternately, sensors167,168, and169are, optionally, coupled with an input controller160in I/O subsystem106. In some embodiments, information is displayed on the touch-screen display in a portrait view or a landscape view based on an analysis of data received from the one or more accelerometers. Device100optionally includes a GPS (or GLONASS or other global navigation system) receiver (not shown) for obtaining information concerning the location of device100.

In some embodiments, the software components stored in memory102include operating system126, communication module (or set of instructions)128, contact/motion module (or set of instructions)130, graphics module (or set of instructions)132, haptic feedback module (or set of instructions)133, text input module (or set of instructions)134, Global Positioning System (GPS) module (or set of instructions)135, and applications (or sets of instructions)136. Furthermore, in some embodiments, memory102stores device/global internal state157, as shown inFIGS. 1A and 3. Device/global internal state157includes one or more of: active application state, indicating which applications, if any, are currently active; display state, indicating what applications, views or other information occupy various regions of touch-sensitive display system112; sensor state, including information obtained from the device's various sensors and other input or control devices116; and location and/or positional information concerning the device's location and/or attitude.

Communication module128facilitates communication with other devices over one or more external ports124and also includes various software components for handling data received by RF circuitry108and/or external port124. External port124(e.g., Universal Serial Bus (USB), FIREWIRE, etc.) is adapted for coupling directly to other devices or indirectly over a network (e.g., the Internet, wireless LAN, etc.). 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 some iPhone®, iPod Touch®, and iPad® devices from Apple Inc. of Cupertino, Calif. In some embodiments, the external port is a Lightning connector that is the same as, or similar to and/or compatible with the Lightning connector used in some iPhone®, iPod Touch®, and iPad® devices from Apple Inc. of Cupertino, Calif.

Contact/motion module130optionally detects contact with touch-sensitive display system112(in conjunction with display controller156) and other touch-sensitive devices (e.g., a touchpad or physical click wheel). Contact/motion module130includes software components for performing various operations related to detection of contact (e.g., by a finger or by a stylus), such as determining if contact has occurred (e.g., detecting a finger-down event), determining an intensity of the contact (e.g., the force or pressure of the contact or a substitute for the force or pressure of the contact), determining if there is movement of the contact and tracking the movement across the touch-sensitive surface (e.g., detecting one or more finger-dragging events), and determining if the contact has ceased (e.g., detecting a finger-up event or a break in contact). Contact/motion module130receives contact data from the touch-sensitive surface. Determining movement of the point of contact, which is represented by a series of contact data, optionally includes determining speed (magnitude), velocity (magnitude and direction), and/or an acceleration (a change in magnitude and/or direction) of the point of contact. These operations are, optionally, applied to single contacts (e.g., one finger contacts or stylus contacts) or to multiple simultaneous contacts (e.g., “multitouch”/multiple finger contacts and/or stylus contacts). In some embodiments, contact/motion module130and display controller156detect contact on a touchpad.

Haptic feedback module133includes various software components for generating instructions used by tactile output generator(s)163to produce tactile outputs at one or more locations on device100in response to user interactions with device100.

In conjunction with touch-sensitive display system112, display controller156, contact module130, graphics module132, and text input module134, contacts module137includes executable instructions to manage an address book or contact list (e.g., stored in application internal state192of contacts module137in memory102or memory370), including: adding name(s) to the address book; deleting name(s) from the address book; associating telephone number(s), e-mail address(es), physical address(es) or other information with a name; associating an image with a name; categorizing and sorting names; providing telephone numbers and/or e-mail addresses to initiate and/or facilitate communications by telephone138, video conference139, e-mail140, or IM141; and so forth.

In conjunction with RF circuitry108, audio circuitry110, speaker111, microphone113, touch-sensitive display system112, display controller156, contact module130, graphics module132, and text input module134, telephone module138includes executable instructions to enter a sequence of characters corresponding to a telephone number, access one or more telephone numbers in address book137, modify a telephone number that has been entered, dial a respective telephone number, conduct a conversation and disconnect or hang up when the conversation is completed. As noted above, the wireless communication optionally uses any of a plurality of communications standards, protocols and technologies.

In conjunction with RF circuitry108, audio circuitry110, speaker111, microphone113, touch-sensitive display system112, display controller156, optical sensor(s)164, optical sensor controller158, contact module130, graphics module132, text input module134, contact list137, and telephone module138, videoconferencing module139includes executable instructions to initiate, conduct, and terminate a video conference between a user and one or more other participants in accordance with user instructions.

In conjunction with RF circuitry108, touch-sensitive display system112, display controller156, contact module130, graphics module132, and text input module134, the instant messaging module141includes executable instructions to enter a sequence of characters corresponding to an instant message, to modify previously entered characters, to transmit a respective instant message (for example, using a Short Message Service (SMS) or Multimedia Message Service (MMS) protocol for telephony-based instant messages or using XMPP, SIMPLE, Apple Push Notification Service (APNs) or IMPS for Internet-based instant messages), to receive instant messages and to view received instant messages. In some embodiments, transmitted and/or received instant messages optionally include graphics, photos, audio files, video files and/or other attachments as are supported in a MMS and/or an Enhanced Messaging Service (EMS). As used herein, “instant messaging” refers to both telephony-based messages (e.g., messages sent using SMS or MMS) and Internet-based messages (e.g., messages sent using XMPP, SIMPLE, APNs, or IMPS).

In conjunction with RF circuitry108, touch-sensitive display system112, display controller156, contact module130, graphics module132, text input module134, GPS module135, map module154, and music player module146, workout support module142includes executable instructions to create workouts (e.g., with time, distance, and/or calorie burning goals); communicate with workout sensors (in sports devices and smart watches); receive workout sensor data; calibrate sensors used to monitor a workout; select and play music for a workout; and display, store and transmit workout data.

In conjunction with touch-sensitive display system112, display controller156, optical sensor(s)164, optical sensor controller158, contact module130, graphics module132, and image management module144, camera module143includes executable instructions to capture still images or video (including a video stream) and store them into memory102, modify characteristics of a still image or video, and/or delete a still image or video from memory102.

In conjunction with touch-sensitive display system112, display controller156, contact module130, graphics module132, text input module134, and camera module143, image management module144includes executable instructions to arrange, modify (e.g., edit), or otherwise manipulate, label, delete, present (e.g., in a digital slide show or album), and store still and/or video images.

In conjunction with RF circuitry108, touch-sensitive display system112, display system controller156, contact module130, graphics module132, and text input module134, browser module147includes executable instructions to browse 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.

In conjunction with RF circuitry108, touch-sensitive display system112, display system controller156, contact module130, graphics module132, text input module134, e-mail client module140, and browser module147, calendar module148includes executable instructions to create, display, modify, and store calendars and data associated with calendars (e.g., calendar entries, to do lists, etc.) in accordance with user instructions.

In conjunction with RF circuitry108, touch-sensitive display system112, display system controller156, contact module130, graphics module132, text input module134, and browser module147, the widget creator module150includes executable instructions to create widgets (e.g., turning a user-specified portion of a web page into a widget).

In conjunction with touch-sensitive display system112, display system controller156, contact module130, graphics module132, and text input module134, search module151includes executable instructions to search for text, music, sound, image, video, and/or other files in memory102that match one or more search criteria (e.g., one or more user-specified search terms) in accordance with user instructions.

In conjunction with touch-sensitive display system112, display system controller156, contact module130, graphics module132, audio circuitry110, speaker111, RF circuitry108, and browser module147, video and music player module152includes executable instructions that allow the 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, and executable instructions to display, present or otherwise play back videos (e.g., on touch-sensitive display system112, or on an external display connected wirelessly or via external port124). In some embodiments, device100optionally includes the functionality of an MP3 player, such as an iPod (trademark of Apple Inc.).

In conjunction with touch-sensitive display system112, display controller156, contact module130, graphics module132, and text input module134, notes module153includes executable instructions to create and manage notes, to do lists, and the like in accordance with user instructions.

In conjunction with RF circuitry108, touch-sensitive display system112, display system controller156, contact module130, graphics module132, text input module134, GPS module135, and browser module147, map module154includes executable instructions to receive, display, modify, and store maps and data associated with maps (e.g., driving directions; data on stores and other points of interest at or near a particular location; and other location-based data) in accordance with user instructions.

In conjunction with touch-sensitive display system112, display system controller156, contact module130, graphics module132, audio circuitry110, speaker111, RF circuitry108, text input module134, e-mail client module140, and browser module147, online video module155includes executable instructions that allow the user to access, browse, receive (e.g., by streaming and/or download), play back (e.g., on the touch screen112, or on an external display connected wirelessly or via external port124), send an e-mail with a link to a particular online video, and otherwise manage online videos in one or more file formats, such as H.264. In some embodiments, instant messaging module141, rather than e-mail client module140, is used to send a link to a particular online video.

Hit view determination module172provides software procedures for determining where a sub-event has taken place within one or more views, when touch-sensitive display system112displays more than one view. Views are made up of controls and other elements that a user can see on the display.

Attention is now directed towards embodiments of user interfaces (“UI”) that are, optionally, implemented on portable multifunction device100.

User Interfaces and Associated Processes

Attention is now directed toward embodiments of user interfaces (“UI”) and associated processes that may be implemented on an electronic device, such as a portable multifunction device100with a display, a touch-sensitive surface, and optionally one or more sensors to detect intensity of contacts with the touch-sensitive surface, or a device300with a one or more processors, non-transitory memory, a display, and an input device.

FIGS. 5A-5Rillustrate example user interfaces for managing electronic communications in accordance with some embodiments. The user interfaces in these figures are used to illustrate the processes described below, including the processes inFIGS. 8A-8C and 9A-9C. Although some of the examples which follow will be given with reference to inputs on a touch-screen display (where the touch-sensitive surface and the display are combined), in some embodiments, the device detects inputs on a touch-sensitive surface451that is separate from the display450, as shown inFIG. 4B.

FIG. 5Aillustrates displaying a folder view502associated with an inbox folder within the display area501of the device100. For example, the inbox folder is one of a plurality of folders associated with an electronic mail (email) and/or messaging application. In some embodiments, the inbox folder includes electronic communications to and/or from the user of the device100. For example, the electronic communications include email conversations, email messages, instant message conversations, instant messages, SMSs, MMSs, talk-to-text, and/or the like. In some embodiments, the content displayed within the display area501corresponds to a grouping of electronic communications such as a specific folder, category, or tag. In some embodiments, the user of the device100is able to select between different groupings of electronic communications such as folders, categories, or tags.

As shown inFIG. 5A, the inbox folder view502includes: a back affordance516a, which, when activated (e.g., with a contact), causes the inbox folder view502to be replaced with a previous view or pane; and an edit affordance516bfor marking, moving, and archiving electronic communications in the inbox folder. As shown inFIG. 5A, the inbox folder view502also includes: a filter affordance518a, which, when activated (e.g., with a contact), causes the messages, conversations, and/or bundles associated with the inbox folder to be filtered according to a set of filter criteria or a filter pane to be displayed; and a draft affordance518b, which, when activated (e.g., with a contact), causes the inbox folder view502to be replaced with an interface for drafting a new message.

As shown inFIG. 5A, the inbox folder view502further includes a plurality of rows in a condensed view mode. In some embodiments, a row represents a plurality of messages (e.g., electronic communications) that satisfy one or more conversation criteria (e.g., a conversation with one or more messages with similar subjects, content, senders, recipients, and/or the like). In some embodiments, a row represents a plurality of messages (e.g., electronic communications) that satisfy a category criterion (e.g., a bundle of promotional, finance, social activity, etc. messages). In some embodiments, a row represents a single message.

InFIG. 5A, the first row corresponds to a conversation504a(e.g., with two messages). The first row includes: a timestamp of a most recently received message in the conversation504a; the sender(s) of messages in the conversation504a; the subject of the conversation504a(e.g., “Apple Picking”); a blurb/snapshot of the contents of the conversation504a; and a view mode affordance514a, which, when activated (e.g., with a contact), causes the first row to change from the condensed view mode to an expanded view mode. For example, the double chevrons associated with the view mode affordance514aindicate that the conversation504aincludes two or more messages. For example, the horizontal orientation of the chevrons associated with the view mode affordance514aindicate that the first row associated with the conversation504ais displayed in the condensed view mode. The first row also includes an icon519indicating that the conversation504aincludes one or more unread messages.

InFIG. 5A, the second row corresponds to a bundle of messages504bassociated with an updates criterion515. The second row includes: a timestamp of a most recently received message in the bundle of messages504b; the sender(s) of messages in the bundle of messages504b; and a view mode affordance514b, which, when activated (e.g., with a contact), causes the second row to change from the condensed view mode to an expanded view mode.

InFIG. 5A, the second row also includes a messages affordance517indicating the total number of messages included in the bundle of messages504breceived today and the number of unread messages included in the bundle of messages504b. In some embodiments, when activated (e.g., with a contact), the messages affordance517causes display of all messages included in the bundle of messages504b(e.g.,FIGS. 5O-5P). In some embodiments, when activated (e.g., with a contact), the messages affordance517causes display of the unread messages included in the bundle of messages504b. For example, the double chevrons associated with the view mode affordance514bindicate that the bundle of messages504bincludes two or more messages. For example, the horizontal orientation of the chevrons associated with the view mode affordance514bindicate that the second row associated with the bundle of messages504bis displayed in the condensed view mode. The second row further includes an icon519indicating that the bundle of messages504bincludes one or more unread messages.

As shown inFIG. 5A, the third row corresponds to a conversation504c(e.g., with one message), and the fourth row corresponds to a conversation504d(e.g., with one message). The third and fourth rows are similar to and adapted from the first row. As such, the third and fourth rows are not described for the sake of brevity. InFIG. 5A, the third row includes a view mode affordance514c, which, when activated (e.g., with a contact), causes the third row to change from the condensed view mode to an expanded view mode. For example, the single chevron associated with the view mode affordance514cindicates that the conversation504cincludes a single message. For example, the horizontal orientation of the chevron associated with the view mode affordance514cindicates that the third row associated with the conversation504cis displayed in the condensed view mode.

FIGS. 5A-5Billustrate a sequence in which additional information (e.g., the conversation view532) for a first plurality of messages that satisfy one or more conversation criteria (e.g., the conversation504a) replaces display of an inbox folder view502.FIG. 5Aalso illustrates detecting a contact520at a location corresponding to the view mode affordance514a.

In some embodiments, in response to selection of the view mode affordance514a(e.g.,FIG. 5A), the first row associated with the conversation504achanges from the condensed view to an expanded view with additional information corresponding to two or more messages from the conversation504aof related messages that are represented by the first row. In some embodiments, in response to selection of a view mode affordance in the first row displayed in the inbox folder region/pane (e.g.,FIG. 6A), additional information corresponding to two or more messages from the conversation of related messages that are represented by the first row is displayed. In some embodiments, the additional information is displayed in a conversation view532that replaces the inbox folder view502(e.g.,FIG. 5B). In some embodiments, the additional information is displayed inline in the inbox folder view502(e.g.,FIG. 5C). In some embodiments, the additional information is displayed in an adjacent content region/pane (e.g.,FIG. 6B).

FIG. 5Billustrates replacing display of the inbox folder view502with a conversation view532with messages534aand534bassociated with the conversation504ain response to selection of the view mode affordance514ainFIG. 5A. As such, the first row associated with the conversation504achanges from the condensed view inFIG. 5Ato the expanded view inFIG. 5Bwith additional information corresponding to two or more messages from the conversation504a.

As shown inFIG. 5B, the conversation view532includes a plurality of rows in the condensed view mode. For example, inFIG. 5B, each of the rows corresponds to a message included in the conversation504a. For example, the conversation504aincludes messages534aand534b, which satisfy the one or more conversation criteria (e.g., similar subjects, content, senders, recipients, and/or the like).

InFIG. 5B, the first row corresponds to the message534a. The first row includes: a timestamp for the message534a; the sender of the message534a; the subject of the message534a; a blurb/snapshot of the contents of the message534; and a view mode affordance544a, which, when activated (e.g., with a contact), causes the first row to change from the condensed view mode to an expanded view mode (e.g., showing the full contents of the message534a). The first row also includes an icon519indicating that the message534ais unread.

InFIG. 5B, the second row corresponds to the message534b. The second row includes: a timestamp for the message534b; the sender of the message534b; the subject of the message534b; a blurb/snapshot of the contents of the message534b; and a view mode affordance544b, which, when activated (e.g., with a contact), causes the first row to change from the condensed view mode to an expanded view mode (e.g., showing the full contents of the message534b). The second row also includes an icon519indicating that the message534bis unread.

FIG. 5AandFIG. 5Cillustrate another sequence in which additional information for a first plurality of messages that satisfy one or more conversation criteria (e.g., the conversation504a) is displayed inline in the inbox folder view502.FIG. 5Cillustrates displaying messages534aand534bassociated with the conversation504ainline in the inbox folder view502in response to selection of the view mode affordance514ainFIG. 5A. As such, the first row associated with the conversation504achanges from the condensed view inFIG. 5Ato the expanded view inFIG. 5Cwith additional information corresponding to two or more messages from the conversation504a.

FIG. 5Cis similar to and adapted fromFIG. 5B. As such,FIG. 5BandFIG. 5Cinclude similar user interfaces and elements labeled with the same reference number in both figures have the same function, only the differences are described herein for the sake of brevity. For example, the conversation504aincludes the messages534aand534b, which satisfy the one or more conversation criteria (e.g., similar subjects, content, senders, recipients, and/or the like). As shown inFIG. 5C, the messages534aand534bare displayed inline in the inbox folder view502. For example, the vertical orientation of the chevrons associated with the view mode affordance514aindicate that the first row associated with the conversation504ais displayed in the expanded view mode.

FIGS. 5D-5Eillustrate a sequence in which additional information (e.g., a bundle view552) for a second plurality of messages that satisfy a first category criterion (e.g., the bundle of messages504bassociated with an updates criterion515) replaces display of an inbox folder view502.FIG. 5Dis similar to and adapted fromFIG. 5A. As such,FIG. 5AandFIG. 5Dinclude similar user interfaces and elements labeled with the same reference number in both figures have the same function, only the differences are described herein for the sake of brevity.FIG. 5Dillustrates detecting a contact550at a location corresponding to the view mode affordance514b.

In some embodiments, in response to selection of the view mode affordance514b(e.g.,FIG. 5D), the second row associated with the bundle of messages504bchanges from the condensed view to an expanded view with additional information corresponding to two or more messages from the bundle of messages504brepresented by the second row. In some embodiments, in response to selection of the view mode affordance in the second row displayed in the inbox folder region/pane (e.g.,FIG. 5N), additional information corresponding to two or more messages from the bundle of messages represented by the second row is displayed. In some embodiments, the additional information is displayed in a bundle view552that replaces the inbox folder view502(e.g.,FIG. 5E). In some embodiments, the additional information is displayed inline in the inbox folder view502(e.g.,FIG. 5F). In some embodiments, the additional information is displayed in an adjacent content region/pane (e.g.,FIG. 5O).

FIG. 5Eillustrates replacing display of the inbox folder view502with a bundle view552in response to detecting selection of the view mode affordance514binFIG. 5D. As such, the second row associated with the bundle of messages504bchanges from the condensed view inFIG. 5Dto the expanded view inFIG. 5Ewith additional information corresponding to two or more messages from the bundle of messages504b.

As shown inFIG. 5E, the bundle view552includes a plurality of rows in condensed view mode. For example, inFIG. 5E, each of the rows corresponds to a message included in the bundle of messages504b. For example, the bundle of messages504bat least includes messages554a,554b, and554c, which satisfy a first category criterion associated with the updates criterion515(e.g., messages with content related to social media updates/notification).

InFIG. 5E, the first row corresponds to the message554a. The first row includes: a timestamp for the message554a; the sender of the message554a; the subject of the message554a; a blurb/snapshot of the contents of the message554a; and a view mode affordance564a, which, when activated (e.g., with a contact), causes the first row to change from the condensed view mode to an expanded view mode (e.g., showing the full contents of the message554a). The first row also includes an icon519indicating that the message554ais unread.

InFIG. 5E, the second row corresponds to the message554b. The second row includes: a timestamp for the message554b; the sender of the message554b; the subject of the message554b; a blurb/snapshot of the contents of the message554b; and a view mode affordance564b, which, when activated (e.g., with a contact), causes the second row to change from the condensed view mode to an expanded view mode (e.g., showing the full contents of the message554b). The second row also includes an icon519indicating that the message554bis unread.

InFIG. 5E, the third row corresponds to the message554c. The third row includes: a timestamp for the message554c; the sender of the message554c; the subject of the message554c; a blurb/snapshot of the contents of the message554c; and a view mode affordance564c, which, when activated (e.g., with a contact), causes the second row to change from the condensed view mode to an expanded view mode (e.g., showing the full contents of the message554c). The third row also includes an icon519indicating that the message554cis unread.

InFIG. 5E, the bundle view552also includes the messages affordance517indicating the total number of messages included in the bundle of messages504breceived today and the number of unread messages included in the bundle of messages504b. In some embodiments, when activated (e.g., with a contact), the messages affordance517causes display of all messages included in the bundle of messages504b(e.g.,FIGS. 5O-5P). In some embodiments, when activated (e.g., with a contact), the messages affordance517causes display of the unread messages included in the bundle of messages504b.

FIGS. 5D and 5Fillustrate another sequence in which additional information for a second plurality of messages that satisfy a first category criterion (e.g., the bundle of messages504bassociated with an updates criterion515) is displayed inline in the inbox folder view502.FIG. 5Fillustrates displaying the messages554a,554b, and554cassociated with the bundle of messages504binline in the inbox folder view502in response to detecting selection of the view mode affordance514binFIG. 5D. As such, the second row associated with the bundle of messages504bchanges from the condensed view inFIG. 5Dto the expanded view inFIG. 5Fwith additional information corresponding to two or more messages from the bundle of messages504b.

FIG. 5Fis similar to and adapted fromFIG. 5E. As such,FIG. 5EandFIG. 5Finclude similar user interfaces and elements labeled with the same reference number in both figures have the same function, only the differences are described herein for the sake of brevity. For example, the bundle of messages504bat least includes the messages554a,554b, and554c, which satisfy the updates criterion515(e.g., messages with content related to social media updates/notification). As shown inFIG. 5F, the messages554a,554b, and554care displayed inline in the inbox folder view502. For example, the vertical orientation of the chevrons associated with view mode affordance514bindicate that the second row associated with the bundle of messages504bis displayed in the expanded view mode.

FIG. 5Falso illustrates detecting a contact565at a location that corresponds to the message554a.FIG. 5Gillustrates replacing the inbox folder view502with a message view572for the message554ain response to detecting selection of the message554ainFIG. 5F. As shown inFIG. 5G, the message view572includes the contents574of the message554a. The message view572also includes: a next message affordance576a, which, when activated (e.g., with a contact), causes the message view572for the message554ato be replaced with a message view for a next message in the inbox folder (e.g., the message554b); and a previous message affordance576b, which, when activated (e.g., with a contact), causes the message view572for the message554ato be replaced with a message view for a previous message in the inbox folder (e.g., the conversation504a). The message view572further includes: a flag affordance578afor flagging the message554a; a move folder affordance578bfor moving the message554afrom the inbox folder to another folder; an archive affordance578cfor archiving the message554a; a reply affordance578dfor replying to or forwarding the message554a; and a draft affordance578efor drafting a new message.

FIGS. 5H-5Jillustrate a sequence in which a filter pane582is displayed and the filter criteria are changed in response to detecting a user input associated with a second input type (e.g., a one finger long press gesture) on the filter affordance518a.FIG. 5His similar to and adapted fromFIG. 5A. As such,FIG. 5AandFIG. 5Hinclude similar user interfaces and elements labeled with the same reference number in both figures have the same function, only the differences are described herein for the sake of brevity.FIG. 5Hillustrates detecting a one finger long press gesture with a contact580at a location corresponding to the filter affordance518a.

FIG. 5Iillustrates replacing display of the inbox folder view502with a filters pane582in response to selection of the filter affordance518awith the one finger long press gesture inFIG. 5H. InFIG. 5I, the filters pane582includes: an inbox filter586a, an important filter586b, a VIP filter586c, a flagged filter586d, an unread filter586e, a “To or CC” filter586f, and an attachments filter586g. As shown inFIG. 5I, the unread filter586eis currently enabled as part of the set of filter criteria as indicated by the icon588aassociated with the unread filter586e. InFIG. 5I, the filters pane582also includes: a done affordance584, which, when activated (e.g., with a contact), causes the filter pane582to be replaced with the previous view/pane (e.g., the inbox folder view502inFIG. 5H); and create custom filter affordance590for creating and adding a custom filter to the filter pane582. According to some embodiments, the filters pane582replaces display of the inbox folder view502when a one finger long press gesture is detected over the filter affordance518awhile the set of filter criteria are active (e.g., currently applied to the inbox folder).

FIG. 5Ialso illustrates detecting a contact592at a location corresponding to the important filter586b.FIG. 5Jillustrates that the important filter586bis enabled as part of the set of filter criteria as indicated by the icon588bassociated with the important filter586bin response to selection of the important filter586binFIG. 5I.FIG. 5Jalso illustrates detecting a contact594at a location corresponding to the done affordance584.

FIG. 5Killustrates replacing display of the filter pane582with the inbox folder view502in response to selection of the done affordance584inFIG. 5J.FIG. 5Kis similar to and adapted fromFIG. 5H. As such,FIG. 5HandFIG. 5Kinclude similar user interfaces and elements labeled with the same reference number in both figures have the same function, only the differences are described herein for the sake of brevity.

FIGS. 5K-5Lillustrate a sequence in which filter criteria (e.g., the enabled filters) are applied to the inbox folder in response to detecting a user input associated with a first input type (e.g., a one finger tap gesture) on the filter affordance518a.FIG. 5Kalso illustrates detecting a one finger tap gesture with a contact596at a location corresponding to the filter affordance518a.

FIG. 5Lillustrates replacing display of the inbox folder view502with a filtered inbox folder view5114in response to selection of the filter affordance518awith the one finger tap inFIG. 5K. As shown inFIG. 5L, the filtered inbox folder view5114includes a plurality of rows in condensed view mode. According to some embodiments, each of the rows inFIG. 5Lrepresents one or more messages (e.g., a bundle of messages, a conversation with a single message, or a conversation with a plurality of messages) that satisfy the set of filter criteria (e.g., the important filter586band the unread filter586e). As such, in some embodiments, at least some of the messages shown in filtered inbox folder view5114are both unread and marked as important. In some embodiments, at least some of the messages shown in filtered inbox folder view5114are either unread or marked as important.

InFIG. 5L, the filtered inbox folder view5114includes: a conversation504a, a conversation504f, a conversation504g, a conversation504h, a conversation504i, a conversation504j, and a conversation504k(partially occluded). As shown inFIG. 5L, the conversation504ais separated from the conversation504fby an expansion affordance5102a. According to some embodiments, the expansion affordance5102aindicates that a first set of one or more messages with timestamps between the timestamp associated with the conversation504aand the timestamp associated with the conversation504fhave been elided. For example, the first set of one or more messages are elided due to not satisfying the set of filter criteria. When activated (e.g., with a contact), the expansion affordance5102acauses the first set of one or more elided messages to be displayed between the conversation504aand the conversation504f.

Similarly, inFIG. 5L, the conversation504iis separated from the conversation504jby an expansion affordance5102b. According to some embodiments, the expansion affordance5102bindicates that a second set of one or more messages with timestamps between the timestamp associated with the conversation504iand the timestamp associated with the conversation504jhave been elided. For example, the one or more messages are elided due to not satisfying the filter criteria. When activated (e.g., with a contact), the expansion affordance5102bcauses the second set of one or more elided messages to be displayed between the conversation504iand the conversation504j.

InFIG. 5L, the filtered inbox folder view5114also includes an indication598of the set of filters applied to the current folder (e.g., the important filter586band the unread filter586e). In some embodiments, the indication598includes a text description of the set of filters applied to the current folder as shown inFIG. 5L. In some embodiments, the indication598includes one or more distinct icons associated with the filters in the set of filters applied to the current folder.

FIGS. 5L-5Millustrate a sequence in which elided messages are displayed within the filtered inbox folder view5114.FIG. 5Lfurther illustrates detecting a contact5100at a location corresponding to the expansion affordance5102a.FIG. 5Millustrates displaying a first set of elided messages within the filtered inbox folder view5114in response to selection of the expansion affordance5102ainFIG. 5L. As shown inFIG. 5M, the first set of elided messages corresponding to the conversations504e,504c, and504dis displayed between the conversations504aand504f.

FIG. 5Nillustrates displaying a dual-pane user interface associated with an electronic mail (email) and/or messaging application that includes a folders pane5110and a content pane5120within the display area501of the device100. As shown inFIG. 5N, the folders pane5110corresponds to an inbox folder that includes electronic communications to and/or from the user of the device100. For example, the electronic communications include email conversations, email messages, instant message conversations, instant messages, SMSs, MMSs, talk-to-text, and/or the like. In some embodiments, the content displayed within the folders pane5110corresponds to a grouping of electronic communications such as a specific folder, category, or tag. In some embodiments, the user of the device100is able to select between different groupings of electronic communications such as folders, categories, or tags.

As shown inFIG. 5N, the folders pane5110includes: a back affordance516a, which, when activated (e.g., with a contact), causes the folders pane5110associated with the inbox folder to be replaced with a previous view or pane; and an edit affordance516bfor marking, moving, and archiving electronic communications in the inbox folder. As shown inFIG. 5N, the folders pane5110also includes a filter affordance518a, which, when activated (e.g., with a contact), causes the messages, conversations, and/or bundles associated with the inbox folder to be filtered according to a set of filter criteria or a filter pane/menu to be displayed.

As shown inFIG. 5N, the folders pane5110further includes a plurality of rows corresponding to conversations with one or more message, bundles of messages, or single messages. In some embodiments, a row represents a plurality of messages (e.g., electronic communications) that satisfy one or more conversation criteria (e.g., a conversation with one or more messages with similar subjects, content, senders, recipients, and/or the like). In some embodiments, a row represents a plurality of messages (e.g., electronic communications) that satisfy a category criterion (e.g., a bundle of promotional, finance, social activity, etc. messages). In some embodiments, a row represents a single message.

InFIG. 5N, the first row in the folders pane5110corresponds to a conversation5112a(e.g., with one message). The first row includes: a timestamp for the conversation5112a; the sender of the conversation5112a; the subject of the conversation5112a(e.g., “Request for Shore Leave”); a blurb/snapshot of the contents of the conversation5112a; and a view mode affordance5114a, which, when activated (e.g., with a contact), causes the first row to change from the expanded view mode to the condensed view mode. For example, the single chevron associated with the view mode affordance5114aindicates that the conversation5112aincludes one message. For example, the vertical orientation of the chevron associated with the view mode affordance5112aindicates that the first row associated with the conversation5112ais displayed in the expanded view mode (e.g., with the contents5122of the conversation5112ashown in the content pane5120).

InFIG. 5N, the second row in the folders pane5110corresponds to a bundle of messages5112bassociated with a travel criterion5115a. The second row includes: a timestamp of a most recently received message in the bundle of messages5112b; the sender(s) of messages in the bundle of messages5112b; and a view mode affordance5114b, which, when activated (e.g., with a contact), causes the second row to change from the condensed view mode to an expanded view mode.

InFIG. 5N, the second row also includes a messages affordance5117aindicating the total number of messages included in the bundle of messages5112breceived today and the number of unread messages included in the bundle of messages5112b. In some embodiments, when activated (e.g., with a contact), the messages affordance5117acauses display of all messages included in the bundle of messages5112bin the content pane5120. In some embodiments, when activated (e.g., with a contact), the messages affordance5117acauses display of the unread messages included in the bundle of messages5112bin the content pane5120. For example, the double chevrons associated with the view mode affordance5114bindicate that the bundle of messages5112bincludes two or more messages. For example, the horizontal orientation of the chevrons associated with the view mode affordance5114bindicate that the second row associated with the bundle of messages5112bis displayed in the condensed view mode. The second row further includes an icon519indicating that the bundle of messages5112bincludes one or more unread messages.

InFIG. 5N, the third row in the folders pane5110corresponds to a conversation5112c(e.g., with one message). The third row includes: a timestamp for the conversation5112c; the sender of the conversation5112c; the subject of the conversation5112c(e.g., “Dehydration Machine”); a blurb/snapshot of the contents of the conversation5112c; and a view mode affordance5114c, which, when activated (e.g., with a contact), causes the third row to change from the expanded view mode to the condensed view mode. For example, the single chevron associated with the view mode affordance5114cindicates that the conversation5112cincludes one message. For example, the horizontal orientation of the chevron associated with the view mode affordance5112cindicates that the first row associated with the conversation5112cis displayed in the condensed view mode. The first row also includes an icon519indicating that the conversation5112cincludes an unread message.

InFIG. 5N, the fourth row in the folders pane5110corresponds to a bundle of messages5112dassociated with a fashion criterion5115b. The fourth row includes: a timestamp of a most recently received message in the bundle of messages5112d; the sender(s) of messages in the bundle of messages5112d; and a view mode affordance5114d, which, when activated (e.g., with a contact), causes the fourth row to change from the condensed view mode to an expanded view mode.

InFIG. 5N, the fourth row also includes a messages affordance5117bindicating the total number of messages included in the bundle of messages5112dreceived today and the number of unread messages included in the bundle of messages5112d. In some embodiments, when activated (e.g., with a contact), the messages affordance5117bcauses display of all messages included in the bundle of messages5112din the content pane5120. In some embodiments, when activated (e.g., with a contact), the messages affordance5117bcauses display of the unread messages included in the bundle of messages5112din the content pane5120. For example, the double chevrons associated with the view mode affordance5114dindicate that the bundle of messages5112dincludes two or more messages. For example, the horizontal orientation of the chevrons associated with the view mode affordance5114dindicate that the fourth row associated with the bundle of messages5112dis displayed in the condensed view mode. The fourth row further includes an icon519indicating that the bundle of messages5112dincludes one or more unread messages.

InFIG. 5N, the fifth row in the folders pane5110corresponds to a conversation5112e(e.g., with one message). The third row includes: a timestamp for the conversation5112e; the sender of the conversation5112e; the subject of the conversation5112c(e.g., “Battle of the Coral Sea Recap”); and a blurb/snapshot of the contents of the conversation5112e.

As shown inFIG. 5N, the content pane5120includes the contents5122of the message included in the conversation5112a. InFIG. 5N, the content pane5120also includes: the flag affordance578afor flagging the message included in the conversation5112a; the move folder affordance578bfor moving the message included in the conversation5112afrom the inbox folder to another folder; the archive affordance578cfor archiving the message included in the conversation5112a; the reply affordance578dfor replying to or forwarding the message included in the conversation5112a; and the draft affordance578efor drafting a new message.

FIGS. 5N-5Oillustrate a sequence in which additional information for a second plurality of messages that satisfy a category criterion (e.g., a bundle of messages associated with the travel criterion5115a) is displayed in the content pane5120.FIG. 5Nfurther illustrates detecting a contact5124at a location corresponding to the view mode affordance5114b.FIG. 5Oillustrates displaying additional information for the bundle of messages5112bin the content pane5120in response to selection of the view mode affordance5114binFIG. 5N.FIG. 5Ois similar to and adapted fromFIG. 5N. A such,FIG. 5NandFIG. 5Oinclude similar user interfaces and elements labeled with the same reference number in both figures have the same function, only the differences are described herein for the sake of brevity.

As shown inFIG. 5O, the content pane5120includes a plurality of rows in condensed view mode. For example, inFIG. 5O, each of the rows corresponds to messages included in the bundle of messages5112b. For example, the bundle of messages5112bat least includes the message5132a, the sub-bundle of messages5132b, and the message5132c, which satisfy a category criterion associated with the travel criterion5115a(e.g., messages with content related to travel, hotels, airplane tickets, etc.).

InFIG. 5O, the first row in the content pane5120corresponds to a message5132a. The first row includes: a timestamp for the message5132a; the sender of the message5132a; the subject of the message5132a; a blurb/snapshot of the contents of the message5132a; and a view mode affordance5134a, which, when activated (e.g., with a contact), causes the first row to change from the condensed view mode to an expanded view mode (e.g., showing the full contents of the message5132awithin the content pane5120). The first row also includes an icon519indicating that the message5132ais unread.

InFIG. 5O, the second row in the content pane5120corresponds to a sub-bundle of messages5132b. For example, the sub-bundle of messages5132bincludes messages within the bundle of messages5112bthat satisfy a sub-category criterion associated with the Europe criterion5131(e.g., messages with content related to European travel, hotels, airplane tickets, etc.). The second row also includes view mode affordance5134b, which, when activated (e.g., with a contact), causes the second row to change from the condensed view mode to an expanded view mode (e.g., showing the messages included in the sub-bundle of messages5132bwithin the content pane5120). The second row also includes an icon519indicating that one or more messages in the sub-bundle of messages5132bare unread.

InFIG. 5O, the second row further includes a messages affordance5133indicating the total number of messages included in the sub-bundle of messages5132breceived today and the number of unread messages included in the sub-bundle of messages5132b. In some embodiments, when activated (e.g., with a contact), the messages affordance5133causes display of all messages included in the sub-bundle of messages5132bin the content pane5120. In some embodiments, when activated (e.g., with a contact), the messages affordance5133causes display of the unread messages included in the sub-bundle of messages5132bin the content pane5120.

InFIG. 5O, the third row in the content pane5120corresponds to a message5132c. The third row includes: a timestamp for the message5132c; the sender of the message5132c; the subject of the message5132c; a blurb/snapshot of the contents of the message5132c; and a view mode affordance5134c, which, when activated (e.g., with a contact), causes the third row to change from the condensed view mode to an expanded view mode (e.g., showing the full contents of the message5132c). The third row also includes an icon519indicating that the message5132cis unread.

As shown inFIG. 5O, the content pane5120also includes the messages affordance5117aindicating the total number of messages included in the bundle of messages5112breceived today and the number of unread messages included in the bundle of messages5112b. In some embodiments, when activated (e.g., with a contact), the messages affordance5117acauses display of all messages included in the bundle of messages5112bin the content pane5120. In some embodiments, when activated (e.g., with a contact), the messages affordance5117acauses display of the unread messages included in the bundle of messages5112bin the content pane5120.FIG. 5Oalso illustrates detecting a contact5126at a location corresponding to the messages affordance5117awithin the content pane5120.

InFIG. 5O, for example, the horizontal orientation of the chevron associated with the view mode affordance5114aindicates that the first row associated with the conversation5112ais displayed in the condensed view mode. For example, the vertical orientation of the chevrons associated with the view mode affordance5114bindicate that the second row associated with the bundle of messages5112bis displayed in the expanded view mode.

FIG. 5Pillustrates displaying all messages for the bundle of messages5112bwithin the content pane5120in response to selection of the messages affordance5117ainFIG. 5O.FIG. 5Pis similar to and adapted fromFIG. 5O. As such,FIG. 5OandFIG. 5Pinclude similar user interfaces and elements labeled with the same reference number in both figures have the same function, only the differences are described herein for the sake of brevity.

As shown inFIG. 5P, the content pane5120includes a plurality of rows in condensed view mode. InFIG. 5P, the rows in the content pane5120correspond to the message5132a, the sub-bundle of messages5132b, the message5132c, the message5132d, and the message5132e(partially occluded), which satisfy a category criterion associated with the travel criterion5115a(e.g., messages with content related to travel, hotels, airplane tickets, etc.).

FIG. 5NandFIG. 5Qillustrate another sequence in which additional information for a second plurality of messages that satisfy a category criterion (e.g., a bundle of messages associated with a travel criterion5115a) is displayed in a content pane5120.FIG. 5Qillustrates displaying additional information for the bundle of messages5112ainline in the folders pane5110and also in the content pane5120in response to selection of the view mode affordance5114binFIG. 5N.FIG. 5Qis similar to and adapted fromFIG. 5O. As such,FIG. 5OandFIG. 5Qinclude similar user interfaces and elements labeled with the same reference number in both figures have the same function, only the differences are described herein for the sake of brevity. As shown inFIG. 5Q, the conversation5132aincluded in the bundle of messages5112a, the sub-bundle of messages5132bincluded in the bundle of messages5112a, the conversation5132cincluded in the bundle of messages5112a, and the messages affordance5117aare displayed inline in the folders pane5110.

InFIG. 5Q, for example, the vertical orientation of the chevrons associated with the view mode affordance5114bindicate that the bundle of messages5112bis displayed in the expanded view mode (e.g., with additional information displayed inline in the folders pane5110). For example, the vertical orientation of the chevron associated with the view mode affordance5134aindicates that the conversation5132aincluded in the bundle of messages5112bis displayed in the expanded view mode (e.g., with contents5138displayed in the content pane5120).

As shown inFIG. 5Q, the contents5138of the conversation5132aare displayed in the content pane5120. InFIG. 5Q, the conversation5132ais displayed as a top message in stack of messages5139associated with the bundle of messages5112bthat satisfy the travel criterion5115a.

FIGS. 5Q-5Rillustrate a sequence in which additional information for a second plurality of messages that satisfy a sub-category criterion (e.g., a sub-bundle of messages associated with a Europe criterion5131) is displayed in the content pane5120.FIG. 5Qalso illustrates detecting a contact5140at a location corresponding to the view mode affordance5134bassociated with the sub-bundle of messages5132b.FIG. 5Rillustrates displaying additional information for the sub-bundle of messages5132binline in the inbox folder pane5110and also in the content pane5120in response to selection of the view mode affordance5134binFIG. 5Q.

FIG. 5Ris similar to and adapted fromFIGS. 5O-5Q. As such,FIGS. 5O-5QandFIG. 5Rinclude similar user interfaces and elements labeled with the same reference number in both figures have the same function, only the differences are described herein for the sake of brevity. As shown inFIG. 5R, the conversation5142aand the conversation5142bincluded in the sub-bundle of messages5132bare displayed inline in the folders pane5110.

InFIG. 5R, for example, the vertical orientation of the chevrons associated with the view mode affordance5114bindicate that the bundle of messages5112bis displayed in the expanded view mode (e.g., with additional information displayed inline in the folders pane5110). For example, the vertical orientation of the chevrons associated with the view mode affordance5134bindicate that the sub-bundle of messages5132bis displayed in the expanded view mode (e.g., with additional information displayed inline in the folders pane5110). For example, the vertical orientation of the chevron associated with the view mode affordance51146indicates that the conversation5142aincluded in the sub-bundle of messages5132bis displayed in the expanded view mode (e.g., with the contents5144displayed in the content pane5120).

As shown inFIG. 5R, the contents5144of the conversation5142aincluded in the sub-bundle of messages5132bare displayed in the content pane5120. InFIG. 5R, the conversation5142ais displayed as a top message in a stack of messages5145associated with the sub-bundle of messages5132bthat satisfy the Europe criterion5131.

FIGS. 6A-6Fillustrate example user interfaces for managing electronic communications in accordance with some embodiments. The user interfaces in these figures are used to illustrate the processes described below, including the processes inFIGS. 8A-8C and 9A-9C. Although some of the examples which follow will be given with reference to inputs on a touch-sensitive surface451that is separate from the display450, in some embodiments, the device (e.g., the device300) detects inputs on a touch-screen display (where the touch-sensitive surface and the display are combined), as shown inFIG. 4A.

FIG. 6Aillustrates displaying a user interface including a window602and a dock605with a plurality of dock icons606-A,606-B, and606-C for different applications within the display area601. For example, the window602corresponds to associated an electronic mail (email) and/or messaging application. As shown inFIG. 6A, the window602includes a chrome region604, a folders pane610, and a content pane620. InFIG. 6A, the folders pane610corresponds to an inbox folder that includes electronic communications to and/or from the user of the device. For example, the electronic communications include email conversations, email messages, instant message conversations, instant messages, SMSs, MMSs, talk-to-text, and/or the like. In some embodiments, the content displayed within the folders pane610corresponds to a grouping of electronic communications such as a specific folder, category, or tag. In some embodiments, the user of the device is able to select between different groupings of electronic communications such as folders, categories, or tags.

As shown inFIG. 6A, the folders pane610includes a plurality of rows corresponding to conversations612a,612b,612c,612d,612e, and612f(partially occluded) each with one or more messages. InFIG. 6A, the folders pane610also includes: a sorting affordance616a, which indicates that the inbox folder is currently sorted in chronological order with the newest conversation first; and a filter affordance616b, which indicates zero or more filters currently applied to the inbox folder (e.g., no filters are currently applied to the inbox folder inFIG. 6A). When activated (e.g., with a single or double click via the focus selector603), the sorting affordance616acauses the inbox folder to be re-sorted.

When activated with a first input type (e.g., with a single click via the focus selector603), the filter affordance616bcauses the application of a set of filter criteria to the electronic communications in the inbox folder (if the set of filter criteria are currently deactivated as shown inFIGS. 6A-6B). When activated with a first input type (e.g., with a single click via the focus selector603), the filter affordance616bcauses deactivation of a set of filter criteria applied to the electronic communications in the inbox folder (if the set of filter criteria are currently active as shown inFIGS. 6D-6E. When activated with a second input type (e.g., with a double click via the focus selector603), the filter affordance616bcauses a filter menu to be overlaid on the window602(e.g.,FIG. 6C).

InFIG. 6A, the first row in the folders pane610includes: a timestamp of a most recently received message in the conversation612a; the sender(s) of messages in the conversation612a; the subject of the conversation612a(e.g., “Apple Picking”); a blurb/snapshot of the contents of the conversation612a; and a view mode affordance616a, which, when activated (e.g., with the focus selector603), causes the first row to change from the condensed view mode to an expanded view mode (e.g.,FIG. 6B). For example, the double chevrons associated with the view mode affordance616aindicate that the conversation612aincludes two or more messages. For example, the horizontal orientation of the chevrons associated with the view mode affordance616aindicate that the conversation612ais displayed in the condensed view mode. The first row also includes an icon619indicating that the conversation612aincludes one or more unread messages.

InFIG. 6A, the second row in the folders pane610includes: a timestamp for the message associated with the conversation612b; the sender of messages in the message associated with the conversation612b; the subject of the message associated with the conversation612b(e.g., “Fort Wayne Historic Site”); a blurb/snapshot of the contents of the message associated with the conversation612b; and a view mode affordance616b, which, when activated (e.g., with the focus selector603), causes the second row to change from the expanded view mode to the condensed view mode. For example, the single chevron associated with the view mode affordance616bindicates that the conversation612bincludes a single message. For example, the vertical orientation of the chevron associated with the view mode affordance616bindicates that the conversation612bis displayed in the expanded view mode (e.g., with the contents622of the conversation612bdisplayed in the content pane620).

InFIG. 6A, the third row in the folders pane610includes: a timestamp for the message associated with the conversation612c; the sender of messages in the message associated with the conversation612c; the subject of the message associated with the conversation612c(e.g., “Dehydration Machine”); a blurb/snapshot of the contents of the message associated with the conversation612c; and a view mode affordance616c, which, when activated (e.g., with the focus selector603), causes the second row to change from the condensed view mode to the expanded view mode (e.g., with the contents of the message associated with the conversation612cin the content pane620). For example, the single chevron associated with the view mode affordance616cindicates that the conversation612cincludes a single message. For example, the horizontal orientation of the chevron associated with the view mode affordance616cindicates that the conversation612cis displayed in the condensed view mode.

As shown inFIG. 6A, the content pane620includes the content622of the message associated with the conversation612b. InFIG. 6A, the content pane620also includes: a flag affordance624afor flagging the message associated with the conversation612b; a move folder affordance624bfor moving the message associated with the conversation612bfrom the inbox folder to another folder; an archive affordance624cfor archiving the message associated with the conversation612b; a reply affordance624dfor replying to or forwarding the message associated with the conversation612b; and a draft affordance624efor drafting a new message.

FIGS. 6A-6Billustrate a sequence in which additional information for a first plurality of messages that satisfy one or more conversation criteria (e.g., the conversation612a) is displayed in a content pane620.FIG. 6Aalso illustrates displaying the focus selector603at a location corresponding to the view mode affordance616a.FIG. 6Billustrates replacing display of the content622of the message associated with the conversation612bin the content pane620with the messages632aand632bassociated with the conversation612ain response to selection of the view mode affordance616ainFIG. 6A. As shown inFIG. 6B, the content pane620includes a plurality of rows corresponding to the messages632aand632b.

InFIG. 6B, the first row in the content pane620, corresponding to the message632a, includes: a timestamp for the message632a; the sender of the message632a; the subject of the message632a; a blurb/snapshot of the contents of message632a; and a view mode affordance634a, which, when activated (e.g., with the focus selector603), causes the first row to change from the condensed view mode to an expanded view mode (e.g., showing the full contents of the message632ain the content pane620). The first row also includes an icon619indicating that the message632ais unread.

InFIG. 6B, the second row in the content pane620, corresponding to the message632b, includes: a timestamp for the message632b; the sender of the message632b; the subject of the message632b; a blurb/snapshot of the contents of the message632b; and a view mode affordance634b, which, when activated (e.g., with the focus selector603), causes the first row to change from the condensed view mode to an expanded view mode (e.g., showing the full contents of the message632bin the content pane620). The second row also includes an icon619indicating that the message634bis unread.

InFIG. 6B, for example, the vertical orientation of the chevrons associated with the view mode affordance616aindicates that the conversation612ais displayed in the expanded view mode. For example, the horizontal orientation of the chevron associated with the view mode affordance616bindicates that the conversation612bis displayed in the condensed view mode.

FIGS. 6B-6Cillustrate a sequence in which a filter menu640is displayed in response to detecting selection of the filter affordance616bwith a second input type (e.g., a double click with the focus selector603).FIG. 6Balso illustrates displaying the focus selector603at a location corresponding to the filter affordance616b.FIG. 6Cillustrates displaying a filters menu640overlaid on the window602in response to selection of the filter affordance616bwith a second input type (e.g., a double click with the focus selector603) inFIG. 6B.FIG. 6Cis similar to and adapted fromFIG. 6B. As such,FIG. 6BandFIG. 6Binclude similar user interfaces and elements labeled with the same reference number in both figures have the same function, only the differences are described herein for the sake of brevity.

As shown inFIG. 6C, the filters menu640includes: an inbox filter642a, an important filter642b, a VIP filter642c, a flagged filter642d, an unread filter642e, a “To or CC” filter642f, and an attachments filter642g. As shown inFIG. 6C, the flagged filter642dis currently enabled as part of the filter criteria as indicated by the icon646aassociated with the flagged filter642d. InFIG. 6C, filters menu640also includes a create custom filter affordance644for creating and adding a custom filter to the filters menu640. According to some embodiments, the filters menu640is overlaid on the window602when a one finger long press gesture is detected over the filter affordance616bwhile the set of filter criteria are active (e.g., currently applied to the inbox folder).

FIG. 6BandFIG. 6Dillustrate a sequence in which filter criteria are applied to the inbox folder in response to detecting selection of the filter affordance616bwith a first input type (e.g., a single click with the focus selector603).FIG. 6Dillustrates displaying a filtered inbox folder in the folders pane610in response to detecting selection of the filter affordance616bwith the first input type (e.g., a single click with the focus selector603) inFIG. 6B. As shown inFIG. 6D, the filtered inbox folder includes a plurality of conversations612c,612d,612e,612f, and612g(partially occluded) that satisfy the set of filter criteria (e.g., the flagged filter642d). As such, according to some embodiments, the conversations612c,612d,612e,612f, and612g(e.g., with one or more messages) shown in filtered inbox folder in the folders pane610include one or more flagged messages.

As shown inFIG. 6D, the folders pane610includes an expansion affordance654above the conversation612c. According to some embodiments, the expansion affordance654indicates that a set of one or more messages with timestamps before the timestamp associated with the conversation612chave been elided. For example, the set of one or more messages are elided due to not satisfying the set of filter criteria (e.g., the flagged filter642d). When activated (e.g., with the focus selector603), the expansion affordance654causes the set of one or more elided messages to be displayed above the conversation612c.

InFIG. 6D, the filter affordance616bincludes an indication of the set of filters applied to the current folder (e.g., the flagged filter642d). In some embodiments, the indication includes a text description of the set of filters applied to the current folder as shown inFIG. 6D. In some embodiments, the indication includes one or more distinct icons for the set of filters applied to the current folder.

As shown inFIG. 6D, the content pane620includes the contents652associated with the conversation612c. InFIG. 6D, for example, the vertical orientation of the chevron associated with the view mode affordance616cindicates that the conversation612cis displayed in the expanded view mode (e.g., the contents652associated with the conversation612care displayed in the content pane620).

For example, a user of the device changes the active folder in the folder pane610from the inbox folder to folder A. Continuing with this example,FIG. 6Eillustrates displaying filtered folder A in the folders pane610in response to switching the active folder. Moreover, the set of filter criteria (e.g., the flagged filter642d) are applied to folder A after switching the active folder.

As shown inFIG. 6E, the filtered folder A includes a plurality of conversations662a,662b,662c, and662dthat satisfy the set of filter criteria (e.g., the flagged filter642d). As such, in some embodiments, the conversations662a,662b,662c, and662d(e.g., with one or more messages) include one or more flagged messages.FIG. 6Ealso illustrates displaying the contents672of the conversation662ain the content pane620.

InFIG. 6E, the first row in the folders pane610includes: a timestamp for the message associated with the conversation662a; the sender of the message associated with the conversation662a; the subject of the conversation662a(e.g., “Koalas in Trees”); a blurb/snapshot of the contents of the conversation662a; and a view mode affordance664a, which, when activated (e.g., with the focus selector603), causes the first row to change from the expanded view mode to the condensed view mode. For example, the single chevron associated with the view mode affordance664aindicates that the conversation662aincludes a single message. For example, the vertical orientation of the chevron associated with the view mode affordance664aindicates that the conversation662ais displayed in the expanded view mode (e.g., with the contents672displayed in the content pane620).

InFIG. 6E, the second row in the folders pane610includes: a timestamp for the message associated with the conversation662b; the sender of the message associated with the conversation662b; the subject of the message associated with the conversation662b(e.g., “Black Shades”); a blurb/snapshot of the contents of the message associated with the conversation662b; and a view mode affordance664b, which, when activated (e.g., with the focus selector603), causes the second row to change from the condensed view mode to the expanded view mode (e.g., with the contents of the message associated with the conversation662bdisplayed in the content pane620). For example, the single chevron associated with the view mode affordance664bindicates that the conversation662bincludes a single message. For example, the horizontal orientation of the chevron associated with the view mode affordance664bindicates that the conversation662bis displayed in the condensed view mode. The second row also includes an icon619indicating that the conversation662bincludes one or more unread messages.

As shown inFIG. 6E, the folders pane610includes an expansion affordance666below the conversation662d. According to some embodiments, the expansion affordance666indicates that a set of one or more messages with timestamps after the timestamp associated with the conversation662dhave been elided. For example, the set of one or more messages are elided due to not satisfying the set of filter criteria (e.g., (e.g., the flagged filter642d). When activated (e.g., with the focus selector603), the expansion affordance666causes the set of one or more elided messages to be displayed below the conversation662d.

FIG. 6E-6Fillustrate a sequence in which the filter criteria are deactivated.FIG. 6Efurther illustrates displaying the focus selector603at a location corresponding to the filter affordance616b.FIG. 6Fillustrates disabling the set of filter criteria and displaying folder A in the folders pane610in response to detecting selection of the filter affordance616bwith the first input type (e.g., a single click with the focus selector603) inFIG. 6E.

FIG. 6Fis similar to and adapted fromFIG. 6E. A such,FIG. 6EandFIG. 6Finclude similar user interfaces and elements labeled with the same reference number in both figures have the same function, only the differences are described herein for the sake of brevity. InFIG. 6F, the filter affordance616bindicates that no filters are currently applied to folder A, as compared toFIG. 6Ewhere the flagged filter642dis applied to folder A. As shown inFIG. 6F, the folders pane610includes conversations662a,662b,662c,662d,662e, and662f(partially occluded) and does not include the expansion affordance666, as compared toFIG. 6E.

FIGS. 7A-7Pillustrate example user interfaces for managing electronic communications in accordance with some embodiments. The user interfaces in these figures are used to illustrate the processes described below, including the processes inFIGS. 10A-10C. Although some of the examples which follow will be given with reference to inputs on a touch-screen display (where the touch-sensitive surface and the display are combined), in some embodiments, the device detects inputs on a touch-sensitive surface451that is separate from the display450, as shown inFIG. 4B.

FIG. 7Aillustrates displaying a folder view702associated with an inbox folder within the display area of the device100. For example, the inbox folder is one of a plurality of folders associated with an electronic mail (email) and/or messaging application. In some embodiments, the inbox folder includes electronic communications to and/or from the user of the device100. For example, the electronic communications include email conversations, email messages, instant message conversations, instant messages, SMSs, MMSs, talk-to-text, and/or the like. In some embodiments, the content displayed within the display area corresponds to a grouping of electronic communications such as a specific folder, category, or tag. In some embodiments, the user of the device100is able to select between different groupings of electronic communications such as folders, categories, or tags.

As shown inFIG. 7A, the inbox folder view702includes: a back affordance716a, which, when activated (e.g., with a contact), causes the inbox folder view702to be replaced with a previous view or pane; and an edit affordance716bfor marking, moving, and archiving electronic communications in the inbox folder. As shown inFIG. 7A, the inbox folder view702also includes: a filter affordance718a, which, when activated (e.g., with a contact), causes the messages, conversations, and/or bundles associated with the inbox folder to be filtered according to a set of filter criteria or a filter pane to be displayed; and a draft affordance718b, which, when activated (e.g., with a contact), causes the inbox folder view702to be replaced with an interface for drafting a new message.

As shown inFIG. 7A, the inbox folder view702further includes a plurality of rows. In some embodiments, a row represents a plurality of messages (e.g., electronic communications) that satisfy one or more conversation criteria (e.g., a conversation with one or more messages with similar subjects, content, senders, recipients, and/or the like). In some embodiments, a row represents a single message.

InFIG. 7A, the first row corresponds to a conversation704a(e.g., with two or more messages). The first row includes: a timestamp of a most recently received message in the conversation704a; the sender(s) of messages in the conversation704a; the subject of the conversation704a(e.g., “Apple Picking”); and a blurb/snapshot of the contents of the conversation704a. The first row also includes an icon719indicating that the conversation704aincludes one or more unread messages.

As shown inFIG. 7A, the second row corresponds to a message704b(e.g., a conversation with one message). The second row includes: a timestamp associated with the message704b; the sender of the message704b; the subject of the message704b(e.g., “Sulawesi Weather Reports”); and a blurb/snapshot of the contents of the message704b. The second row also includes an icon719indicating that the message704bis unread.

As shown inFIG. 7A, the third row corresponds to a message704c(e.g., a conversation with one message). The third row includes: a timestamp associated with the message704c; the sender of the message704c; the subject of the message704c(e.g., “Dehydration Machine”); and a blurb/snapshot of the contents of the message704c. The third row also includes an icon719indicating that the message704cis unread.

InFIG. 7A, the fourth row corresponds to a conversation704d(e.g., with two or more messages). The fourth row includes: a timestamp of a most recently received message in the conversation704d; the sender(s) of messages in the conversation704d; the subject of the conversation704d(e.g., “Battle of Leyte Gulf”); and a blurb/snapshot of the contents of the conversation704d.

As shown inFIG. 7A, according to some embodiments, a respective dimension (e.g., the height) of each of the rows in the inbox folder view702is the same. For example, inFIG. 7A, a respective dimension (e.g., the height) of the first row corresponding to the conversation704ahas a value703, and the respective dimension (e.g., the height) of the second row corresponding to the message704balso has the value703.

FIGS. 7A-7Billustrate a sequence in which a conversation view730replaces display of the inbox folder view702.FIG. 7Aillustrates detecting a contact706at a location corresponding to the conversation704a(e.g., a one finger tap gesture).FIG. 7Billustrates replacing display of the inbox folder view702with the conversation view730corresponding to the conversation704ain response to selection of the conversation704ainFIG. 7A.

As shown inFIG. 7B, the conversation view730includes: a header region731a, a content region731b, a toolbar region731c, and a subject bar734. InFIG. 7B, the content region731bincludes: a first message region732aassociated with a first message in the conversation704a; a second message region732bassociated with a second message in the conversation704a; and a portion of a third message region732cassociated with a third message in the conversation704a(sometimes collectively referred to as the “message regions732”). For example, if a user scrolls the conversation view730, the balance of the third message region732cis displayed within the content region731b.

In some embodiments, the messages are sorted in reverse chronological order. As such, in this example, the first message associated with the message region732ais the most recent message in the conversation704a. In some embodiments, the messages are sorted in chronological order. As such, in this example, the first message associated with the message region732ais the oldest message in the conversation704a. InFIG. 7B, the subject bar734indicates the subject (e.g., “Apple Picking”) of the conversation704a.

As shown inFIG. 7B, the message regions732include a header sub-region736a, a content sub-region736b, and a bottom sub-region736c. The header sub-region736aincludes the sender of the corresponding message, the recipients of the corresponding message, the folder associated with the corresponding message, a timestamp for the corresponding message, and a “details” affordance738a, which, when activated (e.g., with a contact), causes additional details associated with a corresponding message to be displayed within the header sub-region736a. The content sub-region736bincludes the content of the corresponding message. The bottom sub-region736cincludes: a “see more” affordance738b, which, when activated (e.g., with a contact), causes a message view of the corresponding message to replace display of the conversation view730(e.g., as shown inFIG. 7J-7K); and an actions affordance738c, which, when activated (e.g., with a contact), causes a first set of one or more affordances to be displayed (e.g., as shown inFIGS. 7C-7D).

As shown inFIG. 7B, the header region731aincludes: a back affordance716a, which, when activated (e.g., with a contact), causes the conversation view730to be replaced with the previous view or pane (e.g., the inbox folder view702inFIG. 7A); and an indication of the number of messages in the conversation704a(e.g., 3 messages). According to some embodiments, the header region731aalso includes: a next affordance726a, which, when activated (e.g., with a contact), causes a next conversation or message from the inbox folder to replace display of the conversation704awithin the conversation view730; and a previous affordance726b, which, when activated (e.g., with a contact), causes a previous conversation or message from the inbox folder to replace display of the conversation704awithin the conversation view730. According to some embodiments, the header region731aalso includes: a next affordance726a, which, when activated (e.g., with a contact), causes a next message region (e.g., the second message region732b) to be displayed at the top of the conversation view730; and a previous affordance726b, which, when activated (e.g., with a contact), causes a previous message region to be displayed at the top of the conversation view730.

As shown inFIG. 7B, according to some embodiments, the toolbar region731cincludes: a flag affordance728afor flagging the messages in the conversation704a; a move folder affordance728bfor moving the messages in the conversation704afrom the inbox folder to another folder; an archive affordance728cfor archiving the messages in the conversation704a; a reply affordance728dfor replying to or forwarding the conversation704a; and a draft affordance728efor drafting a new message. According to some embodiments, the toolbar region731cincludes: a flag affordance728afor flagging a respective message in the conversation704a; a move folder affordance728bfor moving the respective message in the conversation704afrom the inbox folder to another folder; an archive affordance728cfor archiving the respective message in the conversation704a; a reply affordance728dfor replying to or forwarding the respective message in the conversation704a; and a draft affordance728efor drafting a new message. In some embodiments, the respective message is the most recent message within the conversation704a. In some embodiments, the respective message is the top-most message that is fully displayed within the conversation view730.

As shown inFIG. 7B, according to some embodiments, a respective dimension (e.g., the height) of each of the message regions732is based on the amount of content associated with the corresponding message. For example, inFIG. 7B, a respective dimension (e.g., the height) of the first message region732ahas a value733a, and the respective dimension (e.g., the height) of the second message region732bhas a value733b. In this example, the value733bis greater than the value733abecause the first message associated with the first message region732ahas less content (e.g., lines of text) than the second message associated with the second message region732b.

FIGS. 7B-7Cillustrate a sequence in which the user scrolls within the conversation view730.FIG. 7Balso illustrates detecting an upward swipe gesture with a contact740within the content region731b.FIG. 7Cillustrates scrolling the message regions732within the content region731bin response to detecting the upward swipe gesture inFIG. 7B.FIG. 7Cis similar to and adapted fromFIG. 7B. As such,FIG. 7BandFIG. 7Cinclude similar user interfaces and elements labeled with the same reference number in both figures have the same function, only the differences are described herein for the sake of brevity. As shown inFIG. 7C, the conversation view730no longer includes the subject bar734. However, the header region731aincludes an indication of the subject of the conversation704a(e.g., Apple Picking”) in addition to the indication of the number of messages in the conversation704a(e.g., 3 messages).

FIGS. 7C-7Dillustrate a sequence in which a first set of one or more affordances is displayed within the content region731b.FIG. 7Calso illustrates detecting a contact742at a location corresponding to the actions affordance738cwithin the second message region732b.FIG. 7Dillustrates sliding the second message region732bin a first direction (e.g., right-to-left) in response to selection of the actions affordance738cinFIG. 7C.FIG. 7Dalso illustrates displaying a first action region744adjacent to the second message region732b, including a first set of one or more affordances provided to perform actions on the second message corresponding to the second message region732bin response to selection of the actions affordance738cinFIG. 7C.

FIG. 7Dis similar to and adapted fromFIG. 7B. As such,FIG. 7BandFIG. 7Dinclude similar user interfaces and elements labeled with the same reference number in both figures have the same function, only the differences are described herein for the sake of brevity. As shown inFIG. 7D, the first action region744includes: a reply affordance746a, which, when activated (e.g., with a contact), causes a menu with a plurality of reply options to be overlaid on the conversation view730(e.g., as shown inFIGS. 7F-7G); a move affordance746b, which, when activated (e.g., with a contact), causes a menu with a plurality of folder options for moving the second message corresponding to the second message region732bto be overlaid on the conversation view730; and a trash affordance746c, which, when activated (e.g., with a contact), causes the second message corresponding to the second message region732bto be moved to the trash (sometimes referred to collectively as the “affordances746”). In some embodiments, the first action region744includes any number of affordances746. In some embodiments, one or more of the affordances746may be replaced with other action options from a preferences menu.

FIGS. 7E-7Fillustrate another sequence in which the first set of one or more affordances is displayed within the content region731b.FIG. 7Eis similar to and adapted fromFIG. 7BandFIG. 7D. As such,FIG. 7B,FIG. 7D, andFIG. 7Einclude similar user interfaces and elements labeled with the same reference number in both figures have the same function, only the differences are described herein for the sake of brevity.FIG. 7Eillustrates detecting a right-to-left swipe gesture within the second message region732bwith a contact748.FIG. 7Fillustrates sliding the second message region732bin a first direction (e.g., right-to-left) in response to detecting the right-to-left swipe gesture inFIG. 7E.FIG. 7Falso illustrates displaying a first action region744adjacent to the second message region732b, including the first set of one or more affordances provided to perform actions on the second message corresponding to the second message region732bin response to detecting the right-to-left swipe gesture inFIG. 7E.

FIGS. 7F-7Gillustrate a sequence in which a menu751with a plurality reply options is overlaid on the conversation view730.FIG. 7Ffurther illustrates detecting a contact750at a location corresponding to the reply affordance746awithin the first action region744.FIG. 7Gillustrates displaying the menu751with a plurality reply options overlaid on the conversation view730in response to selection of the reply affordance746ainFIG. 7F. According to some embodiments, the menu751slides up from the bottom edge of the display area of the device100. As shown inFIG. 7G, the menu751includes: a reply to all affordance749a, which, when activated (e.g., with a contact) causes a message drafting interface for replying to all participants of the second message that corresponds to the second message region732bto replace display of the conversation view730; a reply affordance749b, which, when activated (e.g., with a contact) causes a message drafting interface for replying to the sender of the second message that corresponds to the second message region732bto replace display of the conversation view730; a forward affordance749c, which, when activated (e.g., with a contact) causes a message drafting interface for forwarding the second message region732bto replace display of the conversation view730; and a cancel affordance749d, which, when activated (e.g., with a contact) causes the menu751to cease being displayed.

FIGS. 7H-7Iillustrate a sequence in which in which a second set of one or more affordances is displayed within the content region731b.FIG. 7His similar to and adapted fromFIG. 7B. As such,FIG. 7BandFIG. 7Hinclude similar user interfaces and elements labeled with the same reference number in both figures have the same function, only the differences are described herein for the sake of brevity.FIG. 7Hillustrates detecting a left-to-right swipe gesture within the second message region732bwith a contact754.FIG. 7Iillustrates sliding the second message region732bin a second direction (e.g., left-to-right) in response to detecting the left-to-right swipe gesture inFIG. 7H.FIG. 7Ialso illustrates displaying a second action region760adjacent to the second message region732b, including a second set of one or more affordances provided to perform actions on the second message corresponding to the second message region732bin response to detecting the left-to-right swipe gesture inFIG. 7H.

As shown inFIG. 7I, the second action region760includes an unread affordance762, which, when activated (e.g., with a contact), causes the second message corresponding to the second message region732bto be marked as unread. In some embodiments, the second action region760includes any number of affordances. In some embodiments, the unread affordance762may be replaced with other action options from a preferences menu.

FIGS. 7J-7Killustrate a sequence in which in which a message view770replaces display of the conversation view730.FIG. 7Jis similar to and adapted fromFIG. 7B. As such,FIG. 7BandFIG. 7Jinclude similar user interfaces and elements labeled with the same reference number in both figures have the same function, only the differences are described herein for the sake of brevity.FIG. 7Jillustrates detecting a contact764at a location corresponding to the “see more” affordance738bwithin the second message region732b.FIG. 7Killustrates replacing display of the conversation view730with a message view770for the second message corresponding to the second message region732bin response to selection of the “see more” affordance738c.

As shown inFIG. 7K, the content region731bincludes the contents774of the second message that corresponds to the second message region732b. As shown inFIG. 7K, the header region731aincludes a back affordance716a, which, when activated (e.g., with a contact), causes the message view770to be replaced with the previous view or pane (e.g., the conversation750inFIG. 7J). According to some embodiments, the header region731aalso includes: a next affordance726a, which, when activated (e.g., with a contact), causes a next message from the conversation704ato be displayed within the message view770; and a previous affordance726b, which, when activated (e.g., with a contact), causes a previous message from the conversation704ato be displayed within the message view770.

According to some embodiments, the message view770for the second message corresponding to the second message region732breplaces display of the conversation view730in response to detecting a contact within the header sub-region736aof the second message region732b(not shown). According to some embodiments, the message view770for the second message corresponding to the second message region732breplaces display of the conversation view730in response to detecting a contact within the content sub-region736bof the second message region732b(not shown).

FIGS. 7L-7Pillustrates displaying a dual-pane user interface associated with an electronic mail (email) and/or messaging application that includes a first pane7120and a second pane7110within the display area of the device100. As shown inFIG. 7L, the second pane7110includes a folder view7140for an inbox folder that includes electronic communications to and/or from the user of the device100. For example, the electronic communications include email conversations, email messages, instant message conversations, instant messages, SMSs, MMSs, talk-to-text, and/or the like. In some embodiments, the user of the device100is able to select between different groupings of electronic communications, such as folders, categories, or tags, to replace the inbox folder view7140with a folder view for a different grouping.

As shown inFIG. 7L, the second pane7110includes: a back affordance716a, which, when activated (e.g., with a contact), causes the inbox folder view7140to be replaced with a previous view or pane; and an edit affordance716bfor marking, moving, and archiving electronic communications in the inbox folder. As shown inFIG. 7L, the second pane7110also includes: a filter affordance718a, which, when activated (e.g., with a contact), causes the messages, conversations, and/or bundles associated with the inbox folder to be filtered according to a set of filter criteria or a filter pane to be displayed.

As shown inFIG. 7L, the second pane7110further includes a plurality of rows. In some embodiments, a row represents a plurality of messages (e.g., electronic communications) from the inbox folder that satisfy one or more conversation criteria (e.g., a conversation with one or more messages with similar subjects, content, senders, recipients, and/or the like). In some embodiments, a row represents a single message from the inbox folder.

InFIG. 7L, the first row corresponds to a conversation704a(e.g., with two or more messages). The first row includes: a timestamp of a most recently received message in the conversation704a; the sender(s) of messages in the conversation704a; the subject of the conversation704a(e.g., “Apple Picking”); and a blurb/snapshot of the contents of the conversation704a. InFIG. 7L, the conversation704ais displayed in the foreground or “in focus” as indicated by the vertical orientation of the view mode affordance7111aand the shading of the first row within the second pane7110.

As shown inFIG. 7L, the second row corresponds to a message704b(e.g., a conversation with one message). The second row includes: a timestamp associated with the message704b; the sender of the message704b; the subject of the message704b(e.g., “Sulawesi Weather Reports”); and a blurb/snapshot of the contents of the message704b. InFIG. 7L, the message704bis displayed in the background as indicated by the horizontal orientation of the view mode affordance7111band the non-shading of the second row within the second pane7110.

As shown inFIG. 7L, the third row corresponds to a message704c(e.g., a conversation with one message). The third row includes: a timestamp associated with the message704c; the sender of the message704c; the subject of the message704c(e.g., “Dehydration Machine”); and a blurb/snapshot of the contents of the message704c.

InFIG. 7L, the fourth row corresponds to a conversation704d(e.g., with two or more messages). The fourth row includes: a timestamp of a most recently received message in the conversation704d; the sender(s) of messages in the conversation704d; the subject of the conversation704d(e.g., “Battle of Leyte Gulf”); and a blurb/snapshot of the contents of the conversation704d.

As shown inFIG. 7L, the first pane7120includes a conversation view7150of the conversation704a, which is displayed in the foreground in the second pane7110. InFIG. 7L, the first pane7120includes: a first message region732aassociated with a first message in the conversation704a; a second message region732bassociated with a second message in the conversation704a; and a portion of a third message region732cassociated with a third message in the conversation704a(sometimes collectively referred to as the “message regions732”). For example, if a user scrolls within the first pane7120, the balance of the third message region732cis displayed.

As shown inFIG. 7L, the message regions732include a header sub-region736a, a content sub-region736b, and a bottom sub-region736c. The header sub-region736aincludes the sender of the corresponding message, the recipients of the corresponding message, the folder associated with the corresponding message, a timestamp for the corresponding message, and a “details” affordance738a, which, when activated (e.g., with a contact), causes additional details associated with a corresponding message to be displayed within the header sub-region736a. The content sub-region736bincludes the content of the corresponding message. The bottom sub-region736cincludes: a “see more” affordance738b, which, when activated (e.g., with a contact), causes a message view of the corresponding message to replace display of the conversation view7150within the first pane7120; and an actions affordance738c, which, when activated (e.g., with a contact), causes a first set of one or more affordances to be displayed (e.g., similar toFIG. 7M).

As shown inFIG. 7L, according to some embodiments, a respective dimension (e.g., the height) of each of the message regions732is based on the amount of content for the corresponding message. For example, inFIG. 7L, a respective dimension (e.g., the height) of the first message region732ahas a value733a, and the respective dimension (e.g., the height) of the second message region732bhas a value733b. In this example, the value733bis greater than the value733abecause the first message associated with the first message region732ahas less content (e.g., lines of text) than the second message associated with the second message region732b.

FIGS. 7L-7Millustrate a sequence in which a first set of one or more affordances is displayed within the first pane7120.FIG. 7Lalso illustrates detecting a right-to-left swipe gesture within the first message region732awith a contact7122.FIG. 7Millustrates sliding the first message region732ain a first direction (e.g., right-to-left) in response to detecting the right-to-left swipe gesture inFIG. 7L.FIG. 7Malso illustrates displaying a first action region744adjacent to the first message region732a, including a first set of one or more affordances provided to perform actions on the first message corresponding to the first message region732ain response to detecting the right-to-left swipe gesture inFIG. 7L.

FIG. 7Mis similar to and adapted fromFIG. 7D. As such,FIG. 7DandFIG. 7Minclude similar user interfaces and elements labeled with the same reference number in both figures have the same function, only the differences are described herein for the sake of brevity. As shown inFIG. 7M, the first action region744includes: a reply affordance746a, a move affordance746b, and a trash affordance746c(sometimes referred to collectively as the “affordances746”). In some embodiments, the first action region744includes any number of affordances. In some embodiments, one or more of the affordances746may be replaced with other action options from a preferences menu.

FIGS. 7N-7Oillustrate a sequence in which a second set of one or more affordances is displayed within the first pane7120.FIG. 7Nillustrates detecting a left-to-right swipe gesture within the first message region732awith a contact7130.FIG. 7Iillustrates sliding the first message region732ain a second direction (e.g., left-to-right) in response to detecting the left-to-right swipe gesture inFIG. 7N.FIG. 7Oalso illustrates displaying a second action region760adjacent to the first message region732a, including a second set of one or more affordances provided to perform actions on the first message corresponding to the first message region732ain response to detecting the left-to-right swipe gesture inFIG. 7N.

FIG. 7Nis similar to and adapted fromFIG. 7L. As such,FIG. 7LandFIG. 7Ninclude similar user interfaces and elements labeled with the same reference number in both figures have the same function, only the differences are described herein for the sake of brevity.FIG. 7Ois similar to and adapted fromFIG. 7I. As such,FIG. 7OandFIG. 7Iinclude similar user interfaces and elements labeled with the same reference number in both figures have the same function, only the differences are described herein for the sake of brevity. As shown inFIG. 7O, the second action region760includes an unread affordance762, which, when activated (e.g., with a contact), causes the first message corresponding to the first message region732ato be marked as unread. In some embodiments, the second action region760includes any number of affordances. In some embodiments, the unread affordance762may be replaced with other action options from a preferences menu.

FIGS. 7O-7Pillustrate a sequence in which in which a message view7160replaces display of the conversation view7150within the first pane7120.FIG. 7Ofurther illustrates detecting a contact7142at a location corresponding to the second row within the second pane7120that corresponds to the message704b.FIG. 7Pillustrates replacing display of the conversation view7150within the first pane7120with a message view7160for the message704bin response to selection of the message704bwithin the first pane7120inFIG. 7O.

As shown inFIG. 7P, the message view7160includes the contents7162of the message704b. InFIG. 7P, the conversation704ais displayed in the background as indicated by the horizontal orientation of the view mode affordance7111aand the non-shading of the first row within the second pane7110. InFIG. 7L, the message704bis displayed in the foreground or “in focus” as indicated by the vertical orientation of the view mode affordance7111band the shading of the second row within the second pane7110.

FIGS. 8A-8Cillustrate a flow diagram of a method800of bundling electronic communications in accordance with some embodiments. The method800is performed at an electronic device (e.g., the portable multifunction device100inFIG. 1A, or the device300inFIG. 3) with a one or more processors, non-transitory memory, a display, and an input device. In some embodiments, the display is a touch-screen display and the input device is on or integrated with the display. In some embodiments, the display is separate from the input device. Some operations in method800are, optionally, combined and/or the order of some operations is, optionally, changed.

As described below, the method800provides an intuitive way to bundle electronic communications. The method reduces the cognitive burden on a user when bundling electronic communications, thereby creating a more efficient human-machine interface. For battery-operated electronic devices, enabling a user to bundle electronic communications faster and more efficiently conserves power and increases the time between battery charges.

The device displays (802), on the display, an inbox view of a messaging application that includes a plurality of rows representing electronic communications, the plurality of rows including a first row representing a first plurality of messages that satisfy one or more conversation criteria that indicate that each of the first plurality of messages are a part of a same respective conversation, and a second row representing a second plurality of messages that satisfy a first category criterion but are not part of a same conversation. In some embodiments, the electronic communications include email conversations, email messages, instant message conversations, instant messages, SMSs, MMSs, talk-to-text, and/or the like. In some embodiments, the inbox view corresponds to a grouping of electronic communications such as a first folder (e.g., inbox, drafts, sent, junk, trash, all mail, or a custom folder) or a first tag. In some embodiments, the one or more conversation criteria are satisfied when messages have a same group of participants, a same subject line, similar content, and/or the like.

For example, the second plurality of messages is a bundle of messages that correspond to a first bundling category (e.g., the first category criterion) in a condensed view mode. In some embodiments, the second plurality of messages do not satisfy the one or more conversation criteria. Thus, the second plurality of messages are not part of a same conversation. In some embodiments, a third plurality of messages represented by a third row satisfy a second bundling category (e.g., the second category criterion) but do satisfy neither the one or more conversation criteria nor the first bundling category. In some embodiments, the inbox view includes an arbitrary number of rows. In some embodiments, an arbitrary number of rows among the plurality of rows in the inbox view represent conversations. In some embodiments, an arbitrary number of rows among the plurality of rows in the inbox view represent bundles of messages. As such, according to some embodiments, the inbox view includes rows for both conversations and bundles of messages, which provides the user with a more intuitive and less cluttered interface by reducing the amount of room taken up by bulk messages in the list of messages and enabling the user to see more of the non-bulk messages without scrolling the list of message.

As one example,FIG. 5Ashows a folder view502associated with an inbox folder for an electronic mail (email) and/or messaging application within the display area501of the device100. InFIG. 5A, the inbox folder view502includes a plurality of rows in condensed view mode, including: a first row that corresponds to a conversation504a(e.g., with two messages); a second row that corresponds to a bundle of messages504bthat satisfy an updates criterion515; and a third row that corresponds to a conversation504c(e.g., with a single message).

As another example,FIG. 5Nshows a user interface for an electronic mail (email) and/or messaging application within the display area501of the device100. InFIG. 5N, the user interface includes a folders pane5110and a content pane5120. As shown inFIG. 5N, the folders pane5110includes: a first row that corresponds to a conversation5112a(e.g., with one message); a second row that corresponds to a bundle of messages5112bthat satisfy a travel criterion5115a; a third row that corresponds to a conversation5112c(e.g., with one message); and a fourth row that corresponds to a bundle of messages5112dthat satisfy a fashion criterion5115b.

In some embodiments, the plurality of rows in the inbox view is sorted (804) by date, and the second row representing the plurality of messages is included in the inbox view based on a date of a most recently received message among the plurality of messages. For example, with reference toFIG. 5A, the conversation504arepresented by the first row includes a message with a more recent timestamp than the messages included in the bundle of messages504brepresented by the second row. However, continuing with this example, the bundle of messages504brepresented by the second row includes a message with a more recent timestamp than the message included in the conversation504crepresented by the third row.

In some embodiments, the first category criterion corresponds to (806) one of a sender type of the second plurality of messages or a content type of the second plurality of messages. As one example, with reference toFIG. 5A, messages included in the bundle of messages504bsatisfy the updates criterion515(e.g., messages associated with social media updates, posts, responses, comments, etc.). As another example, with reference toFIG. 5N, messages included in the bundle of messages5112bsatisfy the travel criterion5115a(e.g., messages with content related to travel, hotels, airplane tickets, etc.).

In some embodiments, the first category criterion is a promotions criterion for bulk messages sent by a company en masse that are intended to advertise a product or service. For example, a message from a retailer advertising a suit sale, a message from an airline company advertising a one-day sale on airline fares, and a message from a vacation rental company advertising last minute vacation home rentals are organized into a bundle that satisfies the promotions criterion. In some embodiments, the first category criterion is a newsletters criterion for bulk messages sent by an entity en masse that disseminate periodic information or updates. For example, messages from the dean or administration of a user's school, periodic messages associated with blogs to which the user is subscribed and periodic messages from associations to which the user is a member (e.g., AARP, AAA, bar association, etc.) are organized into a bundle that satisfies the newsletters criterion.

In some embodiments, the first category criterion is a reservations criterion for machine-generated messages associated with an upcoming event for the user. For example, messages associated with an upcoming dinner reservation, an upcoming airplane flight, an upcoming hotel stay, and/or the like are organized into a bundle that satisfies the reservations criterion. In some embodiments, the first category criterion is a purchases criterion for machine-generated messages associated with purchases made by the user. For example, messages associated with online purchases, ride share receipts, shipping notifications, and/or the like are organized into a bundle that satisfies the purchases criterion. In some embodiments, the first category criterion is a finance criterion for machine-generated messages associated with financial accounts or transactions. For example, messages associated with person-to-person payments and payments requests, bills, credit card statements, bank statements, bank transactions, brokerage notifications and prospectuses, and/or the like are organized into a bundle that satisfies the finance criterion.

In some embodiments, the first category criterion is a social activity criterion for machine-generated messages related to activity on social media networks, online dating services, media-sharing services, and/or the like. For example, messages associated with contact/friend requests, postings, comments, personal messages, photo tags, etc. are organized into a bundle that satisfies the social activity criterion. In some embodiments, the first category criterion is a notifications criterion for machine-generated messages associated with updates not covered by other bundling criteria. For example, messages associated with account security such as unidentified login attempts, credit card fraud alerts, password resets, and/or the like are organized into a bundle that satisfies the notifications criterion. In some embodiments, the first category criterion corresponds to bulk/spam email messages.

In some embodiments, the second row is displayed (808) in a condensed view mode prior to detecting the user input. As one example, inFIG. 5A, the second row representing the bundle of messages504bis displayed in the condensed view mode. According to some embodiments, the horizontal orientation of the chevrons associated with the view mode affordance514b, inFIG. 5A, indicate that the second row representing the bundle of messages504bis displayed in the condensed view mode. As another example, inFIG. 5N, the second row in the folders pane5110representing the bundle of messages5112bis displayed in the condensed view mode. According to some embodiments, the horizontal orientation of the chevrons associated with the view mode affordance5114b, inFIG. 5N, indicate that the second row representing the bundle of messages5112bis displayed in the condensed view mode. As such, according to some embodiments, when displayed in the condensed mode, the rows occupy less space while still conveying important information regarding the messages represented by the rows, which provides the user with a more intuitive and less cluttered interface by informing the user of the number and status of the messages in the row, that will help a user decide whether or not to expand the row to view the messages in the row.

In some embodiments, the condensed view mode includes (810) one or more of an indication of the first category, one or more senders of the plurality of messages represented by the second row, an indication of a most recently received message among the plurality of messages represented by the second row (e.g., timestamp and/or blurb), an indication of a count of the plurality of messages represented by the second row, or an indication of a count of the unread messages among the plurality of messages represented by the second row. As one example, inFIG. 5A, the second row representing the bundle of messages504bincludes: a timestamp of a most recently received message in the bundle of messages504b; the sender(s) of messages in the bundle of messages504b; and a messages affordance517indicating the total number of messages included in the bundle of messages504breceived today and the number of unread messages included in the bundle of messages504b. As another example, inFIG. 5N, the second row representing the bundle of messages5112bincludes: a timestamp of a most recently received message in the bundle of messages5112b; the sender(s) of messages in the bundle of messages5112b; and a messages affordance5117aindicating the total number of messages included in the bundle of messages5112breceived today and the number of unread messages included in the bundle of messages5112b.

In some embodiments, the second plurality of messages represented by the second row are not displayed (812) in the inbox view while the second row is displayed in the condensed view mode. For example, while in the condensed view mode inFIG. 5A, the second row representing the bundle of messages504bincludes a timestamp of a most recently received message in the bundle of messages504band at least some of the sender(s) of messages in the bundle of messages504b, but does not include the second plurality of messages.

In some embodiments, the second row includes (814) a view mode affordance provided to toggle between the condensed view mode and an expanded view mode of the second row. As one example, inFIG. 5A, the first row representing the conversation504aincludes a view mode affordance514b, which, when activated (e.g., with a contact), causes the second row to change from the condensed view mode to an expanded view mode (e.g., as shown inFIGS. 5B-5C). Similarly, inFIG. 5A, the second row representing the bundle of messages504bincludes a view mode affordance514b, which, when activated (e.g., with a contact), causes the second row to change from the condensed view mode to an expanded view mode (e.g., as shown inFIGS. 5E-5F). And, inFIG. 5A, the third row representing the conversation504cincludes a view mode affordance514c, which, when activated (e.g., with a contact), causes the third row to change from the condensed view mode to an expanded view mode.

The device detects (816) an input, via the input device, corresponding to selection of a respective row from among the plurality of rows in the inbox view. As one example,FIG. 5Ashows a contact520detected at a location corresponding to the view mode affordance514a. As another example,FIG. 5Dshows a contact550detected at a location corresponding to the view mode affordance514b. As yet another example,FIG. 5Nshows a contact6124detected at a location corresponding to the view mode affordance5114b. As yet another example,FIG. 6Ashows the focus selector603at a location corresponding to the view mode affordance616a.

In response to detecting the input, and in accordance with a determination that the respective row corresponds to the first row, the device displays (820), on the display, additional information corresponding to two or more messages from the conversation of related messages that are represented by the first row. According to some embodiments, the device displays two or messages included in the conversation of related messages. In some embodiments, the two or more messages from the conversation replace the inbox view. In some embodiments, the two or more messages from the conversation are displayed inline in the inbox view. In some embodiments, the two or more messages are displayed in an adjacent content pane. As such, according to some embodiments, the user is able to easily view/access additional information (e.g., an expanded view) corresponding to the first row without unnecessarily cluttering the inbox view.

As one example, inFIG. 5B, the inbox folder view502is replaced with a conversation view532with messages534aand534bincluded in the conversation504ain response to selection of the view mode affordance514ainFIG. 5A. As another example, inFIG. 5C, the messages534aand534bincluded in the conversation504aare displayed inline in the inbox folder view502in response to selection of the view mode affordance514ainFIG. 5A. As yet another example, inFIG. 6B, the content622in the content pane620is replaced with the messages632aand632bincluded in the conversation612ain response to selection of the view mode affordance616ainFIG. 6A.

In response to detecting the input, and in accordance with a determination that the respective row corresponds to the second row, the device displays (822), on the display, additional information corresponding to two or more messages from among the second plurality of messages that are represented by the second row, including a first message and a second message that both satisfy the first category criterion but not part of a same conversation. According to some embodiments, input toggles the view mode of the bundle of messages from a condensed view mode to an expanded view mode. As such, according to some embodiments, the user is able to easily view/access additional information (e.g., an expanded view) corresponding to the second row without unnecessarily cluttering the inbox view. In some embodiments, the first message is part of a first conversation and the second message is part of a second conversation that is different from the first conversation. As such, in some embodiments, the first and second messages are associated with different conversations. In some embodiments, the first and second messages have different senders or participants. In some embodiments, the first and second messages do not include overlapping content.

In some embodiments, the two or more messages included in the bundle of messages replaces the inbox view. In some embodiments, the two or more messages included in the bundle of messages are displayed inline in the inbox view. In some embodiments, the two or more messages included in the bundle of messages are displayed in an adjacent content pane.

As one example, inFIG. 5E, the inbox folder view502is replaced with a bundle view552in response to detecting selection of the view mode affordance514binFIG. 5D. As another example, inFIG. 5F, the messages554a,554b, and554cincluded in the bundle of messages504bare displayed inline in the inbox folder view502in response to detecting selection of the view mode affordance514binFIG. 5D. As another example, inFIG. 5O, the content5122displayed in the content pane5120is replaced with the message5132a, the sub-bundle of messages5132b, and the message5132cincluded in the bundle of messages5112bin response to selection of the view mode affordance5114binFIG. 5N.

In some embodiments, the additional information corresponding to the two or more messages from the conversation of related messages that are represented by the first row is displayed (824) inline in the inbox view, and the additional information corresponding to the two or more messages from among the plurality of messages that are represented by the second row is displayed inline in the inbox view. According to some embodiments, the device maintains display of at least a portion of the first and second rows, and the device displays the additional information as rows in the inbox view. As such, according to some embodiments, the user is able to easily view/access additional information (e.g., an expanded view) corresponding to the second row inline, which provides the user with a more intuitive and less cluttered interface. As one example, inFIG. 5C, the messages534aand534b(e.g., the additional information) included in the conversation504aare displayed inline in the inbox folder view502. As another example, inFIG. 5F, the messages554a,554b, and554c(e.g., the additional information) included in the bundle of messages504bare displayed inline in the inbox folder view502.

In some embodiments, the additional information corresponding to the two or more messages from the conversation of related messages that are represented by the first row replaces display of (826) the inbox view, and the additional information corresponding to the two or more messages from among the plurality of messages that are represented by the second row replaces display of the inbox view. According to some embodiments, the device replaces display of the inbox view with the two or more messages corresponding to the conversation or the two or more messages from the bundle of messages. As such, according to some embodiments, the user is able to easily view/access additional information (e.g., an expanded view) corresponding to the second row in a new interface that replaces the inbox view, which provides the user with a more intuitive and less cluttered interface. As one example, inFIG. 5B, the inbox folder view502is replaced with a conversation view532that includes the messages534aand534b(e.g., the additional information) from the conversation504a. As another example, in Figure inFIG. 5E, the inbox folder view502is replaced with a bundle view552that includes the messages554a,554b, and554c(e.g., the additional information) from the bundle of messages504b.

In some embodiments, the additional information corresponding to the two or more messages from the conversation of related messages that are represented by the first row is displayed (828) in a content pane separate from the inbox view displayed in an inbox pane, and the additional information corresponding to the two or more messages from among the plurality of messages that are represented by the second row is displayed in the content pane separate from the inbox view displayed in the inbox pane. According to some embodiments, the device maintains display of the inbox view in the inbox pane and displays the additional information in the separate content pane. As such, according to some embodiments, the user is able to easily view/access additional information (e.g., an expanded view) corresponding to the second row in a separate content pane, which provides the user with a more intuitive and less cluttered interface. As one example, inFIG. 6B, the device maintains display of the folders pane610and replaces display of the content622in the content pane620with the messages632aand632b(e.g., the additional information) from the conversation612a. As another example, inFIG. 5O, the device maintains display of the folders pane5110and replaces display of the content5122in the content pane5120with the message5132a, the sub-bundle of messages5132b, and the message5132c(e.g., the additional information) from the bundle of messages5112b.

In some embodiments, the two or more messages from among the plurality of messages that are represented by the second row include (830) a subset of the plurality of messages selected based on a predetermined criterion. In some embodiments, the first and second messages are the most recent messages in the second plurality of messages. In some embodiments, the first and second messages are the most recent messages received today. In some embodiments, the first and second messages are the most recent unread messages. some embodiments, the first and second messages are the most recent messages received from VIP contacts (e.g., a list of specific contacts). In some embodiments, the first and second messages are the most recent messages from the user's most frequent contacts.

In some embodiments, the user input corresponds to (832) selection of the view mode affordance, and the second row is displayed in the expanded view mode after detecting the user input. In some embodiments, the expanded view shows a limited number of the second plurality of messages in the bundle of messages based on the category criterion. As one example, inFIG. 5F, the second row representing the bundle of messages504bis displayed in the expanded view mode in response to selection of the view mode affordance514binFIG. 5D. For example, the horizontal orientation of the chevrons associated with the view mode affordance514binFIG. 5Dindicate that the second row representing the bundle of messages504bis displayed in the condensed view mode, and the vertical orientation of the chevrons associated with view mode affordance514binFIG. 5Findicate that the second row representing the bundle of messages504bis displayed in the expanded view mode.

As another example, inFIG. 5O, the second row representing the bundle of messages5112bis displayed in the expanded view mode in response to selection of the view mode affordance5114binFIG. 5N. For example, the horizontal orientation of the chevrons associated with the view mode affordance5114binFIG. 5Nindicate that the second row representing the bundle of messages5112bis displayed in the condensed view mode, and the vertical orientation of the chevrons associated with view mode affordance5114binFIG. 5Oindicate that the second row representing the bundle of messages5112bis displayed in the expanded view mode.

In some embodiments, the expanded view mode includes (834) an affordance provided to display the plurality of messages different from the two or more messages. In some embodiments, the expanded view of the bundle of messages represented by the second row includes: X unread messages or the X most recent messages, and an affordance for viewing all messages include in bundle of messages. In some embodiments, the expanded view mode shows a limited number of the second plurality of messages, and the balance of the second plurality of the messages are viewable by selecting the affordance. In some embodiments, the two or more messages include the second plurality of messages.

As one example, inFIG. 5E, the bundle view552includes a messages affordance517, which, when activated (e.g., with a contact), causes display of the unread messages included in the bundle of messages504bor all messages included in the bundle of messages504b. As another example, inFIG. 5F, the messages affordance517is displayed in the inbox folder view502.

As yet another example, inFIG. 5O, the content pane5120includes a messages affordance5117a, which, when activated (e.g., with a contact), causes display of the unread messages included in the bundle of messages5112bor all messages included in the bundle of messages5112b. Continuing with this example, inFIG. 5P, the content pane5120displays all messages included in the bundle of message5112bin response to selection of the messages affordance5117ainFIG. 5O.

In some embodiments, the expanded view of the bundle of messages represented by the second row includes: X unread or the X most recent messages, an affordance for viewing all messages include in bundle of messages, and a sub-bundle associated with a sub-category criterion in a condensed view. As one example, inFIG. 5Q, a row representing a sub-bundle of messages5132bthat satisfy the travel criterion5115aand also a Europe sub-criterion5131(e.g., messages with content related to European travel, hotels, airplane tickets, etc.) is displayed inline in the folders pane5110. Continuing with this example, inFIG. 5R, additional information (e.g., the conversations/messages5142aand5142b) for the sub-bundle of messages5132bis displayed inline in the inbox folder pane5110and the content5144for the conversation/message5142ais displayed in the content pane5120in response to selection of the view mode affordance5134binFIG. 5Q. For example, the horizontal orientation of the chevrons associated with the view mode affordance5134binFIG. 5Qindicate that the row representing the sub-bundle of messages5132bis displayed in the condensed view mode, and the vertical orientation of the chevrons associated with view mode affordance5134binFIG. 5Rindicate that the second row representing the sub-bundle of messages5132bis displayed in the expanded view mode.

In some embodiments, the inbox view of the messaging application includes (836) a third row representing a third plurality of messages that satisfy a second category criterion different from the first category criterion. In some embodiments, the second category criterion corresponds to one of a sender type of the third plurality of messages or a content type of the third plurality of messages. For example,FIG. 5Nshows a user interface for an electronic mail (email) and/or messaging application within the display area501of the device100. InFIG. 5N, the user interface includes a folders pane5110and a content pane5120. As shown inFIG. 5N, the folders pane5110includes: a first row that corresponds to a conversation5112a(e.g., with one message); a second row that corresponds to a bundle of messages5112bthat satisfy a travel criterion5115a(e.g., the first category criterion also herein called the first bundling criteria); a third row that corresponds to a conversation5112c(e.g., with one message); and a fourth row that corresponds to a bundle of messages5112dthat satisfy a fashion criterion5115b(e.g., the second category criterion also herein called the second bundling criteria).

In some embodiments, the inbox view is included in an inbox pane, and the device displays (838), on the display, a content pane adjacent to the inbox pane, where the content pane includes information associated with the conversation of related messages represented by the first row or the plurality of messages represented by the second row. For example,FIG. 5Qshows a user interface for an electronic mail (email) and/or messaging application within the display area501of the device100. InFIG. 5Q, the user interface includes a folders pane5110and a content pane5120. As shown inFIG. 5N, the folders pane5110corresponds to an inbox folder that includes electronic communications to and/or from the user of the device100. InFIG. 5Q, the folders pane5110includes a second row that corresponds to a bundle of messages5112bthat satisfy the travel criterion5115a, and the content pane5120includes content5138for the conversation/message5132aincluded in the bundle of messages5112b.

In some embodiments, the content pane includes (840) an indication that the information included in the content pane corresponds to the plurality of messages that do not meet the one or more conversation criteria represented by the second row. In some embodiments, the content pane includes a badge corresponding to the bundling category. In some embodiments, the content pane includes a stack of overlapping messages from the bundle of messages. For example, inFIG. 5Q, the content pane5120includes an indicator (e.g., a badge or text description) of the travel criterion5115a. For example, inFIG. 5Q, the conversation5132ais displayed as a top message in a stack of messages5139associated with the bundle of messages5112bthat satisfy the travel criterion5115a.

In some embodiments, the information included in the content pane has (842) a different appearance for the plurality of messages that do not meet the one or more conversation criteria (e.g., stacked and obscuring each other), the conversation of related messages (e.g., displayed adjacent to each other and separated by message delimiters such as spaces or borders), and a message (e.g., displayed by itself). As one example, inFIG. 5Q, the messages/conversations associated with the bundle of messages5112bare displayed in a stack of messages5139in the content pane5120with the content5138of the conversation5132adisplayed on the top of the stack of messages5139. As another example, inFIG. 6B, rows representing the messages634aand634bincluded in the conversation612aare displayed in the content pane620. As yet example, inFIG. 5N, the content5122of the messages/conversation5122ais displayed in the content pane5120.

It should be understood that the particular order in which the operations inFIGS. 8A-8Chave been described is merely example and is not intended to indicate that the described order is the only order in which the operations could be performed. One of ordinary skill in the art would recognize various ways to reorder the operations described herein. Additionally, it should be noted that details of other processes described herein with respect to other methods described herein (e.g., methods900and1000) are also applicable in an analogous manner to method800described above with respect toFIGS. 8A-8C. For example, the contacts, gestures, user interface objects, and focus selectors described above with reference to method800optionally have one or more of the characteristics of the contacts, gestures, user interface objects, and focus selectors described herein with reference to other methods described herein (e.g., methods900and1000). For brevity, these details are not repeated here.

FIGS. 9A-9Cillustrate a flow diagram of a method900of filtering electronic communications in accordance with some embodiments. The method900is performed at an electronic device (e.g., the portable multifunction device100inFIG. 1A, or the device300inFIG. 3) with a one or more processors, non-transitory memory, a display, and an input device. In some embodiments, the display is a touch-screen display and the input device is on or integrated with the display. In some embodiments, the display is separate from the input device. Some operations in method900are, optionally, combined and/or the order of some operations is, optionally, changed.

As described below, the method900provides an intuitive way to filter electronic communications. The method reduces the cognitive burden on a user when filtering electronic communications, thereby creating a more efficient human-machine interface. For battery-operated electronic devices, enabling a user to filter electronic communications faster and more efficiently conserves power and increases the time between battery charges.

The device concurrently displays (902), on the display, a plurality of representations of electronic communications associated with a first grouping (e.g., a first folder or first tag), and a filter affordance (e.g., a filter icon within a portion of a title bar or chrome region) that corresponds to a set of one or more filter criteria. In some embodiments, the electronic communications include email conversations, email messages, instant message conversations, instant messages, SMSs, MMSs, talk-to-text, and/or the like.

As one example,FIG. 5Ashows a folder view502associated with an inbox folder for an electronic mail (email) and/or messaging application within the display area501of the device100. InFIG. 5A, the inbox folder view502includes a plurality of rows representing a conversation504a(e.g., with two messages), a bundle of messages504bthat satisfy an updates criterion515, a conversation504c(e.g., with a single message), and a conversation504d(e.g., with a single message). InFIG. 5A, the inbox folder view502also includes a filter affordance518a.

As another example,FIG. 5Nshows a user interface for an electronic mail (email) and/or messaging application within the display area501of the device100. InFIG. 5N, the user interface includes a folders pane5110and a content pane5120. As shown inFIG. 5N, the folders pane5110includes rows representing a conversation5112a(e.g., with one message), a bundle of messages5112bthat satisfy a travel criterion5115a, a conversation5112c(e.g., with one message), and a bundle of messages5112dthat satisfy a fashion criterion5115b. InFIG. 5N, the folders pane5110also includes the filter affordance518a. As shown inFIG. 5N, the content pane5120includes content5122for the conversation5112a.

As yet another example,FIG. 6Ashows a window602for an electronic mail (email) and/or messaging application within the display area601that includes a folders pane610and a content pane620. As shown inFIG. 6A, the folders pane610includes rows representing a conversation612a(e.g., with two or more messages), a conversation612b(e.g., with one message), a conversation612c(e.g., with one message), a conversation612d(e.g., with one message), a conversation612e(e.g., with one message), and a conversation612a(e.g., with one message) (partially occluded). InFIG. 6A, the folders pane610also includes the filter affordance616b. As shown inFIG. 6A, the content pane620includes content622for the conversation612b.

In some embodiments, satisfying a respective criterion from among the set of one or more filter criteria includes (904) determining that electronic communications associated with the second set of representations of electronic communications are categorized as important based on past user actions with electronic communications. In some embodiments, a message is automatically categorized or identified as important when the message is sent by a VIP sender (e.g., a sender on a list of specified senders) or the user frequently communicates with the sender. In some embodiments, a message is automatically categorized or identified as important when the message is starred or marked as an urgent message. In some embodiments, a message is automatically categorized or identified as important when the message is sent in reply to a starred or urgent message. In some embodiments, a message is automatically categorized or identified as important when the message is sent directly or only to the user (e.g., the message is not a bulk/spam message and the message is not associated with a list server or a subscription). In some embodiments, a message is automatically categorized or identified as important when the message has a subject or content that includes one or more words that match a list of predefined words (e.g., urgent, important, time sensitive, etc.). As one example, inFIG. 5I, the filters pane582includes the important filter586b. As another example, inFIG. 6C, the filters menu640includes the important filter642b.

While concurrently displaying the plurality of representations of electronic communications and the filter affordance, the device detects (906) a selection input, via the input device, that corresponds to selection of the filter affordance. As one example,FIG. 5Hshows selection of the filter affordance518awith a contact580. As another example,FIG. 5Kshows selection of the filter affordance518awith a contact596.

In response to detecting the selection input, and in accordance with a determination that the selection input corresponds to a first input type (e.g., a one finger tap, a one finger light press gesture, a single click with a focus selector, or the like), the device (908): ceases to display a first set of representations of electronic communications (e.g., the first set representations corresponds to one or more electronic communications) from among the plurality of representations of electronic communications associated with the first grouping that do not match the set of one or more filter criteria; displays a second set of representations of electronic communications (e.g., the second set representations corresponds to one or more electronic communications) from among the plurality of representations of electronic communications associated with the first grouping that match the set of one or more filter criteria; and displays an indication of the set of one or more filter criteria that have been applied to the electronic communications associated with the first grouping. As such, according to some embodiments, the user is able to quickly filter the first grouping to provide a more tailored interface that is less cluttered and includes more of the messages that the user wants to see and fewer of the messages that the user has elected to filter out, while still providing the user with a simple way to view the messages that have been filtered out.

In some embodiments, ceasing to display the first set of representations includes eliding a subset of the previously displayed plurality of representations of electronic communications associated with the first grouping that do not match the set of one or more filter criteria. In some embodiments, displaying the second set of representations includes maintaining display of a subset of the previously displayed plurality of representations of electronic communications associated with the first grouping that match the filter criteria. In some embodiments, the set of one or more filter criteria will continue to apply to the first grouping until the user of the device again selects the filter affordance to toggle off the set of one or more filter criteria. For example, the set of one or more filter criteria will continue to apply even if the user of the device selects a second grouping.

As one example,FIG. 5Lshows the filtered inbox folder view5114in response to the selection input of the filter affordance518ainFIG. 5Kthat corresponds to the first input type (e.g., a one finger tap gesture). According to some embodiments, each of the rows in the filtered inbox folder view5114inFIG. 5Lrepresents one or more messages (e.g., a bundle of messages, or a conversation with a single message or a plurality of messages) that satisfy the set of filter criteria (e.g., the important filter586band the unread filter586e).

As another example,FIG. 6Dshows the filtered inbox folder in the folders pane610in response to the selection input of the filter affordance616binFIG. 6Bthat corresponds to the first input type (e.g., a single click with the focus selector603). According to some embodiments, each of the rows of the filtered inbox folder within the folders pane610inFIG. 6Drepresents a conversation that satisfies the set of filter criteria (e.g., the flagged filter642d).

In some embodiments, the indication of the set of one or more filter criteria includes (910) a description of the set of one or more filter criteria adjacent to the filter affordance. In some embodiments, the indication includes a text description of the set of filters applied to the current folder as shown inFIGS. 5L and 6D. In some embodiments, the indication includes one or more distinct icons for t the set of filters applied to the current folder. As one example, inFIG. 5L, the filtered inbox folder view5114includes an indication598of the set of filters applied to the current folder (e.g., the important filter586band the unread filter586e). As another example, inFIG. 6D, the filter affordance616bincludes an indication of the set of filters applied to the current folder (e.g., the flagged filter642d). As such, according to some embodiments, the user is able to keep track of the filter(s) applied to the first grouping and is alerted to the fact that a filter has been applied to the current view.

In some embodiments, the set of one or more filter criteria includes (912) two or more filter criteria. For example, inFIG. 5L, the filtered inbox folder view5114corresponds to the important filter586band the unread filter586ebeing applied to the inbox folder.

In some embodiments, the second set of representations of electronic communications that match the set of one or more filter criteria are ordered (914) based on how many of the two or more filter criteria the corresponding electronic communications match. According to some embodiments, when the set of filter criteria includes two filters, electronic communications that match two criteria are sorted before electronic communications that match only one of the two filter criteria. For example, the second set of representations of electronic communications includes: a first subset of representations with electronic communications that match Filter A AND Filter B; a second subset of representations with electronic communications that match Filter A ANDNOT Filter B; and a third subset of representations with electronic communications that match Filter B ANDNOT Filter A. In this example, the second set of representations is sorted such that the first subset of representations is displayed before the second subset of representations, which is displayed before the third subset of representations.

In some embodiments, the second set of representations of electronic communications that match the set of one or more filter criteria are displayed in an inbox pane, and the device concurrently displays (916), on the display, a content pane adjacent to the inbox pane, where the content pane includes information corresponding to a respective electronic communication that matches the set of one or more filter criteria. For example,FIG. 6Dshows the filtered inbox folder in the folders pane610and the content652for the conversation612cincluded in the filtered inbox folder displayed in the content pane620in response to the selection input of the filter affordance616binFIG. 6Bthat corresponds to the first input type (e.g., a single click with the focus selector603).

In some embodiments, in response to detecting the selection input, and in accordance with a determination that the selection input corresponds to the first input type, the device displays (918), on the display, an indication of a portion of the first set of representations of electronic communications that have been elided, where the indication is displayed between first and second subsets of the second set of representations of electronic communications. As one example,FIG. 5Lshows an expansion affordance5102athat separates the conversation504athe conversation504fwithin the filtered inbox view5114. For example, the first set of one or more messages are elided due to not satisfying the set of filter criteria. As another example,FIG. 6Dshows an expansion affordance654above the conversation612cin the folders pane610associated with the filter inbox folder. For example, the set of one or more messages are elided due to not satisfying the set of filter criteria (e.g., the flagged filter642d). As such, according to some embodiments, the expansion affordance provides a visual queue of electronic communications that have been elided in a non-obtrusive manner.

In some embodiments, displaying the second set of representations of electronic communications from among the plurality of representations of electronic communications associated with the first grouping that match the set of one or more filter criteria includes (920): displaying a first subset of representations of electronic communications that match the set of one or more filter criteria and a second subset of representations of electronic communications that match the set of one or more filter criteria from among the plurality of representations of electronic communications associated with the first grouping; and displaying an expansion affordance between and adjacent to the first and second subsets of representations of electronic communications, where the expansion affordance is provided to display a portion of the first set of representations of electronic communications that do not match the set of one or more filter criteria. As one example,FIG. 5Lshows an expansion affordance5102athat separates the conversation504athe conversation504fwithin the filtered inbox view5114. According to some embodiments, the expansion affordance5102aindicates that a first set of one or more messages with timestamps between the timestamp associated with the conversation504aand the timestamp associated with the conversation504fhave been elided. For example, the first set of one or more messages are elided due to not satisfying the set of filter criteria. When activated (e.g., with a contact), the expansion affordance5102acauses the first set of one or more elided messages to be displayed between the conversation504aand the conversation504f. As such, according to some embodiments, the user is able to quickly view representations of electronic communications that have been elided in a non-obtrusive manner.

As another example,FIG. 6Dshows an expansion affordance654above the conversation612cin the folders pane610associated with the filter inbox folder. According to some embodiments, the expansion affordance654indicates that a set of one or more messages with timestamps before the timestamp associated with the conversation612chave been elided. For example, the set of one or more messages are elided due to not satisfying the set of filter criteria (e.g., the flagged filter642d). When activated (e.g., with the focus selector603), the expansion affordance654causes the set of one or more elided messages to be displayed above the conversation612c.

In some embodiments, electronic communications in the portion of the first set of representations of electronic communications that do not match the set of one or more filter criteria are associated (922) with timestamps between timestamps associated with electronic communications in the first and second subsets of representations of electronic communications that match the one or more filter criteria. As one example,FIG. 5Lshows an expansion affordance5102athat separates the conversation504athe conversation504fwithin the filtered inbox view5114. According to some embodiments, the expansion affordance5102aindicates that a first set of one or more messages with timestamps between the timestamp associated with the conversation504aand the timestamp associated with the conversation504fhave been elided.

In some embodiments, the device (924): detects a second selection input that corresponds to selection of the expansion affordance; and, in response to detecting the second selection input, replaces display of the expansion affordance, on the display, with the portion of the first set of representations of electronic communications that do not match the set of one or more filter criteria, where the portion of the first set of representations of electronic communications that do not match the set of one or more filter criteria are displayed between and adjacent to the first and second subsets of representations of electronic communications that match the one or more filter criteria. According to some embodiments, selection of the expansion affordance causes a group of elided messages with timestamps between the first and second subsets of representations that match the filter criteria to be displayed. As such, according to some embodiments, the user is able to quickly view representations of electronic communications that have been elided in a non-obtrusive manner. For example,FIG. 5Mshows a first set of elided messages displayed in the filtered inbox view5114in response to selection of the expansion affordance5102ainFIG. 5L. As shown inFIG. 5M, the first set of elided messages corresponding to the conversations504e,504c, and504dthat do not match the filter criteria is displayed between the conversations504aand504fthat match the filter criteria.

In some embodiments, selection of the expansion affordance causes a group of elided messages with timestamps before the second set of representations of electronic communications that match the filter criteria to be displayed. For example, inFIG. 6D, the expansion affordance654is displayed above the conversation612cin the folders pane610associated with the filtered inbox folder. In this example, selection of the expansion affordance654would cause elided messages with timestamps before the conversation612cto be displayed above the conversation612cwithin the folders pane610. In some embodiments, selection of the expansion affordance causes a group of elided messages with timestamps after the second set of representations of electronic communications that match the filter criteria to be displayed. For example, inFIG. 6E, the expansion affordance666is displayed above the conversation662din the folders pane610associated with the filtered folder A. In this example, selection of the expansion affordance666would cause elided messages with timestamps after the conversation662dto be displayed below the conversation662dwithin the folders pane610.

In some embodiments, in response to detecting the selection input, and in accordance with a determination that the selection input corresponds to a second input type (e.g., a one finger long press gesture, a one finger deep press gesture, a double click with a focus selector, or the like), the device displays (926), on the display, a filter selection menu overlaid on the plurality of representations of electronic communications associated with the first grouping. As such, according to some embodiments, the user is able to quickly change the filter criteria from within the current inbox view. As one example,FIG. 5Ishows the filters pane582replacing display of the inbox folder view502in response to the selection input of the filter affordance518ainFIG. 5Hthat corresponds to the second input type (e.g., a one finger long press gesture). According to some embodiments, the filters pane582replaces display of the inbox folder view502when a one finger long press gesture is detected over the filter affordance518awhile the set of filter criteria are active (e.g., currently applied to the inbox folder).

As another example,FIG. 6Cshows the filters menu640overlaid on the window602in response to selection input of the filter affordance616binFIG. 6Bthat corresponds to the second input type (e.g., a double click with the focus selector603). According to some embodiments, the filters menu640is overlaid on the window602when a one finger long press gesture is detected over the filter affordance616bwhile the set of filter criteria are active (e.g., currently applied to the inbox folder).

In some embodiments, the filter selection menu is provided (928) to at least one of enable or disable one or more filters among a plurality of filters included in the filter menu. In some embodiments, the filter selection menu enables the user is able to turn enable or disable any of the filters in the filter menu. For example, inFIG. 5H, the filters pane582includes: an inbox filter586a, an important filter586b, a VIP filter586c, a flagged filter586d, an unread filter586e, a “To or CC” filter586f, and an attachments filter586g.FIGS. 5I-5.1also show a sequence in which the filter criteria are changed to include the important filter586bin addition to the unread filter586e. As shown inFIG. 5I, the set of filter criteria includes the important filter586band the unread filter586eas indicated by the icons588aand588b.

In another example, inFIG. 6C, the filters menu640includes: an inbox filter642a, an important filter642b, a VIP filter642c, a flagged filter642d, an unread filter642e, a “To or CC” filter642f, and an attachments filter642g. As shown inFIG. 6C, the set of filter criteria includes the flagged filter642das indicated by the icon646aassociated with the unread filter642e.

In some embodiments, the filter selection menu includes (930) an affordance provided to add a custom filter to the plurality of filters included in the filter menu. As one example, the filters pane582inFIGS. 5I-5Jincludes also includes a create custom filter affordance590for creating and adding a custom filter to the filter pane582. As another example, the filters menu640inFIG. 6Calso includes a create custom filter affordance644for creating and adding a custom filter to the filters menu640.

In some embodiments, after detecting the selection input, the device detects (932) a sequence of one or more user inputs, via the input device, that correspond to displaying a second plurality of representations of electronic communications associated with a second grouping, and, in response to detecting the sequence of one or more user inputs, the device displays, on the display, a third set of representations of electronic communications from among the second plurality of representations of electronic communications associated with the second grouping that match the set of one or more filter criteria and the indication of the set of one or more filter criteria that have been applied to the electronic communications associated with the second grouping. InFIG. 6D, the set of filter criteria (e.g., the flagged filter642d) is applied to the inbox folder (e.g., the filtered inbox folder is displayed in the folders pane610). For example, a user changes the grouping (e.g., via the sequence of one or more user inputs) from the inbox folder to the folder A. Continuing with this example,FIG. 6Eshows the set of filter criteria (e.g., the flagged filter642d) applied to the folder A (e.g., the filtered folder A is displayed in the folders pane610). As such, when the set of filter criteria are applied to a first grouping and the grouping changes from the first grouping to a second grouping, the set of filter criteria are also applied to the second grouping. This, for example, allows the user to maintain the filter criteria when switching between groupings.

In some embodiments, while displaying the third set of representations of electronic communications, the device detects (934) a second selection input, via the input device, that corresponds to selection of the filter affordance, and, in response to detecting the second selection input, and in accordance with a determination that the selection input corresponds to the first input type, the device concurrently displays, on the display, the third set of representations of electronic communications from among the second plurality of representations of electronic communications associated with the second grouping that match the set of one or more filter criteria and a fourth set of representations of electronic communications from among the second plurality of representations of electronic communications associated with the second grouping that do not match the set of one or more filter criteria. According to some embodiments, when the set of filter criteria are currently active, the set of filter criteria are deactivated by a selection input of the filter affordance that corresponds to the first input type (e.g., a one finger tap gesture, a one finger light press gesture, a single click with a focus selector, or the like). As such, according to some embodiments, the user is able to quickly toggle on/off the application of the filter criteria to the current grouping.

For example, the set of filter criteria are no longer applied to the folder A andFIG. 6Fshows the (unfiltered) folder A in the folders pane610in response to selection input of the filter affordance616binFIG. 6Ethat corresponds to the first input type (e.g., a single click with the focus selector603). As shown inFIG. 6F, the filter affordance616bindicates that no filters are currently applied to folder A, as compared toFIG. 6Ewhere the flagged filter642dis applied to folder A.

It should be understood that the particular order in which the operations inFIGS. 9A-9Chave been described is merely example and is not intended to indicate that the described order is the only order in which the operations could be performed. One of ordinary skill in the art would recognize various ways to reorder the operations described herein. Additionally, it should be noted that details of other processes described herein with respect to other methods described herein (e.g., methods800and1000) are also applicable in an analogous manner to method900described above with respect toFIGS. 9A-9C. For example, the contacts, gestures, user interface objects, and focus selectors described above with reference to method900optionally have one or more of the characteristics of the contacts, gestures, user interface objects, and focus selectors described herein with reference to other methods described herein (e.g., methods800and1000). For brevity, these details are not repeated here.

FIGS. 10A-10Cillustrate a flow diagram of a method1000of displaying affordances for performing corresponding actions within a conversation view in accordance with some embodiments. The method1000is performed at an electronic device (e.g., the portable multifunction device100inFIG. 1A, or the device300inFIG. 3) with a one or more processors, non-transitory memory, a display, and an input device. In some embodiments, the display is a touch-screen display and the input device is on or integrated with the display. In some embodiments, the display is separate from the input device. Some operations in method1000are, optionally, combined and/or the order of some operations is, optionally, changed.

As described below, the method1000provides an intuitive way to display affordances for performing corresponding actions within a conversation view. The method reduces the cognitive burden on a user when displaying affordances for performing corresponding actions within a conversation view, thereby creating a more efficient human-machine interface. For battery-operated electronic devices, enabling a user to display affordances for performing corresponding actions within a conversation view faster and more efficiently conserves power and increases the time between battery charges.

The device displays (1002), on the display, a conversation view of a plurality of messages within a first pane of a messaging application, where the conversation view includes a first message region of a portion of a first message of the plurality of messages and a second message region of a portion of a second message of the plurality of messages. In some embodiments, the plurality of messages in the conversation satisfy one or more conversation criteria (e.g., similar participants, subject, content, etc.). In some embodiments, the user is able to scroll within the conversation view to view, for example, a third message region associated with a third message included in the conversation. In some embodiments, when the second message region is partially occluded, the user is able to scroll within the conversation view to view the balance of the second message region. As such, in this example, the entirety of the first message region is displayed within the conversation view, and a portion of the second message is displayed in the conversation view with the remainder occluded. For example, the first and second message regions include a preview or snippet of the associated messages.

FIG. 7B, for example, shows a conversation view730(e.g., associated with the conversation704ainFIG. 7A) displayed within the display area of the device100. As shown inFIG. 7B, the conversation view730includes: a header region731a, a content region731b, a toolbar region731c, and a subject bar734. InFIG. 7B, the content region731bincludes: a first message region732aassociated with a first message in the conversation704a; a second message region732bassociated with a second message in the conversation704a; and a portion of a third message region732cassociated with a third message in the conversation704a(sometimes collectively referred to as the “message regions732”). For example, if a user scrolls the conversation view730, the balance of the third message region732cis displayed within the content region731b. For example,FIGS. 7B-7Cshow a sequence in which the user scrolls within the conversation view730in response to detecting an upward swipe gesture inFIG. 7B.

In some embodiments, the conversation view includes (1004) a toolbar region including a plurality of affordances provided to perform corresponding actions on a most recent message among the plurality of messages. In some embodiments, the messages within the conversation view are sorted in reverse chronological order. As such, inFIG. 7B, for example, the first message associated with the message region732ais the most recent message in the conversation704a. In some embodiments, the messages within the conversation view are sorted in chronological order. As such, inFIG. 7B, for example, the first message associated with the message region732ais the oldest message in the conversation704a. According to some embodiments, with reference toFIGS. 7A-7K, the toolbar region731cincludes: a flag affordance728afor flagging a respective message in the conversation704a; a move folder affordance728bfor moving the respective message in the conversation704afrom the inbox folder to another folder; an archive affordance728cfor archiving the respective message in the conversation704a; a reply affordance728dfor replying to or forwarding the respective message in the conversation704a; and a draft affordance728efor drafting a new message. In some embodiments, the respective message is the most recent message within the conversation704a. In some embodiments, the respective message is the top-most message that is fully displayed within the conversation view730.

In some embodiments, a respective dimension (e.g., the height) of the first message region is (1006) based at least in part on an amount of content associated with the first message, and a respective dimension (e.g., the height) of the second message region is based at least in part on an amount of content associated with the second message. As shown inFIG. 7B, according to some embodiments, a respective dimension (e.g., the height) of each of the message regions732is based on the amount of content for the corresponding message. For example, inFIG. 7B, a respective dimension (e.g., the height) of the first message region732ahas a value733a, and the respective dimension (e.g., the height) of the second message region732bhas a value733b. In this example, the value733bis greater than the value733abecause the first message associated with the first message region732ahas less content (e.g., lines of text) than the second message associated with the second message region732b.

In some embodiments, the device displays (1008), on the display, a list view including a plurality of rows representing a plurality of conversations in a second pane adjacent to the first pane that includes the conversation view. For example, the plurality of conversations corresponds to a particular grouping such as a specified mailbox, folder, or tag. In some embodiments, the list view and the conversation view are concurrently displayed side-by-side to enable the user to select between different conversations to be shown in the conversation view. As such, for example, the device100displays a second pane with a list of conversations adjacent to a first pane including a conversation view corresponding to a conversation selected within the list of conversations.

FIGS. 7L-7P, for example show a dual-pane user interface associated with an electronic mail (email) and/or messaging application that includes a first pane7120and a second pane7110displayed within the display area of the device100. InFIG. 7L, for example, the second pane7110includes a folder view7140for an inbox folder. As shown inFIG. 7L, the inbox folder view7140includes a plurality of rows representing conversation704a, message704b, message704c, and conversation704dwithin the inbox folder. InFIG. 7L, the conversation704ais displayed in the foreground or “in focus” as indicated by the vertical orientation of the view mode affordance7111aand the shading of the first row within the second pane7110. InFIG. 7L, for example, the first pane7120includes a conversation view7150of the conversation704a, which is displayed in the foreground in the second pane7110.

The device detects (1010) a user input, via the input device, that corresponds to selecting the first message region within the conversation view. As one example,FIG. 7Eshows a right-to-left swipe gesture within the second message region732b. As another example,FIG. 7Hshows a left-to-right swipe gesture within the second message region732b. As yet another example,FIG. 7Jshows a contact764selecting the “see more” affordance738bwithin the second message region732b.

In response to detecting the user input selecting the first message region, and in accordance with a determination that the user input satisfies a first set of input criteria (e.g., a horizontal swipe within the message, selection of an actions affordance within the message region, or the like), the device displays (1012), on the display, one or more affordances provided to perform corresponding actions on the first message. In some embodiments, the first set of input criteria is satisfied when an actions affordance is selected within the first message region. In some embodiments, the first set of input criteria is satisfied when a horizontal swipe is detected within the first message region. As such, according to some embodiments, the user is able to quickly access options for performing actions on a message from within the conversation view, which saves the user time and effort and also conserves power.

As one example,FIGS. 7C-7Dshows a sequence in which a first set of affordances746a,746b, and746cis displayed within a first action region744in response to selection of the actions affordance738cwithin the second message region732binFIG. 7C. As another example,FIGS. 7E-7Fshow sequence in which the first set of affordances746a,746b, and746cis displayed within a first action region744in response to detecting the right-to-left swipe gesture within the second message region732binFIG. 7E. As yet another example,FIGS. 7H-7Ishow a sequence in which in which a second set of one or more affordances including the affordance762is displayed within the second action region760in response to detecting the left-to-right swipe gesture within the second message region732binFIG. 7H.

In some embodiments, satisfying the first input criteria includes (1014) detecting a horizontal swipe gesture within the first message region associated with a magnitude that is less than a threshold distance. In some embodiments, the first set of input criteria is satisfied when a horizontal swipe that is less than a threshold distance is detected within the first message region. For example, a left-to-right or a right-to-left swipe gesture with a magnitude less than 33%, 50%, 100%, etc. of the width of the message region. As one example,FIGS. 7E-7Fshow a sequence in which the first set of affordances746a,746b, and746cis displayed within the conversation view730in response to detecting the right-to-left swipe gesture with a magnitude that is less than the threshold distance within the second message region732binFIG. 7E. As another example,FIGS. 7H-7Ishow a sequence in which in which the second set of one or more affordances including the affordance762is displayed within the conversation view730in response to detecting the left-to-right swipe gesture with a magnitude that is less than the threshold distance within the second message region732binFIG. 7H.

In some embodiments, satisfying the first input criteria includes (1016) detecting a user input that corresponds to selecting an actions affordance within the first message region. For example,FIGS. 7C-7Dshows a sequence in which the first set of affordances746a,746b, and746cis displayed within the conversation view730in response to selection of the actions affordance738cwithin the second message region732binFIG. 7C.

In some embodiments, displaying the one or more affordances includes (1018): in accordance with a determination that the user input is associated with a first direction (e.g., right-to-left): displaying, on the display, a first set of one or more affordances adjacent to a first side of the message region, where the first set of one or more affordances is provided to perform corresponding actions on the first message; and sliding the first message region in the first direction, where at least a portion of first message region associated with a second side of the first message region opposite the first side is occluded. As one example, if an actions affordance is selected within the first message region, a first set of one or more affordances including reply, move, and trash is slid in from the right edge of the conversation view and the first message region is proportionately slid left with a portion being occluded (e.g., as shown inFIGS. 7C-7D). As another example, if a right-to-left swipe gesture is detected within the first message region, a first set of one or more affordances including reply, move, and trash is slid in from the right edge of the conversation view and the first message region is proportionately slid left with a portion being occluded (e.g., as shown inFIGS. 7E-7FandFIG. 7L-7M). In some embodiments, one or more of the first set of one or more affordances is customizable. In one example, the rightmost or middle affordance is customizable. As such, according to some embodiments, the user is able to quickly access a first set of one or more options from within the conversation view, which saves the user time and effort and also conserves power.

In some embodiments, the device (1020): detects a subsequent user input, via the input device, that corresponds to selecting a respective affordance from among the first set of one or more affordances; and, in response to detecting the subsequent user input selecting the respective affordance, displays, on the display, one or more options associated with the action that corresponds to the respective affordance. For example, the subsequent user input corresponds to a one finger tap gesture, a two finger tap gesture, a vertical swipe gesture, or the like over the respective affordance. As one example, if the user selects a reply affordance, a menu of reply options (e.g., reply, reply all, forward, and/or the like) slides up from the bottom edge of the display area (e.g., as shown inFIGS. 7F-7G).

In some embodiments, displaying the one or more affordances includes (1022): in accordance with a determination that the user input is associated with a second direction (e.g., left-to-right): displaying, on the display, a second set of one or more affordances adjacent to a second side of the message region, where the second set of one or more affordances is provided to perform corresponding actions on the first message; and sliding the first message region in the second direction, where at least a portion of first message region associated with a first side of the first message region opposite the second side is occluded. As one example, if a left-to-right swipe gesture is detected within the first message region, a second set of one or more affordances including mark as read or mark as unread is slid in from the left edge of the conversation view and the first message region is proportionately slid right with a portion being occluded (e.g., as shown inFIGS. 7H-7IandFIG. 7N-7O). In some embodiments, the second set of one or more affordances is customizable. As such, according to some embodiments, the user is able to quickly access a second set of one or more options from within the conversation view, which saves the user time and effort and also conserves power.

In some embodiments, displaying the one or more affordances includes (1024) maintaining display of the second message region within the conversation view. In some embodiments, continue to display at least a portion of the second message region as displayed prior to detecting the user input. As one example, with reference toFIGS. 7E-7F, the first message region732aand the third message region732cmaintain their respective positions after the right-to-left swipe gesture inFIG. 7E. As another example, with reference toFIGS. 7H-7I, the first message region732aand the third message region732cmaintain their respective positions after the left-to-right swipe gesture inFIG. 7H. As yet another example, with reference toFIGS. 7L-7M, the second message region732band the third message region732cmaintain their respective positions after the right-to-left swipe gesture inFIG. 7L. As yet another example, with reference toFIGS. 7N-7O, the second message region732band the third message region732cmaintain their respective positions after the left-to-right swipe gesture inFIG. 7N.

In response to detecting the user input selecting the first message region, and in accordance with a determination that the user input satisfies a second set of input criteria (e.g., a finger tap gesture within a header of the message region, selection of a “see more” affordance, or the like), the device replaces display of (1026) the conversation view with a message view that corresponds to the first message. As such, for example, show the selected message in a message view that replaces the conversation view.FIGS. 7J-7K, for example, show a sequence in which a message view770of the second message within the conversation704athat corresponds to the second message region732breplaces display of the conversation view730in response to selection of the “see more” affordance738bwithin the second message region732binFIG. 7J.

In some embodiments, satisfying the second input criteria includes (1028) detecting a user input that corresponds to selecting a header sub-region of the first message region. In some embodiments, the second set of criteria are satisfied when a header of the first message region is selected. For example, with reference toFIG. 7B, if a contact is detected over the header sub-region731bof the first message region732a(not shown), a message view with the contents of the first message corresponding to the first message region732areplaces display of the conversation view730.

In some embodiments, satisfying the second input criteria includes (1030) detecting a user input that corresponds to selecting a “see more” affordance within the first message region. In some embodiments, the second set of criteria are satisfied when a “see more” affordance within the first message region is selected (e.g., as shown inFIGS. 7J-7K).

In some embodiments, in response to detecting the user input, and in accordance with a determination that the user input satisfies a third set of input criteria, the device performs (1032) a predefined action on the first message. As one example, if a left-to-right swipe gesture is detected within the first message region that is greater than a threshold distance (e.g., 33%, 50%, 100%, etc. of the width of the message region), a predefined action associated with one of the first set of one or more affordances is performed on the first message that corresponds to the first message region (e.g., the first message is moved to the trash). As another example, if a right-to-left swipe gesture is detected within the first message region that is greater than a threshold distance (e.g., 33%, 50%, 100%, etc. of the width of the message region), a predefined action associated with one of the second set of one or more affordances is performed on the first message that corresponds to the first message region (e.g., the first message is marked as read or marked as unread).

In some embodiments, satisfying the third input criteria includes (1034) detecting a horizontal swipe gesture within the first message region associated with a magnitude that is greater than a threshold distance. According to some embodiments, the third set of criteria are satisfied when a magnitude of a horizontal swipe gesture within the first message region is greater than the threshold distance (e.g., 33%, 50%, 100%, etc. of the width of the message region).

In some embodiments, the device detects (1036) a second user input, via the input device, corresponding to the second message region within the conversation view. In response to detecting the second user input, and in accordance with a determination that the second user input satisfies the first set of input criteria (e.g., a lateral swipe within the message, selection of an actions affordance within the message region, or the like), the device displays one or more affordances provided to perform corresponding actions to the second message. In response to detecting the second user input, and in accordance with a determination that the second user input satisfies the second set of input criteria (e.g., a finger tap gesture within a header of the message region, selection of a “see more” affordance, or the like), the device replaces display of the conversation view with a message view that corresponds on the second message. As such, for example, the user is able to similarly interact with any message within the conversation view. InFIGS. 7B-7K, for example, the user interacts with the second message region732bthat corresponds to a second message within the conversation704a. InFIGS. 7L-7O, for example, the user interacts with the first message region732athat corresponds to a first message within the conversation704a. As such, according to some embodiments, the user is able to quickly access options for performing actions on a message by interacting with any of the message regions in the conversation view, which saves the user time and effort and also conserves power.

In some embodiments, prior to displaying the conversation view within the first pane of the messaging application, the device (1038): displays, on the display, a mailbox view that includes a plurality of representations of corresponding to one or more messages and one or more conversations, where the plurality of representations have a same size (e.g., rows for messages and/or conversations with a same height in a list view); and detects a second user input, via the input device, that corresponds to selecting a respective representation from among the plurality of representations. In response to detecting the second user input selecting the respective representation, and in accordance with a determination that respective representation corresponds to a message, the device replaces display of the mailbox view with a message view that corresponds to the message associated with the respective representation. In response to detecting the second user input selecting the respective representation, and in accordance with a determination that respective representation corresponds to a conversation, the device replaces display of the mailbox view with the conversation view that corresponds to the conversation associated with the respective representation, where the conversation includes the plurality of messages.

FIGS. 7A-7B, for example, show a sequence in which a conversation view730for a conversation704areplaces display of the inbox folder view702in response to selection of the first row corresponding to the conversation704ainFIG. 7A. As shown inFIG. 7A, a respective dimension (e.g., the height) of each of the rows in the inbox folder view702has the same value703. In contrast, as shown inFIG. 7B, the respective dimension (e.g., the height) of each of the message regions732is based on the amount of content for the corresponding message. InFIG. 7B, the respective dimension (e.g., the height) of the first message region732ahas a value733a, and the respective dimension (e.g., the height) of the second message region732bhas a value733b. In this example, the value733bis greater than the value733abecause the first message associated with the first message region732ahas less content (e.g., lines of text) than the second message associated with the second message region732b.

It should be understood that the particular order in which the operations inFIGS. 10A-10Chave been described is merely example and is not intended to indicate that the described order is the only order in which the operations could be performed. One of ordinary skill in the art would recognize various ways to reorder the operations described herein. Additionally, it should be noted that details of other processes described herein with respect to other methods described herein (e.g., methods800and900) are also applicable in an analogous manner to method1000described above with respect toFIGS. 10A-10C. For example, the contacts, gestures, user interface objects, and focus selectors described above with reference to method1000optionally have one or more of the characteristics of the contacts, gestures, user interface objects, and focus selectors described herein with reference to other methods described herein (e.g., methods800and900). For brevity, these details are not repeated here.

As shown inFIG. 11, an electronic device1100includes a display unit1102configured to display a user interface, one or more input units1104configured to receive user inputs, and a processing unit1108coupled to the display unit1102and the one or more input units1104. In some embodiments, the processing unit1108includes: a display control unit1110, and an input detecting unit1112.

The processing unit1108is configured to enable display of (e.g., with the display control unit1110), on the display unit1102, an inbox view of a messaging application that includes a plurality of rows representing electronic communications, the plurality of rows including a first row representing a first plurality of messages that satisfy one or more conversation criteria that indicate that each of the first plurality of messages are a part of a same respective conversation, and a second row representing a second plurality of messages that satisfy a first category criterion but are not part of a same conversation. The processing unit1108is also configured to detect (e.g., with the input detecting unit1112) an input, via the one or more input units1104, corresponding to selection of a respective row from among the plurality of rows in the inbox view. In response to detecting the input, the processing unit1108is further configured to enable display of (e.g., with the display control unit1110), on the display unit1102, additional information corresponding to two or more messages from the conversation of related messages that are represented by the first row in accordance with a determination that the respective row corresponds to the first row. In response to detecting the input, the processing unit1108is further configured to enable display of (e.g., with the display control unit1110), on the display unit1102, additional information corresponding to two or more messages from among the plurality of messages that are represented by the second row, including a first message and a second message that both satisfy the first category criterion but not part of a same conversation in accordance with a determination that the respective row corresponds to the second row.

In some embodiments, the additional information corresponding to the two or more messages from the conversation of related messages that are represented by the first row is displayed inline in the inbox view, and the additional information corresponding to the two or more messages from among the plurality of messages that are represented by the second row is displayed inline in the inbox view

In some embodiments, the additional information corresponding to the two or more messages from the conversation of related messages that are represented by the first row replaces display of the inbox view, and the additional information corresponding to the two or more messages from among the plurality of messages that are represented by the second row replaces display of the inbox view.

In some embodiments, the additional information corresponding to the two or more messages from the conversation of related messages that are represented by the first row is displayed in a content pane separate from the inbox view displayed in an inbox pane, and the additional information corresponding to the two or more messages from among the plurality of messages that are represented by the second row is displayed in the content pane separate from the inbox view displayed in the inbox pane.

In some embodiments, the plurality of rows in the inbox view is sorted by date, and the second row representing the plurality of messages is included in the inbox view based on a date of a most recently received message among the plurality of messages.

In some embodiments, the first category criterion corresponds to one of a sender type of the second plurality of messages or a content type of the second plurality of messages.

In some embodiments, the second row is displayed in a condensed view mode prior to detecting the user input.

In some embodiments, the condensed view mode includes one or more of an indication of the first category, one or more senders of the plurality of messages represented by the second row, an indication of a most recently received message among the plurality of messages represented by the second row, an indication of a count of the plurality of messages represented by the second row, or an indication of a count of the unread messages among the plurality of messages represented by the second row.

In some embodiments, the second plurality of messages represented by the second row are not displayed in the inbox view while the second row is displayed in the condensed view mode.

In some embodiments, the second row includes a view mode affordance provided to toggle between the condensed view mode and an expanded view mode of the second row.

In some embodiments, the user input corresponds to selection of the view mode affordance, and the second row is displayed in the expanded view mode after detecting the user input.

In some embodiments, the expanded view mode includes an affordance provided to display the plurality of messages different from the two or more messages.

In some embodiments, the two or more messages from among the plurality of messages that are represented by the second row include a subset of the plurality of messages selected based on a predetermined criterion.

In some embodiments, the inbox view of the messaging application includes a third row representing a third plurality of messages that satisfy a second category criterion different from the first category criterion.

In some embodiments, the inbox view is included in an inbox pane, and the processing unit1108is further configured to enable display of (e.g., with the display control unit1110), on the display unit1102, a content pane adjacent to the inbox pane, where the content pane includes information associated with the conversation of related messages represented by the first row or the plurality of messages represented by the second row.

In some embodiments, the content pane includes an indication that the information included in the content pane corresponds to the plurality of messages that do not meet the one or more conversation criteria represented by the second row.

In some embodiments, the information included in the content pane has a different appearance for the plurality of messages that do not meet the one or more conversation criteria, the conversation of related messages, and a message.

As shown inFIG. 12, an electronic device1200includes a display unit1202configured to display a user interface, one or more input units1204configured to receive user inputs, and a processing unit1208coupled to the display unit1202and the one or more input units1204. In some embodiments, the processing unit1208includes: a display control unit1210, an input detecting unit1212, and a determining unit1214.

The processing unit1208is configured to enable concurrent display of (e.g., with the display control unit1210), on the display unit1202, a plurality of representations of electronic communications, and a filter affordance, where the filter affordance corresponds to a set of one or more filter criteria. The processing unit1208is also configured to detect (e.g., with the input detecting unit1212) a selection input, via the one or more input units1204, that corresponds to selection of the filter affordance while concurrently displaying the plurality of representations of electronic communications and the filter affordance. In response to detecting the selection input, and in accordance with a determination (e.g., with the determining unit1214) that the selection input corresponds to a first input type, the processing unit1208is further configured to: cease display of (e.g., with the display control unit1210), on the display unit1202, a first set of representations of electronic communications from among the plurality of representations of electronic communications associated with the first grouping that do not match the set of one or more filter criteria; enable display of (e.g., with the display control unit1210), on the display unit1202, a second set of representations of electronic communications from among the plurality of representations of electronic communications associated with the first grouping that match the set of one or more filter criteria; and display of (e.g., with the display control unit1210), on the display unit1202, an indication of the set of one or more filter criteria that have been applied to the electronic communications associated with the first grouping.

In some embodiments, satisfying a respective criterion from among the set of one or more filter criteria includes determining that electronic communications associated with the second set of representations of electronic communications are categorized as important based on past user actions with electronic communications.

In some embodiments, the indication of the set of one or more filter criteria includes a description of the set of one or more filter criteria adjacent to the filter affordance.

In some embodiments, the set of one or more filter criteria includes two or more filter criteria.

In some embodiments, the second set of representations of electronic communications that match the set of one or more filter criteria are ordered based on how many of the two or more filter criteria the corresponding electronic communications match.

In some embodiments, the second set of representations of electronic communications that match the set of one or more filter criteria are displayed in an inbox pane, and the processing unit1208is further configured to enable concurrent display of (e.g., with the display control unit1210), on the display unit1202, a content pane adjacent to the inbox pane, where the content pane includes information corresponding to a respective electronic communication that matches the set of one or more filter criteria.

In some embodiments, in response to detecting the selection input, and in accordance with a determination (e.g., with the determining unit1214) that the selection input corresponds to a first input type, the processing unit1208is further configured to enable display of (e.g., with the display control unit1210), on the display unit1202, an indication of a portion of the first set of representations of electronic communications that have been elided, where the indication is displayed between first and second subsets of the second set of representations of electronic communications.

In some embodiments, displaying the second set of representations of electronic communications from among the plurality of representations of electronic communications associated with the first grouping that match the set of one or more filter criteria includes: displaying a first subset of representations of electronic communications that match the set of one or more filter criteria and a second subset of representations of electronic communications that match the set of one or more filter criteria from among the plurality of representations of electronic communications associated with the first grouping; and displaying an expansion affordance between and adjacent to the first and second subsets of representations of electronic communications, where the expansion affordance is provided to display a portion of the first set of representations of electronic communications that do not match the set of one or more filter criteria.

In some embodiments, electronic communications in the portion of the first set of representations of electronic communications that do not match the set of one or more filter criteria are associated with timestamps between timestamps associated with electronic communications in the first and second subsets of representations of electronic communications that match the one or more filter criteria.

In some embodiments, the processing unit1208is further configured to: detect (e.g., with the input detecting unit1212) a second selection input, via the one or more input units1204, that corresponds to selection of the expansion affordance; and, in response to detecting the second selection input, replace display of (e.g., with the display control unit1210) the expansion affordance, on the display unit1202, with the portion of the first set of representations of electronic communications that do not match the set of one or more filter criteria, where the portion of the first set of representations of electronic communications that do not match the set of one or more filter criteria are displayed between and adjacent to the first and second subsets of representations of electronic communications that match the one or more filter criteria.

In some embodiments, in response to detecting the selection input, and in accordance with a determination (e.g., with the determining unit1214) that the selection input corresponds to a second input type, the processing unit1208is further configured to enable display of (e.g., with the display control unit1210), on the display unit1202, a filter selection menu overlaid on the plurality of representations of electronic communications associated with the first grouping.

In some embodiments, the filter selection menu is provided to at least one of enable or disable one or more filters among a plurality of filters included in the filter menu.

In some embodiments, the filter selection menu includes an affordance provided to add a custom filter to the plurality of filters included in the filter menu.

In some embodiments, after detecting the selection input, the processing unit1208is further configured to detect (e.g., with the input detecting unit1212) a sequence of one or more user inputs, via the one or more input units1204, that correspond to displaying a second plurality of representations of electronic communications associated with a second grouping, and, in response to detecting the sequence of one or more user inputs, enable display of (e.g., with the display control unit1210), on the display unit1202, a third set of representations of electronic communications from among the second plurality of representations of electronic communications associated with the second grouping that match the set of one or more filter criteria and the indication of the set of one or more filter criteria that have been applied to the electronic communications associated with the second grouping.

In some embodiments, while displaying the third set of representations of electronic communications, the processing unit1208is further configured to detect (e.g., with the input detecting unit1212) a second selection input, via the one or more input units1204, that corresponds to selection of the filter affordance, and, in response to detecting the second selection input, and in accordance with a determination (e.g., with the determining unit1214) that the selection input corresponds to the first input type, enable concurrent display of (e.g., with the display control unit1210), on the display unit1202, the third set of representations of electronic communications from among the second plurality of representations of electronic communications associated with the second grouping that match the set of one or more filter criteria and a fourth set of representations of electronic communications from among the second plurality of representations of electronic communications associated with the second grouping that do not match the set of one or more filter criteria.

As shown inFIG. 13, an electronic device1300includes a display unit1302configured to display a user interface, one or more input units1304configured to receive user inputs, and a processing unit1308coupled to the display unit1302and the one or more input units1304. In some embodiments, the processing unit1308includes: a display control unit1310, an input detecting unit1312, a determining unit1314, and a performing unit1316.

The processing unit1308is configured to: enable display of (e.g., with the display control unit1310), on the display unit1302, a conversation view of a plurality of messages within a first pane of a messaging application, where the conversation view includes a first message region of a portion of a first message of the plurality of messages and a second message region of a portion of a second message of the plurality of messages; and detect (e.g., with the input detecting unit1312) a user input, via the one or more input units1304, that corresponds to selecting the first message region within the conversation view. In response to detecting the user input selecting the first message region, and in accordance with a determination (e.g., with the determining unit1314) that the user input satisfies a first set of input criteria, the processing unit1308is further configured to enable display of (e.g., with the display control unit1310), on the display unit1302, one or more affordances provided to perform corresponding actions on the first message. In response to detecting the user input selecting the first message region, and in accordance with a determination (e.g., with the determining unit1314) that the user input satisfies a second set of input criteria, the processing unit1308is further configured to replace display of (e.g., with the display control unit1310) of the conversation view with a message view that corresponds to the first message.

In some embodiments, displaying the one or more affordances includes: in accordance with a determination that the user input is associated with a first direction: displaying, on the display, a first set of one or more affordances adjacent to a first side of the message region, where the first set of one or more affordances is provided to perform corresponding actions on the first message; and sliding the first message region in the first direction, where at least a portion of first message region associated with a second side of the first message region opposite the first side is occluded.

In some embodiments, the processing unit1308is further configured to: detect (e.g., with the input detecting unit1312) a subsequent user input, via the one or more input units1304, that corresponds to selecting a respective affordance from among the first set of one or more affordances; and in response to detecting the subsequent user input selecting the respective affordance, enable display of (e.g., with the display control unit1310), on the display unit1302, one or more options associated with the action that corresponds to the respective affordance.

In some embodiments, displaying the one or more affordances includes: in accordance with a determination that the user input is associated with a second direction: displaying, on the display, a second set of one or more affordances adjacent to a second side of the message region, where the second set of one or more affordances is provided to perform corresponding actions on the first message; and sliding the first message region in the second direction, where at least a portion of first message region associated with a first side of the first message region opposite the second side is occluded.

In some embodiments, displaying the one or more affordances includes maintaining display of the second message region within the conversation view.

In some embodiments, satisfying the first input criteria includes detecting a horizontal swipe gesture within the first message region associated with a magnitude that is less than a threshold distance.

In some embodiments, satisfying the first input criteria includes detecting a user input that corresponds to selecting an actions affordance within the first message region.

In some embodiments, satisfying the second input criteria includes detecting a user input that corresponds to selecting a header sub-region of the first message region.

In some embodiments, satisfying the second input criteria includes detecting a user input that corresponds to selecting a “see more” affordance within the first message region.

In some embodiments, in response to detecting the user input, and in accordance with a determination (e.g., with the determining unit1314) that the user input satisfies a third set of input criteria, the processing unit1308is further configured to perform (e.g., with the performing unit1316) a predefined action on the first message.

In some embodiments, satisfying the third input criteria includes detecting a horizontal swipe gesture within the first message region associated with a magnitude that is greater than a threshold distance.

In some embodiments, the conversation view includes a toolbar region including a plurality of affordances provided to perform corresponding actions on a most recent message among the plurality of messages.

In some embodiments, a size of the first message region is based at least in part on an amount of content associated with the first message, and a size of the second message region is based at least in part on an amount of content associated with the second message.

In some embodiments, the processing unit1308is further configured to enable display of (e.g., with the display control unit1310), on the display unit1302, a list view including a plurality of rows representing a plurality of conversations in a second pane adjacent to the first pane that includes the conversation view.

In some embodiments, the processing unit1308is further configured to detect (e.g., with the input detecting unit1312) a second user input, via the one or more input unit1304, corresponding to the second message region within the conversation view. In response to detecting the second user input, and in accordance with a determination (e.g., with the determining unit1314) that the second user input satisfies the first set of input criteria, the processing unit1308is further configured to enable display of (e.g., with the display control unit1310), on the display unit1302, one or more affordances provided to perform corresponding actions to the second message. In response to detecting the second user input, and in accordance with a determination (e.g., with the determining unit1314) that the second user input satisfies the second set of input criteria, the processing unit1308is further configured to replace display of (e.g., with the display control unit1310) the conversation view with a message view that corresponds on the second message.

In some embodiments, prior to displaying the conversation view within the first pane of the messaging application, the processing unit1308is further configured to enable display of (e.g., with the display control unit1310), on the display unit1302, a mailbox view that includes a plurality of representations of corresponding to one or more messages and one or more conversations, where the plurality of representations have a same size. The processing unit1308is further configured to detect (e.g., with the input detecting unit1312) a second user input, via the input device, that corresponds to selecting a respective representation from among the plurality of representations. In response to detecting the second user input selecting the respective representation, and in accordance with a determination that respective representation corresponds to a message, the processing unit1308is further configured to replace display of (e.g., with the display control unit1310) the mailbox view with a message view that corresponds to the message associated with the respective representation. In response to detecting the second user input selecting the respective representation, and in accordance with a determination that respective representation corresponds to a conversation, the processing unit1308is further configured to replace display of (e.g., with the display control unit1310) the mailbox view with the conversation view that corresponds to the conversation associated with the respective representation, where the conversation includes the plurality of messages.