How to Install Superflow with Webflow

Apr 17, 2023

Superflow 🤝 Webflow

Superflow and Webflow are two powerful tools that can help teams and clients streamline their workflows and improve their web design and development projects.

Webflow is a web design and development platform that allows users to create and launch responsive websites without writing code.

‍Superflow, on the other hand, is the swiftest annotation tool for web design feedback. It allows users to leave pinpoint comments, create voice or video recordings, start live huddles, guide users on the page with follow mode, rewrite copy with ChatGPT AI Copilot, and more!

By integrating Superflow with Webflow, users can enhance their design feedback capabilities and improve their web development process.

In this blog post, we'll go over how to install Superflow with Webflow and explore the benefits of using these two tools together.

Step-by-step guide to install Superflow with Webflow.


Step 1: After signing up, you'll want to select Webflow as your platform option.

Step 2: Copy your Webflow website URL. Paste the URL into Superflow’s project creation page to verify where you want to install.

Step 3: Copy the Superflow provided code snippet. Then in Webflow, navigate to your settings and go to the Custom Code section.

Step 4: Paste the code snippet into the Footer Code section, adding it before the </body> tag, then save changes. Publish your Webflow website to ensure the changes are live.

Step 5: In Superflow, click "Next," then try the Test button. If you hit a snag, make sure to hard refresh your pages.


Additional Steps to start Superflowin:

* Add your first comment by clicking on the comment icon and choosing where you want to add the comment. Type up your feedback and then publish it.

* In the Superflow app portal, add teammates and clients to your project to collaborate with them.



Benefits of using Superflow with Webflow

Installing Superflow with Webflow can be incredibly beneficial for both teams and clients alike.

By using Superflow to annotate web design feedback directly on the website, teams can collaborate in real-time, communicate more efficiently, and streamline the design revision process.

This can lead to faster turnaround times, fewer miscommunications, and ultimately, better results.

Integrating Superflow with Webflow also makes it easier for teams to manage their tasks and design revisions in one place.

Clients, in turn, benefit from the ability to provide feedback in context, which can help them better understand the design decisions being made and provide more actionable feedback.

By working together in a more streamlined and efficient way, teams and clients can achieve better results and build stronger relationships.

How can Superflow improve team collaboration, productivity, and communication?


Superflow is a powerful tool that can significantly improve team collaboration, productivity, and communication by streamlining the design revision process. Here are a few examples of how Superflow achieves this:

Collaborate directly on your website:

‍With Superflow, team members can leave pin-point comments, create voice or video recordings, and start live huddles. This allows for direct and efficient communication about design changes or feedback, reducing the need for lengthy email chains or meetings.

ChatGPT AI Copilot:‍

Superflow's AI Copilot can rewrite copy, making suggestions to improve the readability, tone, and voice of your website. This can save time and effort, allowing for more streamlined workflows and improved productivity.

Seamlessly integrate with other tools:‍

Superflow seamlessly integrates with ClickUp, Slack, Asana, and of course, Webflow. This means you can manage all of your tasks and projects in one place, reducing the need to jump between different tools and platforms.

Clear feedback on projects:

‍With Superflow, team members and clients can provide clear feedback on projects, reducing misunderstandings and delays in the design revision process. This allows for more efficient workflows and ultimately, faster project completion times.


Now that you know some of the most significant features of Superflow, let's talk about some real-life scenarios where it can be a game-changer:

Do you need to iterate and make changes to your website design quickly?

Use Superflow to leave comments and feedback directly on the design so your team can see them in real-time.

Is your team distributed across the globe?

No problem. Superflow integrates with platforms like Slack, ClickUp, and Asana to keep tasks organized in one place.

Want to get feedback from clients directly on the design?

Superflow's commenting and feedback features make this possible. You can keep communication clear, and everyone in the loop.

Finally, if you want to speed up the design revision process, Superflow is the way to go.

Leaving pinpoint comments and collaborating in real-time will reduce the time it takes to complete your project.


If you want to improve your digital design feedback and collaboration process, Superflow is here to help. If you're interested in trying it out, start here and sign up for a 10-day free trial.