Figma product mockup

Поділитися
Вставка
  • Опубліковано 16 чер 2022
  • #shorts #figma #mockup
    Master Figma with our new course, Figma for Web Designers: t.ly/qG-Ig
    🤑 FREE Brand Design Workshop - Enroll here 👉 bit.ly/3EJOf9M 🤑
    Don't forget to subscribe to our channel for more Design Content. Click here 👉 bit.ly/33byV7L
    🎨 Learn the Art & Business of Web Design. Check out all our courses 👉 bit.ly/3jMxocU
    📱 Find us on SOCIAL MEDIA
    Flux Academy's Instagram 👉 / flux.academy
    Thanks for watching our video!

КОМЕНТАРІ • 116

  • @bhatshakir817
    @bhatshakir817 Рік тому +252

    Thats how u give numerous hours of frustation to a developer

    • @josh0147
      @josh0147 Рік тому +1

      Can you explain how?

    • @alikhanhotak511
      @alikhanhotak511 Рік тому +40

      @@josh0147 The UI designer is just dragging, dropping and sliding for the opacity, while the developers have to do that with actual code, which takes a lot of time. They have to get the opacity right the position, have that show upside down. So much things

    • @josh0147
      @josh0147 Рік тому +45

      @@alikhanhotak511 would It be easier to get the image he’s just made and merge it into one? Would that save the guy who’s coding it from having to do opacity etc and they could just use the 1 image he’s made?

    • @yashsharma1080
      @yashsharma1080 Рік тому +7

      ​@@josh0147Yeah, that's how it's done

    • @alikhanhotak511
      @alikhanhotak511 Рік тому +3

      @@josh0147 yea that would be possible, as long as the image quality stays as it is.

  • @ItsFoxCrafter
    @ItsFoxCrafter 8 днів тому +3

    The Designers Dream Is a Developer Nightmare 💀💀💀

  • @DavidStavegard
    @DavidStavegard Рік тому +47

    I love that ending - "And it's done!". Give me like 5-6 hours and I'll say the same! Maybe swapping out "it's"to "I'm" 😂

  • @danieldey
    @danieldey 2 роки тому +97

    Dude! Make more such tutorials!!!

    • @pluto1334
      @pluto1334 Рік тому +1

      Animations with ua-cam.com/video/aMFUuGZ9LEs/v-deo.html

  • @Oxytocin_NA
    @Oxytocin_NA 4 місяці тому +6

    should keep the final image for a second or two in the end so that we can use the progress slider and compare the final result

  • @swaroop4una
    @swaroop4una 2 роки тому +10

    We need more tutorials like this please make more

  • @cedrictheveneau9141
    @cedrictheveneau9141 Рік тому +31

    Really cool ! Love it ! Now we need a code tutorial

  • @friday077
    @friday077 12 днів тому

    I didn't understand the use mask part

  • @tomashruska2171
    @tomashruska2171 Рік тому +3

    we need more of these tutrials

  • @Jutenas
    @Jutenas Рік тому +1

    Sweet! Thanks for showing 🙂

  • @salawudeenambali4700
    @salawudeenambali4700 10 місяців тому

    Simple and straight forward

  • @therankingworld7627
    @therankingworld7627 2 роки тому +6

    Woahhhhhh soooo cooooollll

  • @arsalanali7512
    @arsalanali7512 Рік тому

    Add new color and use gradient on that instead of making new layers

  • @andyatmosphere
    @andyatmosphere Рік тому

    So simple but effective!

  • @infinitedesigns_io
    @infinitedesigns_io 2 роки тому +2

    Super awesome but even better if you would slow down a hair and show what the end product looks like. Cut away way too fast. I understand that's the trend nowadays but geez! haha Awesome stuff though!

  • @B_Migs
    @B_Migs 11 місяців тому

    Haha, stop making it look so easy... Thanks Ace!

  • @irzq_z
    @irzq_z Рік тому +1

    I’m falling love with Figma

  • @MacChoo
    @MacChoo Рік тому

    This reminds of making emblems in the bo2 days

  • @KENISLIVE3
    @KENISLIVE3 10 місяців тому

    Instead of reducing opacity u could do multiply on the screen

  • @1wayLane26
    @1wayLane26 Рік тому

    thank you! keep up the good work bro

  • @ahmedhafiz2419
    @ahmedhafiz2419 Рік тому

    That Shadow trick is new to me

  • @akane8615
    @akane8615 Рік тому

    MORE OF THIS PLS

  • @myfeatheredfriends254
    @myfeatheredfriends254 2 роки тому

    Wow this is so helpful

  • @julleketbulleke
    @julleketbulleke Місяць тому

    What if the shop sells something other than shoes, or different shapes of shoes, u cant realistically create a mirror and dropshadow per item.

  • @mdstyles_
    @mdstyles_ Рік тому

    Amazing video gonna try this

  • @jonyeazel
    @jonyeazel Рік тому

    good stuff brother.

  • @MrFarqi180
    @MrFarqi180 Рік тому

    Very cool! ❤

  • @domni4699
    @domni4699 Рік тому

    Very nice!

  • @acetechnics3420
    @acetechnics3420 10 місяців тому

    Regular classes available?

  • @thatsalot3577
    @thatsalot3577 Рік тому +12

    I can think of the corresponding css as he's explaining.

    • @chrisapostolou4354
      @chrisapostolou4354 Рік тому +3

      Is it easy in coding?

    • @thatsalot3577
      @thatsalot3577 Рік тому +3

      @@chrisapostolou4354 wouldn't consider it easy but I'm kinda used to it as I'm not very good at using figma or adobe xd,
      With enough practice you can also do it in real time as he's explaining.
      It's all about experience and very little about knowledge.

    • @vaisakhkm783
      @vaisakhkm783 Рік тому +3

      @@chrisapostolou4354 as i am not good at figma, it is easier for me to do this in css

  • @user-ct8np9yg7v
    @user-ct8np9yg7v 4 місяці тому

    can we make a same thing on framer

  • @obinnaibem
    @obinnaibem 8 місяців тому

    Very simple and powerful

  • @mirka488
    @mirka488 Рік тому

    Thank you 👍

  • @luizg.zambrano
    @luizg.zambrano Рік тому

    how can I make the same thing for 3D objects like a box mockup? Because in this case, the reflection must have another dimension, and not just a linear reflection as a 2D object.

  • @ahmedamber
    @ahmedamber Рік тому

    Witch software you are using?

  • @abdullahmohammed5236
    @abdullahmohammed5236 2 роки тому

    You just master it

  • @realmeee
    @realmeee Рік тому

    Figma need an option right click over image to set a mask with out dropping a rectangle

  • @aquiyahdesigns
    @aquiyahdesigns Рік тому

    This is awesome

  • @_manishray_
    @_manishray_ Рік тому

    Awesome. 😮

  • @freefellow
    @freefellow 10 місяців тому

    make full vid

  • @savitawalki1730
    @savitawalki1730 9 місяців тому

    Awesome

  • @gauravsharma9794
    @gauravsharma9794 12 днів тому

    no way that shadow looks realistic :/

  • @rahulochani578
    @rahulochani578 2 роки тому

    Love it

  • @connectionism3754
    @connectionism3754 Рік тому

    There was a time when this was seen as an absolute no no for any product online.

  • @gujjarch83
    @gujjarch83 11 місяців тому

    Amazing

  • @amitkoyande
    @amitkoyande Рік тому +1

    I use Photoshop.

  • @umarabduqahhorov7608
    @umarabduqahhorov7608 Рік тому

    How did u take this picture

  • @iben1195
    @iben1195 Рік тому +1

    Is one click on PowerPoint 🤗

  • @mrpixelgrapher
    @mrpixelgrapher 11 місяців тому

    Why not just do it in photoshop and then add it to figma??

  • @molokofreak
    @molokofreak Рік тому

    wow, it's like Photoshop 3.0

  • @damirrashidullin9323
    @damirrashidullin9323 2 роки тому

    Круто! Спасибо😁

  • @JayPatel-ou2ud
    @JayPatel-ou2ud Рік тому

    Wow 😍

  • @nabaa_ataib
    @nabaa_ataib Рік тому

    Genious

  • @Sparkee05
    @Sparkee05 10 місяців тому

    can someone let me know what the point of doing something like this in Figma over photoshop? Seems like a lot of unnecessary clicks in Figma when this can be done in only 3 layers in photoshop (shoe, shadow, reflection).

  • @janehogan3345
    @janehogan3345 13 днів тому

    🎉

  • @entrinsek9230
    @entrinsek9230 2 роки тому +1

    Very fast need a video for it about 2 or 3 minutes hhh

  • @badbrother_2023
    @badbrother_2023 Рік тому

    Huh now code it

  • @colsjit
    @colsjit Рік тому

    In canvas that's 3 steps

  • @karansharma1gaming
    @karansharma1gaming Рік тому

    I can literally do this in picsart😜😭👆🏻

  • @Vibe4ant
    @Vibe4ant Рік тому

    Shadow needs more work.

  • @gold571
    @gold571 Рік тому +1

    Figma B-

  • @mefizto.
    @mefizto. Рік тому

    Pretty useful!

  • @denisgut
    @denisgut Рік тому

    Dude, you don’t have to make all these 3 layers, but instead you could have made only 1 with all that settings

  • @user-wz4qs9un1x
    @user-wz4qs9un1x 9 місяців тому

    nice 0:12

  • @uzzmah
    @uzzmah Рік тому

    "Amateur" Graphic designer here. Can Figma be used as an alternative to Adobe Illustrator? If not, why so?

    • @savvosg
      @savvosg Рік тому +1

      They are used for different fields. Think about Figma as Adobe XD. They are tools for UI/UX designing.

    • @hobisdimples94
      @hobisdimples94 Рік тому +1

      As someone who uses both, Illustrator definitely has more advanced tools for certain functions. Personally Figma is incredibly user friendly and honestly I like the interface better and find it useful for quick layouts. But there's no replacement for AI when trying to do complex graphics. I think it's good to be proficient in both programs and use them together for efficiency, rather than just one or the other.

    • @uzzmah
      @uzzmah Рік тому

      @@savvosg Got it, thanks👍🏼

    • @uzzmah
      @uzzmah Рік тому

      @@hobisdimples94 Thank you, great suggestion 👍🏼

  • @Oscar4u69
    @Oscar4u69 Рік тому

    figma what 🤨😳

  • @OrewaPein
    @OrewaPein 13 днів тому

    To all the people who are commenting, "Nightmare for developers 😭😱"
    You are either not a developer and if you are then please chose some other field because you will be only wasting time and resources of the company you are working with by trying to actually "develop" this image rather than just exporting this image from figma and using tag 🙂🙂

  • @arunbelur6759
    @arunbelur6759 Місяць тому

    Why do always show you face in tutorials. Isn’t the whole idea to see what you’re doing rather than see your face?

  • @outpost31737
    @outpost31737 2 роки тому +7

    Dude you need to sort your head out and I mean quite literally move it out of the way so we can see what you're doing.

    • @mikeyturralde
      @mikeyturralde 2 роки тому +3

      oh yeah, didn't even notice that but you're right. This would be better if the face cam was out of the way on the left or something

  • @juts_sama
    @juts_sama Рік тому

    supafas

  • @chestify950
    @chestify950 2 роки тому

    Wtf

  • @--.--
    @--.-- Рік тому

    Figma mоnkeys haven't heard about Photoshop