Compound animation in content items
An online system presents a content item to users and receives selections of reaction icons from the users. The online system generates a background animation with the selected reaction icons and a foreground animation to be layered on top of the background animation. The online system sends the background and foreground animations to a client device to be cached. Further, the online system presents the content item to a viewing user associated with the client device and receives a selection of a reaction icon from the viewing user. The online system selects a subset of the users based on the viewing user's affinity to the users, retrieves images of the selected users, and send the images to the client device. The client device customizes the background and foreground animations based on the images and the viewing user's reaction icon to generate a compound animation for display to the viewing user.
1. A method comprising:
generating, by an online system, an animation for a content item received by the online system for display to a plurality of users;
sending, by the online system, the animation to a client device associated with a viewing user of the plurality of users;
receiving, by the online system, a request for the content item from the client device;
in response to the request, identifying, by the online system, one or more other users who have interacted with the content item from the plurality of users based on the viewing user's affinity to each of the one or more other users;
retrieving, by the online system, information associated with the one or more other users; and
sending, by the online system, the retrieved information to the client device for the client device to customize the animation based on the retrieved information received by the client device from the online system and to present the customized animation, in addition to the content item, to the viewing user.
2. The method of claim 1 , wherein identifying, by the online system, the one or more other users who have interacted with the content item from the plurality of users based on the viewing user's affinity to each of the one or more other users comprises:
selecting, by the online system, a group of other users who have interacted with the content item from the plurality of users, the group of other users including the one or more other users;
determining, by the online system, an affinity score for each other user in the group that indicates the viewing user's affinity with the other user;
ranking, by the online system, the other users in the group based on their affinity scores; and
identifying, by the online system, the one or more other users based on the ranking.
3. The method of claim 2 , wherein identifying, by the online system, the one or more other users who have interacted with the content item from the plurality of users based on the viewing user's affinity to each of the one or more other users further comprises:
determining, by the online system, a second affinity score for each other user in the group that indicates a posting user's affinity with the other user, the content item received by the online system from a client device associated with the posting user; and
ranking, by the online system, the other users in the group based on their affinity scores and their second affinity scores.
4. The method of claim 1 , wherein retrieving, by the online system, the information associated with the one or more other users with the content item comprises:
retrieving, by the online system, information of interactions performed by the one or more other users with the content item.
5. The method of claim 1 , wherein retrieving, by the online system, the information associated with the one or more other users with the content item comprises:
retrieving, by the online system, a profile image associated with each of the one or more other users.
6. The method of claim 1 , wherein the animation comprises one or more open spots, further comprising:
sending, by the online system, an instruction to the client device, the client device configured to add the retrieved information received by the client device from the online system into the one or more open spots in accordance with the instruction.
7. The method of claim 1 , wherein the animation comprises one or more open spots, further comprising:
sending, by the online system, an instruction to the client device, the client device configured to add the retrieved information of each respective other user of the one or more other users into each open spot of the one or more open spots based on the viewing user's affinity to the respective other user and the size of the open spot.
8. A computer program product comprising a non-transitory computer readable storage medium having instructions encoded thereon that, when executed by a processor, cause the processor to:
generate, by an online system, an animation for a content item received by the online system for display to a plurality of users;
send, by the online system, the animation to a client device associated with a viewing user of the plurality of users;
receive, by the online system, a request for the content item from the client device;
in response to the request, identify, by the online system, one or more other users who have interacted with the content item from the plurality of users based on the viewing user's affinity to each of the one or more other users;
retrieve, by the online system, information associated with the one or more other users; and
send, by the online system, the retrieved information to the client device for the client device to customize the animation based on the retrieved information received by the client device from the online system and to present the customized animation in addition to the content item, to the viewing user.
9. The computer program product of claim 8 , wherein the instructions for identifying, by the online system, the one or more other users who have interacted with the content item from the plurality of users based on the viewing user's affinity to each of the one or more other users comprise instructions that when executed cause the computer processor to:
select, by the online system, a group of other users who have interacted with the content item from the plurality of users, the group of other users including the one or more other users;
determine, by the online system, an affinity score for each other user in the group that indicates the viewing user's affinity with the other user;
rank, by the online system, the other users in the group based on their affinity scores; and
identify, by the online system, the one or more other users based on the ranking.
10. The computer program product of claim 9 , wherein the instructions for identifying, by the online system, the one or more other users who have interacted with the content item from the plurality of users based on the viewing user's affinity to each of the one or more other users further comprise instructions that when executed cause the computer processor to:
determine, by the online system, a second affinity score for each other user in the group that indicates a posting user's affinity with the other user, the content item received by the online system from a client device associated with the posting user; and
rank, by the online system, the other users in the group based on their affinity scores and their second affinity scores.
11. The computer program product of claim 8 , wherein the instructions for retrieving, by the online system, the information associated with the one or more other users with the content item comprise instructions that when executed cause the computer processor to:
retrieve, by the online system, information of interactions performed by the one or more other users with the content item.
12. The computer program product of claim 8 , wherein the instructions for retrieving, by the online system, the information associated with the one or more other users with the content item comprise instructions that when executed cause the computer processor to:
retrieve, by the online system, a profile image associated with each of the one or more other users.
13. The computer program product of claim 8 , wherein the animation comprises one or more open spots and the instructions, when executed by the processor, further cause the processor to:
send, by the online system, an instruction to the client device, the client device configured to add the retrieved information received by the client device from the online system into the one or more open spots in accordance with the instruction.
14. The computer program product of claim 8 , wherein the animation comprises one or more open spots and the instructions, when executed by the processor, further cause the processor to:
send, by the online system, an instruction to the client device, the client device configured to add the retrieved information of each respective other user of the one or more other users into each open spot of the one or more open spots based on the viewing user's affinity to the respective other user and the size of the open spot.
15. A computer system comprising:
a non-transitory computer-readable storage medium storing executable computer program instructions, the computer program instructions comprising instructions that when executed cause a computer processor to perform steps, comprising:
generating, by an online system, an animation for a content item received by the online system for display to a plurality of users;
sending, by the online system, the animation to a client device associated with a viewing user of the plurality of users;
receiving, by the online system, a request for the content item from the client device;
in response to the request, identifying, by the online system, one or more other users who have interacted with the content item from the plurality of users based on the viewing user's affinity to each of the one or more other users;
retrieving, by the online system, information associated with the one or more other users; and
sending, by the online system, the retrieved information to the client device for the client device to customize the animation based on the retrieved information received by the client device from the online system and to present the customized animation, in addition to the content item, to the viewing user.
16. The computer system of claim 15 , wherein identifying, by the online system, the one or more other users who have interacted with the content item from the plurality of users based on the viewing user's affinity to each of the one or more other users comprises:
selecting, by the online system, a group of other users who have interacted with the content item from the plurality of users, the group of other users including the one or more other users;
determining, by the online system, an affinity score for each other user in the group that indicates the viewing user's affinity with the other user;
ranking, by the online system, the other users in the group based on their affinity scores; and
identifying, by the online system, the one or more other users based on the ranking.
17. The computer system of claim 15 , wherein retrieving, by the online system, the information associated with the one or more other users with the content item comprises:
retrieving, by the online system, information of interactions performed by the one or more other users with the content item.
18. The computer system of claim 15 , wherein retrieving, by the online system, the information associated with the one or more other users with the content item comprises:
retrieving, by the online system, a profile image associated with each of the one or more other users.
19. The computer system of claim 15 , wherein the animation comprises one or more open spots, further comprising:
sending, by the online system, an instruction to the client device, the client device configured to add the retrieved information received by the client device from the online system into the one or more open spots in accordance with the instruction.
20. The computer system of claim 15 , wherein the animation comprises one or more open spots, further comprising:
sending, by the online system, an instruction to the client device, the client device configured to add the retrieved information of each respective other user of the one or more other users into each open spot of the one or more open spots based on the viewing user's affinity to the respective other user and the size of the open spot.