Тёмный

Prototyping auto panning map interaction of Google map/ AirBnb | Figma 

Akash Yadav
Подписаться 20 тыс.
Просмотров 17 тыс.
50% 1

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

 

25 окт 2024

Поделиться:

Ссылка:

Скачать:

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

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 33   
@stationmontroyal
@stationmontroyal 2 года назад
aaaayyooo😩🤞🏻🤞🏻🤞🏻 this vid was all i needed to create my own map/// you explain very well!!
@karenngo2687
@karenngo2687 2 года назад
Help please- In my design I have cards instead of buttons that link to targets on the map. I was wondering how to set up vertical scroll in my bottom sheet element so users can scroll down to read the various cards? I selected all the cards and made a frame selection and enabled vertical scroll in that frame selection but it seems like the pan of the map interferes. There are two frames but I guess because the map frame is behind the bottom sheet/pull up panel it affects it. I tried experimenting by reducing the size of the map frame to not overlap with the bottom sheet, but it still didn't scroll the cards in the bottom sheet.
@RobertoGonzalez-bz8si
@RobertoGonzalez-bz8si 10 месяцев назад
How do I fix the UI interface in place? I am having issues with the interface moving with the map
@sauravsharma2617
@sauravsharma2617 3 года назад
Amazing tutorial sir something different to learn thank you
@AkashYadavUX
@AkashYadavUX 3 года назад
Thanks a lot 🤠
@vasumanchauhan
@vasumanchauhan 3 года назад
Finally! The most awaited 🙏
@AkashYadavUX
@AkashYadavUX 3 года назад
🤠🤠🤠 hope you like it 😇
@vasumanchauhan
@vasumanchauhan 3 года назад
@@AkashYadavUX ofcourse 😄 Akash just a small request. Can you please make a separate video on using constraints for responsive design??
@AkashYadavUX
@AkashYadavUX 3 года назад
Hey! So i will cover responsive design soon :)
@pranayagarwal954
@pranayagarwal954 3 года назад
Learned so many things!
@AkashYadavUX
@AkashYadavUX 3 года назад
😇😇
@TemitopeFanawopo-q6w
@TemitopeFanawopo-q6w Год назад
Can you talk about text box animation?
@shyam4479
@shyam4479 3 года назад
Hello sir! I'm Srirenganath, I have been following your works, your contents are very educative for beginners like me, a big thank you🙏 for that sir. I tried the map interaction you have taught in this video using Figma, it came out well🎉. But sir, I'm facing an issue creating it using adobe xd. After all the processes like placing the pins on the map and creating components, the issue is that the buttons in "nearby card(bottom card)" cannot break into the scroll group of the map while prototyping, since the "scroll to" dropdown shows only the "scroll group as a whole" and not the components in it. so when I click a button in the nearby card(bottom card with the neighbourhood buttons" the scroll to positions the map, based on scroll groups not based on pins. But when the map and pins are not in scroll groups they are shown in the drop-down of "scroll to" but if I put them in the scroll group after prototyping they again link back to the whole map and not to the pins in the map. I have searched many sources sir but didn't get the required information, please help with this sir🙏. A video on this if possible would be more useful sir.
@AkashYadavUX
@AkashYadavUX 3 года назад
Hi Shyam, this is unfortunately a limitation with XD for thr scroll to interaction. I will see if there is a workaround for this. Will update 🤘
@shyam4479
@shyam4479 3 года назад
@@AkashYadavUX Thank you sir👍.
@sterlingsimpson-johnson5096
@sterlingsimpson-johnson5096 3 года назад
Is there a way to make horizontal scrolling so that the end of the frames do not 'bounce' once they have been reached? If you scroll all the way to the left or to the right, the end icons bounce before returning to their stationary position.
@AkashYadavUX
@AkashYadavUX 3 года назад
umm no Actually.. that's a standard default behaviour which figma has added to mimic the iOS behaviour. Slight bounce will be there always when you scroll to extreme.
@sarayupalanivel3148
@sarayupalanivel3148 Год назад
Hello Akash. Thank you for the tutorial. I just have a small issue with this prototype. I'm not able to scroll the location buttons but instead the map behind moves. Is there a way to solve this issue?
@AkashYadavUX
@AkashYadavUX Год назад
hey Club both map and location pins into one frame and then add horizontal & vertical scroll to this frame.
@romanmir8443
@romanmir8443 3 года назад
Can you make a video on layout grids on Android and iOS
@AkashYadavUX
@AkashYadavUX 3 года назад
Will do in upcoming videos
@rashankr9277
@rashankr9277 3 года назад
i have a doubt in protype sir. in this comment section unable to attach a exported jpg. issue is when i am turning a screen to protype mode and play.it looks like scattered can u please provide any socialmedia id
@AkashYadavUX
@AkashYadavUX 3 года назад
Hey Rashank, my socials are on my channel, but currently not super active on them. However i am releasing all the source file tomorrow, so keep a watch 😇🤗
@sunilkumar-uf1bi
@sunilkumar-uf1bi 3 года назад
Sir make video how to used figma template or figma ui kit I can't find the tutorial of this Please make video as soon as
@AkashYadavUX
@AkashYadavUX 3 года назад
hey Sunil, Didnt get you? Can you explain again?
@sunilkumar-uf1bi
@sunilkumar-uf1bi 3 года назад
@@AkashYadavUX sir I don't know how to used ui template or ui kit( like about where we can find it or used) can you please make video on this topic! Also I an question that what is relation between the illustrator or Photoshop with figma ( how can we use all three)
@AkashYadavUX
@AkashYadavUX 3 года назад
sure, will mske a short video 🤘
@sterlingsimpson-johnson5096
@sterlingsimpson-johnson5096 3 года назад
@@sunilkumar-uf1bi you can go to figma community. After you search 'UI kit' and find what you want, click on the result, then click duplicate. This will open another figma window. From there you can just copy and paste the figma materials (UI kit) into your own figma projects: www.figma.com/community/explore
@ALLNALLProductions
@ALLNALLProductions 3 года назад
Perfect
@AkashYadavUX
@AkashYadavUX 3 года назад
😇
@borisdelgadomoran633
@borisdelgadomoran633 3 года назад
Save my life bro, 😍
@playpiano2264
@playpiano2264 3 года назад
Challenge accepted 💯
@AkashYadavUX
@AkashYadavUX 3 года назад
🤓
Далее
Designing Google Maps interaction in Figma
15:57
Просмотров 84 тыс.
6 UI Hacks I Wish I Knew As A Beginner
11:11
Просмотров 832 тыс.
He went ALL in 😭
00:12
Просмотров 1,9 млн
Building Interactive Maps in Figma with Variable's
25:02
Prototyper un Google Map version Hyrule sur Figma
13:45
Figma for Edu: Advanced prototyping workshop
59:48
Просмотров 61 тыс.
I Redesigned Popular Websites (Amazon & Google)
6:58
Просмотров 282 тыс.
How to Make a Figma Map Draggable and Zoomable
4:59
Liquid Swipe interaction in Figma
18:30
Просмотров 23 тыс.
Level up your UI design skills in 7 minutes! | EP1
7:12