# US 11,307,737 B2 · Media browsing user interface with intelligently selected representative media items

> Agents: this data is available as JSON from the patentgrep API and MCP server — see https://patentgrep.com/llms.txt

- Number: US 11,307,737 B2
- Document ID: US11307737B2
- Status: Granted
- Kind: B2
- Application number: 16/584,783
- Filed: 2019-09-26
- Published: 2020-11-12
- Granted: 2022-04-19
- Earliest claimed: 2019-05-06
- Assignees: Apple Inc.
- Applicants: Apple Inc.
- Inventors: Graham R. Clarke; Simon Bovet; Eric M. G. Circlaeys; Lynne Devine; Alan C. Dye; Andreas Karlsson; Matthieu Lucas; Behkish J. Manzari; Nicole R. Ryan; William A. Sorrentino, III; Andre Souza Dos Santos; Gregg Suzuki; Sergey Tatarchuk
- Web page: https://patentgrep.com/patent/US11307737B2

## CPC

- G06F 3/0482: Interaction with lists of selectable items, e.g. menus
- G06F 16/55: Clustering; Classification
- G06F 3/016: {Input arrangements with force or tactile feedback as computer generated output to the user}
- G06F 3/04845: for image manipulation, e.g. dragging, rotation, expansion or change of colour
- G06F 3/0485: Scrolling or panning
- G06F 3/0488: using a touch-screen or digitiser, e.g. input of commands through traced gestures
- G06F 3/04883: for inputting data by handwriting, e.g. gesture or text
- G06F 9/451: Execution arrangements for user interfaces
- G06F 16/434: {using image data, e.g. images, photos, pictures taken by a user}
- G06F 16/435: Filtering based on additional data, e.g. user or group profiles
- G06F 16/438: Presentation of query results
- G06F 16/447: {Temporal browsing, e.g. timeline}
- G06F 16/54: Browsing; Visualisation therefor
- G06F 16/743: {a collection of video files or sequences}
- G06F 2203/04803: Split screen, i.e. subdividing the display area or the window area into separate subareas
- G06F 2203/04806: Zoom, i.e. interaction techniques or interactors for controlling the zooming operation
- G06F 2203/04808: Several contacts: gestures triggering a specific function, e.g. scrolling, zooming, right-click, when the user establishes several contacts with the surface simultaneously; e.g. using several fingers or a combination of fingers and pen
- G06F: ELECTRIC DIGITAL DATA PROCESSING (computer systems based on specific computational models G06N)

## Abstract

The present disclosure generally relates to navigating a collection of media items. In accordance with one embodiment, a device displays a plurality of content items in a first layout, including a first content item at a first aspect ratio and a first size, a second content item, and a third content item. While displaying the plurality of content items in the first layout, the device detects a user input that includes a gesture, wherein the user input corresponds to a request to change a size of the first content item. In response to detecting the user input, and as the gesture progresses, the device changes the size of the first content item from the first size to a second size while concurrently gradually changing an aspect ratio of the first content item from the first aspect ratio to a second aspect ratio.

## Claims

### Claim 1

An electronic device, comprising:
a display device;
one or more processors; and
memory storing one or more programs configured to be executed by the one or more processors, the one or more programs including instructions for:
displaying, via the display device, a plurality of media items in a first layout that includes a plurality of rows and a plurality of columns, including displaying:
a first media item of the plurality of media items at a first aspect ratio and a first size,
a second media item of the plurality of media items at the first aspect ratio, and
a third media item of the plurality of media items;
while displaying, via the display device, the plurality of media items in the first layout that includes the plurality of rows and the plurality of columns, detecting a user input that includes a gesture, wherein the user input corresponds to a request to change a size of the first media item; and
in response to detecting the user input:
gradually changing, as the gesture progresses, the size of the first media item from the first size to a second size that is different from the first size while concurrently gradually changing, as the gesture progresses, an aspect ratio of the first media item from the first aspect ratio to a second aspect ratio that is different from the first aspect ratio; and
changing an aspect ratio of the second media item from the first aspect ratio to a third aspect ratio that is different from the first aspect ratio and the second aspect ratio, so that at least a subset of the plurality of media items are displayed in a second layout that includes concurrently displaying the first media item in the second aspect ratio and at least a portion of the second media item in the third aspect ratio.

