How to Create Typing Field Animation in Adobe Xd | Using Auto Animate

แชร์
ฝัง
  • เผยแพร่เมื่อ 15 ม.ค. 2025

ความคิดเห็น • 50

  • @salhakim2322
    @salhakim2322 3 ปีที่แล้ว +5

    Very creative approach - loved it!

    • @DesignXstream
      @DesignXstream  3 ปีที่แล้ว

      Thank you, Glad you liked it! 😊

  • @portalmasterry6765
    @portalmasterry6765 3 ปีที่แล้ว +10

    Great tutorial. I wish Adobe would fix it so we don't have to this type of process for prototyping interactive content.

    • @DesignXstream
      @DesignXstream  3 ปีที่แล้ว +1

      Totally agree! Basic things like checkbox, input field should be in-built into any prototyping tool! Hopefully they will add it soon.

  • @zeejahali
    @zeejahali 3 ปีที่แล้ว +1

    *just found your channel I love your content and I love your voice you did exactly what I wanted several thx. I will share this channel with my designer friends here in Pakistan*

    • @DesignXstream
      @DesignXstream  3 ปีที่แล้ว

      Thank you! That means a lot :)

  • @shalinmgiri
    @shalinmgiri 4 ปีที่แล้ว +1

    woow.......bro best of luck for your future videos.

    • @DesignXstream
      @DesignXstream  4 ปีที่แล้ว

      Hey Shalin, Thanks a lot! Stay tuned for more design videos :)

  • @AlexSteveScratch
    @AlexSteveScratch 3 ปีที่แล้ว +1

    Thanks!

    • @DesignXstream
      @DesignXstream  3 ปีที่แล้ว +1

      Hey Alex, Glad you liked it :)

  • @richardottley4611
    @richardottley4611 4 ปีที่แล้ว +1

    Cool hack.. thanks for the video

    • @DesignXstream
      @DesignXstream  4 ปีที่แล้ว

      Hey Richard, Glad you found it helpful :)

  • @agnidiptahomroy8656
    @agnidiptahomroy8656 2 ปีที่แล้ว +1

    I actually couldn't find the time trigger earlier, after I searched about it, then I came to realize that if I select an artboard for prototyping, then only I can use the time trigger, if I select an object only, then I can't use time trigger. Nice video though.

    • @DesignXstream
      @DesignXstream  2 ปีที่แล้ว

      Ohh yes! Probably I missed to mention that in the video!

    • @agnidiptahomroy8656
      @agnidiptahomroy8656 2 ปีที่แล้ว

      @@DesignXstream yupp, nice video though.

  • @falconswiss5217
    @falconswiss5217 2 ปีที่แล้ว +1

    Sir, I found a problem, not a major one, but one you might want to take a few seconds to change. at 5:41 it says: "Please enter the amount" instead of "You have purchased the below". @Design Xstream

    • @DesignXstream
      @DesignXstream  2 ปีที่แล้ว

      Thats a good catch! Did not notice it 😅

  • @sahadatsajib8708
    @sahadatsajib8708 3 ปีที่แล้ว +2

    I got a question---
    Brother is it possible to single handled inside multiple input type field??????? like a real website form✔

    • @DesignXstream
      @DesignXstream  3 ปีที่แล้ว +1

      It is not possible in Adobe Xd prototype. You can use Anima Plugin on Adobe Xd to create forms but it will open in a browser not on Adobe Xd.

    • @sahadatsajib8708
      @sahadatsajib8708 3 ปีที่แล้ว +1

      @@DesignXstream Thanks for your great opinions and suggest also thanks for you're valuable replay ❤

  • @CaliathleteNepal
    @CaliathleteNepal 3 ปีที่แล้ว

    where can i get keyboard plugins? i need HELP.

    • @DesignXstream
      @DesignXstream  3 ปีที่แล้ว

      There is no plugin for keyboard this is just a workaround animation.

  • @gavinstokes
    @gavinstokes 3 ปีที่แล้ว +1

    Great tutorial, but nuts that you have to use so many artboards to achieve an animation... Adobe need to get the finger out.

    • @DesignXstream
      @DesignXstream  3 ปีที่แล้ว

      Very true! Simple things like input field are so complicated in such prototyping tools. Figma is a bit better bcoz of its Interactive components feature!

  • @slack.
    @slack. 3 ปีที่แล้ว

    What about using "component states" instead of duplicating the arboards?

    • @DesignXstream
      @DesignXstream  3 ปีที่แล้ว +3

      Component states are still not very flexible in terms of triggers and actions that an be performed. Figma has this feature of interactive states which makes component states very flexible. Hopefully Xd also will add it soon.

  • @kbhandarkar33
    @kbhandarkar33 3 ปีที่แล้ว

    Bro please upload video on how we can add animated character on sign up screen

    • @DesignXstream
      @DesignXstream  3 ปีที่แล้ว

      Hey Krunal, what exactly do you mean by animated character? Can you show an example.

    • @kbhandarkar33
      @kbhandarkar33 3 ปีที่แล้ว

      @@DesignXstream If I design a sign-up screen for kids, how could we show one moving character for interaction purposes on the sign-up page? Would convey the impression to the user that the onboarding process is engaging and responsive. I'm referring to a child-centered approach.

    • @DesignXstream
      @DesignXstream  3 ปีที่แล้ว

      @@kbhandarkar33 You can just do basic animations on Adobe Xd. Like this one: th-cam.com/video/XZTiNNTbY50/w-d-xo.html
      But animated characters that you see on designs are made on Adobe After Effects!

    • @kbhandarkar33
      @kbhandarkar33 3 ปีที่แล้ว +1

      @@DesignXstream 🙏🙏🙏

  • @dec_nuea4932
    @dec_nuea4932 3 ปีที่แล้ว

    How to make cursor on keyboard while Typing?

  • @saadalamk
    @saadalamk 3 ปีที่แล้ว

    I am doing this but my whole screen is blinking with the text cursor.

    • @DesignXstream
      @DesignXstream  3 ปีที่แล้ว

      Not sure which step you have missed. The source file is there in the description try to compare with it.

    • @saadalamk
      @saadalamk 3 ปีที่แล้ว

      @@DesignXstream In XD we have to keep the name of the objects same when you are auto animating them or looping them so the whole screen won't blink, find out this after so much efforts, thanks for you responc❤️

    • @DesignXstream
      @DesignXstream  3 ปีที่แล้ว +1

      @@saadalamk Yes that is a basic rule common in all these tools like Xd Figma, etc. Anyway glad you found the problem. Cheers & happy designing :)

  • @alimfuzzy
    @alimfuzzy 4 ปีที่แล้ว +1

    You can create dynamic text with animate... just code it up. Does it still use ActionScript?

    • @DesignXstream
      @DesignXstream  4 ปีที่แล้ว +1

      Hey Andrew, yes I've heard of Animate CC but never used it. But Adobe Xd doesn't support any code or script so far! It would be great if they add some script support.

    • @alimfuzzy
      @alimfuzzy 4 ปีที่แล้ว +1

      @@DesignXstream aaahhh. I totally read the title wrong XD

    • @DesignXstream
      @DesignXstream  4 ปีที่แล้ว

      @@alimfuzzy haha! Yeah, I kinda expected that 😅

  • @dennisrasmussen6169
    @dennisrasmussen6169 3 ปีที่แล้ว

    When i do this, the keyboard is also blinking..

    • @DesignXstream
      @DesignXstream  3 ปีที่แล้ว

      Hey Dennis, Probably some issue in the interactions applied. We have the demo file in the description pls refer to it in case some interaction is missed.

    • @dennisrasmussen6169
      @dennisrasmussen6169 3 ปีที่แล้ว

      @@DesignXstream Hi, i tried your demo, and it works perfectly. I have the exacts interactions applied as you on my workspace, but the keyboard keeps blinking..

    • @DesignXstream
      @DesignXstream  3 ปีที่แล้ว

      Hey Dennis, If you can share your xd file then I can have a quick look at it. You can dm us at our instagram page.

  • @kikky1
    @kikky1 ปีที่แล้ว

    your files c'ant be open.

    • @DesignXstream
      @DesignXstream  ปีที่แล้ว

      What is the issue?

    • @kikky1
      @kikky1 ปีที่แล้ว

      @@DesignXstream
      Ca not be opened. Is there a adobe xd file?

    • @DesignXstream
      @DesignXstream  ปีที่แล้ว

      @@kikky1 yes its an xd file in the description,

  • @rogadev
    @rogadev 3 ปีที่แล้ว

    Wow. XD really is total garbage. I had no idea it was so far behind the curve. Why can't you just have a regular keypad component? Why can't you have just regular input boxes? This is such a fuckaround. Get your shit together, Adobe.