We recently launched Enlisted Salutes, a FOX project designed to to express gratitude to those who serve their country.
The challenge? Collect photos and videos from various social media platforms and display them in a grid layout.
While it may seem like a simple set of photos on the surface, behind the scenes there are many moving parts and complexities that presented a unique and fun challenge.
We used MassRelevance (which merged with Spreadfast and is now Khoros) to aggregate and curate photos and videos from Twitter, Vine, and Instagram, all based on the hashtag #EnlistedSalutes. These posts then get displayed in a grid using Masonry. Clicking/tapping on an item launches a nifty popover that shows information about the post and its author.
To accommodate a high volume of submissions, we implememented a “load more” button that fetches fresh data from the server and dynamically adds them to the grid.
The page also needed to be responsive, which required dynamic resizing and repositioning of the grid elements, adapting the UI to all screen sizes, as well as implementing various touch guestures in order to optimize the user experience on mobile.
Perhaps the coolest parts is that we now have a reusable platform for taking social content and visualizing it in a cool, interactive way.
Fox will be donating $1 to Operation Gratitude for each submission.