### Claim 2 (depends on 1)

The electronic device of claim 1, wherein:
gradually changing the size of the first media item from the first size to the second size includes:
gradually changing the size of the first media item from the first size to the second size in conjunction with movement of the gesture; and
gradually changing the aspect ratio of the first media item from the first aspect ratio to the second aspect ratio includes:
gradually changing the aspect ratio of the first media item from the first aspect ratio to the second aspect ratio in conjunction with movement of the gesture.

### Claim 3 (depends on 1)

The electronic device of claim 1, wherein:
gradually changing the aspect ratio of the first media item from the first aspect ratio to the second aspect ratio includes:
gradually changing the aspect ratio of the first media item from the first aspect ratio to an intermediate aspect ratio while maintaining a magnification of the first media item; and
gradually changing the aspect ratio of the first media item from the intermediate aspect ratio to the second aspect ratio while changing a magnification of the first media item.

### Claim 4 (depends on 1)

The electronic device of claim 1, wherein changing the aspect ratio of the first media item from the first aspect ratio to the second aspect ratio includes:
cropping portions of the first media item or revealing previously cropped portions of the first media item.

### Claim 5 (depends on 1)

The electronic device of claim 1, wherein:
displaying the third media item in the first layout includes displaying the third media item at the first aspect ratio.

### Claim 6 (depends on 1)

The electronic device of claim 1, wherein:
the first aspect ratio is square; and
the second aspect ratio is rectangular with unequal adjacent sides.

### Claim 7 (depends on 1)

The electronic device of claim 1, the one or more programs further including instructions for:
in response to detecting the user input:
displaying, via the display device, a subset of the plurality of media items in the second layout, wherein the second layout includes a single row or a single column, including:
concurrently displaying, on the display device, with the first media item at the second aspect ratio, the second media item of the plurality of media items at the third aspect ratio, wherein the third aspect ratio is different from the first aspect ratio, and
without concurrently displaying the third media item of the plurality of media items.

### Claim 8 (depends on 7)

The electronic device of claim 7, wherein:
the second layout is different from the first layout;
in the first layout the second media item has a first location relative to the first media item;
in the second layout the third media item has the first location relative to the first media item; and
displaying, on the display device, the subset of the plurality of media items in the second layout includes:
transitioning, as the gesture of the user input progresses, from displaying the first media item in the first layout to displaying the first media item in the second layout, including displaying a combination of the second media item and the third media item at the first location relative to the first media item during the transition from displaying the first media item in the first layout to displaying the first media item in the second layout.

### Claim 9 (depends on 1)

The electronic device of claim 1, the one or more programs further including instructions for:
while displaying, via the display device, the first media item at the second size and at the second aspect ratio, detecting a second user input that corresponds to a request to change a size of the first media item; and
in response to detecting the second user input, gradually changing the size of the first media item from the second size to the first size while concurrently gradually changing the aspect ratio of the first media item from the second aspect ratio to the first aspect ratio.

### Claim 10 (depends on 9)

The electronic device of claim 9, wherein changing the aspect ratio of the first media item from the second aspect ratio to the first aspect ratio includes:
in accordance with a determination that the first media item is in a portrait format, reducing the height of the first media item.

### Claim 11 (depends on 9)

The electronic device of claim 9, wherein changing the aspect ratio of the first media item from the second aspect ratio to the first aspect ratio includes:
in accordance with a determination that the first media item is in a landscape format, reducing the width of the first media item.

### Claim 12 (depends on 9)

