Portable electronic device for instant messaging - Patent application

The portable multifunction device with a touch-sensitive display and graphical user interface addresses the challenge of complex user interfaces on handheld devices by enabling intuitive interaction through gestures, improving instant messaging functionality.

JP7777272B2Active Publication Date: 2025-11-28APPLE INC
View PDF 7 Cites 0 Cited by

Patent Information

Application Number
JP2024032422
Authority / Receiving Office
JP · JP
Patent Type
Patents
Current Assignee / Owner
Priority Date
2007-08-30
Filing Date
2024-03-04
Publication Date
2025-11-28
Estimated Expiration
2027-08-31

AI Technical Summary

Technical Problem

Portable electronic devices face challenges in providing intuitive and flexible user interfaces for instant messaging due to small screens and complex key sequences, making it difficult for users to interact with multifunction devices, especially handheld devices.

Method used

A portable multifunction device with a touch-sensitive display and graphical user interface that allows users to interact through finger contacts and gestures, enabling scrolling of messages and conversations based on vertical movements independent of horizontal position, and supporting various applications with adaptable keyboards.

Benefits of technology

Provides a transparent and intuitive user interface for creating, viewing, and navigating instant message conversations, enhancing user interaction and reducing the complexity of operating portable devices.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure 0007777272000001
    Figure 0007777272000001
  • Figure 0007777272000002
    Figure 0007777272000002
  • Figure 0007777272000003
    Figure 0007777272000003
Patent Text Reader

Abstract

To provide a portable multifunction device with a more transparent and intuitive user interface for instant messaging that is easy to use, configure and / or apply.SOLUTION: One aspect of the present invention includes a graphic user interface (GUI) for a portable electronic device with a touch screen display. The GUI includes a set of messages that may be exchanged between a user of the device and another individual. The set of messages is displayed in chronological order. In response to detecting a scroll gesture comprising a substantial vertical migration of a contact of a user with the touch screen display, on the basis of the direction of the scroll gesture, the message display is scrolled. The detection of the scroll gesture is substantially independent of a horizontal migration of the contact of the user with the touch screen display.SELECTED DRAWING: Figure 5
Need to check novelty before this filing date? Find Prior Art

Description

[Technical Field]

[0001] FIELD OF THE INVENTION The disclosed embodiments relate generally to portable electronic devices, and more particularly to portable devices for performing instant messaging. [Background technology]

[0002] As portable electronic devices become more compact and the number of functions performed on a given device increases, designing a user interface that allows a user to easily interact with a multifunction device becomes a significant challenge. This challenge is particularly significant for handheld portable devices, which have much smaller screens than desktop and laptop computers. This situation is disadvantageous because the user interface is the gateway through which the user not only receives content but also receives responses to the user's actions or behaviors, including the user's attempts to access the device's features, tools, and functions.

[0003] Some portable communication devices (e.g., mobile telephones, sometimes referred to as mobile phones, cell phones, cellular telephones, etc.) rely on adding more push buttons, increasing push button density, overloading push button functions, or using complex menu systems to allow users to access, store, and manipulate data. These conventional user interfaces often result in complex key sequences and menu hierarchies that users must memorize.

[0004] Many conventional user interfaces, such as those involving physical push buttons, are also inflexible, which can be inadequate because it can prevent the user interface from being configured and / or adapted by either the user or the applications running on the portable device. When combined with the time-consuming requirement to memorize numerous key sequences and menu hierarchies and the difficulty of operating the desired push button, this inflexibility can be frustrating for most users.

[0005] Portable device-based instant messaging (IM) services are becoming increasingly popular. However, most IM services on portable electronic devices have rudimentary user interfaces. Creating an instant message on such a device is cumbersome. Users are often required to repeatedly press the telephone keypad to select a character. It is also difficult to find and view previous instant messages. For example, it may be inconvenient or impossible for a user to compose a new message to a particular user while viewing a series of previous messages with that user. Summary of the Invention [Problem to be solved by the invention]

[0006] Therefore, there is a need for a portable multifunction device with a more transparent and intuitive user interface for instant messaging that is easy to use, configure and / or apply. [Means for solving the problem]

[0007] The above-mentioned drawbacks and other problems associated with user interfaces for portable devices are mitigated or eliminated by the portable multifunction device disclosed herein. In one embodiment, the device has a touch-sensitive display (also known as a touchscreen or touchscreen display) with a graphical user interface (GUI), one or more processors, memory, and one or more modules, programs, or instruction sets stored in the memory for performing a number of functions. In one embodiment, a user interacts with the GUI primarily through finger contacts and gestures on the touch-sensitive display. Instructions for performing instant messaging operations may be included in a computer program product configured to execute on one or more processors.

[0008] One aspect of the invention encompasses a computer-implemented method in which a portable electronic device with a touchscreen display chronologically displays a set of messages exchanged between a user of the device and another individual, detects a scrolling gesture comprising a substantial vertical movement of a user's contact with the touchscreen display, the detection of the scrolling gesture being substantially independent of a horizontal position of the user's contact with the touchscreen display, and, in response to the scrolling gesture, scrolls the display of the messages based on a direction of the scrolling gesture.

[0009] Another aspect of the invention encompasses a computer-implemented method in which a portable electronic device with a touchscreen display displays a list of conversations, each conversation including a set of messages exchanged between a user of the device and each other individual, and further detects a scrolling gesture comprising a substantially vertical movement of a user's contact with the touchscreen display, and in response to the scrolling gesture, scrolls the list of conversations based on the direction of the scrolling gesture, the scrolling gesture being substantially independent of the horizontal position of the user's contact with the touchscreen display.

[0010] Another aspect of the invention encompasses a portable electronic device comprising a touchscreen display, one or more processors, a memory, and one or more programs stored in the memory and configured to be executed by the one or more processors, the one or more programs including instructions for chronologically displaying a set of messages exchanged between a user of the device and another individual, instructions for detecting a scrolling gesture comprising a substantial vertical movement of a user's contact with the touchscreen display, the detection of the scrolling gesture being substantially independent of a horizontal position of the user's contact with the touchscreen display, and instructions for, in response to the scrolling gesture, scrolling a display of the messages based on a direction of the scrolling gesture.

[0011] Another aspect of the invention encompasses a portable electronic device comprising a touchscreen display, one or more processors, a memory, and one or more programs stored in the memory and configured to be executed by the one or more processors, the one or more programs including instructions for displaying a list of conversations, each conversation including a set of messages exchanged between a user of the device and each of other individuals, instructions for detecting a scrolling gesture comprising a substantially vertical movement of a user's contact with the touchscreen display, and instructions for, in response to the scrolling gesture, scrolling the list of conversations based on a direction of the scrolling gesture, the scrolling gesture being substantially independent of a horizontal position of the user's contact with the touchscreen display.

[0012] Another aspect of the invention encompasses a computer program product including a computer-readable storage medium and a computer program mechanism embodied therein, the computer program mechanism including instructions that, when executed by a portable electronic device with a touchscreen display, cause the device to chronologically display a set of messages exchanged between a user of the device and another individual, detect a scrolling gesture comprising a substantial vertical movement of a user's contact with the touchscreen display, the detection of the scrolling gesture being substantially independent of a horizontal position of the user's contact with the touchscreen display, and, in response to the scrolling gesture, scroll the display of the messages based on a direction of the scrolling gesture.

[0013] Another aspect of the invention encompasses a computer program product including a computer-readable storage medium and a computer program mechanism embodied therein that, when executed by a portable electronic device with a touchscreen display, causes the device to display a list of conversations, each conversation including a set of messages exchanged between a user of the device and each other individual, and further includes instructions to detect a scrolling gesture comprising a substantially vertical movement of a user's contact with the touchscreen display, and in response to the scrolling gesture, scroll the list of conversations based on the direction of the scrolling gesture, the scrolling gesture being substantially independent of the horizontal position of the user's contact with the touchscreen display.

[0014] Another aspect of the present invention encompasses a graphical user interface (GUI) for a portable electronic device with a touchscreen display, the GUI having a set of messages to be exchanged between a user of the device and another individual, the set of messages being displayed in chronological order, and in response to detecting a scrolling gesture comprising a substantially vertical movement of a user contact with the touchscreen display, scrolling the display of the messages based on a direction of the scrolling gesture, wherein the detection of the scrolling gesture is substantially independent of a horizontal position of the user contact with the touchscreen display.

[0015] Another aspect of the present invention encompasses a graphical user interface (GUI) for a portable electronic device with a touchscreen display, the GUI having a list of conversations, each conversation including a set of messages exchanged between a user of the device and each of the other individuals. In response to detecting a scroll gesture comprising a substantially vertical movement of a user's contact with the touchscreen display, the list of conversations is scrolled based on a direction of the scroll gesture, the scroll gesture being substantially independent of a horizontal position of the user's contact with the touchscreen display.

[0016] Another aspect of the invention encompasses a portable electronic device with a touch screen display, comprising: means for chronologically displaying a set of messages exchanged between a user of the device and another individual; means for detecting a scrolling gesture comprising a substantial vertical movement of a user's contact with the touch screen display, the detection of the scrolling gesture being substantially independent of a horizontal position of the user's contact with the touch screen display; and means for, in response to the scrolling gesture, scrolling a display of the messages based on a direction of the scrolling gesture.

[0017] Another aspect of the present invention encompasses a portable electronic device with a touchscreen display, comprising: means for displaying a list of conversations, each conversation including a set of messages exchanged between a user of the device and each other individual; means for detecting a scrolling gesture comprising a substantially vertical movement of a user's contact with the touchscreen display; and means for, in response to the scrolling gesture, scrolling the list of conversations based on a direction of the scrolling gesture, the scrolling gesture being substantially independent of a horizontal position of the user's contact with the touchscreen display.

[0018] Another aspect of the invention encompasses a computer-implemented method in which a portable electronic device with a touchscreen display chronologically displays a set of messages exchanged between a user of the device and another individual, the messages sent by the other individual including a first message sent from a first address associated with the other individual and a second message sent from a second address associated with the other individual that is different from the first address.

[0019] Another aspect of the invention encompasses a portable electronic device. The device includes a touchscreen display, one or more processors, a memory, and one or more programs. The one or more programs are configured to be stored in the memory and executed by the one or more processors. The one or more programs include instructions for chronologically displaying a set of messages exchanged between a user of the device and another individual. The messages sent by the other individual include a first message sent from a first address associated with the other individual and a second message sent from a second address associated with the other individual that is different from the first address.

[0020] Another aspect of the invention encompasses a computer program product comprising a computer-readable storage medium and a computer program mechanism embodied therein, the computer program mechanism including instructions that, when executed by a portable electronic device with a touchscreen display, cause the device to chronologically display a set of messages exchanged between a user of the device and another individual, the messages sent by the other individual including a first message sent from a first address associated with the other individual and a second message sent from a second address associated with the other individual that is different from the first address.

