Figma | Testing Prototype with Figma Mirror |

Поделиться
HTML-код
  • Опубликовано: 19 ноя 2024

Комментарии •

  • @tulsiindesign
    @tulsiindesign  Год назад +56

    Hey! Hope you like this prototype. Share your thoughts in comments 😊
    Want to know how I design this? visit here - ruclips.net/user/shortsFfufeM1wUZE

    • @joxxyyz
      @joxxyyz Год назад +4

      Nice
      Please do you have a tutorial on how to create Duolingo button style in Figma or is it a feature implemented solely in development. The button style I'm talking about is that whenever you click on any button it goes down and springs back up like an actual button (on maybe a remote)

    • @tulsiindesign
      @tulsiindesign  Год назад +7

      Hy! A programmer makes it. but you can share a prototype with your developer to show them how you want it.

    • @joxxyyz
      @joxxyyz Год назад +1

      ​@@tulsiindesignthanks

    • @GamingGuru20254
      @GamingGuru20254 Год назад

      @@tulsiindesign
      Hey,
      I have completed my 12th, now I want to start UX/UI course but I don't know how to start, please can you tell me all about it can I start directly after 12th Or do I need a degree first, if so then which degree should I do...?

    • @vmorgan_io
      @vmorgan_io Год назад +1

      ​@@joxxyyzThe bottom will need to be put in a frame without auto layout, a button shape placed beneath it. Set the default state, hover state and the pressing or focused state.
      For the focused state, move the bottom down by 2 or three pixels. You should get the keyboard effect.

  • @RoanCorporation
    @RoanCorporation 7 месяцев назад +28

    fantastic work !!!!

  • @BrialMusic
    @BrialMusic 9 месяцев назад +250

    That UI sends me back to early 2000's 😅

    • @ChavusGavus
      @ChavusGavus 9 месяцев назад +30

      What. Smartphones DIDNT exist in the early 2000’s

    • @daniel_ryan
      @daniel_ryan 8 месяцев назад +18

      ​​@@ChavusGavusactually they did. Windows Mobile was popular with business folk. I myself had the Harrier a Windows Mobile 2003 phone.

    • @Hrhp16
      @Hrhp16 5 месяцев назад +5

      whats the problem with u if he use 2000 UI?

    • @quadrilateral7278
      @quadrilateral7278 5 месяцев назад +5

      ​​​​@@ChavusGavus They did 💀. They had blackberries, Nokias and Palm phones. They also had windows mobile pda's, etc.

    • @IsisRoseStudio
      @IsisRoseStudio 4 месяца назад +3

      Can you explain how ? I’m studying UX/UI. Thanks

  • @Lorz
    @Lorz 9 месяцев назад +35

    Why is no one talking about the fake notch😂?!

    • @itsnj2607
      @itsnj2607 Месяц назад

      that was applied when he was designing with figma, everyone knows that dude😅

  • @realllity
    @realllity 9 месяцев назад +4

    Add animations but overall nice job

  • @Demiurge.
    @Demiurge. Год назад +11

    Hmmm. Maybe blur the coffee beans background, there’s a little too much clashing there

  • @lazyinterface
    @lazyinterface 7 месяцев назад +1

    Neat work

  • @lucassetiajiwardoyo
    @lucassetiajiwardoyo 6 дней назад

    sangat bermanfaat thankyou👏🏻

  • @mihriiban
    @mihriiban 10 месяцев назад +1

    I loved it! You did a great job.

  • @cheetagaming8936
    @cheetagaming8936 Год назад +61

    So beautiful, so elegant just looking like a wow, just looking like a woww

  • @22.abhishekkamble76
    @22.abhishekkamble76 Год назад +9

    please creat a full form start to end of your project design

  • @oladipoprevail6504
    @oladipoprevail6504 Год назад +1

    I love the preloader

  • @TaniaOchoaPLUSPLUS
    @TaniaOchoaPLUSPLUS 3 дня назад

    can you show us how you went start to finish , coding etc. interested in learning how to do authentication page

  • @WFCStickers
    @WFCStickers Год назад +10

    All the time I was like: ooh! ahhh! woahh! (this is srsly so cool)

  • @UIdesignerwalaa
    @UIdesignerwalaa Год назад +23

    So beautiful ❤❤

  • @sharonwaceke7226
    @sharonwaceke7226 Год назад +1

    Wow so cool. Could kindly share the link to the project. I would love to try it out. And also some tips on how to make this kind of perfect design

  • @DUONGBDCPT-Vuinh
    @DUONGBDCPT-Vuinh 9 месяцев назад +8

    looks great. I want to ask what the first movement is like

  • @sushantnamurte16
    @sushantnamurte16 Год назад +1

    It's Nice🎉
    Please make more......

  • @heenaverma2313
    @heenaverma2313 7 месяцев назад +1

    That animation ❤

  • @Propertiupdates
    @Propertiupdates 18 дней назад

    Keren bang,ajarin dong😮

  • @Cute_girl-q7r
    @Cute_girl-q7r 9 месяцев назад

    Very nice 👍💕

  • @hasibgns
    @hasibgns Год назад +17

    Did you made that intro logo animation with figma? If yes, can you please share a tutorial?

    • @tulsiindesign
      @tulsiindesign  Год назад +14

      Logo animation is from Lottie Files plugin 🌱

    • @hasibgns
      @hasibgns Год назад +5

      @@tulsiindesign so this is gif? I thought It's natively done inside figma

    • @ClintHowen
      @ClintHowen 7 месяцев назад +1

      Interesting way to do it. I don’t think you can do gif in Figma. But maybe gif to Lottie to make it easy?

    • @scaxz_.
      @scaxz_. 2 месяца назад

      ​@@tulsiindesigncould you please make a tutorial I'm really confused 😊😮

    • @rocky7595
      @rocky7595 27 дней назад

      s@@scaxz_.go to her channel shorts and see the popular video which is 2nd

  • @nalatherescue
    @nalatherescue 29 дней назад

    Looks good! I personally don’t like longer copy/microcopy center justified. This point is very nit picky. Another thing I’ve grown to loathe is yellow based color palettes. With yellow in particular, if it complies with contrast criteria, it probably looks like dudu (literally). Orange isn’t any better as everything looks like it’s a Halloween themed ui kit. Color is sooo important. If you look at business using yellow, a lot of their ctas are going to be greyscale/black (system black not 000).

  • @SMMandTutorial
    @SMMandTutorial Год назад +1

    Very good

  • @bobbymarsh4996
    @bobbymarsh4996 2 месяца назад

    Nice, how to make the splash screen animation?

  • @ridoykhan4969
    @ridoykhan4969 2 месяца назад

    Nice❤❤❤

  • @victoriaibrahim7444
    @victoriaibrahim7444 29 дней назад

    Hello, how did you do the animate for the first screen?

  • @Rodrigo-sp3vw
    @Rodrigo-sp3vw 8 месяцев назад +1

    To test it do you need to pass it through flutter?

  • @pravinkumar4685
    @pravinkumar4685 Год назад +7

    Good Splash screen. I like it. You used any lotte files or you created components. If components may i know how you made, because it is so good.❤

    • @tulsiindesign
      @tulsiindesign  Год назад +1

      Sure! You can watch it here - ruclips.net/user/shortsFfufeM1wUZE?feature=share

  • @gouravchhari39
    @gouravchhari39 8 месяцев назад

    Hi can you make a playlist to teach figma

  • @acetechnics3420
    @acetechnics3420 Год назад +1

    Regular classes available?

    • @tulsiindesign
      @tulsiindesign  Год назад

      Not yet. I am preparing mega UI UX resource guide which might be helpfull!

    • @acetechnics3420
      @acetechnics3420 Год назад

      @@tulsiindesign I recently hired a team and started working. Besides I'd love to learn too

  • @BigYellaGal
    @BigYellaGal 8 месяцев назад

    Cool!!!

  • @middlerboy7191
    @middlerboy7191 9 месяцев назад

    Mam which laptop you are using?

  • @myglobalyt
    @myglobalyt 6 месяцев назад

    Do you need to code in figma? How you made this? Just design?

  • @FerahJr
    @FerahJr 8 месяцев назад +1

    Wow ❤

  • @rudrakshbavishkar8042
    @rudrakshbavishkar8042 Месяц назад

    How did you done 3d animation in figma??

  • @MD-qr4cw
    @MD-qr4cw 2 месяца назад +1

    Tutorial please

  • @lockitdrop
    @lockitdrop 9 месяцев назад

    Whoa are you gonna make the app?

  • @henocalao7375
    @henocalao7375 6 месяцев назад +1

    😅thé only thing i want is the splashcreen animation logo . Very good

  • @Findingmysoul7
    @Findingmysoul7 4 месяца назад

    You are so cool 😅

  • @bloomycrafts5460
    @bloomycrafts5460 3 месяца назад

    Can you tell me the software name in which you are running figma?

    • @tulsiindesign
      @tulsiindesign  Месяц назад

      figma itself is a software, no need of anything other software. You can use it in web as well!

  • @kabilanbgmi-xd8yh
    @kabilanbgmi-xd8yh 4 месяца назад

    That full process make in figma or external with html and css ??

  • @qwerty3000
    @qwerty3000 4 месяца назад

    Hi! How do you create the "send a code" functionality"?

  • @aakashkhetani5274
    @aakashkhetani5274 Год назад

    How much time takes it

  • @shafalibharti
    @shafalibharti 7 месяцев назад

    Sir web design or development ek hi hoti h kya figma m ?. Mtlb payment option bhi add kr skte h?

    • @tulsiindesign
      @tulsiindesign  7 месяцев назад +1

      it is design tool.

    • @shafalibharti
      @shafalibharti 7 месяцев назад

      @@tulsiindesign so if we become only ui and ux designer. Is it enough? Or we should become developer also. What are the charges we can take for UI design or ux design?

    • @tulsiindesign
      @tulsiindesign  6 месяцев назад

      yes UIUX designer is a different field than developers, Charges depends upon experience and skill. Hope that helped 🌱

  • @rinkoizumi6411
    @rinkoizumi6411 Год назад +1

    So you make the keyboard number button for prototype only? Its just shape right? Not real button that can be click?

    • @tulsiindesign
      @tulsiindesign  Год назад

      Yes, it's just shape, which is used to indicate the process. Prototype are use to indicate how actual app will work, it is not yet coded. Hope this helps😇!

  • @bioelbadway9290
    @bioelbadway9290 2 месяца назад

    how you creat the frist protype
    the first animation was good

  • @VenuGopal-xz6ey
    @VenuGopal-xz6ey 6 месяцев назад +1

    How you did starting animation

  • @aphae
    @aphae Год назад

    Hi. I would like to know how you went from the loading screen to the login screen without clicking.Thanks

    • @tulsiindesign
      @tulsiindesign  Год назад +1

      Hy! With figma "delay" Prototype option you can do it. Hope this will help!

    • @aphae
      @aphae Год назад

      @@tulsiindesign Cool! Thanks :D

  • @seth_milla_2
    @seth_milla_2 Год назад +1

    sweet. 😊

  • @desiben
    @desiben 8 месяцев назад

    How did you do the animation

  • @thetabalavlogs3758
    @thetabalavlogs3758 4 месяца назад

    How did u do that animation pls tell that opening part

  • @Pakurwalaa
    @Pakurwalaa 3 месяца назад

    Did OTP came or just you have written over there

  • @amitkoyande
    @amitkoyande 2 месяца назад

    Waah. Teach me also.

  • @uday9020
    @uday9020 9 месяцев назад

    How did you connect backend bro?

  • @The_Manish_yadav
    @The_Manish_yadav Год назад

    Sister apne kaha se ux designing sikha plz reply

  • @viki_sky007
    @viki_sky007 5 месяцев назад

    As a Full stack Dev. Dev team ki lag gayi. 🤙🏼

  • @senthilpandian9437
    @senthilpandian9437 6 месяцев назад +1

    Lit💥💥❤️‍🔥❤️‍🔥

  • @sureshpirannavan4463
    @sureshpirannavan4463 Год назад +2

    Nice ❤

  • @unknown2702
    @unknown2702 Год назад

    What app are you using for challenge? Please

    • @tulsiindesign
      @tulsiindesign  Год назад

      Hy, I am using figma to design these.

    • @unknown2702
      @unknown2702 Год назад +1

      @@tulsiindesign I meant for the challenge contest 😊 btw being inspired watching you...

  • @aravinthdaya5066
    @aravinthdaya5066 Год назад +1

    Ma'am where can we use this just UI design.Because there is no functionalities is in figma. If you're just designing UI can I export it for my application in Android studio for free or is there any big advantage in designing in figma. l am a beginner i Just don't know things. Plzz explain me out

    • @tulsiindesign
      @tulsiindesign  Год назад +1

      Ui design can be created in any design tools like figma, adobe xd, sketch. These designs are used as an architecture to code 👩‍💻. Figma made it easy for developers to understand and export designs into code.

    • @knowledgefactz85
      @knowledgefactz85 11 месяцев назад

      but how to export or download it as a video format
      @@tulsiindesign

  • @SubhashreeDesgin07
    @SubhashreeDesgin07 Год назад

    full tutorial i want

  • @JulReyVellijo-YT-71905
    @JulReyVellijo-YT-71905 9 месяцев назад

    What's name of apps for making ui

  • @kiranravi-k9p
    @kiranravi-k9p 11 месяцев назад

    Great ❤🎉

  • @salsa604
    @salsa604 Год назад +1

    How to make the coffee like that?

  • @itsrajjj
    @itsrajjj 8 месяцев назад

    How to create coffee ☕ animation?

  • @LearnwithDayve
    @LearnwithDayve 6 месяцев назад

    How do I use on my phone?

  • @PiyushKumar-ey8ub
    @PiyushKumar-ey8ub 7 месяцев назад

    how you can export these figma files to android? please guide..

  • @Fr0sT_is_Playing
    @Fr0sT_is_Playing 6 месяцев назад

    Which software you used?

  • @shafalibharti
    @shafalibharti 7 месяцев назад

    Jb m prototype video mobile m open kr rhi hu bhot slow chl rhi h. Can you please tell me the reason behind that?

    • @tulsiindesign
      @tulsiindesign  6 месяцев назад

      May be it is because of network or maybe your prototype turns out very heavy.

  • @AlinaMurielBoyGibe
    @AlinaMurielBoyGibe 3 месяца назад

    How i create animations with this tool

  • @joelim5010
    @joelim5010 Год назад

    Now imagine if you can implement function in it. Or convert this into front-end.

  • @lydiajennifer
    @lydiajennifer 11 месяцев назад

    How did you do this animation of coffee mug?

  • @vivekkumarverma6999
    @vivekkumarverma6999 8 месяцев назад

    Dii How I learn figma Ui ux designing and get a job?

  • @mdshafqatullah4996
    @mdshafqatullah4996 Год назад +1

    How is that logo initially animated in figma, that is called trim path, how it's possible in figma

    • @mdshafqatullah4996
      @mdshafqatullah4996 10 месяцев назад

      Any update??? 😂😂😂

    • @DesignXstream
      @DesignXstream 9 месяцев назад

      @@mdshafqatullah4996 That is a GIF used in Figma. It's not possible using Figma animations.

  • @arsamus98
    @arsamus98 Год назад +1

    How you make a animation in the first video

  • @kingsleyanim6020
    @kingsleyanim6020 9 месяцев назад +1

    Wow

  • @knowledgefactz85
    @knowledgefactz85 11 месяцев назад

    after making animation in figma how to export or download it as a video format

  • @0y0.s
    @0y0.s 7 месяцев назад +1

    Lol, the fake camera 😂

  • @appusalman1673
    @appusalman1673 Год назад

    Any tutorial how did you do that?

    • @tulsiindesign
      @tulsiindesign  Год назад

      There is one in-fact, please go through my channel. It might be helpful for you :)

  • @yashsoni8043
    @yashsoni8043 4 месяца назад

    Bro how fo i export to get code gor html and css in figma please i need this

  • @rosangelamae9350
    @rosangelamae9350 3 месяца назад

    Consigo imprimir?

  • @FactQuest69
    @FactQuest69 10 месяцев назад

    tutorial plz

  • @dharunyaponnusamy434
    @dharunyaponnusamy434 3 месяца назад

    how to connect with this in backend

    • @10framojmabilangan61
      @10framojmabilangan61 Месяц назад

      It's a prototype. You can't connect this to your backend because figma designs are just designs/mockups. If you want to implement it, you'll have to code and replicate it on your frontend, then only after you can connect it to your backend.

  • @anuragdas8774
    @anuragdas8774 4 месяца назад +2

    Why this looks like screen record. This is an android phone. But there is a notch like iphone 😅😂😂😂😂

  • @mr.dood999
    @mr.dood999 4 месяца назад

    Where do you find those 10% annual interst opportunities? Asking for a friend 😅

  • @TheUprut
    @TheUprut 10 месяцев назад

    Front end developer : 😡🥵🥴🤯😵‍💫😵

  • @majd9315
    @majd9315 Месяц назад

    Is that s10+

  • @dikshanayak756
    @dikshanayak756 7 месяцев назад

    Plz provide me link

  • @lazerdrone6812
    @lazerdrone6812 8 месяцев назад +1

    Why does it have yo for the iPhone

    • @Pakurwalaa
      @Pakurwalaa 3 месяца назад

      Software only provides iPhone display as a reference while designing apps.

    • @lazerdrone6812
      @lazerdrone6812 3 месяца назад

      @@Pakurwalaa oh ok

  • @sai_2023
    @sai_2023 Год назад +3

    how to preview in mobile?

    • @tulsiindesign
      @tulsiindesign  Год назад +5

      You can use Figma mirror feature using the Figma app. Hope it helps!

  • @witcher-x8721
    @witcher-x8721 11 месяцев назад

    U should blur u r number before posting

  • @prajuprajwal7568
    @prajuprajwal7568 Год назад +1

    Totorial

  • @rihan_saifi6567
    @rihan_saifi6567 10 месяцев назад

    Hey how can i export my prototypes.....if anybody knows plz help me 😢. I want to export them with functions....and animation

  • @mariyamkhan4688
    @mariyamkhan4688 Год назад +1

    Please share tutorial of this design.

  • @zainalimajeed4600
    @zainalimajeed4600 Год назад

    Sir how to export our prototype project.

    • @tulsiindesign
      @tulsiindesign  Год назад +2

      You can use prototype link 🔗 to share or paste in your projects (Behance). Hope that helped ✌ 😊

    • @zainalimajeed4600
      @zainalimajeed4600 Год назад

      @@tulsiindesign Thanks

  • @karimshmaysani
    @karimshmaysani 8 месяцев назад

    Now your number got leaked😂😭

  • @manoja9972
    @manoja9972 10 месяцев назад

    No need have i phone for testing design

  • @oladipoprevail6504
    @oladipoprevail6504 Год назад +1

    😲Wow

  • @mdzafarmaster4286
    @mdzafarmaster4286 6 месяцев назад

    Suggest me, or make a video Best and cheap pc build for figma