The electronic device of claim 9, the one or more programs further including instructions for:
while displaying, via the display device, the plurality of media items, including the first media item at the first size and at the first aspect ratio, in the first layout that includes the plurality of rows and the plurality of columns, detecting a third user input that corresponds to a request to change a size of the first media item; and
in response to detecting the third user input, displaying, via the display device, a second plurality of media items in a third layout that includes a second plurality of rows and a second plurality of columns, including:
gradually changing the size of the first media item from the first size to a third size without changing the aspect ratio of the first media item.

### Claim 13 (depends on 9)

The electronic device of claim 9, the one or more programs further including instructions for:
while displaying, via the display device, the plurality of media items, including the first media item at the first size and at the first aspect ratio, in the first layout that includes the plurality of rows and the plurality of columns, detecting a fourth user input that corresponds to a request to change an aspect ratio of the first media item; and
in response to detecting the fourth user input, changing the aspect ratio of at least some of the plurality of media items while continuing to display the plurality of media items in the first layout, including changing the aspect ratio of the first media item from the first aspect ratio to a third aspect ratio.

### Claim 14 (depends on 1)

The electronic device of claim 1, the one or more programs further including instructions for:
while displaying the plurality of media items in the first layout that includes the plurality of rows and the plurality of columns, providing an option to change aspect ratios of at least some of the plurality of media items while continuing to display the plurality of media items in the first layout; and
subsequent to displaying the plurality of media items in the first layout, displaying the plurality of media items in a fourth layout that includes a third plurality of rows and a third plurality of columns without providing the option to change aspect ratios of at least some of the plurality of media items.

### Claim 15

A non-transitory computer-readable storage medium storing one or more programs configured to be executed by one or more processors of an electronic device with a display device, the one or more programs including instructions for:
displaying, via the display device, a plurality of media items in a first layout that includes a plurality of rows and a plurality of columns, including displaying:
a first media item of the plurality of media items at a first aspect ratio and a first size,
a second media item of the plurality of media items at the first aspect ratio, and
a third media item of the plurality of media items;
while displaying, via the display device, the plurality of media items in the first layout that includes the plurality of rows and the plurality of columns, detecting a user input that includes a gesture, wherein the user input corresponds to a request to change a size of the first media item; and
in response to detecting the user input:
gradually changing, as the gesture progresses, the size of the first media item from the first size to a second size that is different from the first size while concurrently gradually changing, as the gesture progresses, an aspect ratio of the first media item from the first aspect ratio to a second aspect ratio that is different from the first aspect ratio; and
changing an aspect ratio of the second media item from the first aspect ratio to a third aspect ratio that is different from the first aspect ratio and the second aspect ratio, so that at least a subset of the plurality of media items are displayed in a second layout that includes concurrently displaying the first media item in the second aspect ratio and at least a portion of the second media item in the third aspect ratio.

### Claim 16 (depends on 15)

The non-transitory computer-readable storage medium of claim 15, wherein:
gradually changing the size of the first media item from the first size to the second size includes:
gradually changing the size of the first media item from the first size to the second size in conjunction with movement of the gesture; and
gradually changing the aspect ratio of the first media item from the first aspect ratio to the second aspect ratio includes:
gradually changing the aspect ratio of the first media item from the first aspect ratio to the second aspect ratio in conjunction with movement of the gesture.

### Claim 17 (depends on 15)

The non-transitory computer-readable storage medium of claim 15, wherein:
gradually changing the aspect ratio of the first media item from the first aspect ratio to the second aspect ratio includes:
gradually changing the aspect ratio of the first media item from the first aspect ratio to an intermediate aspect ratio while maintaining a magnification of the first media item; and
gradually changing the aspect ratio of the first media item from the intermediate aspect ratio to the second aspect ratio while changing a magnification of the first media item.

### Claim 18 (depends on 15)

The non-transitory computer-readable storage medium of claim 15, wherein changing the aspect ratio of the first media item from the first aspect ratio to the second aspect ratio includes:
cropping portions of the first media item or revealing previously cropped portions of the first media item.