[0021] Another aspect of the invention encompasses a graphic user interface (GUI) for a portable electronic device with a touchscreen display, the GUI having a chronological set of messages exchanged between a user of the device and another individual, the messages sent by the other individual including a first message sent from a first address associated with the other individual and a second message sent from a second address associated with the other individual different from the first address.

[0022] Another aspect of the invention encompasses a portable electronic device with a touchscreen display, the portable electronic device including means for chronologically displaying a set of messages exchanged between a user of the device and another individual, the messages sent by the other individual including a first message sent from a first address associated with the other individual and a second message sent from a second address associated with the other individual different from the first address.

[0023] Thus, the present invention provides a transparent and intuitive user interface for creating, viewing, and navigating instant message conversations on a portable electronic device with a touchscreen display.

[0024] For a better understanding of the above-described and additional embodiments of the present invention, embodiments will now be described in detail with reference to the accompanying drawings, in which like reference numerals designate corresponding parts throughout the drawings. [Brief explanation of the drawings]

[0025] [Figure 1] FIG. 1 is a block diagram illustrating a portable electronic device with a touch-sensitive display according to an embodiment. [Figure 2] FIG. 1 illustrates a portable electronic device having a touch screen according to an embodiment. [Figure 3] FIG. 10 illustrates an example user interface for unlocking a portable electronic device according to some embodiments. [Figure 4] FIG. 1 illustrates an example user interface for a menu of applications on a portable electronic device in accordance with an embodiment. [Figure 5] FIG. 10 illustrates an example user interface for listing instant message conversations on a portable electronic device according to an embodiment. [Figure 6A] FIG. 10 illustrates an example user interface for entering text for an instant message according to one embodiment. [Figure 6B] FIG. 10 illustrates an example user interface for entering text for an instant message according to one embodiment. [Figure 6C] FIG. 10 illustrates an example user interface for entering text for an instant message according to one embodiment. [Figure 6D] FIG. 10 illustrates an example user interface for entering text for an instant message according to one embodiment. [Figure 6E] FIG. 10 illustrates an example user interface for entering text for an instant message according to one embodiment. [Figure 6F]FIG. 10 illustrates an example user interface for entering text for an instant message according to one embodiment. [Figure 6G] FIG. 10 illustrates an example user interface for entering text for an instant message according to one embodiment. [Figure 6H] FIG. 10 illustrates an example user interface for entering text for an instant message according to one embodiment. [Figure 6I] FIG. 10 illustrates an example user interface for entering text for an instant message according to one embodiment. [Figure 6J] FIG. 10 illustrates an example user interface for entering text for an instant message according to one embodiment. [Figure 6K] FIG. 10 illustrates an example user interface for entering text for an instant message according to one embodiment. [Figure 7] 10A-10C illustrate example user interfaces for deleting an instant message conversation according to some embodiments. [Figure 8A] FIG. 10 illustrates an example user interface for a contact list according to an embodiment. [Figure 8B] FIG. 10 illustrates an example user interface for a contact list according to an embodiment. [Figure 9] FIG. 10 illustrates an example user interface for entering an instant messaging phone number according to an embodiment. [Figure 10] 10 is a flowchart illustrating a process for displaying a list of instant message conversations on a touchscreen of a portable electronic device according to one embodiment. [Figure 11] 1 is a flowchart illustrating a process for displaying a user-selected instant message conversation upon detecting a defined user contact with a touchscreen of a portable electronic device according to one embodiment. [Figure 12]1 is a flowchart illustrating a process for displaying user-entered characters and word suggestions, if any, according to one embodiment. [Figure 13] 10 is a flowchart illustrating a process for displaying keyboards upon detecting user contact with a keyboard selection icon according to one embodiment. [Figure 14] 10 is a flowchart illustrating a process for interpreting the meaning of a particular user contact with the shift key according to one embodiment. [Figure 15] 10 is a flowchart illustrating a process for sending an instant message to each recipient according to one embodiment. [Figure 16] 10 is a flowchart illustrating a process for displaying a list of instant message conversations for editing according to one embodiment. [Figure 17] 1 is a flowchart illustrating a process for a user to edit a selected instant message conversation according to one embodiment. [Figure 18] 10 is a flowchart illustrating a process for a user to remove a selected instant message conversation or exit conversation edit mode according to one embodiment. [Figure 19] 1 is a flowchart illustrating a process for displaying a list of contacts for a user to select from to send an instant message according to one embodiment. [Figure 20] 1 is a flowchart illustrating a process for starting a new conversation using a new phone number according to one embodiment. [Figure 21] FIG. 10 illustrates an example user interface for alerting a user to a new instant message according to one embodiment. DETAILED DESCRIPTION OF THE INVENTION

[0026] DETAILED DESCRIPTION OF THE PREFERRED EMBODIMENTS The following detailed description of the preferred embodiments is provided with reference to the accompanying drawings. In the following detailed description, numerous specific details are set forth in order to provide a thorough understanding of the present invention. However, it will be apparent to those skilled in the art that the present invention may be practiced without these specific details. In other instances, well-known methods, procedures, components, circuits, and networks have not been described in detail so as not to unnecessarily obscure aspects of these embodiments.

[0027] Embodiments of portable electronic devices, user interfaces for such devices, and associated processes for using such devices are described. In one embodiment, the device is a portable communications device such as a mobile phone that also includes other functions, such as a PDA and / or music player function.

[0028] The user interface may include a physical click wheel in addition to a touch screen or a virtual click wheel displayed on the touch screen. A click wheel is a user interface device that can provide navigation commands based on the angular displacement of the wheel or the point of contact of a device user with the wheel. A click wheel can also be used to provide a user command corresponding to the selection of one or more items, for example, when a device user depresses at least a portion of the wheel or the center of the wheel. Alternatively, breaking contact with a click wheel image on the touch screen surface can indicate a user command corresponding to the selection. For simplicity, a portable multifunction device including a touch screen will be used as an embodiment in the following description. However, it should be understood that the user interface and some of the associated processes may also be applied to other devices, such as personal computers and laptop computers, that include one or more other physical user interface devices, such as a physical click wheel, a physical keyboard, a mouse, and / or a joystick.

[0029] In addition to instant messaging, the device supports a variety of other applications, such as a telephone application, a video conferencing application, an email application, a blog application, a digital camera application, a digital video camera application, a web browsing application, a digital music player application, and / or a digital video player application.

[0030] Various applications that can be executed on a device can use at least one common physical user interface device, such as a touchscreen. One or more functions of the touchscreen and the corresponding information displayed on the device can be tailored and / or changed for each application and / or within each application. In this way, the device's common physical architecture (such as a touchscreen) can support various applications with intuitive and transparent user interfaces.

[0031] The user interface may include one or more soft keyboard embodiments. Soft keyboard embodiments may include standard (QWERTY) and / or non-standard configurations of symbols on the displayed icons of the keyboard, as described in U.S. patent application Ser. No. 11 / 459,606, entitled "Keyboards For Portable Electronic Devices," filed July 24, 2006, and U.S. patent application Ser. No. 11 / 459,615, entitled "Touch Screen Keyboards For Portable Electronic Devices," filed July 24, 2006, the contents of which are incorporated herein by reference. Keyboard embodiments may include a reduced number of icons (or soft keys) relative to the number of keys on an existing physical keyboard, such as on a typewriter. This allows a user to easily select one or more icons on the keyboard, and thus one or more corresponding symbols. Keyboard embodiments may be adaptive. For example, the displayed icons may change based on a user action, such as selecting one or more icons and / or one or more corresponding symbols. One or more applications on a portable electronic device may use common and / or different keyboard embodiments. Thus, the keyboard embodiment used can be tailored to at least some applications. In some embodiments, one or more keyboard embodiments can be tailored to each user, for example, based on each user's word usage history (dictionary, slang, individual usage). Some keyboard embodiments can be adjusted to reduce the probability of user error when selecting one or more icons, and therefore one or more symbols when using a soft keyboard embodiment.

[0032] Attention now turns to device embodiments. FIG. 1 is a block diagram illustrating a portable electronic device 100 with a touch-sensitive display 112 according to one embodiment. The touch-sensitive display 112 is also conveniently referred to as a "touch screen." The device 100 may include memory 102 (including one or more computer-readable storage media), a memory controller 122, one or more processing units (CPUs) 120, a peripherals interface 118, RF circuitry 108, audio circuitry 110, a speaker 111, a microphone 113, an input / output (I / O) subsystem 106, other input or control devices 116, and an external port 124. Additionally, the device 100 may also include one or more optical sensors 164. These components may communicate over one or more communication buses or signal lines 103.

[0033] It will be apparent that device 100 is only one example of a portable electronic device 100, and that device 100 may have more or fewer components than those shown, may combine two or more components, or may have components in a different configuration or arrangement. The various components shown in Figure 1 may be implemented in hardware, software, or a combination of both, including one or more signal processing and / or application specific integrated circuits.

[0034] Memory 102 includes high-speed random-access memory and may also include 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 memory 102 by other components of device 100, such as CPU 120 and peripheral interface 118, may be controlled by memory controller 122.

[0035] A peripheral interface 118 couples the device's input and output peripherals to the CPU 120 and memory 102. The one or more processors 120 run or execute various software programs and / or instruction sets stored in the memory 102 to perform various functions of the device 100 and to process data.

[0036] In some embodiments, peripheral interface 118, CPU 120, and memory controller 122 may be implemented on a single chip, such as chip 104. In some other embodiments, they may be implemented on separate chips.

[0037] RF (radio frequency) circuitry 108 receives and transmits RF signals, also referred to as electromagnetic signals. RF circuitry 108 converts between electrical and electromagnetic signals and communicates with communication networks and other communication devices via the electromagnetic signals. RF circuitry 108 can include well-known circuits for performing these functions, including, but not limited to, an antenna system, an RF transceiver, one or more amplifiers, a tuner, one or more oscillators, a digital signal processor, a CODEC chipset, a subscriber identity module (SIM) card, memory, etc. RF circuitry 108 can communicate wirelessly with networks, such as the Internet, also referred to as the World Wide Web (WWW), intranets, and / or wireless networks, such as cellular telephone networks, wireless local area networks (LANs), and / or metropolitan area networks (MANs), and other devices.Wireless communications may use any of a number of communication standards, protocols, and technologies, including Global System for Mobile Communications (GSM), Enhanced Data GSM Environment (EDGE), High Speed ​​Downlink Packet Access (HSDPA), Wideband Code Division Multiple Access (W-CDMA), Code Division Multiple Access (CDMA), Time Division Multiple Access (TDMA), Bluetooth, Wireless Fidelity (Wi-Fi) (e.g., IEEE 802.11a, IEEE 802.11b, IEEE 802.11g, and / or IEEE 802.11n), Voice over Internet Protocol (VoIP), and Wi-Fi. -MAX, protocols for email (e.g., Internet Message Access Protocol (IMAP) and / or Post Office Protocol (POP)), instant messaging (e.g., Extensible Messaging and Presence Protocol (XMPP), Session Initiation Protocol for Instant Messaging and Presence Leverage Extensions (SIMPLE), and / or Instant Messaging and Presence Service (IMPS)), and / or Short Messaging Service (SMS), and other suitable communication protocols, including communication protocols not yet developed as of the filing date of this application.

