How I Optimized My SaaS Step by Step

I am creating an interactive product demo tool. Based on the experiences shared by most people, I first launched a basic, usable version that was quite simple—some animations were a bit stiff, and there were even a few bugs.

Then, I added a simple demo that I recorded myself on the homepage (essentially a "bootstrapping" approach). After it went live, I quickly realized that users interacted with the product differently than I had expected. Users were hoping to click in more places, rather than just on the "Next" button. For example, they might click on text blocks, hotspots (the small dots in the demo), as well as the default "Next" button. So, I added click response events to all the areas where users might click, to prevent any confusion.

Next, regarding the website layout, I created a simple video to showcase the three steps of using the product (recording, viewing the demo, and editing the demo), and I placed it in the HERO section of the webpage. However, the data showed that a majority of users (over 60%) nearly ignored this video, scrolling down to view other sections instead. So, I decided to break the video into three separate segments, each displayed in a two-column layout: a brief introduction on the left and a condensed video on the right. This significantly increased the likelihood that users would watch the video.

From this experience, I learned that if your video isn't visually appealing enough (in terms of text, animation, visuals, image quality, etc.), it's better not to create a longer video. Instead, break it into multiple shorter videos and accompany each with a brief introduction.

Finally, I moved the interactive demo—which had a higher click-through rate and viewing rate—up to the HERO section, while placing the previously divided three demo videos in the second section.

I would also like to ask everyone: Do you pay attention to user behavior in the early stages?