### Claim 19 (depends on 15)

The non-transitory computer-readable storage medium of claim 15, wherein:
displaying the third media item in the first layout includes displaying the third media item at the first aspect ratio.

### Claim 20 (depends on 15)

The non-transitory computer-readable storage medium of claim 15, wherein:
the first aspect ratio is square; and
the second aspect ratio is rectangular with unequal adjacent sides.

### Claim 21 (depends on 15)

The non-transitory computer-readable storage medium of claim 15, the one or more programs further including instructions for:
in response to detecting the user input:
displaying, via the display device, a subset of the plurality of media items in the second layout, wherein the second layout includes a single row or a single column, including:
concurrently displaying, on the display device, with the first media item at the second aspect ratio, the second media item of the plurality of media items at the third aspect ratio, wherein the third aspect ratio is different from the first aspect ratio, and
without concurrently displaying the third media item of the plurality of media items.

### Claim 22 (depends on 21)

The non-transitory computer-readable storage medium of claim 21, wherein:
the second layout is different from the first layout;
in the first layout the second media item has a first location relative to the first media item;
in the second layout the third media item has the first location relative to the first media item; and
displaying, on the display device, the subset of the plurality of media items in the second layout includes:
transitioning, as the gesture of the user input progresses, from displaying the first media item in the first layout to displaying the first media item in the second layout, including displaying a combination of the second media item and the third media item at the first location relative to the first media item during the transition from displaying the first media item in the first layout to displaying the first media item in the second layout.

### Claim 23 (depends on 15)

The non-transitory computer-readable storage medium of claim 15, the one or more programs further including instructions for:
while displaying, via the display device, the first media item at the second size and at the second aspect ratio, detecting a second user input that corresponds to a request to change a size of the first media item; and
in response to detecting the second user input, gradually changing the size of the first media item from the second size to the first size while concurrently gradually changing the aspect ratio of the first media item from the second aspect ratio to the first aspect ratio.

### Claim 24 (depends on 23)

The non-transitory computer-readable storage medium of claim 23, wherein changing the aspect ratio of the first media item from the second aspect ratio to the first aspect ratio includes:
in accordance with a determination that the first media item is in a portrait format, reducing the height of the first media item.

### Claim 25 (depends on 23)

The non-transitory computer-readable storage medium of claim 23, wherein changing the aspect ratio of the first media item from the second aspect ratio to the first aspect ratio includes:
in accordance with a determination that the first media item is in a landscape format, reducing the width of the first media item.

### Claim 26 (depends on 23)

The non-transitory computer-readable storage medium of claim 23, the one or more programs further including instructions for:
while displaying, via the display device, the plurality of media items, including the first media item at the first size and at the first aspect ratio, in the first layout that includes the plurality of rows and the plurality of columns, detecting a third user input that corresponds to a request to change a size of the first media item; and
in response to detecting the third user input, displaying, via the display device, a second plurality of media items in a third layout that includes a second plurality of rows and a second plurality of columns, including:
gradually changing the size of the first media item from the first size to a third size without changing the aspect ratio of the first media item.

### Claim 27 (depends on 23)

The non-transitory computer-readable storage medium of claim 23, the one or more programs further including instructions for:
while displaying, via the display device, the plurality of media items, including the first media item at the first size and at the first aspect ratio, in the first layout that includes the plurality of rows and the plurality of columns, detecting a fourth user input that corresponds to a request to change an aspect ratio of the first media item; and
in response to detecting the fourth user input, changing the aspect ratio of at least some of the plurality of media items while continuing to display the plurality of media items in the first layout, including changing the aspect ratio of the first media item from the first aspect ratio to a third aspect ratio.

### Claim 28 (depends on 15)

