Тёмный
No video :(

How To Create a Functional "BACK TO TOP" Button in Figma 

Mavi Design
Подписаться 45 тыс.
Просмотров 30 тыс.
50% 1

Visit my STORE: bit.ly/mavi-de...
Explore Mavi Design COURSES : bit.ly/mavi-de...
Download FIGMA for FREE: bit.ly/get-sta...
Take FULL advantage of ALL FIGMA's features: bit.ly/figma-p...
This is a Figma prototyping tutorial for beginners where we'll go over creating a functional "scroll back to top" button in Figma. We will be working with overflow scrolling, prototyping, frames, autolayout to achieve the result.
--------
© 2022 Mavi Design

Опубликовано:

 

6 сен 2022

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 35   
@tioroshi8256
@tioroshi8256 Год назад
Now in prototype set "On Click" > Scroll To > Select a frame on the top, done!
@santiagoardila2202
@santiagoardila2202 Год назад
Thanks bro you transformed 8 min of video in 30 sec
@Domvelando
@Domvelando 8 месяцев назад
haha yes seeing the process was cool but this is the only reason i watched the video@@santiagoardila2202
@jareboi18
@jareboi18 6 месяцев назад
How do you do it in a frame with auto layout?
@kirbypotito
@kirbypotito Год назад
Please, do a tutorial with this new update, this is not function anymore
@sk.q7049
@sk.q7049 Месяц назад
Hello,can you make this vlog for framer too?
@jen5917
@jen5917 Год назад
after i "fix position" the scroll to top button from the second screen, the "mouse enter" prototype from page 1 does not work for me. the button wont show... how can i fix this?
@Gorilla_brown786
@Gorilla_brown786 7 месяцев назад
How do you connect one rectangle in one frame to another rectangle in another frame? I can't do it.
@baichuanlu3131
@baichuanlu3131 8 месяцев назад
this is a mobile page, so does mouse enter still work?
@beluarribas3996
@beluarribas3996 4 месяца назад
How can I can do the same but with hover state?
@JoseReyes-pr9hg
@JoseReyes-pr9hg Год назад
I will run my own experiments but how could you replicate this in a mobile environment where there is not a mouse available?
@sanamadre5051
@sanamadre5051 Год назад
What would be the substitute for mouse enter for app as in app you scroll thus mouse enter not working for me.
@hoshinohikaru907
@hoshinohikaru907 Год назад
my figma does not show the fix position when scrolling. What should I do?
@Tschoii90
@Tschoii90 Год назад
It is now in the prototype section on the top right.
@shoyo671
@shoyo671 Год назад
Nice vid
@kiarakun
@kiarakun Год назад
Can "sticky scroll" be an alternative?
@mavidesign
@mavidesign Год назад
With the new update, I think it can :)
@paavamkutty
@paavamkutty 10 месяцев назад
back button is not working on figma even though I have made the connections. Rest all the buttons are working. Can somebody tell me what might have gone wrong?
@mavidesign
@mavidesign 9 месяцев назад
To get personalized help and feedback on your project, please join my free Discord server. You can send me an Instagram DM or reach out to my email (About section of my channel) to get your invite. I'm unable to help everyone over RU-vid - thank you for your understanding! Mavi
@uts2521
@uts2521 Год назад
Thank you
@zinmyowin978
@zinmyowin978 Год назад
Could you pls tell me which website or app do you use in this video for creating design?
@mavidesign
@mavidesign Год назад
Figma, it's in the video title :)
@zinmyowin978
@zinmyowin978 Год назад
@@mavidesign Thanks!! and I'm waiting for your new video and design😁😁
@maryamabaee332
@maryamabaee332 9 месяцев назад
I can't understand from copying a background and pasting it to website 1...:/
@mavidesign
@mavidesign 9 месяцев назад
To get personalized help and feedback with your project, please join my free Discord server. You can send me an Instagram DM or reach out to my email (About section of my channel) to get your invite. I'm unable to help everyone over RU-vid - thank you for your understanding! Mavi
@junjie83
@junjie83 Год назад
I can't make it lol.. how
@maryamabaee332
@maryamabaee332 9 месяцев назад
me neither
@brunogamesbr1
@brunogamesbr1 2 месяца назад
as a programmer, forced to learn ux design, figma seems like a fancy software for you to find awkward ways to fake a functionality, jesus christ, a "back to top" button is one of the most basic, most common things a SPA should have, it's so common that it should be a prototyping option, why are we forced to make all of this janky shit just for something that every single website has?
@user-go4wx3jr9w
@user-go4wx3jr9w 4 месяца назад
way to fast. also shapes cant connect to other shapes with protyping, only frames.
@hayuralves1207
@hayuralves1207 Год назад
I did not like
@hayuralves1207
@hayuralves1207 Год назад
yout opnion don´t matter, because I like
@hayuralves1207
@hayuralves1207 Год назад
but I don´t like
@hayuralves1207
@hayuralves1207 Год назад
but I like
@hayuralves1207
@hayuralves1207 Год назад
ok
@hayuralves1207
@hayuralves1207 Год назад
Далее
STOP doing DROPDOWNS like this - Figma variables 2023
15:35
до/после Знакомо?
00:16
Просмотров 13 тыс.
Prototyping Anchor Link / Scroll To Position in Figma
14:26
How to Add a Button Hover Effect in Figma
10:18
Просмотров 86 тыс.
Can Figma Do THIS? (It Changes When You Scroll)
17:07
Scroll Bar Animation in Figma Using Smart Animate
8:36
Sticky scroll
4:41
Просмотров 130 тыс.
Back to top (or any section) Interaction in Framer
8:03
Trick to Show/Hide Header on Scroll in Figma
4:53
Просмотров 105 тыс.