Build a 3D Site Without Code with Framer - Crash Course
194,635
Published 2022-08-30
Sponsored by www.framer.com/?utm_source=designcode&utm_medium=y…
Final site: soft-buttons-231170.framer.app/
Template: framer.com/projects/new?duplicate=jVScTJ0E7HJdoU7F…
Assets: www.dropbox.com/scl/fo/pw9eq6mzdm75etdw1v248/h?dl=…
Text content: designcode.io/framer-3d-site
Spline URL #1: my.spline.design/framercopy-bd9e7275da55ebaf7252e8…
Spline URL #2: my.spline.design/daccord-49093ae84c00862e2451c9531…
Imagine being able to create a fully functional site from a design tool without writing a single line of code. Framer offers the power of CSS layouts and animations with the familiar and quick editing capabilities of Figma. You can deploy and iterate almost instantly without having to wait for builds and you have essential features like search engine optimizations and a content management system.
0:00 Intro to Framer
4:06 3D Animation and Text Styles
15:50 Stacks and Adaptive Layout
32:46 Components and Interactions
48:17 Top Bar Menu Animation
01:06:32 Scroll Parallax
01:29:05 Appear Animation
01:45:52 Overlay and Forms
02:03:40 Pages and Breakpoints
02:19:55 CMS and Content
#webdesign #uidesign #nocode
All Comments (21)
-
I purchased the Flux Academy Framer Masterclass and your tutorial was wayyy more valuable..and also free I might add.
-
😍
-
Thank you for the crash course! I know where to build my portfolio now.
-
new subscriber here. just came across Framer and fell in love with it. I'm new to web design and development and believe Framer can make my life much easier. thanks for this tutorial.
-
I was about learning Webflow... Well I just found a better option 😇
-
Very well done, thank you for this amazing content and detailed explanations. Much appreciated!!
-
This is a fantastic tutorial! As a new Framer user I've run into several problems that you've actually help solve and I'm only 30 minutes in. I can't wait to see what else I learn. Thank you for creating this and sharing.
-
I think this is the best crash course I've found on YouTube.
-
Whoever made this video, I really want to express my deepest gratitude😊. Thanks to you, I can smoothly and understand how to create prototypes in Framer, and thank you as well for providing the assets for us to learn.😉
-
Thank you for the course! It´s great!! Thank you
-
This is the most calming voice I ever heard!
-
Best and most valuable free course i've ever seen on the internet. Thank you so much for your effort, One of the things I appreciated most about the video was the focus on practical, real-world examples. The instructor showed how to apply the concepts being taught to actual web design projects, which really helped me to understand how to use the techniques in a practical setting.
-
This video convinced me to go all in on Framer 🙌 I
-
yours is perfect. These are going to takes loads of ti off the learning process.
-
So informative. Fact packed! Easy explanations, if you don’t understand everything at first, give it some time, it will be referenced later. Watch this. I’m super pumped to get started on my new site!!
-
Thanks for this. I wish you all the best ❤
-
Wonderful course! It was very helpful😘
-
Thank you so much Framer and design code... I've been a wordpress developer but was never happy, So i have been keep jumping to various CMS's and framer is the real deal,.......
-
IDK what to say but i just wanted to say thank you for sharing such valuable lessons.
-
You are saving me a semester!