Make A Framer Website In Minutes

Timestamps:
00:00 Introduction
00:23 Drawing a Topbar
01:20 Creating a Stack
02:19 Creating a Component
02:32 Creating a Text Style
04:00 Creating a Link
04:26 Adding a Video
05:01 Adding a Hover State
06:47 Adding Breakpoints (Responsive Workflow)
07:58 Turning Pages into Stacks
08:58 Adding a Content Wrapper with Max Width
12:05 Adding an Overlay
13:19 Adding Appear Effects
14:20 Customizing the Overlay
15:24 Adding Page Links to the Topbar

#website #webdesign #framer

[Framer]

Hey everyone. Thank you so much for watching! There is a new 2024 version of this tutorial now available here.

[freyadoll]

These kinds of videos are great! Please make more videos like theses where you show us how you build different layouts and website designs in framer from scratch!

[포켓몬-ds]

I hope there will be more tutorials like this. I wish there was a tutorial video on how to prototype "Scroll", "Carousel", etc. on a web page.

[gabriellesee]

i am mindblown… as a creative who has a clear vision of what i want my website to look like but has zero coding skills, this is a gamechanger

[felippewick]

Just did the tutorial. The UX is mind-blowingly good. Great work!

[corneromme]

I really like these kinds of videos! I would love to see a video like this in which you explain how to work with overlapping layouts like you would with negative margins.

[mmathems]

This was a great introduction to Framer. Thank you so much for this content. I must've opened up an account and just had no idea of how to do anything or of what was possible with Framer, but this video has amazed me on how useful and potentially time saving Framer can be. Framer is definitely a brilliant platform 😊

[claudioduartesilva]

Love Framer, this is really a game changer for the no code community. Now we just need a way to integrate with things like memberstack and stripe and we can create our own e-learning or e-commerce platforms. Goodbye Webflow!

[zictorvulaica]

¡Muchas gracias! Son el futuro, han resuelto lo que realmente necesitamos para web. ¡Un saludo desde México!

[particularspam]

Awesome video! Only thing is: the font is very tiny, guys. You need to increase the zoom or change screen resolution before recording. Please! 🙌

[JonnainSydney]

omg so good!!!! So easy to follow. You guys are such geniuses

[KeesKeesKeesKees]

Jullie zijn helden. Wat een heerlijk product is dit <3

[sofianemtimet]

Hi, I really enjoyed your video! I happened to notice at 4:36 an e-commerce feature being used, but you didn't talk about it. It caught my attention, and I'd really like to implement it in my projects, but I can't seem to find it. Could you kindly explain how to access this feature? Thanks in advance for your help.

[victorkernes]

Super helpful, thanks for the walkthrough Benjamin!

[naft]

Finally frammer post video for make a website from 0

[lindaberggren]

Thank you for this! Please show more tutorials of examples of websites! (:

[DaveCraige]

Great video. Thanks for making it so clear!

[Brightmoonindasky]

Thanks a lot for this video! At 8:40 I set Width on "fill" for my video but only the frame was filling the page, not the thumbnail of the video itself. How can I fix it ?

[dishanfernando]

love this kind of contents, please add more

[BugsVsHumans]

At 8:00, I am aware of changes that flow from Desktop all the way down to the Phone. But there are times that some components or element changes do not get carried over to the Tablet or Phone. Is this a Framer bug? Or am I the only one experiencing this? Or is this perfectly normal since you already need some permanent changes on the small screen?