Avatar editing environment

• US 9,576,400 B2
• Filed: 04/07/2011
• Issued: 02/21/2017
• Est. Priority Date: 04/07/2010
• Status: Active Grant

• Current Assignee: Apple Inc.
• Original Assignee: Apple Inc.
• Inventors: van Os, Marcel, Goossens, Thomas, Baumann, Laurent, Lampell, Michael Dale, Carlhian, Alexandre
• Primary Examiner(s): McDowell, Jr., Maurice L
• Assistant Examiner(s): Isanians, Raffi
• Application Number:
  US13/082,035
• Publication Number:
  US 20110248992A1
• Time in Patent Office: 2,147 Days
• US Class Current: 1/1
• CPC Class Codes: G06F 3/04812 Interaction techniques based on cursor appearance or behaviour, e.g. being affected by the presence of displayed objects
• CPC Class Codes: G06F 3/04817 using icons graphical or visual programming using iconic symbols G06F8/34
• CPC Class Codes: G06F 3/0482 Interaction with lists of selectable items, e.g. menus
• CPC Class Codes: G06F 3/04845 for image manipulation, e.g. dragging, rotation, expansion or change of colour
• CPC Class Codes: G06F 3/04883 for inputting data by handwriting, e.g. gesture or text
• CPC Class Codes: G06T 11/001 Texturing; Colouring; Generation of texture or colour inpainting G06T5/77
• CPC Class Codes: G06T 11/60 Editing figures and text; Combining figures or text
• CPC Class Codes: G06T 13/40 of characters, e.g. humans, animals or virtual beings
• CPC Class Codes: G06T 13/80 2D [Two Dimensional] animation, e.g. using sprites
• CPC Class Codes: G06T 15/04 Texture mapping
• CPC Class Codes: G06T 19/20 Editing of 3D images, e.g. changing shapes or colours, aligning objects or positioning parts
• CPC Class Codes: G06T 2200/24 involving graphical user interfaces [GUIs]
• CPC Class Codes: G06T 2219/2012 Colour editing, changing, or manipulating; Use of colour codes
• CPC Class Codes: G06T 2219/2016 Rotation, translation, scaling

Abstract

An avatar editing environment is disclosed that allows users to create custom avatars for use in online games and other applications. Starting with a blank face the user can add, rescale and position different elements (e.g., eyes, nose, mouth) on the blank face. The user can also change the shape of the avatar'"'"'s face, the avatar'"'"'s skin color and the color of all the elements. In some implementations, touch input and gestures can be used to manually edit the avatar. Various controls can be used to create the avatar, such as controls for resizing, rotating, positioning, etc. The user can choose between manual and automatic avatar creation. The avatar editing environment can be part of a framework that is available to applications. One or more elements of the avatar can be animated.

Claims

1. A computer-implemented method performed by one or more processors, comprising:

presenting an avatar editing environment on a display of a device, the avatar editing environment including a plurality of editing zones;

displaying an avatar model in the avatar editing environment, the avatar model including a plurality of avatar elements, each avatar element positioned in a respective editing zone;

receiving first input selecting an editing zone;

in response to receiving the first input, displaying, in the selected editing zone and in an image layer either over or below an avatar element image layer displayed in the selected editing zone, the avatar element image layer including the avatar element, selection elements selectable to modify the avatar element displayed in the selected editing zone;

receiving a second input selecting a selection element;

in response to receiving the second input, displaying a different avatar element in place of the avatar element in the selected editing zone; and

rendering the avatar model in the avatar editing environment, the avatar model including the different avatar element.

2. The method of claim 1, where the device is a mobile device and the display is a touch sensitive display.

3. The method of claim 1, wherein presenting the avatar editing environment on the display of the device comprises:

displaying a bar in the avatar editing environment, the bar containing a number of icons representing element categories; and

applying a touch input to the bar on the display to animate the icons, the animation simulating motion of the icons through a center position of the bar, where the icon occupying the center position of the bar when the motion stops is the selected avatar element category.

4. The method of claim 3, further comprising:

displaying a grid view in the avatar editing environment, at least some cells in the grid view displaying the avatar with a different avatar element;

associating the second input with a cell; and

selecting an avatar element based on the associating.

5. The method of claim 1, wherein rendering the avatar model comprises:

rendering a two-dimensional texture representing the avatar element on the avatar model.

6. The method of claim 1, further comprising:

providing avatar data to an application, the avatar data operable for creating the avatar in the application.

7. The method of claim 6, further comprising:

animating the avatar in the application.

8. The method of claim 7, where animating the avatar in the application, comprises:

animating an eye element on the avatar in response to a trigger event.

9. The method of claim 7, where animating an eye element, comprises:

animating the eye element to follow a cursor or other object displayed in a user interface of the application.

10. The method of claim 1, wherein the avatar element is included in a selected avatar element category, the method further comprising:

receiving fourth input selecting a color for the selected avatar element category;

displaying a grid view in the avatar editing environment, at least some cells in the grid view displaying different colors associated with the selected avatar element category;

associating the fourth input with a cell; and

selecting a color based on the associating.

11. The method of claim 1, further comprising:

receiving an input for zooming the avatar element; and

receiving an input for manually editing the zoomed avatar element.

12. The method of claim 11, where the input for zooming the avatar element is a touch input or gesture.