[0038] Audio circuit 110, speaker 111, and microphone 113 form an audio interface between a user and device 100. Audio circuit 110 receives audio data from peripheral interface 118, converts the audio data into electrical signals, and sends the electrical signals to speaker 111. Speaker 111 converts the electrical signals into sound waves that humans can hear. Audio circuit 110 also receives electrical signals converted from sound waves by microphone 113. Audio circuit 110 converts the electrical signals into audio data and sends the audio data to peripheral device 118 for processing. Audio data may be retrieved from and / or sent to memory 102 and / or RF circuit 108 by peripheral interface 118. In some embodiments, audio circuit 110 also includes a headset jack (not shown). The headset jack provides an interface between audio circuitry 110 and a detachable audio input / output peripheral, such as output-only headphones or a headset with both an output (e.g., mono or binaural headphones) and an input (e.g., a microphone).

[0039] The I / O subsystem 106 couples input / output peripherals of the device 100, such as the display system 112 and other input / control devices 116, to a peripheral interface 118. The I / O subsystem 106 may include a display controller 156 and one or more input controllers 160 for other input or control devices. The one or more input controllers 160 send / receive electrical signals to / from the other input or control devices 116. The other input / control devices 116 may include physical buttons (e.g., push buttons, rocker buttons, etc.), dials, slider switches, joysticks, click wheels, etc. In some alternative embodiments, the input controller(s) 160 may be connected to none or any of the following: a keyboard, an infrared port, a USB port, and a pointer device such as a mouse. One or more buttons (e.g., 208 in FIG. 2) may include up / down buttons for volume control of the speaker 111 and / or microphone 113. The one or more buttons may include a push button (e.g., 206 in FIG. 2). A quick press of the push button can unlock the touch screen 112 or initiate the process of unlocking the device using gestures on the touch screen, as described in U.S. patent application Ser. No. 11 / 322,549 (filed Dec. 23, 2005, entitled "Unlocking a Device by Performing Gestures on an Unlock Image"), which is incorporated herein by reference. A long press of a push button (e.g., 206) can turn power to the device 100 on or off. A user can also customize the function of one or more buttons. The touch screen 112 can be used to implement virtual or soft buttons and one or more soft keyboards.

[0040] Touch-sensitive touchscreen 112 provides an input and output interface between the device and a user. Display controller 156 sends and / or receives electrical signals to and from touchscreen 112. Touchscreen 112 displays visual output to the user. This visual output may include graphics, text, icons, video, and combinations thereof (collectively referred to as "graphics"). In some embodiments, some or all of the visual output may correspond to user interface objects, which are described in further detail below.

[0041] Touchscreen 112 is a touch-sensitive surface, sensor, or set of sensors that accepts input from a user based on tactile and / or haptic contact. Touchscreen 112 and display controller 156 (along with associated modules and / or sets of instructions in memory 102) detects contact (and movement or breaking of contact) on touchscreen 112 and translates the detected contact into an interaction with a user interface object (e.g., one or more softkeys, icons, web pages, or images) displayed on the touchscreen. In the illustrated embodiment, the point of contact between touchscreen 112 and the user corresponds to the user's finger.

[0042] Touchscreen 112 may use LCD (liquid crystal display) or LPD (light emitting polymer display) technology, although other display technologies may be used in other embodiments. Touchscreen 112 and display controller 156 may detect contact and its movement or disruption using any of a number of now known or later developed touch sensing technologies, including, but not limited to, capacitive, resistive, infrared, and surface acoustic wave technologies, as well as other proximity sensor arrays or other elements for determining one or more points of contact with touchscreen 112. The touch-sensitive display in some embodiments of touchscreen 112 may be similar to the multi-touch sensitive tablets described in U.S. Pat. Nos. 6,323,846 (Westerman et al.), 6,570,557 (Westerman et al.), and / or 6,677,932 (Westerman), and / or U.S. Patent Publication No. 2002 / 0015024 A1, each of which is incorporated herein by reference. However, while the touchscreen 112 displays visual output from the portable device 100, the touch-sensitive tablet does not provide visual output. The touchscreen 112 can have a resolution greater than 100 dpi. In the illustrated embodiment, the touchscreen of the display system has a resolution of approximately 168 dpi. A user can contact the touchscreen 112 using a suitable object or accessory, such as a stylus, finger, etc. In one embodiment, the user interface is designed to function primarily with finger-based touches and gestures, which are significantly less precise than stylus-based input due to the large contact area of ​​a finger on the touchscreen. In one embodiment, the device translates approximate finger-based input into precise pointer / cursor positions or commands to perform the user's desired actions.

[0043] Touch-sensitive displays in certain embodiments of touch screen 112 are described in the following patent applications: (1) U.S. patent application Ser. No. 11 / 381,313, entitled "Multipoint Touch Surface Controller," filed May 2, 2006; (2) U.S. patent application Ser. No. 10 / 840,862, entitled "Multipoint Touch screen," filed May 6, 2004; (3) U.S. patent application Ser. No. 10 / 903,964, entitled "Gestures For Touch Sensitive Input Devices," filed July 30, 2004; (4) U.S. patent application Ser. No. 11 / 048,264, entitled "Gestures For Touch Sensitive Input Devices," filed January 31, 2005; and (5) U.S. patent application Ser. No. 11 / 048,264, entitled "Gestures For Touch Sensitive Input Devices," filed January 18, 2005. (6) U.S. patent application Ser. No. 11 / 038,590 entitled "Virtual Input Device Placement On A Touch Screen User Interface," filed on September 16, 2005; (7) U.S. patent application Ser. No. 11 / 228,758 entitled "Virtual Input Device Placement On A Touch Screen User Interface," filed on September 16, 2005; (8) U.S. patent application Ser. No. 11 / 228,737 entitled "Activating Virtual Keys Of A Touch-Screen Virtual Keyboard," filed on September 16, 2005; and (9) U.S. patent application Ser. No. 11 / 367,749 entitled "Multi-Functional Hand-Held Device," filed on March 3, 2006, all of which applications are incorporated herein by reference.

[0044] In some embodiments, in addition to the touchscreen, device 100 may include a touchpad (not shown) for activating or deactivating certain functions. In some embodiments, the touchpad is a touch-sensitive area of ​​the device that, unlike the touchscreen, does not display visual output. The touchpad may be a separate touch-sensitive surface from touchscreen 112 or may be an extension of the touch-sensitive surface formed by the touchscreen.

[0045] In some embodiments, device 100 may include a physical or virtual click wheel as input control device 116. A user can navigate among and interact with one or more graphical objects (hereinafter referred to as icons) displayed on touchscreen 112 by rotating the click wheel or by moving a contact point with the click wheel (e.g., where movement of the contact point is measured by its angular displacement relative to the center point of the click wheel). The click wheel may also be used to select one or more of the displayed icons. For example, a user may depress at least a portion of the click wheel or a button associated therewith. User and navigation commands provided by a user via the click wheel may be processed by input controller 160 and one or more modules and / or instruction sets in memory 102. In the case of a virtual click wheel, the click wheel and click wheel controller may be a portion of touchscreen 112 and display controller 156, respectively. In the case of a virtual click wheel, the click wheel may be an opaque or translucent object that appears and disappears on the touchscreen display in response to user interaction with the device. In some embodiments, the virtual click wheel is displayed on the touchscreen of the portable multifunction device and is activated by user contact with the touchscreen.

[0046] Device 100 also includes a power system 162 for powering the various components. This power system 162 may include a power management system, one or more power sources (e.g., battery, alternating current (AC)), a recharging system, power failure detection circuitry, power converters or inverters, power status indicators (e.g., light emitting diodes (LEDs)), and other components associated with the generation, management, and distribution of power in a portable electronic device.

[0047] Device 100 may also include one or more optical sensors 164. FIG. 1 shows an optical sensor coupled to optical sensor controller 158 in I / O subsystem 106. Optical sensor 164 may include a charge-coupled device (CCD) or a complementary metal-oxide semiconductor (CMOS) phototransistor. Optical sensor 164 receives light projected from the surroundings through one or more lenses and converts the light into data representing an image. In conjunction with imaging module 143, optical sensor 164 may also capture still images or video. In one embodiment, an optical sensor is located on the back of device 100 opposite touchscreen display 112 on the front of the device, allowing the touchscreen display to be used as a viewfinder for still and / or video image capture. In one embodiment, an optical sensor is located on the front of the device to obtain an image of the user for a video conference, while the user can view other video conference participants on the touchscreen display. In one embodiment, the position of the optical sensor 164 can be switched by the user (e.g., by rotating the lens and sensor within the device housing) so that a single optical sensor 164 can be used for both video conferencing and still and / or video image capture, along with a touchscreen display.

[0048] Device 100 may also include one or more proximity sensors 166. FIG. 1 shows proximity sensor 166 coupled to peripheral interface 118. Alternatively, proximity sensor 166 may be coupled to input controller 160 of I / O subsystem 106. Proximity sensor 166 may operate as described in U.S. patent application Ser. No. 11 / 241,839, entitled "Proximity Detector In Handheld Devices," filed Sep. 30, 2005, and U.S. patent application Ser. No. 11 / 240,788, entitled "Proximity Detector In Handheld Devices," filed Sep. 30, 2005, both of which are incorporated herein by reference. In one embodiment, the proximity sensor turns off and disables touchscreen 112 when the multifunction device is placed near a user's ear (e.g., when the user makes a phone call). In one embodiment, to prevent unnecessary battery drain when the device is in a locked state, a proximity sensor keeps the screen off when the device is placed in a user's pocket, purse, or other dark area.

[0049] Device 100 may also include one or more accelerometers 168. FIG. 1 shows accelerometer 168 coupled to peripherals interface 118. Alternatively, accelerometer 168 may be coupled to input controller 160 of I / O subsystem 106. Accelerometer 168 may operate as described in U.S. Patent Publication No. 20050190059, entitled "Acceleration-Based Theft Detection System for Portable Electronic Devices," and U.S. Patent Publication No. 20060017692, entitled "Methods And Apparatus For Operating A Portable Device Based On An Accelerometer," both of which are incorporated herein by reference. In one embodiment, information is displayed on the touchscreen display in a portrait or landscape view based on an analysis of data received from one or more accelerometers.

[0050] In one embodiment, the software components stored in memory 102 may include an operating system 126, a communications module (or set of instructions) 128, a contact / motion module (or set of instructions) 130, a graphics module (or set of instructions) 132, a text input module (or set of instructions) 134, a global positioning system (GPS) module (or set of instructions) 135, and an application (or set of instructions) 136.

[0051] Operating system 126 (e.g., Darwin, RTXC, LINUX, UNIX, OS X, WINDOWS, or an embedded operating system such as VxWorks) comprises various software components and / or drivers for controlling and managing general system tasks (e.g., memory management, storage control, power management, etc.) and facilitating communication between various hardware and software components.