The non-transitory computer-readable storage medium of claim 15, the one or more programs further including instructions for:
while displaying the plurality of media items in the first layout that includes the plurality of rows and the plurality of columns, providing an option to change aspect ratios of at least some of the plurality of media items while continuing to display the plurality of media items in the first layout; and
subsequent to displaying the plurality of media items in the first layout, displaying the plurality of media items in a fourth layout that includes a third plurality of rows and a third plurality of columns without providing the option to change aspect ratios of at least some of the plurality of media items.

### Claim 29

A method, comprising:
at an electronic device with a display device:
displaying, via the display device, a plurality of media items in a first layout that includes a plurality of rows and a plurality of columns, including displaying:
a first media item of the plurality of media items at a first aspect ratio and a first size,
a second media item of the plurality of media items at the first aspect ratio, and
a third media item of the plurality of media items;
while displaying, via the display device, the plurality of media items in the first layout that includes the plurality of rows and the plurality of columns, detecting a user input that includes a gesture, wherein the user input corresponds to a request to change a size of the first media item; and
in response to detecting the user input:
gradually changing, as the gesture progresses, the size of the first media item from the first size to a second size that is different from the first size while concurrently gradually changing, as the gesture progresses, an aspect ratio of the first media item from the first aspect ratio to a second aspect ratio that is different from the first aspect ratio; and
changing an aspect ratio of the second media item from the first aspect ratio to a third aspect ratio that is different from the first aspect ratio and the second aspect ratio, so that at least a subset of the plurality of media items are displayed in a second layout that includes concurrently displaying the first media item in the second aspect ratio and at least a portion of the second media item in the third aspect ratio.

### Claim 30 (depends on 29)

The method of claim 29, wherein:
gradually changing the size of the first media item from the first size to the second size includes:
gradually changing the size of the first media item from the first size to the second size in conjunction with movement of the gesture; and
gradually changing the aspect ratio of the first media item from the first aspect ratio to the second aspect ratio includes:
gradually changing the aspect ratio of the first media item from the first aspect ratio to the second aspect ratio in conjunction with movement of the gesture.

### Claim 31 (depends on 29)

The method of claim 29, wherein:
gradually changing the aspect ratio of the first media item from the first aspect ratio to the second aspect ratio includes:
gradually changing the aspect ratio of the first media item from the first aspect ratio to an intermediate aspect ratio while maintaining a magnification of the first media item; and
gradually changing the aspect ratio of the first media item from the intermediate aspect ratio to the second aspect ratio while changing a magnification of the first media item.

### Claim 32 (depends on 29)

The method of claim 29, wherein changing the aspect ratio of the first media item from the first aspect ratio to the second aspect ratio includes:
cropping portions of the first media item or revealing previously cropped portions of the first media item.

### Claim 33 (depends on 29)

The method of claim 29, wherein:
displaying the third media item in the first layout includes displaying the third media item at the first aspect ratio.

### Claim 34 (depends on 29)

The method of claim 29, wherein:
the first aspect ratio is square; and
the second aspect ratio is rectangular with unequal adjacent sides.

### Claim 35 (depends on 29)

The method of claim 29, further comprising:
in response to detecting the user input:
displaying, via the display device, a subset of the plurality of media items in the second layout, wherein the second layout includes a single row or a single column, including:
concurrently displaying, on the display device, with the first media item at the second aspect ratio, the second media item of the plurality of media items at the third aspect ratio, wherein the third aspect ratio is different from the first aspect ratio, and
without concurrently displaying the third media item of the plurality of media items.

### Claim 36 (depends on 35)

The method of claim 35, wherein:
the second layout is different from the first layout;
in the first layout the second media item has a first location relative to the first media item;
in the second layout the third media item has the first location relative to the first media item; and
displaying, on the display device, the subset of the plurality of media items in the second layout includes:
transitioning, as the gesture of the user input progresses, from displaying the first media item in the first layout to displaying the first media item in the second layout, including displaying a combination of the second media item and the third media item at the first location relative to the first media item during the transition from displaying the first media item in the first layout to displaying the first media item in the second layout.

### Claim 37 (depends on 29)

