TLDR
As a founding designer at vidyo.ai. With over 750K content creators relying on vidyo.ai for seamless video creation in the social media landscape, my primary focus was enhancing the product experience.
Taking charge of a comprehensive UX overhaul, I collaborated closely with the founding team to identify and address critical user challenges.
The objective was to optimise conversion and funnel metrics throughout the web application.
The strategic redesign not only resolved key issues but also led to a significant improvement in product metrics, driving substantial commercial success and fostering growth for vidyo.ai.
New Activation Rate
47.19%
About vidyo.ai
vidyo.ai is an AI-powered video editing tool with over 750,000 global users. This SaaS tool helps them edit and create videos quickly.
Users can upload their raw video footage, Zoom recordings, livestreams, and more. In just a few minutes, the AI will create many short videos perfect for sharing on social media.
This means that the usual video content workflow, which typically takes 3-4 hours for brainstorming, editing, and publishing, can now be done in minutes. It saves creators time, effort, and money.
Goals
Two crucial metric for any SaaS tool are TTV, which stands for time-to-value and Activation Rate. In simpler terms, it means that the software must quickly demonstrate its value to the users.
For vidyo.ai, this translates to users getting their AI generated short clips promptly. Moreover, they should receive these clips in their preferred format and have the ability to make adjustments as needed.
With this perspective in mind, we outlined the following success metrics for a sample of 10,000 users.
Improve Activation Rate
The percentage of new users downloading a video created by AI. It’s currently at 20%.
Reduce Time to Value (TTV)
The average time taken by new users to download the AI generated video. It’s currently at 17.3 minutes.
Breaking down the problem
To better understand how we can improve these metrics, I took a step-by-step approach to break down the software's user journey.
The strategy was simple: for each part of the process, we identified problems and opportunities, made quick improvements, and then continued to iterate further.
The software workflow can be divided into three parts.
Part 1: Importing & Processing Video Files
For the AI to generate videos for users, they must first upload or import their files.
Initially, new users encountered a screen that appeared confusing. It contained numerous buttons and distractions that diverted attention from their primary action.
Old Visual Design
Meanwhile, during user interviews, we uncovered an additional issue.
Opportunities
💡 How might we prioritise user focus on video uploading before platform exploration for new users?
Furthermore, if a user doesn't have a video on their laptop, they cannot realise the product's value. For many individuals whose videos are located elsewhere or online, this adds a high-friction step of downloading and subsequently uploading the video once more.
After discussions with both our team and users, I chose to incorporate the following elements into the new visual designs.
- A laser-sharp focus on the upload video functionality after signup.
- Introducing YouTube link parsing, as it aligns with user comfort and the widespread use of YouTube as a platform.
- Integrating Dropbox, Google Drive, and link sharing to ensure that users can experience the software regardless of where their video is stored.
New Visual Design
The changes we implemented within two weeks of the launch yielded overwhelmingly positive results.
Results
This development has been a substantial boost for the team in optimizing Time to Value (TTV) and Activation Rate. vidyo.ai can now serve a broader range of users without requiring significant changes to the software.
Old Visual Design
New Visual Design
The sign-up to video upload rate increased from 40% to 75%.
78% of the videos uploaded to the platform utilise the YouTube link feature.
Users have streamlined their workflow by adopting drive integrations, eliminating manual video uploads.
Part 2: Selecting and organising the best clips
Once the AI has created the videos, there are different challenges to address.
From user's perspective
The experience needs to be simple and easy to proceed with the next steps.
From business perspective
This is the moment when users realise that AI can do the work in much less time than it used to
take.
It's important to meet the expectations of both sides while providing a genuinely impressive AI experience.
.png)
Opportunities
How might we deliver essential information like context and metadata for users to quickly experience the software's value without overwhelming them?
I compiled a list of all the issues and suggestions provided by users for the old version of the video clip preview screen.
Issues and suggestions
- Clearly distinguish between video clips.
- Obtain timestamps and length for each video clip.
- Enhance the ability to quickly grasp the context of video clips for better evaluation.
- Provide a fast method for users to access or mark clips they prefer.
The extensive requested changes in this software section necessitated a complete redesign. Following numerous brainstorming and white boarding sessions, we developed the following visual design.
Preview Clips
Results
Although quantitatively measuring the impact of this redesign was challenging, we opted for an A/B test to assess the impact of each screen on activation ratio.
After two weeks, the results were evident: the new screens exhibited a 20% increase in activation rate for users who encountered them. Additionally, there was a notable rise in the usage of features on this screen, as evidenced by increased clicks and time spent.
Subsequently, we rolled out the new iterations to all users following the successful two-week testing period.
Old Visual Design
New Visual Design
Part 3: Editing and downloading the chosen clip
The editor plays a pivotal role in our software workflow. Here, users can select and open a video to make various edits and alterations. These edits encompass a wide array of elements, including subtitles, fonts, images, videos, background music, start and end times, and more.
Up to this point, the software lacked an integrated editor. It essentially didn't allow users to modify or edit the generated videos, which proved frustrating for many. Therefore, creating an editor became the logical next step for our product.
Recognising that the editor can appear intricate with numerous components, we chose to leverage the familiarity bias to facilitate their engagement with this part of the interface.
.png)
Opportunities
How might we create an editor that is user-friendly yet robust, providing creators with essential functionalities without overwhelming them?
We took inspiration from Canva for this section and made the following design choices during the editor's revamp.
Implemented a left-column menu for primary actions like subtitles, fonts, background, images, and music.
Added a left sub-menu with detailed customisation options linked to the main menu.
Incorporated a video control timeline at the bottom of the screen.
Introduced a top navigation bar with video-level options, including 'save draft' and 'render quality,' among others.
Video Editor
Results
Following prototyping and testing of the editor's key components with a select group of users, we proceeded to develop vidyo.ai's inaugural video editor.
Upon its release, users expressed positive sentiment, accompanied by requests for additional features, which the team has since committed to working on.
Conclusion
Our objective was to determine how we could increase the Activation Ratio for users on vidyo.ai and reduce the Time to Value (TTV) for these users.
Thanks to our collective efforts spanning six months, encompassing development and iterations, we achieved a remarkable 107% increase in our activation ratio, alongside a 2.5-minute reduction in the Time to Value (TTV) moment.
New Activation Rate
47.19%
Learnings
Making Data-Driven Decisions
Without data to support them, any changes, design enhancements, or hypotheses are futile. My commitment to a data-driven approach allowed us to achieve substantial benefits for our users.
Rapid Iterations & Experiments
Thanks to the small scale and agile nature of an AI startup, I could swiftly implement iterations and experiments, obtaining immediate insights into our efforts. This shortened the feedback cycle to under 48 hours for minor changes and up to 14 days for more significant outcomes.
Various products demand distinct expertise
An online-only consumer product such as vidyo.ai can develop products and systems in a manner that enterprise or hybrid companies like Jiva cannot.
A minor rendering error on vidyo.ai may not significantly affect anyone, whereas a truck dispatch error on Jiva can lead to serious real-world consequences.
