Figma Prototyping Tutorial

Опубликовано: 25 Июль 2026
на канале: Islam Hefney
21,670
678

In this video, we'll explain Prototypes in Figma, which allows us to create a realistic experience of the product we're working on, enabling us to test it or present it to clients or our team.

This video will also briefly cover Interactions and their types. In upcoming videos, we'll cover animations and overlays.


Previous videos:
Breakpoints Plugin:    • شرح Responsive Design بإستخدام Breakpoints...  
Responsive Design:    • شرح الـ Responsive Design و الـ Constraint...  
Responsive Grid:    • شرح الـ Layout Grid في فيجما - Responsive ...  
Boolean property:    • ازاي تعمل تصميم واحد باكتر من لغة في فيجما...  
Auto Layout:    • كل حاجة عن اوتو لاي اوت في فيجما - Everyth...  
Components in Figma:    • شرح الـ Components في فيجما | Figma Compon...  
Variants Video:    • شرح الـ Variants في فيجما | Figma Variants  

Timestamps:
00:00 Intro
00:20 Prototype Settings
02:06 Flow Starting Point
05:10 Scroll Behavior - Position
07:18 Scroll Behavior - Overflow
08:59 Interactions
11:21 Back Button
12:42 Scroll To
15:22 Animating Using Dissolve
14:20 Reset Scroll Position
16:07 Outro