The method of claim 29, further comprising:
while displaying, via the display device, the first media item at the second size and at the second aspect ratio, detecting a second user input that corresponds to a request to change a size of the first media item; and
in response to detecting the second user input, gradually changing the size of the first media item from the second size to the first size while concurrently gradually changing the aspect ratio of the first media item from the second aspect ratio to the first aspect ratio.

### Claim 38 (depends on 37)

The method of claim 37, wherein changing the aspect ratio of the first media item from the second aspect ratio to the first aspect ratio includes:
in accordance with a determination that the first media item is in a portrait format, reducing the height of the first media item.

### Claim 39 (depends on 37)

The method of claim 37, wherein changing the aspect ratio of the first media item from the second aspect ratio to the first aspect ratio includes:
in accordance with a determination that the first media item is in a landscape format, reducing the width of the first media item.

### Claim 40 (depends on 37)

The method of claim 37, further comprising:
while displaying, via the display device, the plurality of media items, including the first media item at the first size and at the first aspect ratio, in the first layout that includes the plurality of rows and the plurality of columns, detecting a third user input that corresponds to a request to change a size of the first media item; and
in response to detecting the third user input, displaying, via the display device, a second plurality of media items in a third layout that includes a second plurality of rows and a second plurality of columns, including:
gradually changing the size of the first media item from the first size to a third size without changing the aspect ratio of the first media item.

### Claim 41 (depends on 37)

The method of claim 37, further comprising:
while displaying, via the display device, the plurality of media items, including the first media item at the first size and at the first aspect ratio, in the first layout that includes the plurality of rows and the plurality of columns, detecting a fourth user input that corresponds to a request to change an aspect ratio of the first media item; and
in response to detecting the fourth user input, changing the aspect ratio of at least some of the plurality of media items while continuing to display the plurality of media items in the first layout, including changing the aspect ratio of the first media item from the first aspect ratio to a third aspect ratio.

### Claim 42 (depends on 29)

The method of claim 29, further comprising:
while displaying the plurality of media items in the first layout that includes the plurality of rows and the plurality of columns, providing an option to change aspect ratios of at least some of the plurality of media items while continuing to display the plurality of media items in the first layout; and
subsequent to displaying the plurality of media items in the first layout, displaying the plurality of media items in a fourth layout that includes a third plurality of rows and a third plurality of columns without providing the option to change aspect ratios of at least some of the plurality of media items.

### Claim 43

An electronic device, comprising:
a display device;
one or more processors; and
memory storing one or more programs configured to be executed by the one or more processors, the one or more programs including instructions for:
displaying, via the display device, a plurality of media items in a first layout that includes a plurality of rows and a plurality of columns, including displaying:
a first media item of the plurality of media items at a first aspect ratio and a first size,
a second media item of the plurality of media items at the first aspect ratio, and
a third media item of the plurality of media items;
while displaying, via the display device, the plurality of media items in the first layout that includes the plurality of rows and the plurality of columns, detecting a user input that includes a gesture, wherein the user input corresponds to a request to change a size of the first media item; and
in response to detecting the user input:
gradually changing, as the gesture progresses, the size of the first media item from the first size to a second size that is different from the first size while concurrently gradually changing, as the gesture progresses, an aspect ratio of the first media item from the first aspect ratio to a second aspect ratio that is different from the first aspect ratio;
changing an aspect ratio of the second media item from the first aspect ratio to a third aspect ratio that is different from the first aspect ratio; and
displaying, via the display device, a subset of the plurality of media items in a second layout that includes a single row or a single column, including:
concurrently displaying, on the display device, with the first media item at the second aspect ratio, the second media item of the plurality of media items at the third aspect ratio that is different from the first aspect ratio, and
without concurrently displaying the third media item of the plurality of media items,
wherein:
the second layout is different from the first layout;
in the first layout the second media item has a first location relative to the first media item;
in the second layout the third media item has the first location relative to the first media item; and
displaying, on the display device, the subset of the plurality of media items in the second layout includes:
transitioning, as the gesture of the user input progresses, from displaying the first media item in the first layout to displaying the first media item in the second layout, including displaying a combination of the second media item and the third media item at the first location relative to the first media item during the transition from displaying the first media item in the first layout to displaying the first media item in the second layout.

