Get ready to innovate. Explore all our services.

View All Services

Drop us a line at [email protected]

or schedule a call and share your story with us

Educational Webflow website to explain what the heck AI is

AI Takes Over
Poznań, Poland
  • Technology
  • Webflow
AI solutions have become incredibly popular in recent months. Unfortunately, in spite of their many benefits, millions of internet users associate AI with fear and uncertainty. We decided to do something about it and, at the same time, showcase our web design prowess.
We told the story of AI and explained why it's not something worth stressing over. What's more, we did so through the medium of an innovative no-code solution in the form of a Webflow-powered website. With fluild animations and eye-catching visuals, as well as absorbing storytelling, the AI Takes Over website offers an educational and engaging take on what AI really is.
Our team created an educational website that quells people's fears of AI in an interactive and visually stimulating way. We’ve also proven that we're more than capable of getting the most out of Webflow in our day-to-day processes.


Artificial fear?

AI has been talked about and studied for many years now. However, the recent emergence of user-friendly and accessible large language models and image-generating tools thrust it into the limelight. With the public expressing a wide range of emotions, from fear and doubt to hope and optimism, little was said about where AI came from. That's when we came up with the idea for the entire project.


Test of skill

Our projects often force us do things for the very first time. The AI Takes Over project was no exception. After brainstorming ideas and researching the topic, we had to craft some unique copy. At the same time, the designers created UX and UI designs in Figma and sculpted a few eye-catching 3D models using Blender. Finally, the developers put everything together using Webflow.


AI enthusiasts and AI helpers

Apart from having a bunch of creative individuals to work on the project, we've also handed over a few tasks to AI itself. GPT-3 helped us write a few key content pieces present on the AI Takes Over website. It even told us a bit about itself!


No code, no problem

One of our goals was to showcase our proficiency in using Webflow. In short, it's a no-code web design platform that's great when it comes to ensuring design cohesiveness and crafting low-budget solutions.


Meet our host, the Rainbow Unicorn!

We decided to make the unicorn emoji the main protagonist of the project. Combining curiosity, adorableness, and quirkiness, it helped make some of the more serious parts of the AI Takes Over website more engaging and easier to digest.


… is asking questions

The unicorn’s conversation with the robot that goes on as the user scrolls down the page is meant to symbolize the messages we use to communicate with AI language models. The idea here was to present human-machine interaction in an engaging and positive way. Because of that, the entire conversation resembles regular conversations we all have in messaging apps every day.


Eye-catching, unique

Our visual direction for the website was to make the project appear innovative both when it comes to the technology that powers it and its visual side. For the first time ever, we used our in-house resources to create 3D visual assets. We also took advantage of Blender's model-building features. The Octane Renderer helped us improve the shading and get the final look of our assets just right.


Going way back

We start off by outlining the history of AI and how it evolved over the years. We touch upon how AI was perceived by the public, as well as what scientists had to say about it. GPT-3 helped us make the entire section more engaging and to-the-point.


It's already here

The next section is about the current state of AI. It's supposed to make the website visitor reflect on how AI is developing and how it can be used in a variety of different industries. The title of the section ("Already Here") is a pop culture reference. In the context of our website, it's a response to popular misconceptions about AI that can be found throughout the internet, usually held by users who are unaware of AI's omnipresence.


A force for good

With the past and present already explained, there had to be a chapter with predictions regarding what’s in store for AI. We’ve gone with an encouraging, positive message of embracing AI-related global changes. Instead of being a threat, they can be viewed as an opportunity to make our lives better.


Color coding in action

The visual side of the project is based on how the entire website changes colors depending on which chapter we're currently viewing. The color change helps signal a change in tone and the overall vibe of the section we're reading about.

Reds symbolize fear of the unknown. Next, there are violets, which represent the present. They are at the intersection of the past and the future. Last but not least, blues illustrate progress and change. Each of these colors stands in contrast with the dark background colors, making the entire website even more visually striking.


Futuristic and legible

The bitmap typeface Offbit 101 does a great job of setting the tone for the whole project. Visibly associated with programming and computers, it helps establish a connection with the digital world. To balance it out, we used the General Sans typeface for sections in which the font size is smaller. Consequently, the website text looks great and is fairly easy to read.


Own the product like never before

For all things technical, we utilized Client-First by Finsweet, a user-friendly and highly-accessible add-on for managing website content. What convinced us to use it is its ability to support real-time website changes. With additional features like user roles and permissions, it allows website managers to control their site’s contents with ease and confidence.


Let’s build your next digital product

Contact Us

We use cookies to deliver services in accordance with the Privacy Policy. You can specify the conditions for storage or access to cookies in your browser or the configuration of the service.

Just great!Read more