Create An Interactive Search Bar & Button: Figma Tutorial

  Рет қаралды 78,883

Darren Northcott - Figma, UX & UI

Darren Northcott - Figma, UX & UI

Күн бұрын

Пікірлер: 45
@olababs2048
@olababs2048 11 ай бұрын
Your videos are on points 👉 the way you speak makes everything easy to follow. Thank you
@mariachistatik1258
@mariachistatik1258 Жыл бұрын
This was so helpful and super straightforward. Subscribed!
@waves1731
@waves1731 Жыл бұрын
Great tutorial but you gotta figure out you mic situation my dude. You're mostly way too quite but then the volume spikes when you talk into the mic.
@scarlet7658
@scarlet7658 3 ай бұрын
Thanks so much for the amazing tutorial, and your efforts! 👏
@KelvinChiuFilms
@KelvinChiuFilms Жыл бұрын
Thank you for this man. I recently lost my job and my dream is to pivot into product design, so your videos help more than you know!
@DarrenNorthcott
@DarrenNorthcott Жыл бұрын
Oh man, sorry to hear that. Glad I could be of some help!
@Edcabraltv
@Edcabraltv 3 ай бұрын
Hopefully you landed something by now. Good luck
@Moritz040-k8j
@Moritz040-k8j 3 ай бұрын
Hey, nice video! At minute 4:28 you added a line for which you were able to select fill container. This option doesn't appear on my screen.. I was thinking of okay if my mother frame is set to fixed instead of fill container maybe the line as well wouldn't be able to set to fill container. But as I saw on your screen it helped anyways.. How to solve this problem?
@zumra3515
@zumra3515 3 ай бұрын
I have the same problem. My guess is it has to do with the recent updates. It needs to be done in another way now, so maybe try framing the line with the inner search header frame. I'll try that now at least
@zumra3515
@zumra3515 3 ай бұрын
Okay I figured it out, Apparently, you need to frame the line first so that you can place it inside another frame. This rule is applicable for every object in figma i think. Something needs to be framed before connecting it to another frame wether it be a text, image or a shape
@dennisantonio6154
@dennisantonio6154 Жыл бұрын
YES!!!! Its very helpful, exactly what Im looking for. thank you! I will subscribe.
@ABESW0RLD
@ABESW0RLD 4 ай бұрын
Itd be great if you could show how you got the search component...
@danedwards11
@danedwards11 Жыл бұрын
Brilliant tutorial, really easy to follow!
@iamalvinaringo
@iamalvinaringo Жыл бұрын
Keep up the great work! I love the short tutorials you have. I'm using them as daily practical 20-minute challenges to perfect skills that would have otherwise taken a bit longer to practice. How many more tutorials are on Patreon?
@DarrenNorthcott
@DarrenNorthcott Жыл бұрын
Glad you like them! Right now there are 3 on Patreon, over the next few weeks I will be building out 3 more, then moving into a more guided project with one off more experimental stuff. I'll also be adding in articles and useful UX tips as I go.
@joshrithabenna
@joshrithabenna 11 ай бұрын
only one word = Awesome
@olumideaanu5403
@olumideaanu5403 Жыл бұрын
I'm wowed. Keep it up.
@oksanamartynkova4259
@oksanamartynkova4259 Жыл бұрын
Wow! It's really good tutorial! Thank you!
@MuhammadZahraan-pb3zr
@MuhammadZahraan-pb3zr Ай бұрын
Thanks bro 🎉
@emekieblinkzokorie3938
@emekieblinkzokorie3938 Жыл бұрын
this is great...thank you for sharing
@nadia5792
@nadia5792 Жыл бұрын
Thank you!!!
@pollyne5010
@pollyne5010 Жыл бұрын
Great video, Thank you
@eirikmonsen9359
@eirikmonsen9359 Жыл бұрын
Awesome!
@diegovictor6772
@diegovictor6772 Жыл бұрын
Great tutorial!!!! 🎉🎉
@aliabdelhalim4304
@aliabdelhalim4304 2 ай бұрын
when i made it it popped to right . How can i make the search bar pop to left ?
@Talkbollywood-w2p
@Talkbollywood-w2p Жыл бұрын
Loved it
@itrend_sa3668
@itrend_sa3668 3 ай бұрын
Thank you bro
@design1556
@design1556 10 ай бұрын
Thank Thanks 🙏
@spacedillah6840
@spacedillah6840 Жыл бұрын
So helpful. Thank you :)
@santoshladde83
@santoshladde83 Жыл бұрын
Also please add tutorial for multi select checkbox with chips added, we can add and remove the selected items
@baaron1254
@baaron1254 Жыл бұрын
Why does this guy sound like Anton Chigurh from No Country For Old Men?
@jamaliphoto
@jamaliphoto 9 ай бұрын
perfect!
@edrianhadinata1303
@edrianhadinata1303 5 ай бұрын
thanks man.. its very helpful, but don't use shortcut without explanation and display, ex shift + E
@NorahAdetayo
@NorahAdetayo Ай бұрын
do you know how he shrink the flame to become smaller
@merovmerov7631
@merovmerov7631 9 ай бұрын
Going too fast, don't have the time to see where your mouse went that you're already clicking somewhere else
@randomstuffz365
@randomstuffz365 Жыл бұрын
Cool good ...can u also pls tell how do we convert a website into a app ?
@ShaunLevett
@ShaunLevett Жыл бұрын
These are good but not sure who they’re aimed at. It seems newer users benefit from these tutorials, yet you don’t explain what you’re doing in terms of layouts and keyboard shortcuts etc. Only more advanced users will understand the process, but they’ll already know how to do all this. I think you just need to explain why you do some things.
@Happydays212-r2x
@Happydays212-r2x 8 ай бұрын
greate one
@Pupuzela
@Pupuzela Жыл бұрын
Whisper me at my sleep daddy 😏 **Read: Please, be louder**
@chideranwafor4772
@chideranwafor4772 Жыл бұрын
cant hear you
@_.crykenny._3019
@_.crykenny._3019 Жыл бұрын
why do you not speak louder
@Arkan.20
@Arkan.20 10 ай бұрын
@NotRustyHere
@NotRustyHere 3 ай бұрын
You sound sick :(
@natalifernandez3272
@natalifernandez3272 9 ай бұрын
can u talk louder next time its super quiet and my volume is all the way
@yuvrajchhatwani
@yuvrajchhatwani 8 ай бұрын
worst tutorial ever 😢😭 not for beginners or noobs
Create A Parallax Animation Based On Mouse Position (on hover): Figma Tutorial
5:55
Darren Northcott - Figma, UX & UI
Рет қаралды 8 М.
It’s all not real
00:15
V.A. show / Магика
Рет қаралды 10 МЛН
Правильный подход к детям
00:18
Beatrise
Рет қаралды 9 МЛН
Reduce Prototypes by 50% (Simple trick) | Figma Tutorial
5:41
How to Design an Interactive Button in Figma: For Beginners
10:04
Design Xstream
Рет қаралды 85 М.
Search Bar (Keyboard Input Animation) | Figma Interactive Components
10:00
Interactive Input Field in Figma
3:16
DesignWithAchyuth
Рет қаралды 137
Advanced Interactive Accordion Component: Figma 2023 Tutorial
14:04
Darren Northcott - Figma, UX & UI
Рет қаралды 5 М.
The CORRECT (and lazy) way to prototype | Figma Tutorial
5:00
How to make… Animate Search Bar | Figma Tutorial
4:59
UI / UX Pixels
Рет қаралды 2 М.
Menu Animation in Figma
4:52
Shmelt studios
Рет қаралды 719 М.
Create an Interactive SEARCH BAR in Figma
11:02
Mavi Design
Рет қаралды 46 М.