[0052] Communications module 128 facilitates communication with other devices via one or more external ports 124 and also includes various software components for handling data received by RF circuitry 108 and / or external port 124. External port 124 (e.g., Universal Serial Bus (USB), FIREWIRE®, etc.) is adapted to couple directly to other devices or indirectly via a network (e.g., the Internet, a wireless LAN, etc.). In one embodiment, the external port is a multi-pin (e.g., 30-pin) connector that is the same as, similar to, and / or compatible with the 30-pin connector used on iPod (trademark of Apple Computer, Inc.) devices.

[0053] The contact / motion module 130 can detect contact with the touchscreen 112 (associated with the display controller 156) and other touch-sensitive devices (e.g., a touchpad or physical click wheel). The contact / motion module 130 includes various software components for performing various operations related to contact detection, such as determining whether contact occurs, determining whether there is contact movement and tracking the movement across the touchscreen 112, and determining whether contact is broken (i.e., whether contact has ceased). Determining contact movement includes determining the speed (magnitude), velocity (magnitude and direction), and / or acceleration (change in magnitude and / or direction) of the contact. These operations can apply to a single contact (e.g., a single finger contact) or multiple simultaneous contacts (e.g., "multi-touch" / multiple finger contacts). In some embodiments, the contact / motion module 130 and display controller 156 also detect contact on a touchpad. In some embodiments, the contact / motion module 130 and controller 160 detect contact on a click wheel.

[0054] Graphics module 132 comprises various known software components for rendering and displaying graphics on touchscreen 112, including components for varying the intensity of the displayed graphics. As used herein, the term "graphics" includes any object that can be displayed to a user, including, but not limited to, text, web pages, icons (such as user interface objects including soft keys), digital images, video, animation, etc.

[0055] The text input module 134, which may be a component of the graphics module 132, provides a soft keyboard for entering text in various applications (e.g., contacts 137, email 140, IM 141, blog 142, browser 147, and other applications requiring text input).

[0056] The GPS module 135 determines the location of the device and provides this information for use in various applications (e.g., to the phone 138 for use in location-based dialing, to the camera 143 and / or blogger 142 as picture / video metadata, and to applications that provide location-based services such as weather widgets, local yellow pages widgets, and map / navigation widgets).

[0057] The application 136 may include the following modules (or sets of instructions), or a subset or superset thereof: • a contacts module 137 (sometimes also referred to as an address book or contact list); ●Telephone module 138, ●Video conferencing module 139, an email client module 140; ● Instant messaging (IM) module 141; ●Blog module 142, a camera module 143 for still and / or video images, ●Video management module 144, ●Video player module 145, ●Music player module 146, ● Browser module 147, ●Calendar module 148, A widget module 149 that can include a weather widget 149-1, a stock widget 149-2, a calculator widget 149-3, an alarm clock widget 149-4, a dictionary widget 149-5, and other widgets provided by the user, as well as user-created widgets 149-6; a widget creator module 150 for creating user-generated widgets 149-6; and / or ●Search module 151.

[0058] Other applications 136 that may be stored in memory 102 include, for example, notepad and other word processing applications, JAVA enabled applications, encryption, digital rights management, voice recognition, and voice duplication.

[0059] In conjunction with RF circuitry 108, touchscreen 112, display controller 156, contact module 130, graphics module 132, and text input module 134, instant messaging module 141 can be used to enter sequences of characters corresponding to instant messages, modify previously entered characters, send instant messages (e.g., using Short Message Service (SMS) or Multimedia Message Service (MMS) protocols for telephone-based instant messaging, or XMPP, SIMPLE, or IMPS for Internet-based instant messaging), receive instant messages, and view IM transcripts containing messages exchanged between the user of portable device 100 and other individuals. In some embodiments, sent and / or received instant messages can include graphics, photos, audio files, video files, and / or other attachments supported by MMS and / or Enhanced Messaging Service (EMS). As used herein, the term "instant messaging" refers to both telephone-based messages (e.g., messages sent using SMS or MMS) and Internet-based messages (e.g., messages sent using XMPP, SIMPLE, or IMPS). An embodiment of a user interface and associated processes using instant messaging module 141 is described in detail below.

[0060] It should be noted that the modules and applications described above (including instant messaging module 141) correspond to sets of instructions for performing one or more functions described above. These modules (i.e., sets of instructions) need not be implemented as separate software programs, procedures, or modules; thus, various subsets of these modules may be combined or otherwise rearranged in various embodiments. In some embodiments, memory 102 may store a subset of the modules and data structures described above. Additionally, memory 102 may store additional modules and data structures not described above.

[0061] In one embodiment, device 100 is a device in which operation of a defined set of functions on the device is performed exclusively through touchscreen 112 and / or touchpad. By using the touchscreen and / or touchpad as the primary input / control devices for operating device 100, the number of physical input / control devices (pushbuttons, dials, etc.) on device 100 can be reduced.

[0062] A defined set of functions that can be performed exclusively through the touchscreen and / or touchpad includes navigation through a user interface. In some embodiments, the touchpad, when touched by a user, navigates device 100 to a main, home, or root menu from a user interface that can be displayed on device 100. In such embodiments, the touchpad can be referred to as a "menu button." In other embodiments, the menu button can be a physical push button or other physical input / control device instead of a touchpad.

[0063] FIG. 2 illustrates a portable electronic device 100 having a touchscreen 112 according to one embodiment. The touchscreen can display one or more graphics. In this embodiment, and other embodiments described below, a user can select one or more graphics by, for example, contacting or touching the graphics with one or more fingers 202 (not drawn to scale) or a stylus (not shown). In some embodiments, selection of one or more graphics occurs when a user breaks contact with one or more graphics. In some embodiments, contact can include gestures such as one or more taps, one or more swipes (left to right, right to left, up and / or down), and / or rolling a finger in contact with the device 100 (left to right, right to left, up and / or down). In some embodiments, accidental contact with a graphic does not result in selection of the graphic. For example, a swipe gesture wiping over an application icon may not select the corresponding application when the gesture corresponding to selection is a tap. In other words, the portable electronic device 100 interprets the meaning of the gesture and acts accordingly after considering which application or module is being used at the time.

[0064] The device 100 may also include one or more physical buttons, such as a "home" or menu button 204. As mentioned above, the menu button 204 can be used to navigate to any application 136 in the set of applications that can run on the device 100. Alternatively, in some embodiments, the menu button is implemented as a soft key in the GUI of the touch screen 112.

[0065] In one embodiment, device 100 includes a touchscreen 112, a menu button 204, a pushbutton 206 for powering the device on / off and locking the device, and volume control button(s) 208. Pushbutton 206 can be used to power the device on / off by pressing and holding the button down for a specified time interval, lock the device by pressing and releasing the button before the specified time interval has elapsed, and / or unlock the device or begin the unlocking process. In another embodiment, device 100 can also accept verbal input to activate or deactivate certain functions through microphone 113.

[0066] Embodiments of user interfaces (UIs) and associated processes that may be implemented in portable electronic device 100 are described below.

[0067] 3 illustrates an example user interface for unlocking a portable electronic device according to one embodiment. In one embodiment, user interface 300 includes the following elements, or a subset or superset thereof: ● An unlock image 302 that is moved with a finger gesture to unlock the device; ● An arrow 304 that provides a visual cue for the unlock gesture; Channel 306 provides an additional cue for the unlock gesture; ●Time 308, ●Day 310, ● Date 312, and ●Wallpaper video 314.

[0068] In one embodiment, the device detects contact with the touch-sensitive display (e.g., a user's finger touching or near the unlock image 302) while the device is in the user interface locked state. The device moves the unlock image 302 based on the contact. The device transitions to the user interface unlocked state if the detected contact corresponds to a defined gesture, such as moving the unlock image across channel 306. Conversely, the device remains in the user interface locked state if the detected contact does not correspond to a defined gesture. As noted above, the process of unlocking a device using gestures on a touchscreen is described in U.S. patent application Ser. No. 11 / 322,549, filed Dec. 23, 2005, entitled "Unlocking a Device by Performing Gesture on an Unlock Image," which is incorporated herein by reference.

[0069] 4 illustrates an example user interface for a menu of applications on a portable electronic device according to one embodiment. In one embodiment, user interface 400 includes the following elements, or a subset or superset thereof: ● A signal strength indicator 402 for wireless communications; ●Time 404, ● Battery status indicator 406, A tray 408 with icons for frequently used applications such as: ○Telephone 138, An email client 140 that may include an indicator 410 of the number of unread emails; ○ Browser 147, ○Music player 146, and Icons for other applications, such as: ○IM141, ○Video management 144, ○ Camera 143, ○Video player 145, ○Weather 149-1, ○ Stock 149-2, ○Blog 142, ○Calendar 148, ○Calculator 149-3, ○Alarm clock 149-4, Dictionary 149-5, and ○User-generated widget 149-6.

[0070] In one embodiment, the UI 400 displays all available applications 136 on one screen, eliminating the need to scroll through the list of applications (e.g., with a scroll bar). In one embodiment, as the number of applications increases, the size of the icons corresponding to the applications decreases so that all applications can be displayed on a single screen without scrolling. In one embodiment, having all applications on one screen, along with a menu button, allows a user to access a desired application with at most two inputs: activating the menu button 204 (e.g., by tapping or other finger gesture on the icon corresponding to the application) and then activating the desired application.

[0071] In one embodiment, UI 400 provides unified access to both widget-based and non-widget-based applications. In one embodiment, all widgets, whether user-created or not, are displayed on UI 400. In another embodiment, activating an icon for a user-created widget 149-6 can lead to another UI (not shown) that includes the user-created widget or an icon corresponding to the user-created widget.

[0072] In one embodiment, a user can rearrange icons in UI 400 using, for example, the process described in U.S. patent application Ser. No. 11 / 459,602, entitled "Portable Electronic Device With Interface Reconfiguration Mode," filed July 24, 2006, which is incorporated herein by reference. For example, a user can use finger gestures to move application icons to and from tray 408.

[0073] In one embodiment, UI 400 includes a gauge (not shown) that displays updated account usage metrics for an account (e.g., a cellular phone account) associated with device usage, as described in U.S. patent application Ser. No. 11 / 322,552, entitled "Account Information Display For Portable Communication Device," filed Dec. 23, 2005, which is incorporated herein by reference.

[0074] 5 is a diagram illustrating an example user interface for listing instant message conversations on a portable electronic device according to one embodiment. An instant message conversation comprises a set of messages exchanged between a user of the portable electronic device and one or more other individuals. In one embodiment, user interface 500 includes the following elements, or a subset or superset thereof: - 402, 404 and 406 mentioned above; "Instant Message" or other similar label 502; Name 504 of an individual with whom the user had an instant message conversation (e.g., Jane Doe 504-1), or phone number if a corresponding individual name is not available (e.g., 408-123-4567) 504-3), the text of the last message or portion thereof in the conversation 506 (note that the last message is the last one sent or received by the user); the date 508 and / or time of the last message in the conversation; a selection icon 510 that, when activated (e.g., by tapping the icon with a finger), initiates a transition to the UI for the corresponding conversation (e.g., FIG. 6A for Jane Doe 504-1); an edit icon 512 that, when activated (e.g., by tapping the icon with a finger), initiates a transition to a UI for deleting a conversation (e.g., FIG. 7); a message creation icon 514 that, when activated (e.g., by tapping the icon with a finger), initiates a transition to the user's contact list (e.g., FIG. 8A); and • A vertical bar 516 that helps the user understand which portion of the list of instant message conversations is being displayed.

