How to Embed an Interactive Prototype from Figma into your Case study | UX Designer

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

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

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

    You just saved me from missing my deadline. I couldn’t figure this out for THE LIFE OF ME. You are my HERO~ thank you SOSOSO MUCH.

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

    2 minutes into the video and got my answer. Thank you so so much!!!

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

    Hi, this video was so helpful! How did you remove the Bar we get below stating - edited months ago.

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

    Thank you so much! I was struggling to adjust the size. This method works on other website builders too!

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

    Hi, I am a new subscriber. I like your energy and vibe! The content was very useful and practical. Thanks. Keep up the good work!

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

    I was soo confused about how to make the prototype look bigger…. Thankyou so much❤

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

    This was really helpful. Thank you!!

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

    Thanks for sharing 🙏 pls let me know how did you used "laptop mock up" in present mode.

  • @Joyceemeziem
    @Joyceemeziem 2 года назад +2

    Hey Jenny.
    When will you be doing a video on how to get internships as a Jnr designer because it is tiring to not find😭😭

    • @jennbydesign
      @jennbydesign  2 года назад +1

      Hey! Since I didn’t do an internship, I do not have much information about that route. :/

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

    Thanks a lot you really made my day

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

    Hi Jennifer ! Thanks for the tip ! I was also wondering how to create transparent non clickable interactions(recorded interactions) showing just the mobile/website frames with no background. How to go about that?

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

      Hey! I honestly don’t know how to do that directly from Figma or adobe but I know there are certain tools/websites that do that.

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

    My embedded prototype has the bar at the bottom mentioning cookies is there a way to remove this? I dont like how it looks

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

      Hmm I’m not familiar with that. Not sure why that would show just for embedding.

  • @xaviergonzalez8933
    @xaviergonzalez8933 2 года назад

    OMG you are so awesome! Thank you so much! I am currently working on my portfolio right now, so this is super useful :)

  • @ikennagibson3933
    @ikennagibson3933 2 года назад +1

    Nice video Jenny. I would like to know if one gets to interact with the prototype through that laptop mock up I can see there having embedded the code

    • @jennbydesign
      @jennbydesign  2 года назад +1

      Yes! Viewers can interact with the prototype and click through it like it was a real website

    • @ikennagibson3933
      @ikennagibson3933 2 года назад

      @@jennbydesign thanks Jenny

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

    When i tried to embed my project on prototype it showing " This embed code is not valid please help me what to do .😢

  • @MarsaAndari
    @MarsaAndari 2 года назад

    Thanks for the info! Been looking for this one :)

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

    Great Instructions! I was wondering if there a way to change the size of the prototype when someone views my portfolio on their phone. When viewing the figma prototype on a desktop screen it looks good, but when someone views it on their phone the prototype is zoomed in (For example not showing the laptop on the zoe cafe prototype) Is there a way to fix it?

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

      I’m not sure if that’s possible. Perhaps, you could explore the option of hard coding in a mobile side of you’re good with coding.

  • @yuliaanisakharova
    @yuliaanisakharova 2 года назад

    Thank you so much! I was desperate to fit the prototype to my case width!

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

    thank you! so helpful!

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

    Cool Video! Is there a way to hide the "Last Updated x time ago" that is in the iFrame?

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

    Hi, thank you the video! I am working in Squarespace too and used your advice for the desktop version. However, it doesn't work for mobile properly since embedded code is the same for desktop and mobile versions. I mean, if I set 1000px width for the prototype, it doesn't look good on mobile. Did you face that problem, any tips? Thank you!

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

      Hi! Yes it’s the same for me however, it shouldn’t be a big deal since recruiters and hiring managers will primarily be viewing your portfolio on a desktop, they’ll be able to see the prototype in its right proportion.

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

    Hei! How did you make your prototype to appear in a laptop frame?

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

    Thanks for this video , very helpful for me🙏 Is that possible to see your portfolio cause I also make portfolio on Squarespace so I would like to see hows your if your don't mind ! :)

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

      You’re welcome! My portfolio can be found here www.jenniferdarlington.com

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

      @@jennbydesign Many thanks

  • @dhinesh.partha
    @dhinesh.partha Год назад

    I can't able to import my figma embed code in behance. Even after I login to the figma

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

      I don’t know if behance has that capability

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

    Thank you so much!

  • @Layquins
    @Layquins 2 года назад

    Hi Jenny, is there a way I can upload the embedded file to play by itself? Rather than viewers having to Interact with?
    Thanks.

    • @jennbydesign
      @jennbydesign  2 года назад +1

      You can hit the record button on your prototype to record yourself interacting with the prototype and upload that video into your portfolio. But viewers would still have to hit play to watch it.
      I don’t know if other platforms have auto-play features.

    • @princeisaac5177
      @princeisaac5177 2 года назад

      A friend told me to try turning the file into a GIF.

  • @njengathegeek
    @njengathegeek 2 года назад

    This is so impressive

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

    I used uxfolio and it won't load. Any tips ?

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

      I’m not familiar with uxfolio so I can’t be of much help.

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

    how do you center it

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

      That will have to be done with whatever platform you’re hosting on. Just center that block.

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

    thank you so much ❤

  • @bobbsey1
    @bobbsey1 2 года назад

    What if my Figma embedded code isn't loading all the way to show the prototype? Its taking for everrrrr and it hasn't loaded, I just see the black Figma screen :( someone help me plz!!

    • @jennbydesign
      @jennbydesign  2 года назад

      I do notice it takes a little longer for Figmas prototype to load but it still shows up for mine. What platform are you using for your portfolio?

    • @danieljacque6665
      @danieljacque6665 2 года назад

      @@jennbydesign I noticed it still works. After you save your code try opening your portfolio from a private browser and see if it comes up.

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

    Thank you

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

    anyone know how to do this with webflow??

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

      Just use the embed code option from the elements options on the left side bar and paste in the code and place the frame where you want it on your page👍

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

    anybody know if wordpress lets us embed code?

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

      Wordpress is code heavy so I’d assume the answer is yes.

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

    Thank you