How to Create Animated Prototypes (GIFS) for your UX Presentation!
Vložit
- čas přidán 27. 07. 2024
- Hello! Here's a quick tutorial on how to create animated prototypes or GIFS for your UX presentation.
Here's the link to Giphy Capture: giphy.com/apps/giphycapture
You really are a life saver to us that are just beginning our UX careers! Thank you so much 🙏🏼
Awesome tutorial, Sharon! I will be trying this out ✨
Thank you! This is the most straightforward tutorial I've seen on this!
Wow, thank you so much!
I used to record the screen with Quicktime, then look for a mov to gif converter and is very time consuming.
You rock!
This is a very useful information , literally enjoyed the who process , just couldn't leave till the video finished 😅❣️🔥
the amount of trouble I had gone through in the past to make a GIF !! thank you so much for the video! saved me so much trouble!🙌🏻🙌🏻
Yes!!!
adding a thick stroke and round corners of the GIF will give a good representation of a mobile device without needing to use external assets.
Nice point!
Thank you so much Sharon. Life saver!
This is so helpful, thank you! Can't wait to start using this for my case studies 😊
Yay! Best of luck :))
I swear i manifested this video 😂 im literally just figuring out how to do this right now and when i saw the video title and it was you i thought finally, a video i need with a reliable source lol. A lot of other UX videos on here under explain most things and in a way that is difficult to digest. Your videos have helped me throughout my bootcamp, and all my case studies had your process in mind. You levelled up my work 🙏🏽
So glad to hear!!! Hope it’s helpful. What else would you like to see?
@@sharonyeunkim I really liked your design challenge video maybe more problem solving like that would be good
Appreciate every time your share.
you always help me.😍 you are the best. thank you.❤
Thank you! Way much better than screenshotting in Mac and converting to GIF.
Agreed 1000%
Thanks for sharing Sharon, It's really helpful❤❤
Thank you for watching Ahmed!! Appreciate you :)
Thank you! This was really helpful! 😊
Thank you for sharing this awesome tutorial
You’re welcome 😆
Thank you for sharing! I always had trouble dealing with problems on the screen record and transforming it into a gif, but this software seems to be very easy to use❤❤
Hope it all works out!
omgosh i needed this this week 😩😅 i just used screen record and had to crop it and it didnt look as nice, but this method is so much better.
Hope it works out!! You got it!
Thank you so much! It's so helpful
Thank you so much! Life saver
Thank you very much for sharing this.
Thanks for sharing. Iwas looking for one like this
My pleasure!
Thank you for sharing!
Thank You!
this is what i seeking for a whole day, thanks a lot for making a good tutorial like this❤❤ hit subscribe button
I just love you
Thanks ❤
Thank you
What about those who do not us apple products what would be the alternative for windows?
Hi thank you for the video Sharon! I wonder, can I do the same with Web app prototype and put the MP4 file on my portfolio? Could you give any tips on that? Would it be good to record a User Testing session and put the video in my case study? Please any tips would be so helpful, thank you!
Is this the best format to include a prototype animation in the website portfolio to show how the app works? Thank you
tnx a lot,. what do recommend for windows uder?
Thanks 🎉does it work for website too??
I wonder if you can add high-quality gifs to figma presentations
your video is awesome and i was able to follow it all the way through until the final step where you put the gif in google slides and have to add a phone case as an overlay - thats not working out well for me. can you put a video on how to put a phone case either through figma while recording the prototype or later on?
So I tried this but the quality is pretty poor. My card element dropshadows look like gray borders in the giphy video.
do you think you'd be able to make a video helping with design-related behavioral questions in ux interviews? i've noticed that the portfolio review portion of my interviews isn't too hard but I really struggle with preparing good stories to tell and fitting them in the STAR method as well. thank you!!
Thanks for the suggestion!!!
The way I’ve tackled behavioural questions is to take every key one based on a google search of ux interview questions and standard behavioural questions. Literally write out 4 bullet points for each letter in STAR, and practice infront of a mirror or on your webcam.
Great! Usually I screen record and gif it in premiere pro, but the files are soo largee. How big are your gigs on average? Like short ones
Hey! For the one I used here it is 1.5MB. I believe using Premiere will definitely use more space so if your gifs are too big- try the giphycapture app!
@@sharonyeunkim yeah that's good. Mine are always minimum 50mb no matter how small the video is. Thanks for the app!
Does the software work for a Windows laptop ?
hi sharon thanks for sharing, is there any alternative ways for windows users?
If anybody knows any alternatives, please tag me
Is it available for windows
How to download the slide in gif format? I don't see that option
Does screen recording work on mobile phones too?
Thanks. Do you know where I can get device mockups?
I would go onto Figma community and type in whatever phone you’re prototyping in and add “case mock-up” at the end! Might have to play around with the wording a bit but I’m usually able to find something of the sort. If not that the googling a high resolution image of a phone case and photoshop it into a PNG then import that case into Google slides.
I tried it out and it made a GIF (yay!) but the quality is actually really poor no matter how much I change the frame rate or general quality. Could it be because my prototype itself is too heavy...? Anyone else experience this issue?
does it work in windows?
the quality isn't good sorry
What about windows users.. This is far useless.