### Claim 44

A non-transitory computer-readable storage medium storing one or more programs configured to be executed by one or more processors of an electronic device with a display device, the one or more programs including instructions for:
displaying, via the display device, a plurality of media items in a first layout that includes a plurality of rows and a plurality of columns, including displaying:
a first media item of the plurality of media items at a first aspect ratio and a first size,
a second media item of the plurality of media items at the first aspect ratio, and
a third media item of the plurality of media items;
while displaying, via the display device, the plurality of media items in the first layout that includes the plurality of rows and the plurality of columns, detecting a user input that includes a gesture, wherein the user input corresponds to a request to change a size of the first media item; and
in response to detecting the user input:
gradually changing, as the gesture progresses, the size of the first media item from the first size to a second size that is different from the first size while concurrently gradually changing, as the gesture progresses, an aspect ratio of the first media item from the first aspect ratio to a second aspect ratio that is different from the first aspect ratio;
changing an aspect ratio of the second media item from the first aspect ratio to a third aspect ratio that is different from the first aspect ratio; and
displaying, via the display device, a subset of the plurality of media items in a second layout that includes a single row or a single column, including:
concurrently displaying, on the display device, with the first media item at the second aspect ratio, the second media item of the plurality of media items at the third aspect ratio that is different from the first aspect ratio, and
without concurrently displaying the third media item of the plurality of media items,
wherein:
the second layout is different from the first layout;
in the first layout the second media item has a first location relative to the first media item;
in the second layout the third media item has the first location relative to the first media item; and
displaying, on the display device, the subset of the plurality of media items in the second layout includes:
transitioning, as the gesture of the user input progresses, from displaying the first media item in the first layout to displaying the first media item in the second layout, including displaying a combination of the second media item and the third media item at the first location relative to the first media item during the transition from displaying the first media item in the first layout to displaying the first media item in the second layout.

### Claim 45

A method, comprising:
at an electronic device with a display device:
displaying, via the display device, a plurality of media items in a first layout that includes a plurality of rows and a plurality of columns, including displaying:
a first media item of the plurality of media items at a first aspect ratio and a first size,
a second media item of the plurality of media items at the first aspect ratio, and
a third media item of the plurality of media items;
while displaying, via the display device, the plurality of media items in the first layout that includes the plurality of rows and the plurality of columns, detecting a user input that includes a gesture, wherein the user input corresponds to a request to change a size of the first media item; and
in response to detecting the user input:
gradually changing, as the gesture progresses, the size of the first media item from the first size to a second size that is different from the first size while concurrently gradually changing, as the gesture progresses, an aspect ratio of the first media item from the first aspect ratio to a second aspect ratio that is different from the first aspect ratio;
changing an aspect ratio of the second media item from the first aspect ratio to a third aspect ratio that is different from the first aspect ratio; and
displaying, via the display device, a subset of the plurality of media items in a second layout that includes a single row or a single column, including:
concurrently displaying, on the display device, with the first media item at the second aspect ratio, the second media item of the plurality of media items at the third aspect ratio that is different from the first aspect ratio, and
without concurrently displaying the third media item of the plurality of media items,
wherein:
the second layout is different from the first layout;
in the first layout the second media item has a first location relative to the first media item;
in the second layout the third media item has the first location relative to the first media item; and
displaying, on the display device, the subset of the plurality of media items in the second layout includes:
transitioning, as the gesture of the user input progresses, from displaying the first media item in the first layout to displaying the first media item in the second layout, including displaying a combination of the second media item and the third media item at the first location relative to the first media item during the transition from displaying the first media item in the first layout to displaying the first media item in the second layout.