I Built a Storytelling Portfolio Website Using AI (0 Code)

In this video, I show you how I built a scroll-based storytelling portfolio website using AI tools.

Instead of creating a traditional portfolio website, I designed a visual storytelling experience where the story unfolds as the user scrolls.

The workflow uses three tools:

First, I generated the story frames using Freepik AI.
Then I converted those frames into an animation using Flow.
Finally, I used Antigravity to turn that animation into a scroll-controlled interaction for a website.

This approach lets you create award-winning style portfolio websites without complex animation tools or manual coding.

In this tutorial you’ll learn:

• How to generate visual frames using AI
• How to turn frames into animation
• How to convert animation into scroll interaction
• How to create storytelling websites

If you're a developer, designer, or student building a portfolio, this method helps you create something much more interactive than a normal portfolio site.

Tools Used:

Freepik AI
https://www.freepik.com/

Flow
https://flow.ai/

Antigravity
https://antigravity.google/

Timestamps:

0:00 Intro
0:18 Creating story frames with AI
1:58 Turning frames into animation
3:48 Converting video into a JPG sequence
4:35 Adding image sequences to the public folder
4:46 Final result
5:15 Outro

#aicoding #reactjs #portfoliowebsite #antigravity #googleantigravity #freepikai #webdevelopment #aiprompts #website #webdesign #uidesign

Видео I Built a Storytelling Portfolio Website Using AI (0 Code) канала Akshay Raveendran