[0075] 10 is a flowchart illustrating a process for displaying a list of instant message conversations on the touchscreen of a portable electronic device according to one embodiment. Upon detecting 1002 a finger gesture (e.g., finger tap 412 on IM icon 141 in FIG. 4), IM module 141 identifies 1004 a set of IM conversations and displays 1006 them on the touchscreen. To allow editing of an existing conversation or starting a new one, the portable device may display 1008 an edit icon 512 and a create message icon 514, respectively, on the touchscreen. The portable device monitors 1010 for user contact with the touchscreen and takes action accordingly.

[0076] As shown in FIG. 5, the list of conversations can be displayed in chronological order. The conversation with "Jane Doe" is at the top because it is the only conversation that contains at least one message that occurred today 508-1, assumed in this example to be January 29, 2006. In some embodiments, the conversations are ordered by the timestamp of the most recent message in each conversation. In some embodiments, conversations that contain at least one message that have not been checked by the user are highlighted on the touchscreen. For example, the third conversation in the list is displayed using bold characters to suggest that the user has not checked recent messages sent by the individual at the phone number 408-123-4567.

[0077] In some embodiments, the name 504 associated with an instant message conversation is determined by locating an entry in the user's contact list 137 that includes the phone number used by the instant message conversation. If no such entry is found, only the phone number is displayed (e.g., 504-3). In some embodiments, if another individual sends a message from two or more different phone numbers, messages appear in the same conversation that include the individual's name if all phone numbers used are found in the same entry (i.e., for the other individual) in the user's contact list 137. In some embodiments, a conversation includes messages sent from phone numbers and / or email addresses associated with the other individual. In some embodiments, messages sent by the other individual include a first message sent from a first address associated with the other individual and a second message sent from a second address associated with the other individual that is different from the first address. In some embodiments, the first address is a phone number and the second address is an email address. In some embodiments, the first and second addresses are two different phone numbers. In some embodiments, the first and second addresses are two different email addresses.

[0078] In other embodiments, if another individual sends a message from two or more different phone numbers, the message will appear in different conversations corresponding to the different numbers, and the phone numbers or other identifiers will be displayed next to the individual's name to distinguish these conversations from one another.

[0079] In one embodiment, the name field of an instant message conversation contains the names or other identifiers of multiple parties participating in the conversation as message recipients and / or senders. If there is not enough room to display all names, a selected subset of the names is displayed with a symbol such as "..." at the end, indicating that more parties are present in the conversation. By default, a message by a user of a portable electronic device is sent to all parties in the conversation. For simplicity, the following embodiment of an IM conversation described herein includes only two parties: the user and another party. However, one skilled in the art will recognize that the methods described herein can also be applied to IM conversations involving three or more parties.

[0080] Automatic binning of instant messages into "conversations" (instant messages exchanged between a device user and each person or phone number) makes it easy for users to conduct and track instant message exchanges with multiple parties. As described below, users can view older messages exchanged between the user and other parties, as well as view the last message sent by the other party.

[0081] In one embodiment, vertical bar 516 is temporarily displayed after an object is detected on or near the touchscreen display (e.g., a finger touch is detected anywhere on the list of instant message conversations). In one embodiment, vertical bar 516 has a vertical position of the top of the displayed portion of the list that corresponds to the vertical position of the displayed portion of the list within the list. In one embodiment, vertical bar 516 has a vertical length that corresponds to the portion of the list that is displayed. In one embodiment, if the entire list of IM conversations can be displayed simultaneously on touchscreen 112, vertical bar 516 is not displayed. In one embodiment, if the entire list of IM conversations can be displayed simultaneously on touchscreen 112, vertical bar 516 is displayed with a length that corresponds to the length of the list display area (e.g., as shown in FIG. 5 ).

[0082] As described above, the portable device monitors (1010) user contact with the conversation list. When a user swipes (1012) their finger or stylus substantially vertically across the touchscreen, this user contact can be interpreted as a scrolling gesture. In some embodiments, the scrolling gesture is independent of the horizontal position of the user contact with the touchscreen display. In some embodiments, the scrolling gesture is substantially independent of the horizontal position of the user contact with the touchscreen display (e.g., one or more side regions of the touchscreen display may be reserved for other functions, e.g., functions corresponding to icons, soft keys, or application navigation functions that are not available for scrolling gestures). Thus, the portable electronic device scrolls (1020) through the conversation list to display different portions of the conversation list.

[0083] 5, the conversation list moves in a direction consistent with the scroll gesture 516. If the scroll gesture is downward (or upward), the conversation list also moves downward (or upward). Scrolling downward through the conversation list typically scrolls the list to earlier entries in the list until the first entry (e.g., Jane Doe 504-1) is reached. However, if the user does not have many IM conversations, the portable electronic device may display the entire conversation list, and the scroll gesture has no effect.

[0084] When the user taps 1018 the edit icon 512 using their finger or stylus, the portable electronic device replaces the conversation list UI with a new UI that allows the user to edit the conversation. A detailed description of the conversation edit feature is provided below with reference to Figures 7 and 16.

[0085] Similarly, when the user taps 1019 the create message icon 514, the portable electronic device replaces the conversation list UI with a new UI that allows the user to create a new instant message and, therefore, a new conversation. A more detailed description of this feature is provided below with reference to Figures 8A-8B, 9, and 19.

[0086] If the user taps 1014 on a particular conversation in the list, the portable electronic device interprets the tap as a gesture indicating that the user wants to check messages associated with the user-selected conversation. Accordingly, the portable electronic device replaces the conversation list UI shown in Figure 5 with the conversation UI shown in Figure 6A.

[0087] 6A-6K illustrate example user interfaces for entering instant message text according to one embodiment.

[0088] In one embodiment, user interface 600A (FIG. 6A) includes the following elements, or a subset or superset thereof: - 402, 404 and 406 mentioned above; • A name 504 corresponding to the telephone number used in the instant message conversation (or the telephone number itself if the name is not available); an instant message icon 602 that, when activated (e.g., by tapping the icon with a finger), initiates a transition to a UI (e.g., UI 500) that lists instant message conversations; Instant messages 604 from other parties, typically listed neatly along one side of the UI 600A; • Instant messages 606 to other parties, typically listed neatly along the opposite side of UI 600A to show the back-and-forth interaction of messages in the conversation; • timestamps 608 for at least some of the instant messages; ●Text entry box 612, • a send icon 614 that, when activated (e.g., by tapping the icon with a finger), initiates sending of the message in the text box 612 to another party (e.g., Jane Doe 504-1); ● a character keyboard 616 for entering text into the box 612; another keyboard selector icon 618 that, when activated (e.g., by tapping the icon with a finger), initiates the display of a different keyboard (e.g., 624, FIG. 6C); • a send icon 620 that, when activated (e.g., by tapping the icon with a finger), initiates sending of the message in the text box 612 to another party (e.g., Jane Doe 504-1); a shift key 628 that, when activated (e.g., by tapping a finger on an icon), capitalizes the next character selected on the character keyboard 616; and • A vertical bar 630 that helps the user understand which part of the list of instant messages in an IM conversation is displayed.

[0089] 11 is a flow chart illustrating a process for displaying a user-selected instant message conversation upon detecting a predetermined user contact with the touchscreen of a portable electronic device according to one embodiment. In this example, in response to a finger gesture 518 (FIG. 5) in the conversation with Jane Doe, the conversation with Jane Doe is displayed.

[0090] Upon detecting 1102 the user's selection of a conversation with Jane Doe, the IM module 141 identifies 1104 the set of instant messages 604 and 606 associated with the conversation and chronologically displays 1106 the instant messages in a message display area on the touchscreen. Because a user viewing an existing conversation may wish to compose a new instant message to another individual, the portable electronic device also displays 1108 a message compose area on the touchscreen. In one embodiment, the message compose area includes a text box 612 displaying characters entered by the user, a send message icon 614, a character keyboard 616, and a keyboard selector icon 618. The portable electronic device monitors 1110 the user's contact with the touchscreen and responds accordingly.

[0091] In one embodiment, the portable electronic device receives an instant message while the device user is using another application, for example, browsing a web page using browser 147 or listening to music using music player 146. In this case, the device can replace the user interface of the ongoing application with a new user interface on touch screen 112 or overlay the new user interface on top of the user interface for the ongoing application. FIG. 21 illustrates an example user interface for alerting a user to a new instant message according to one embodiment. This user interface may or may not abort or terminate the ongoing application. For example, the user may still be listening to music when this new user interface appears on touch screen 112. This is true even if the user subsequently chooses to activate IM module 141 and respond to the new message.

[0092] In one embodiment, the new user interface (eg, UI 2100, FIG. 21) includes the following elements, or a subset or superset thereof: the name of the instant message sender (e.g., Jane Doe) 2102, which can be determined by matching the phone number of the incoming instant message with phone numbers in the user's contacts 137; A newly received instant message or portion thereof 2104 (e.g., "Do U want 2..."); a first action icon 2106, for example, "Ignore," and ● A second action icon 2108, e.g., "View." User selection of "Ignore" icon 2106 restores the user interface of the ongoing application, and the user can resume the operation interrupted by the incoming message. User selection of "View" icon 2108 bypasses user interface 500 and takes the user directly to user interface 600A, which contains the new instant message. The user can then perform operations related to the message, as described below.

[0093] In one embodiment, the portable electronic device can receive instant messages while it is in locked mode. In this case, the device can include a visual alert indicating the arrival of a new message on user interface 300 and / or generate an audible alert through the device's speaker 111. If the device user unlocks the device's touchscreen 112 in response to the visual and / or audible alert, the user can see user interface 600A on the touchscreen (but not user interface 400).

[0094] As shown in FIG. 6A , instant messages 604 from Jane Doe may be displayed on the left side of the message display area, with the most recent message (e.g., 604-2) at the bottom. Messages sent by the user to Jane Doe are on the opposite side of the display area. The relative vertical positions of the messages correspond to the order in which they were exchanged between the device user and Jane Doe. Selected timestamps 608 further indicate when these messages were exchanged. In some embodiments, timestamps are displayed adjacent to their associated messages. If the message display area does not currently have enough room to display the timestamps for each message, the device can select to display timestamps for a subset of the messages, e.g., timestamp 608-1 corresponding to message 604-1 at the top of the message area and timestamp 608-2 corresponding to message 606-2 at the bottom of the message area. In some embodiments, the device can display more timestamps for messages in the middle, for example, if the time gap between the two messages is higher than a specified threshold. From instant messages, users can easily grasp the topic of a conversation. If desired, the user can browse other older messages not currently on the display by applying 1112 a scroll gesture 610 to the message display area. In response, the portable electronic device scrolls 1124 through the set of message conversations. In some embodiments, the scroll gesture is independent of the horizontal position of the user's contact with the touchscreen display. In some embodiments, the scroll gesture is substantially independent of the horizontal position of the user's contact with the touchscreen display, as described above.

