Trouva
Designed and launched a new tool that would allow users of the Trouva creator platform to add pre-licensed music to their video posts.
Role
Design Lead
Timeframe
1 month
Team
1 Product Manager
1 Engineer
2 Stakeholders
Context
Trouva is an online marketplace that connects physical boutiques based in the UK and EU with shoppers across the globe.
In 2023, to increase engagement and product visibility, Trouva launched a social commerce strategy that would enable boutiques and content creators to post short videos with shoppable products tagged within them.
The Problem
Soon after launch, the issue of music licensing was raised.
Since the videos often came from other social platforms they usually had music added on top, music that Trouva didn’t have the license to share on their website. While the team felt music added to the video experience, the moderation effort in deducing which music was royalty-free and which wasn’t was becoming a blocker in getting videos published onto the site.
Joining the team after the launch of an MVP for a new social commerce platform, I led on the iterative phase.
To facilitate live show creation, I added a section for live events in the Trouva admin platform called Backalley. From this section, the admin could create a new live show for any user.
Option A
Wireframes showing a solution where the user can either upload the video with no sound, or toggle it on and accept responsibility for the commercial license of the music. The video post UI would then be updated to show whether the video had no sound or original audio.
Option B
Wireframes of a solution with 3 choices; use original audio and take responsibility for any music used; choose a track from a selection of songs purchased by Trouva or use no sound.
Option C
Wireframes of a solution where the user can choose between original audio or music licensed by Trouva only. By positioning the audio selection at the start of the video upload flow and including cover art, the user has greater visibility of the tracks and encouraged to select music over the original audio.
Competitive Analysis
Through exploring different options, the integration of licensed music was becoming the preference. While the Head of Product explored different third party music providers, I undertook competitive research and analysis, looking at how a variety of different video editing and social media platforms enable music to be added.
By analysing the UX of the competitors, I was able to get a sense of the kinds of behaviours users were used to when posting video content. This helped to define the user flow that would work best with the existing video upload process.
Highlighting the key features I observed that each competitor utilising also helped to set a benchmark for the kinds of features we would like to include in order to provide a high quality product.
With a music library to partner with confirmed, the engineers focused on the technical side of the integration, I worked on the user flow for adding music to each uploaded video. Based on the chosen music library, MVP feedback and early user research, a list of initial requirements were defined for the product.
Design Walkthrough
After much design exploration and reviewing with the Head of Product, I worked up a prototype of a version we were most happy with and initiated a design walkthrough to discuss the wireframes with the engineering team for technical feedback.
Above
Initial wireframes for adding music. Beginning top left, once footage has been uploaded for the video post and ending on the far right screen where the audio has been confirmed. If selected an audio track from library, this will be processing as the user completes the post content.
Through this session, adjustments and descoping of features were made due to time pressures:


Filtering of music tracks will be descoped for launch.
Filtering of music tracks will be descoped for launch.
Tracks to be shuffled at random to allow variety
Play/select to be integrated into one click to help with processing speed
Background colour to remain white at all times to save additional development time
Additional feedback from legal also fed into the iterative process:
The user must acknowledge the conditions of using the original audio, this needs to be achieved by them confirming to have read the statement.
With the prototype feedback in mind, I reworked the designs and simplified the user flow further. Once a new prototype was signed off, I presented a demo in a company meeting to allow those capture any further feedback from those not involved in the project. Then the wireframes were handed over to engineers for development.
Below
Clickable demo showing the flow for adding music to a video post
Internal Tools
As part of the feature, I updated the backend tool used by Trouva admins to view and manage video content uploaded by boutiques to surface the audio selection made by the user. This would further help in moderation efforts as admins could instantly see whether the music was part of the library and could disapprove the video if necessary.
After a QA process was complete, the new feature was communicated to the selected boutiques using the feature and asked for their feedback on usability. Other than catching some additional bugs, the sentiment was very positive on the ease of use and selection of music.
Next Steps
As part of the design development, I considered how additional features could be incorporated in future phases to enhance the video upload further. This included the ability to trim the video footage and to position the audio to the desired sequence of footage.
