The product can be comprehended in two separate entities:
App Components: This takes a collection as an input and shows the corresponding images or videos along with other metadata in the different blueprint of the design.
AEM Asset Integration: This allows a user to choose user generated content from internal library. In addition to UGC Library, a user can also fetch the desired assets (using various filtering options) from other social networking sites like Twitter & Instagram. A user can create the collection of these assets which are finally propounded to different App Components.
The design has to be simple and consistent for a better user experience.
Things have to be implemented using limited technologies without relying on external codebase.
Proper design pattern needs to be followed so that other modules can be introduced to the application without harming the existing module.
The product needs to adopt any upgrade in the internal tools, in particular, the different versions of AEM.
Progress
App Components are built majorly in Mustache, Less and JavaScript that runs on Node.JS. The code is automated using Mocha and Jasmine which run on the Karma test runner.
AEM Asset Integration UI is built in Coral, Granite and JavaScript while the Java back-end is used as the API provider platform. The whole environment is set in Adobe Experience Manager. The code is automated using Nightwatch.JS and runs on Selenium server.
Commonly occurring stuff is implemented and enclosed as custom SDK. Then these development kits are used to build different components to avoid redundancy. The functionalities specific to a particular App are handled within the App codebase.
Result
Livefyre integration with assets within Adobe Experience Manager gives marketers the ability to source, manage and deliver user generated content experience without having to leave the experience manager interface.