[0095] In one embodiment, the device highlights certain portions of incoming and outgoing messages using, for example, underlining, different font sizes or styles, and / or colors. Typically, the highlighted portions are deemed to have special connotations, such as phone numbers, URLs, stock tickers, or contact names. These highlighted message portions are user-selectable. For example, when the user gestures with their finger over the highlighted portion "apple.com" in message 604-2, browser 147 is activated, taking the user to the home page of the website www.apple.com. Similarly, when the user gestures with their finger over a phone number, phone 138 is activated, initiating a call to that phone number.

[0096] In some embodiments, a vertically downward scroll gesture scrolls the conversation downward, thereby revealing older messages in the conversation. In some embodiments, a vertically upward scroll gesture scrolls the conversation upward, thereby revealing newer, more recent messages in the conversation. In some embodiments, as described above, the last message in the conversation (e.g., 606-2) is displayed in the list of instant message conversations 500 (e.g., 506-1).

[0097] In some embodiments, vertical bar 630 is temporarily displayed after an object is detected on or near the touchscreen display (e.g., a finger touch is detected anywhere in the list of instant messages). In some embodiments, vertical bar 630 has a vertical position of the top of the displayed portion of the list that corresponds to the vertical position of the displayed portion of the list within the list. In some embodiments, vertical bar 630 has a vertical length that corresponds to the portion of the list that is displayed. For example, in FIG. 6A , the vertical position of vertical bar 630 indicates that the bottom of the list of messages (corresponding to the most recent message) is displayed, and the vertical length of vertical bar 630 indicates that approximately half of the messages in the conversation are displayed.

[0098] In response to the user's finger gestures on different letter keys of the keyboard (1114), a new instant message is composed in text box 612. A description of this composition process is provided below with reference to FIG. 12. In one embodiment, keyboard 616 of FIG. 6A has only 26 English letters due to the limited size of the touchscreen. To enter characters such as numbers, punctuation marks, and other special symbols, the user must tap (1120) on keyboard selector icon 618 and / or tap (1116) on shift key icon 628 to bring up an additional keyboard or switch the existing keyboard to a different display mode (e.g., from uppercase / lowercase to lowercase / uppercase). A detailed description of these processes is provided below with reference to FIGS. 13 and 14, respectively. After completing the new message, the user taps send message icon 614 or 620 to send the message to other participants in the conversation (1118). A more detailed description of the send process is provided below with reference to FIG. 15.

[0099] 12 is a flowchart illustrating a process for displaying user-entered characters and word suggestions, if any, according to one embodiment. Upon detecting user selection of a character key (1202), the portable electronic device displays the user-selected character in text box 612 (1204). To facilitate the process of composing a new message, the portable electronic device determines (1206) whether it can present word suggestions based on the user input. To do this, the portable electronic device may apply a language-based algorithm (e.g., as described in U.S. patent application Ser. No. 11 / 549,624, entitled "Method, System, and Graphical User Interface for Text Entry with Partial Word Display," filed Oct. 13, 2006, which is incorporated herein by reference in its entirety) to the user input to display one or more related words from its database (1208).

[0100] As shown in FIG. 6B, user interface 600B includes the following elements, or a subset or superset thereof: - 402, 404, 406, 602, 604, 606, 608, 612, 614, 616, 618, 620 mentioned above, and • A word suggestion area 622 that provides a list of possible words to complete the word fragment being typed by the user in the text box 612 .

[0101] In this example, based on the user input string "vacat," the portable electronic device displays three possible words in area 622: "vacant," "vacate," and "vacation." The user can select any of them with a finger tap on each word icon. Alternatively, the user can ignore all computer-suggested words by tapping on the exact match for their input. In some embodiments, the portable electronic device saves the user input as a new word in its database. If the user subsequently enters the same string or a subset thereof, the portable electronic device can display this new word as one of the word suggestions. In some embodiments, the word suggestion area does not appear in UI 600B until after a specified time delay (e.g., 2-3 seconds) in text has been entered by the user. In some embodiments, the word suggestion area is not used or can be turned off by the user.

[0102] If none is suggested by the portable electronic device or the option is turned off, the portable electronic device resumes monitoring for user contact with the touchscreen and takes action accordingly (1210).

[0103] Additional discussion of providing word recommendations can be found in U.S. patent application Ser. No. 11 / 620,642, filed Jan. 5, 2007, entitled "Method, System, and Graphical User Interface for Providing Word Recommendations," the contents of which are incorporated herein by reference in their entirety.

[0104] As mentioned above, keyboard 616 may not include all characters that a user desires to input. Various solutions exist for introducing additional characters. For example, as shown in FIG. 6B, a user can tap keyboard selection icon 618 to replace the current character keyboard 616 with a new keyboard that includes a different set of characters, such as numbers and / or punctuation marks.

[0105] 13 is a flowchart illustrating a process for displaying keyboards upon detecting user contact with a keyboard selection icon according to one embodiment. In response to a user selection of the keyboard selector 618 (1302), the portable electronic device checks (1304) what type of keyboard is requested. Based on the type of keyboard requested, the portable electronic device displays (1308) either a literal keyboard or a non-literal keyboard (1306). In one embodiment, the meaning of the user contact with the keyboard selector icon 618 depends on the current display mode of the keyboard. Following display of the requested keyboard, the portable electronic device resumes monitoring (1310) for user contact with the touchscreen.

[0106] As shown in FIG. 6C, after a user finger gesture on the keyboard selector icon 618 in FIG. 6B, a new user interface 600C is rendered on the touch screen with the following elements or a subset or superset: - 402, 404, 406, 602, 604, 606, 608, 612, 614, 620, and 622 mentioned above; Another keyboard 624, which is primarily made up of numbers and punctuation marks, with frequently used punctuation keys (e.g., period key 631, comma key 633, question mark key 635, and exclamation mark key 637) made larger than the other keys; a character keyboard selector icon 626 that, when activated (e.g., by tapping the icon with a finger), initiates the display of a character keyboard (e.g., 616, FIG. 6A); and • A shift key 628 that, when activated (eg, by tapping a finger on an icon), initiates the display of yet another keyboard (eg, 639, FIG. 6D).

[0107] Note that the non-character keyboard selector 618 of Figure 6B is now replaced with the character keyboard selector 626 of Figure 6C. In one embodiment, a period key 631 and a comma key 633 are positioned near the keyboard selector icon 626 to reduce the distance a user's fingers must travel to enter frequently used periods and commas.

[0108] However, the alternate keyboard 624 does not have to include all of the operators. For example, it may not have operators like "+", "-", "*", or " / ". A finger gesture on the keyboard selector 626 returns to the character keyboard 616 rather than a new keyboard. In some embodiments, the user can tap another multi-function key, such as the shift key 628, to bring up an additional keyboard.

[0109] In one embodiment, like the keyboard selector icons (618, 626), the shift key 628 has different meanings in different contexts. Figure 14 is a flow chart illustrating a process for interpreting the meaning of a particular user contact with the shift key 628 according to one embodiment. The portable electronic device detects user selection of the shift key (1402). The portable electronic device checks what keyboard is currently displayed on the touch screen (1404). If the current keyboard is a character keyboard, a finger gesture over the shift key triggers the portable electronic device to switch the display mode of subsequent user-entered characters from uppercase to lowercase or vice versa (1406).

[0110] Returning to FIG. 6B , in one embodiment, the portable electronic device displays only the first letter “h” of the first word “how” in uppercase by default. If the user wishes to enter another capital letter in the same sentence, the user can tap the shift key 628. As a result, the shift key 628 appears visually different (e.g., a different color or shade) after the finger gesture. In one embodiment, the shift key 628 reverts to lowercase mode after the user enters the next letter in uppercase. If the user wishes to enter a series of uppercase letters, the user can maintain finger contact with the shift key 628 for a specified extended period of time (e.g., 1-3 seconds) until the shift key 628 has a new appearance. In another embodiment, the shift key 628 remains in uppercase mode for all subsequent user-entered characters until another finger gesture is detected on the shift key 628.

[0111] 14, user contact with the shift key 628 has a different meaning when the current keyboard is a non-character keyboard (e.g., another keyboard 624 in FIG. 6C). Because keyboard 624 does not have two different display modes for any of the characters, the portable electronic device replaces keyboard 624 with another non-character keyboard 639 (1408) and then waits for the next user contact with the touchscreen (1410).

[0112] FIG. 6D is a screenshot of a corresponding user interface 600D, which includes the following elements, or a subset or superset thereof: - 402, 404, 406, 602, 604, 606, 608, 612, 614, 620, 622, 626, 628, and - Yet another keyboard 639, which is primarily made up of symbols and punctuation marks, with frequently used punctuation keys (e.g., period key 631, comma key 633, question mark key 635, and exclamation mark key 637) made larger than the other keys.

[0113] Like keyboard 624, none of the characters on keyboard 639 have two different display modes. In some embodiments, the user can tap shift key 628 again to bring up more alternate keyboards with more special characters or symbols. In some embodiments, the user can tap shift key 628 again to return to alternate keyboard 624. At any time, the user can also switch back to the character keyboard by tapping keyboard selection icon 626.

[0114] Additional discussion of soft keyboard selection can be found in U.S. patent application Ser. No. 11 / 553,431, filed Oct. 26, 2006, entitled "Method, System, and Graphical User Interface for Selecting a Soft Keyboard," the contents of which are incorporated herein by reference in their entirety.

[0115] After completing a new message, the user sends the message by activating (e.g., with a finger gesture) the send message icon 614 or 620. Figure 6E shows such a user interface 600E, which includes the following elements, or a subset or superset thereof: - 402, 404, 406, 602, 604, 606, 608, 612, 614, 616, 618, 620 mentioned above, and - New instant message 6006-3 sent to the other party.

[0116] In one embodiment, this user's finger gesture moves from the text box 612 to the side of the message display area and triggers a new message animation showing the message being sent by the device user. For example, when the user triggers the send key (e.g., 614 or 620), the text in the text box 612 "pops" or otherwise emerges from the box to become part of the string of the user's message 606 to the other party. The black arrow in Figure 6E indicates the animated formation of the quote bubble 606-3. In one embodiment, the size of the quote bubble increases or decreases with the size of the message. In one embodiment, a sound, such as the sound of water dripping, is also made to notify the user when the message is sent.