13. The method of claim 11, where receiving the input for manually editing the zoomed avatar element, comprises:

moving, rotating or resizing the avatar element according to the input for manually editing the zoomed avatar element.

14. The method of claim 13, further comprising:

defining an editing region surrounding the avatar element; and

restricting the manual editing to within the editing region.

15. The method of claim 11, wherein receiving the input for manually editing the zoomed avatar element comprises:

receiving a touch selection of the zoomed avatar element; and

after receiving the touch selection, receiving a gesture selection of the zoomed avatar element.

16. The method of claim 15, further comprising resizing the zoomed avatar element in response to the touch selection and the gesture selection.

17. A computer-implemented method performed by one or more processors, comprising:

presenting an avatar editing environment on a touch sensitive display of a mobile device, the avatar editing environment including a plurality of editing zones;

displaying a three-dimensional (3D) avatar model in the avatar editing environment, the avatar model including a plurality of avatar elements, each avatar element positioned in a respective editing zone;

receiving a user selection of an editing zone, the user selection of the editing zone comprising a touch input of the touch sensitive display at a location at which the editing zone is displayed;

in response to receiving the user selection of the editing zone, displaying, in the selected editing zone and in an image layer either over or below an avatar element image layer displayed in the selected editing zone, the avatar element image layer including the avatar element, selection elements selectable to modify the avatar element displayed in the selected editing zone;

receiving a user selection of a selection element displayed in the selected editing zone, the user selection of the editing zone comprising a touch input of the touch sensitive display at a location at which the selection element is displayed;

in response to receiving the user selection of the selection element, displaying a different avatar element in place of the avatar element in the selected editing zone; and

rendering the avatar model in the avatar editing environment, the avatar model including the different avatar element.

18. The method of claim 17, wherein rendering the selected avatar model comprises:

rendering a two-dimensional (2D) texture representing the avatar element on the 3D avatar model.

19. The method of claim 17, further comprising:

defining an editing region surrounding the avatar element; and

restricting the manual editing to within the editing region.

20. The method of claim 17, further comprising a touch input or gesture for manually resizing or rotating the zoomed avatar element.

21. The method of claim 20, wherein receiving the touch input or gesture for manually resizing or rotating the zoomed avatar element comprises:

receiving a touch selection of the zoomed avatar element; and

after receiving the touch selection, receiving a gesture selection of the zoomed avatar element.

22. The method of claim 21, further comprising resizing or rotating the zoomed avatar element in response to the touch selection and the gesture selection.

23. A system for editing avatars, comprising:

one or more processors;

a computer-readable medium coupled to the one or more processors and storing instructions, which, when executed by the one or more processors, causes the one or more processors to perform operations, comprising;

presenting an avatar editing environment on a display of a device, the avatar editing environment including a plurality of editing zones;

displaying an avatar model in the avatar editing environment, the avatar model including a plurality of avatar elements, each avatar element positioned in a respective editing zone;

receiving first input selecting an editing zone;

in response to receiving the first input, displaying, in the selected editing zone and in an image layer either over or below an avatar element image layer displayed in the selected editing zone, the avatar element image layer including the avatar element, selection elements selectable to modify the avatar element displayed in the selected editing zone, the selection elements displayed on either side of the avatar element;

receiving a second input selecting a selection element;

in response to receiving the second input, displaying a different avatar element in place of the avatar element in the selected editing zone; and

rendering the avatar model in the avatar editing environment, the avatar model including the different avatar element.

24. The system of claim 23, where the system is a mobile device and the display is a touch sensitive display.

25. The system of claim 24, the operations further comprising receiving third input for manually editing the different avatar element, where the third input is a touch input or gesture.

26. The system of claim 25, wherein receiving the third input for manually editing the avatar element comprises:

receiving a touch selection of the zoomed avatar element; and

after receiving the touch selection, receiving a gesture selection of the zoomed avatar element.

27. The system of claim 26, the operations further comprising resizing the zoomed avatar element in response to the touch selection and the gesture selection.

28. The system of claim 24, where the computer-readable medium stores instructions, which when executed by the one or more processors, causes the one or more processors to perform operations comprising:

displaying a grid view in the avatar editing environment, at least some cells in the grid view displaying the avatar with a different avatar element;

associating the second input with a cell; and

selecting an avatar element based on the associating.

29. The system of claim 24, where the computer-readable medium stores instructions, which when executed by the one or more processors, causes the one or more processors to perform operations comprising:

rendering a two-dimensional texture representing the avatar element on the avatar model.

30. The system of claim 24, where the computer-readable medium stores instructions, which when executed by the one or more processors, causes the one or more processors to perform operations comprising:

receiving third input for manually editing the avatar element; and

moving, rotating or resizing the avatar element according to the third input.

31. The system of claim 23, the operations further comprising:

defining an editing region surrounding the avatar element; and

restricting the manual editing to within the editing region

where the manual editing is restricted to an editing region associated with the avatar element.

32. The system of claim 23, where the computer-readable medium stores instructions, which when executed by the one or more processors, causes the one or more processors to perform operations comprising:

providing avatar data to an application, the avatar data operable for creating the avatar in the application; and

animating the avatar in the application, the animating including animating an eye element of the avatar in response to a trigger event or animating the eye element to follow a cursor or other object displayed in a user interface of the application.

33. The system of claim 23, the operations further comprising receiving an input for zooming the avatar element.