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

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

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

  • @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.

  • @salhakim2322
    @salhakim2322 3 года назад +5

    Very creative approach - loved it!

  • @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*

  • @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 ❤

  • @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 :)

  • @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.

  • @AlexSteveScratch
    @AlexSteveScratch 3 года назад +1

    Thanks!

  • @falconswiss5217
    @falconswiss5217 Год назад +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  Год назад

      Thats a good catch! Did not notice it 😅

  • @richardottley4611
    @richardottley4611 3 года назад +1

    Cool hack.. thanks for the video

    • @DesignXstream
      @DesignXstream  3 года назад

      Hey Richard, Glad you found it helpful :)

  • @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.

  • @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!

  • @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.

  • @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 😅

  • @dec_nuea4932
    @dec_nuea4932 3 года назад

    How to make cursor on keyboard while Typing?

  • @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: ruclips.net/video/XZTiNNTbY50/видео.html
      But animated characters that you see on designs are made on Adobe After Effects!

    • @kbhandarkar33
      @kbhandarkar33 3 года назад +1

      @@DesignXstream 🙏🙏🙏

  • @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 :)

  • @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.