[0117] 15 is a flowchart illustrating a process for sending an instant message to each recipient according to one embodiment. In response to a user selection of the send message icon (1502), the portable electronic device checks whether there is user input in the text box (1504). If there is not, the device may simply ignore the user's finger gesture on the send icon or display an error message on the touch screen (1508). In one embodiment, the visual appearance of the send icon 614 is changed (e.g., dimmed) if there is no user input in the text box.

[0118] If there is user input in the text box (1504, yes), the portable electronic device may optionally spell check the user input (1506). If there is a spelling error (1506, yes), an error message and / or word suggestion is displayed on the touch screen for the user to select (1512). If there is no spelling error, the portable electronic device may also send the message and animate the movement of the new message from the text box to the message display area (1514). The portable electronic device then monitors for user contact with the touch screen (1516).

[0119] In some embodiments, keys on keyboard 616 (FIGS. 6A, 6B, 6E-6K), 624 (FIG. 6C), and / or 639 (FIG. 6D) briefly change shape, shading, and / or color when touched / activated by the user to aid the user in learning that they have activated the desired key. In some embodiments, user selection of a key on the touchscreen with a finger gesture is accompanied by a sound for the same purpose. In other embodiments, different sounds are associated with different types of keystrokes to indicate which key was "pressed" by the user. In some embodiments, outlines or shaded areas corresponding to the user's finger contacts are shown on the keyboard to aid in user training.

[0120] In some embodiments, a user can delete an instant message from a conversation by tapping a corresponding quote bubble in the message display area with their finger. In response, the portable electronic device grays out the bubble and pops up a small window on the touchscreen. This small window can include a "Yes" icon and a "No" icon. If the user reconfirms their decision to delete the message by tapping a finger on the "Yes" icon, the portable electronic device removes the bubble from the message display area. However, if the user selects the "No" icon, the quote bubble resumes its normal appearance.

[0121] In one embodiment, user interface 600F (FIG. 6F) includes the following elements, or a subset or superset thereof: - 402, 404, 406, 612, 614, 616, 618, 620, and 628 mentioned above; a recipient input field 632 that, when activated (e.g., by tapping the field with a finger), receives and displays the phone number of the recipient of the instant message (or the recipient's name, if the recipient is already in the user's contact list); an add recipient icon 634 that, when activated (e.g., by tapping the icon with a finger), initiates a scrollable contact list (e.g., 638, FIG. 6G); and • A cancel icon 636 that, when activated (eg, by tapping the icon with a finger), cancels the new instant message.

[0122] In one embodiment, user interface 600G (FIG. 6G) includes the following elements, or a subset or superset thereof: - 402, 404, 406, 612, 614, 616, 618, 620, 628, 632, 634, and 636 mentioned above; a scrollable list 638 of contacts that match the entry in the recipient entry field 632; and • A vertical bar 640 that helps the user understand how many items in the contact list are displayed that match the entry in the recipient entry field 632 .

[0123] In one embodiment, list 638 includes contacts that match the entry in recipient entry field 632. For example, if the letter "v" is entered, contacts whose first or last name begins with "v" are shown. If the letter "va" is entered in field 632, the list of contacts is narrowed to contacts whose first or last name begins with "va," and so on, until one of the displayed contacts is selected (e.g., by tapping the contact in list 638).

[0124] In some embodiments, a user can scroll through list 638 by applying a vertical swipe gesture 642 to an area displaying list 638. In some embodiments, a vertical downward gesture scrolls down the list, and a vertical upward gesture scrolls up the list.

[0125] In one embodiment, vertical bar 640 is temporarily displayed after an object is detected on or near the touchscreen display (e.g., a finger touch is detected anywhere on list 638). In one embodiment, vertical bar 640 has a vertical position of the top of the displayed portion of the list that corresponds to the vertical position of the displayed portion of the list within the list. In one embodiment, vertical bar 640 has a vertical length that corresponds to the portion of the list that is displayed.

[0126] In one embodiment, user interfaces 600H (FIG. 6H) and 600I (FIG. 6I) include the following elements, or a subset or superset thereof: - 402, 404, 406, 612, 614, 616, 618, 620, 628, 632, 634, and 636 mentioned above; • Suggested words 644 adjacent to the word being entered; the suggested word on the space bar of the keyboard 616, and / or • An insertion marker 656 (eg, a cursor, insertion bar, insertion point, or pointer).

[0127] In some embodiments, activating suggested word 644 (e.g., by tapping a finger on the suggested word) replaces the typed word with suggested word 644. In some embodiments, activating suggested word 646 (e.g., by tapping a finger on the space bar) replaces the typed word with suggested word 646. In some embodiments, a user can configure whether suggested words 644 and / or 646 are shown (e.g., by setting a user preference).

[0128] In one embodiment, to provide feedback to the user, a letter is briefly enlarged when it is selected (e.g., in Figure 6H, after typing "din", the "N" is briefly enlarged).

[0129] In one embodiment, user interfaces 600J (FIG. 6J) and 600K (FIG. 6K) include the following elements, or a subset or superset thereof: - 402, 404, 406, 612, 614, 616, 618, 620, 628, 632, 634, 636, and 656 mentioned above; • A graphical extension 650 that helps the user adjust the position of an extension insertion marker 657 (sometimes called an "insertion point extender"); ● Extended insertion marker 657, and • A vertical bar 658 that indicates which portion of an instant message containing multiple lines of text is being displayed.

[0130] In some embodiments, finger contact 648-1 at or near insertion marker 656 initiates the display of insertion point magnifier 650 and expanded insertion marker 657-1. In some embodiments, as the finger contact is moved on the touchscreen (e.g., to position 648-2), the expanded insertion marker correspondingly moves (e.g., to 657-2) and the insertion point magnifier 650 correspondingly moves. Thus, insertion point magnifier 650 provides an efficient way to position a cursor or other insertion marker using finger input on the touchscreen. In some embodiments, magnifier 650 remains visible and can be repositioned (e.g., from 648-1 to 648-2 to 648-3) as long as continuous contact with the touchscreen is maintained.

[0131] In some embodiments, the portable electronic device displays a graphic and also displays an insertion marker (e.g., marker 656, FIG. 6I) at a first location in the graphic on the touchscreen display (e.g., FIG. 6I). In some embodiments, the insertion marker 656 is a cursor, insertion bar, insertion point, or pointer. In some embodiments, the graphic includes text (e.g., text in box 612, FIG. 6I).

[0132] A finger contact (e.g., contact 648-1, FIG. 6I) is detected on the touchscreen display. In some embodiments, the location of the finger contact is close to the location of the insertion marker. In some embodiments, the location of the finger contact is somewhere within the text entry area (e.g., box 612, FIG. 6I).

[0133] In response to the detected finger contact, an insert marker is expanded on the touchscreen display from a first size (e.g., marker 656, FIG. 6I) to a second size (e.g., marker 657-1, FIG. 6J), and a portion of a graphic on the touchscreen display (e.g., portion 650-1, FIG. 6J) is expanded from its original size to the expanded size.

[0134] In some embodiments, the portion of the graphic that is expanded includes the insertion marker and the adjacent graphic. In some embodiments, after the insertion point and the portion of the graphic are expanded, a graphic is displayed that includes the insertion marker and the adjacent graphic in its original size and expanded size.

[0135] Movement of the finger contact (eg, from 648-1 to 648-2, FIG. 6J) is detected on the touchscreen display.

[0136] The extended insertion marker is moved based on the detected movement of the finger contact from a first position (eg, 657-1, FIG. 6J) to a second position (eg, 657-2, FIG. 6J) on the graphic.

[0137] In some embodiments, the portion of the expanded graphic changes as the insertion marker moves from a first position to a second position (e.g., from 650-1 to 650-2, FIG. 6J). In some embodiments, the portion of the expanded graphic is displayed as a predetermined shape. In some embodiments, the portion of the expanded graphic (e.g., 650, FIG. 6J) is displayed as a circle. In some embodiments, the expanded insertion marker is within a circle.

[0138] In some embodiments, the detected movement of the finger contact has a horizontal component on the touchscreen display and a vertical component on the touchscreen display. In some embodiments, moving the expanded insertion marker 657 based on the detected movement of the finger contact includes moving the expanded insertion marker and the expanded portion of the graphic based on the horizontal component of the movement of the finger contact if the finger contact moves outside of the text entry area without breaking contact. For example, in FIG. 6I , if the finger contact moves from 648-2 (inside the text entry area 612) to 648-3 (inside the keyboard area), the expanded insertion marker 657 and the expanded portion of the graphic 650 may move horizontally along the bottom of the text entry area based on the horizontal component of the movement (not shown) from 648-2 to 648-3.

[0139] In one embodiment, moving the extended insertion marker based on the detected movement of the finger contact includes moving the extended insertion marker in a first area of ​​the touch screen that includes characters entered using a soft keyboard (e.g., text box 612, FIG. 6J), where the soft keyboard is located in a second area of ​​the touch screen away from the first area (e.g., keyboard 616, FIG. 6I).

[0140] In one embodiment, the expanded insert marker is contracted from the second size to the first size (e.g., insert marker 656, FIG. 6K) when finger contact with the touchscreen display is broken. In one embodiment, the contracting includes an animation of expanded insert marker 657 contracting to insert marker 656 in the second position.

[0141] In one embodiment, the extended portion 650 of the graphic is contracted when finger contact with the touchscreen display is no longer detected for a predetermined period of time.

[0142] A graphical user interface of a portable electronic device with a touchscreen display includes an insertion marker and a graphic. In response to detecting a finger contact 648 with the touchscreen display, the insertion marker expands from a first size 656 to a second size 657, and a portion of the graphic is expanded. In response to detecting movement of the finger contact on the touchscreen display, the expanded insertion marker is moved based on the detected movement of the finger contact from a first location 657-1 on the graphic to a second location 657-2 on the graphic.

[0143] As described above with reference to FIG. 6E, a user's finger selection of send key 614 triggers an animation of the message moving from text box 612 into the message display area. In some embodiments, before sending a message, the text box expands in size as text is entered (e.g., from one line of text in FIG. 6H to two lines of text in FIG. 61). In some embodiments, text box 612 does not have enough room to display the entire message if it has too many lines of text (indicated by short vertical bar 658). When a quote bubble containing a multi-line message emerges from text box 612, it gradually increases in size until a specified condition is met (e.g., the bubble has enough room to contain the entire message and / or the bubble's size reaches a threshold determined statically or dynamically by the device based on the number of existing messages in the conversation). For example, if the text box shows three lines of a ten-line instant message, the quote bubble may grow from a three-line quote bubble to a ten-line quote bubble during the animation of the message moving from the text box 612 to the message display area.

[0144] Further discussion regarding positioning of insertion markers can be found in U.S. patent application Ser. No. 11 / 553,436, filed Oct. 26, 2006, entitled "Method, System, And Graphical User Interface For Positioning An Insertion Marker In A Touch Screen Display," the contents of which are incorporated herein by reference in their entirety.

