
Learn to build interactive 3d websites with Webflow by integrating spline models and animations. Explore portfolio, product, and restaurant sites with AI chatbot and online reservations.
Explore the course structure across ten chapters, from the basic fundamentals of Webflow to building 3D models with splines, exploring Webflow features, and integrating AI chatbots for interactive 3D websites.
Equip designers, developers, business owners, and marketing professionals to build interactive 3D websites with Webflow by creating projects: portfolio sites, product landing pages, restaurant sites, with 3D models and animations.
Explore essential tools for building interactive 3d websites with webflow, including drag-and-drop design, apps and templates, spline 3d modeling, seo optimization, ai chatbots, and lead-generation options, with free-plan notes.
Explore how Webflow enables building visually stunning, interactive websites without coding, using a drag-and-drop editor, responsive design, CMS, SEO tools, and optional custom code, including 3D elements and use-case examples.
Learn to build 3D models with spline, from scratch or using the library, group components, customize colors and materials, and export code to integrate into a Webflow website.
Explore Webflow features on the editing page, including adding content, uploading images, adjusting colors and styles, and navigating templates to build a professional portfolio site.
Clone a professional portfolio template in Webflow, embed a Spline 3D model, and adjust its size and position to create a sticky, full-height interactive section.
Animate a 3d model in a Webflow portfolio site with a spline 3d model, center it, and enable mouse-move viewport rotation on the y axis, then preview and save.
Add content to a Webflow portfolio site by updating colors, replacing images and text, and highlighting web design, web development, and data science skills with AI-generated imagery.
Build and customize a 3D model with spline, embed it into a Webflow product landing page for sneakers, and configure a sticky 3D scene using a free template.
Animate a 3D model on a product landing page by configuring spline interactions, selecting the running shoe, and rotating it on the y axis, then previewing and saving the animation.
Learn to customize a product landing page in Webflow by replacing images and text, editing 3D models and lighting with Spline Scene, and building a two-product catalog with updated descriptions.
Learn to build and integrate an ai chatbot with Orimon AI on a Webflow site, train it from your data, and deploy it for customer service.
Build a restaurant website by integrating a pizza 3D model from Spline into Webflow, exporting the embed, and animating the model with a mouse move interaction.
Learn how to add restaurant content in Webflow: replace images, edit text and menus, adjust nav color, reveal a 3D model, and connect orders via forms, email, or phone.
Create an online reservation form for a pizza restaurant using Typeform, customize questions (name, email, phone, pizza type, arrival date), and publish and embed it into a Webflow site.
Conduct a search engine optimization audit with Semrush to evaluate website performance, identify on-page, link, usability, and social issues, and apply prioritized recommendations for improvement.
Welcome to Building & Designing Interactive 3D Website with Webflow course. This is an extensive project based course where you will learn step by step on how to build and design an interactive 3D website using Webflow alongside with Spline which is a 3D designing tool. In the introduction session, you will learn the basic fundamentals of Webflow, such as getting to know its main features, common use cases, and I am also going to show you several project showcases created using Webflow. Then, in the next session, you will learn to build 3D models using a tool called Spline, then those 3D models will be integrated to your website later on. After creating several 3D models, we will move on to the project section. Firstly, you will explore all features on the Webflow editing page and you will get to know how to edit the website’s content, upload images, change the design, style, colour etc. Afterward, we will start the actual project. In this course, we will build three websites, the first one is a professional portfolio website, the second one is the product's landing page, and the third one is a website for restaurants. We will start by adding contents and also optimise the SEO, then, we will integrate 3D models that we created using Spline to the website. In addition to that, we will also animate the website and make it more interactive. Even more exciting, we will build and integrate AI chatbot using Orimon AI. This chatbot will help to answer questions from your website's visitors. After building the website, we will be conducting testing to make sure that the website functions as it should and also to check if the website has a user friendly interface. There will be four main testing objectives that we are going to be focusing on, those are functionality testing, user experience testing, compatibility testing, and performance testing. Lastly, at the end of the course, we will explore several business models that you can consider, for examples like starting a web design agency, selling Webflow templates, offering SEO service to website owners, selling design assets, and building an E-commerce store for clients.
First of all, before getting into the course, we need to ask ourselves this question, why should we learn to build and design a website using Webflow? Well, there are many reasons and let me explain these two major reasons. Firstly, as the world economy undergoes a digital transformation, an increasing number of businesses are transitioning to online platforms to sell their products and reach a broader customer base. Consequently, there is a growing demand for the creation of high-quality and compelling websites. Secondly, Webflow stands out as a powerful and user-friendly tool that empowers designers and developers to create sophisticated websites without delving into complex code. This accessibility makes it an ideal platform for individuals and businesses seeking to establish a strong online presence without having extensive technical expertise. Last but not least, acquiring the skill of building interactive 3D websites using Webflow will certainly equip you with valuable skill sets and potentially open up a lot business opportunities in the future
Below are things that you can expect to learn from this course:
Learn the basic fundamentals of Webflow, such as getting to know its main features and use cases
Learn how to build 3D models with Spline
Learn how to edit text, add content, upload images, change background colour, font type, font colour on Webflow editing page
Learn how to integrate 3D models to Webflow
Learn how to animate 3D models on Webflow
Learn how to build a professional portfolio website, product landing page, and restaurant website using Webflow
Learn how to build and integrate AI chatbot to Webflow
Learn how to create online reservation forms using Typeform
Learn how to conduct SEO audit using SEOptimer and Semrush
Learn how to build website using WebWave
Learn about website testing objectives, such as functionality testing, user experience testing, compatibility testing, and performance testing
Explore business models like starting web design agency, selling Webflow templates, offering SEO services, building E-commerce website, and selling design assets