Wishpond
Data-Driven Decision Sparks 52% Growth in Visitor Numbers
Website creation has come a long way over the years. Back in the 90s, websites were pretty basic, with just text and simple HTML formatting. Nowadays, you can find content management systems and drag-and-drop builders all over the internet, making it super easy to create websites. But guess what? Technology didn't stop there. We've entered a whole new era with AI-powered website builders. These bad boys are changing the game and making website creation a breeze.
In just a matter of weeks since the AI trend took off, we witnessed a rapid surge in the adoption and integration of AI across various markets. Countless products and software swiftly embraced this trend, incorporating AI into their offerings.
![](https://framerusercontent.com/images/YNoVB0nHD8ybyqJyHNhexUyMpk.png)
How could we integrate AI to our products in a short period of time?
During the early stage, while the concept was still hazy and undefined. We were getting the request from the managers that we need to start building mockups and push the project forward. After extensive research, a crucial question raised -
"How could we empower users by building this integration?"
Research
Our research identified two primary use cases for leveraging AI: generative and assistive. In the generative use case, AI can be utilized for tasks such as drafting initial emails based on goals and other details, generating website images, and proposing survey questions. On the other hand, in the assistive use case, AI can provide grammar and wording suggestions, as well as summarize articles or reports.
Define
We knew that our customers are small to midsize business owners who primarily focus on other aspects of their business and require substantial assistance in the marketing domain. Particularly when it comes to designing a website and crafting engaging website content. This is precisely where generative AI can prove to be invaluable in providing the initial assistance and empowering users to achieve their goals.
Technical Constraints
When it comes to generative AI models, it was still relatively new and lack of customization in the backend. This means that when designing the user experience we needed to consider and prioritize the existing technical constraints.
How did I help?
After we had a full understanding on the generative AI model and the technical constraints that come with it, we started to map out the user experience. For the project, we even included marketing team to strategize the best way to start this user experience, streamlined the steps in the meantime taking account the technical constraints. After countless of brainstorming meetings, we were able to come up with the first version of the user flow map.
![](https://framerusercontent.com/images/IIYN4OtzLvjY94t14SG5eJftIM.png)
One key aspect I focused on was the user's experience when they begin building a new website, which is choosing a template. To enhance this process, I introduced a badge with an icon featuring the AI-Content Generator. This badge serves two purposes: firstly, it informs users about which are the templates that support AI feature, and secondly, by introducing this badge it does not add any extra steps that could potentially frustrate users.
![](https://framerusercontent.com/images/gMllJtWGnAiiRfc8eoihWIX8BA.png)
After the user selects a template, we introduced an additional step to gather user input for the AI prompts, ensuring a complete customization experience. To make this process seamless and user-friendly, I opted for a pop-up design solution. By implementing a pop-up, we maintain the flow of the user journey while allowing users to conveniently provide the necessary information. This design choice ensures a smooth and intuitive experience for users during the AI prompt completion phase.
![](https://framerusercontent.com/images/FI5nod3tR1MmufJ666Ai7Jf4RoM.png)
Lastly, although the AI is powerful and can perform magical tasks, generating an entire website may still take a few minutes. To reduce any potential frustration caused by the loading time, we implemented 4 to 5 delightful animations (inspired by Uber Eats, break the process into small little steps). These animations not only entertain the users but also serve as a visual cue that the AI is actively working in the background. By introducing these animations, we aim to create a more engaging and enjoyable experience for users during the waiting period.
The Results
After two months of dedicated work, we successfully launched the MVP, which yielded remarkable outcomes. With our new feature, users can now build a fully customized three-page website from scratch in an average time of just 60 seconds. Previously, this process could take anywhere between three to twelve weeks. This drastic reduction in design time showcases the effectiveness of our innovation.
Furthermore, the launch of our product proved to be a resounding success, as it generated an impressive average of over 150 leads per day during the initial weeks. This exceptional level of customer interest and engagement has further validated the value and appeal of our offering.
-
Substantial loss of 90% of potential users engaging with our new feature
One of the main problem we found, as you can see from the graphic, it reveals that out of the visitors who reached the sign-up phase, only 13.64% proceeded to the next step. This indicates a substantial loss of around 90% of potential users engaging with our new feature.
![](https://framerusercontent.com/images/gUO5lXJltNkiiBu1xPsrFyE7s.png)
To address this problem, we started to talk with some users to gain insights into the barriers they encountered during this phase. In the meantime, we conducted extensive competitor research to explore alternative solutions that could enhance our user experience.
The approach
The visitors were expressing frustration upon discovering that signing up and going through the entire process was necessary to use our free AI website builder. To address this issue, these are some approaches we took.
Firstly, we decided to eliminate the sign-up step altogether, prioritizing the goal of enabling users to engage with our new feature as quickly as possible. By removing this barrier, we aimed to reduce user frustration and encourage immediate interaction.
Simultaneously, we streamlined the onboarding process into just two steps, incorporating straightforward questions to make it more user-friendly. Additionally, I made intentional design choices to enhance the overall experience which is to include interactive graphics alongside the process to engage users and make it a more delightful and less frustrating experience.
![](https://framerusercontent.com/images/M7VkLLT9KpO87YPESdWr9Cyk.png)
Substantial growth to 52% of visitors now actively engaging with it
Following the implementation of our new solution, we observed a remarkable surge in the number of potential users engaging with our feature. Initially, only 7% of visitors successfully reached our feature, but we witnessed a substantial growth to 52% of visitors now actively engaging with it.
![](https://framerusercontent.com/images/b6zHU1bK6sGW7yPPTCUioynltWQ.png)
While we acknowledge that there are undoubtedly other factors that can impact users' decision to proceed to the next step or not, it is undeniable that our implementation played a crucial role in driving this improvement.
By streamlining the onboarding process and incorporating engaging graphics, we were able to create a more delightful and user-friendly experience, thereby capturing the attention and interest of a significantly higher percentage of our visitors.
![](https://framerusercontent.com/images/n33njA5JSU9DZC1iizM2Y9Rqk.png)
![](https://framerusercontent.com/images/csyIOSorCl3LYseDLfzYaGQM.png)