[0145] In addition to deleting individual messages from a conversation, an entire conversation can be deleted via edit icon 512 in Figure 5. Figure 7 illustrates an example user interface for deleting an instant message conversation according to one embodiment. In one embodiment, user interface 700 includes the following elements, or a subset or superset thereof: - 402, 404, 406, 504, 506, 508, 510 mentioned above, ● Delete icon 702, ●Removal icon 704, and ●Exit icon 706.

[0146] 16 is a flowchart illustrating a process for displaying a list of instant message conversations for editing according to one embodiment. Upon detecting 1602 a user selection of edit icon 512, the portable electronic device associates 1604 a delete icon 702 with each conversation (e.g., delete icon 702 appears next to each conversation). Additionally, the portable electronic device replaces 1606 edit icon 512 with end icon 706 and monitors 1608 for user contact with the touchscreen.

[0147] If the user swipes 1610 their finger or stylus in a substantially vertical direction on the touchscreen, the portable electronic device scrolls 1616 through the conversation list. If the user activates a delete icon (e.g., with a finger gesture), the portable electronic device continues with the deletion process for the corresponding conversation. A detailed description of an exemplary conversation removal process is provided below with reference to Figures 17 and 18. However, if the user touches the end icon, the portable electronic device removes all delete icons 702 from the touchscreen and returns to the conversation list UI as shown in Figure 5.

[0148] FIG. 17 is a flowchart illustrating a process for a user to edit a selected instant messaging conversation according to one embodiment. Upon detecting a user selection of a delete icon associated with the conversation (1702), the portable electronic device changes the appearance of the delete icon (e.g., rotates the selected delete icon 702-4, FIG. 7, 90 degrees) (1704). The portable electronic device associates a confirmation icon (e.g., remove icon 704) with the selected conversation (1706). In one embodiment, at most one confirmation is displayed on the touchscreen at a time during the editing process. Based on the user's next contact with the touchscreen (1708), the portable electronic device can perform different operations on the conversation list. For example, the device can scroll the list up / down in response to a scroll gesture by the user (1710, 1718). The device can return to the conversation list UI in response to a finger gesture on the exit icon (1714).

[0149] 18 is a flowchart illustrating the process of deleting a user-selected instant messaging conversation or exiting conversation editing mode according to one embodiment. If the user selects the confirmation icon (1712, 1802), the portable electronic device removes the conversation from the touchscreen (1804). If the deleted conversation is not the last conversation in the list, the portable electronic device may shift other conversations up to fill the space left by the deleted conversation (1806). In addition to the confirmation icon 704, a finger gesture (1716, 1803) on the modified delete icon 702-4, or, in one embodiment, anywhere on the touchscreen, indicates that the user decides not to delete the conversation. Accordingly, the portable electronic device changes the delete icon back to its original appearance (1805) and removes the confirmation icon from the touchscreen (1807).

[0150] Following operation 1806 or 1807, the portable electronic device resumes monitoring 1808 for user contact with the touchscreen. For example, when the user is finished deleting the IM conversation, they can activate the end icon 706 by tapping it with their finger 1814, and the device returns to UI 500. The user can delete another conversation by activating its associated delete icon 1812. If there is a long list of conversations that fills more than the screen area, the user can scroll the list 1810, 1816 using vertical up and / or vertical down gestures 708 on the touchscreen.

[0151] This conversation removal process, which requires multiple gestures by the user on different portions of the touchscreen (e.g., delete icon 702-4 and confirm icon 704 are on opposite sides of the touchscreen), can reduce the chances that the user will accidentally delete a conversation or other similar item.

[0152] Referring again to FIG. 5, a user can start a new conversation with another individual by activating the create message icon 514 (e.g., with a finger tap or other gesture). FIG. 19 is a flowchart illustrating a process for displaying a list of contacts for a user to select from to send an instant message, according to one embodiment. After detecting the user's selection of the create message icon (1902), the portable electronic device, not knowing to whom this new conversation is directed, identifies (1904) a set of contacts from the user's address book or equivalent. The portable electronic device then displays (1908) the identified contacts on the touchscreen. In one embodiment, the portable electronic device displays multiple icons on the touchscreen in addition to the contact list, such as a group contact icon, a first and last name icon, an alphabet list icon, a cancel icon, and other number icons. A more detailed description of these icons is provided below with reference to FIGS. 8A and 8B. After rendering the contact list and additional icons, the portable electronic device monitors (1910) for user contact with the touchscreen.

[0153] 8A and 8B are diagrams illustrating example user interfaces for a contact list according to one embodiment. In one embodiment, user interfaces 800A and 800B include the following elements, or a subset or superset thereof: - 402, 404, 406 mentioned above, a group icon 802 that, when activated (e.g., by a finger gesture on the icon), begins displaying a group of contacts; a name icon 804 (FIG. 8B) that, when activated (e.g., by a finger gesture on the icon), initiates an alphabetical display of the user's contacts by first name; a last name icon 806 (FIG. 8A) that, when activated (e.g., by a finger gesture on the icon), initiates an alphabetical display of the user's contacts by last name; • an alphabet list icon 808 that the user can touch to quickly reach a particular first letter in the displayed contact list; a cancel icon 810 that, when activated (e.g., by a finger gesture on the icon), transitions back to the previous UI (e.g., UI 500); and • Other Number icon 812 that, when activated (e.g., by a finger gesture on the icon), initiates a transition to a UI (e.g., UI 900, Figure 9) for entering a phone number for instant messaging, e.g., a phone number not in the user's contact list.

[0154] As described in U.S. patent application Ser. No. 11 / 322,547, filed Dec. 23, 2005, entitled "Scrolling List With Floating Adjacent Index Symbols," which is incorporated herein by reference in its entirety, a user can scroll through the contact list using vertical up and / or vertical down gestures 814 on the touchscreen.

[0155] If the next user touch is such a scroll gesture 814 (1912) or a finger gesture 1914 on one of the first name icon 804, last name icon 806, and alphabet list icon 808, the portable electronic device modifies (1920) the contacts currently on the display. Although a contact list can be shared by multiple applications (e.g., email, phone, and instant messaging) on ​​the same portable device, in this situation the user selection of names in the contact list is used for the IM service because the contact list is requested from within the IM application. Here, the contact list is shown in connection with user activation of the message creation icon 514 in the IM application 141.

[0156] When the portable electronic device detects 1916 a finger gesture on the name or other identifier of an individual in the contact list, it displays 1108 a message compose area for a message to the selected contact and displays the conversation UI, as shown in FIG. 6A. In one embodiment, if there is an existing conversation between the user and the selected individual, the portable electronic device merges the new conversation into the existing conversation by displaying a message related to the existing conversation.

[0157] When the portable electronic device detects (1918) a user gesture on the cancel icon 810, it aborts the process of creating a new conversation and returns to the conversation list shown in FIG. 5 (1006, FIG. 10).

[0158] When the portable electronic device detects 1919 a finger gesture over the other number icon 812, a new conversation is typically initiated with an individual not on the contact list. Thus, the portable electronic device can render a new user interface for the user to enter contact information for the individual to be used in the new conversation.

[0159] FIG. 20 is a flowchart illustrating the process of starting a new conversation using a new phone number according to one embodiment. Upon detecting a user selection of the Other Number icon (2002), the portable electronic device presents a contact information display area (2004) and a contact information compose area (2006) on the touchscreen. The contact information may be a phone number or an email address for an IM service. The contact information display area includes a text box 906 for displaying contact information to be entered by the user. The contact information compose area includes a keyboard 624 for the user to enter such contact information. If the user activates the Cancel icon (2012), the portable electronic device aborts the process of creating a new conversation and returns to the conversation list UI shown in FIG. 5. If the user input is a letter or number (2010), the portable electronic device displays it in the text box (2014).

[0160] 9 illustrates an example user interface for entering an instant messaging phone number according to one embodiment. In one embodiment, user interface 900 includes the following elements, or a subset or superset thereof: - 402, 404, 406, 602, and 624 mentioned above; a cancel icon 902 that, when activated (e.g., by a finger gesture on the icon), initiates a transition to the preceding UI (e.g., UI 800A or UI 800B); a save icon 904 that, when activated (e.g., by a finger gesture on the icon), initiates the display of a UI (e.g., UI 600A) for saving the entered phone number to an instant message conversation list (e.g., UI 500) and composing an instant message to be sent to the entered phone number; and • A numeric entry box 906 for entering a telephone number using the keyboard 624 .

[0161] Note that the keyboard that is displayed depends on the application context. For example, the UI displays a soft keyboard with numbers (e.g., 624) when numeric input is required or expected, and a soft keyboard with letters (e.g., 616) when letter input is required or expected.

[0162] The present invention has been described in detail with reference to specific embodiments. However, the description is not exhaustive and is not intended to limit the invention to the precise form. Many variations and modifications are possible in light of the above teachings. The embodiments were chosen and described in order to best explain the principles of the invention and its practical application. Those skilled in the art will be able to best utilize the invention and its various embodiments with various modifications as suited to the particular use intended.

Claims

1. An electronic device having a display, while the electronic device is in a locked mode and a first application is presenting media on the electronic device; receiving a notification corresponding to a second application different from the first application; and displaying the notification via the display in response to receiving the notification from the second application.

2. A method as described in claim 1, wherein the first application corresponds to one of a music player and a browser.

3. A method according to claim 1, detecting a first set of inputs while the electronic device is in the locked mode and the first application is presenting media on the electronic device, the first set of inputs including a first input directed to the notification; and in response to detecting the first set of inputs including the first input directed to the notification, displaying via the display a user interface corresponding to the second application, the user interface being different from the notification.

4. A method as described in claim 3, wherein the notification includes a first graphical object that, when selected, causes the user interface corresponding to the second application to be displayed, and the first input directed to the notification is an input directed to the first graphical object.

5. The method according to claim 3, The method further comprising ceasing display of the notification in response to detecting the first set of inputs including the first input directed to the notification.

6. The method of claim 1, wherein the notification includes a second graphical object, the method comprising: detecting a second set of inputs while the electronic device is in the locked mode and the first application is presenting media on the electronic device, the second set of inputs including a second input directed at the second graphical object; In response to detecting the second set of inputs including the second input directed to the notification, ceasing to display the notification.

7. The method of claim 1, wherein the notification corresponds to an electronic message.

8. A method as described in claim 7, wherein the notification includes a name corresponding to the sender of the electronic message.

9. A computer program that causes a computer to execute the method described in any one of claims 1 to 8.

10. An electronic device, a memory for storing the computer program according to claim 9; one or more processors capable of executing the computer programs stored in the memory, wherein the electronic device is configured to communicate with a display.

11. An electronic device configured to communicate with a display, comprising: An electronic device comprising means for carrying out the method according to any one of claims 1 to 8.

Citation Information

Patent Citations

  • Mobile communication terminal device having screen protection / auto locking function and its control method

    CN1728856A

  • Portable information apparatus

    JP2002244783A

  • Mobile phone terminal

    JP2005167455A

  • Mobile phone with broadcast reproducing function

    JP2005328167A

  • Communications apparatus and method for indicating receipt of electronic message and server, method and computer program product for providing computerized icon ordering service

    JP2006505037A