Making flexible auto layout tool tip components in Figma.

#Figma #Config #Config2022 #FigJam #Tutorial #NothingGreatIsMadeAlone #autolayout #tooltip #design #ui #uxui #uxdesign

[jjgangi]

Would have never figured this out without this video. Not sure if that's a compliment to the creator, or an insult to the usability of Figma.

[thasr]

I absolutely these videos. No fluff, no waffling, just pure learning, straight to the point. Love, love, love.

[MotivatingMarketingTech]

This video just fried my brain in the best possible way.

[xpk.creative]

Absolute positioning is a such leap forward guys, much appreciated feature that makes Figma out of this world! Cheers ;)

[cruisysoozi]

I 💖this, it's exactly what I needed to know. It's demystifying Figma, thank you. Great explanation and pace.
Something interesting happens though when I place an instance of this tool tip into another component... The bubble reverts to a small size and leaves the text hanging out. The horizontal and vertical resizing then need to be reset to 'hug' and it's all good.

[dmitry_zakedonsky]

When I tryed create component with layout, it was very complicated method. This one simple and advanced - thanks a lot!

[BobbyCharlz]

Wow, I learned so much in quite a short bit of time. I am blown away at the depth of Figma. Just when I think I’m getting a handle on it, so much more comes out that I’m eager to learn and get after. Thank you for the great video. 👍

[MrJmhess]

BRAVO, BRAVO!! ENCORE!!! do you have more videos? Very easy to follow along and understand.

[FerdiCildiz]

I would use auto layout for the bubble and arrow.

[Studio-sapana]

hey, after practicing 2-3 times i could make responsive component. This is superb :)

[jarediledundee]

Exactly what I was looking for. Many thanks!

[TheMrBrendo]

Amazing! Thanks for taking your time on this and showing the steps, you rock!!!

[VarunKumar]

I had been looking for a video like this for so long. This helped me create a complex button shape! Thank you 🥹

[z-h-d]

Didn't know about outline mode! wow

[AnAn-wchn]

It works, so helpful! Thank you so much!🤩

[adamstuartclark]

Lovely. I could be beneficial to actually have two text layers, one for the main body of text and another for an optional heading, which you could also control with a visibility boolean property.

[elflacosoyyo]

Amazing! Thanks for sharing Migi. Genio 🧞‍♂️!

[Underhills]

@0:23 you said you hit Ctrl+E / Cmd+E to expand it, but it did the opposite. The container hugged the object instead. This is a neat trick, but did you just say it wrong or is that expression correct? What do u mean by expand?

[yutani]

This may be sufficient for short, concise tooltips. In practice, however, it is unfortunately much more complex. Often you have actions that are located at the edge of the viewport, in which case the tooltip also moves out of the viewport. Then you have to align the tooltip left if the tooltip flows out of the viewport to the right. But what about multi-line tooltips? So that we don't have a long ugly line, we need a max width. But what happens when this width is reached? The tooltip should then grow dynamically.

[adrestuc]

Thanks for the video! Is there a way to set a max and min width for a component like this? Seems I lose the responsiveness when switching to a Fixed width (vs. Hug)