Design a Signup Page in Figma | UI/Web Design Tutorial

Поділитися
Вставка
  • Опубліковано 6 лют 2025
  • If you're looking to design a sign-up page for a website, then this web design tutorial is perfect for you. In this tutorial, we cover everything you need to know about designing a signup page that is both visually appealing and user-friendly... Remember to Subscribe goo.gl/6vCw64
    We start by discussing the importance of a clean and simple design for your sign-up page, as cluttered designs can discourage users from signing up. We then move on to the various design elements that make up an effective signup page, including the use of clear and concise copy, appropriate color schemes, and easy-to-use form fields.
    By the end of this tutorial, you'll have all the knowledge you need to create a visually appealing and user-friendly sign-up page that encourages users to sign up and engage with your website.
    So, whether you're a seasoned web designer looking to improve your skills or a beginner just starting out, this tutorial is a must-watch. Check it out now and start designing your own sign-up page today!
    🏆 //////////// Join my members community to get access to perks:
    You can get this starting and ending design file
    designchamps.io/
    ------------------------------------------------------------------------------------
    🤝 //////////// My Courses, Templates, Free E-Books, & 1:1 Mentorship
    www.jesseshowa...
    👋 ////////// Follow me on Social
    Instagram: / imjesseshow
    Twitter: / imjesseshow
    📫 ////////// Sign up for my Monthly Newsletter
    www.jesseshowalter.com/newsletter
    ------------------------------------------------------------------------------------
    🖥️ ////////// I build most of my websites using Webflow
    webflow.grsm.i...
    🎵 ////////// Take your films to the next level with music from Musicbed. Sign up for a free account to listen for yourself: fm.pxf.io/c/13...
    📸 ////////// The Equipment I use
    www.amazon.com...

КОМЕНТАРІ • 52

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

    Brilliant vid. Learnt a lot . Well explained and no guessing work on my side. Except sometimes cant see what you're selecting behind your webcam image. Thanks you.

  • @aydanlalonde9242
    @aydanlalonde9242 Рік тому +5

    Love this! Something I’ve been struggling with recently is to make nice page layouts that have heavy text. It would be neat to see your approach how to add nice elements of design to heavy text pages :)

  • @ifechukwuodimegwu6910
    @ifechukwuodimegwu6910 11 місяців тому +1

    I have been following your videos on UIUX and I admire them honestly. Since I am also learning UI designing and graphics design, can you help me with videos on how you learnt ?

  • @georgeeanca
    @georgeeanca Рік тому +6

    Great! I would love to see more similar tutorials 🤩

  • @joypeace9555
    @joypeace9555 Рік тому +2

    Awesome, This is so amazing.
    I really learnt a lot.
    Thank you very much Jesse. I would love to see more tutorials like this.

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

    I'm excited! Keep giving us the 🔥 I really appreciate it

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

    Great content!! its so fun starting to learn UX/UI and having videos like this one available!! keep up the great content

  • @RahulMishraD
    @RahulMishraD 3 місяці тому

    this is my third screen that I designed in figma
    thexxx for everthing

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

    Great tutorial Jesse 👍

  • @TaherKhan21
    @TaherKhan21 8 місяців тому +1

    Hi,
    How are you?
    I have gone through your Video's it's really awesome, your teaching mothed is soo good,
    I Found the channel very helpful.
    Thanks.

  • @prashlovessamosa
    @prashlovessamosa Рік тому +13

    Today's Homework.

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

    Help full for me .... Best wishes from 🇵🇰

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

    Great design

  • @laurapatten9074
    @laurapatten9074 4 місяці тому

    Why don't you ever want to use pure black for fonts? Thank you Jesse! Great video.👍

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

    I wish you included the links of tools you used in the description... bro why you skip the most important parts...

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

    why does the text in line didnt work in my work? 9:20 part

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

    thank you brother its help's a lot

  • @swalehaarshad2113
    @swalehaarshad2113 27 днів тому

    How to add graphic key?

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

    Bruv thats magic

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

    is there any source code html css for this?

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

    Thank youuuuuuuuuuu😃

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

    how to convert the custom form fields to html though?

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

    We can not see due to your video Icon over layout option! -_-

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

    From where can I download those shapes type of graphics?

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

    Thanks bro that's very nice

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

    Do you still use the 1440px frame?

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

    I can''t find 3D mockup which you're using, link it please

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

    Awesome content, but I have a problem. The Scale don't work for me. If I scale the frame, all elements moves.

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

      hold ctrl while doing so

    • @luisbautista2156
      @luisbautista2156 Рік тому +2

      Use the scale tool in the top left corner under the move tool.

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

      @@luisbautista2156 I don't write comments on UA-cam at all, but I am so grateful to you that I write this. THANK YOU

    • @peteroguntola8760
      @peteroguntola8760 6 місяців тому +1

      Just press k (scale tool) before moving them

  • @ERICKP-h5h
    @ERICKP-h5h Рік тому

    how to create this signup page in webflow?

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

    life saver

  • @Trio-S-y1m
    @Trio-S-y1m 4 місяці тому

    Can you give that image

  • @MarryRose-o7k
    @MarryRose-o7k 9 місяців тому

    If you give the details about my the icons ,you use steps by steps.❤

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

    You copied the intro music from Steve will do it? lol nice

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

    How about for mobile apps?

  • @iUmerFarooq
    @iUmerFarooq Рік тому +2

    From where we can get these kind of 3D photos for free?

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

      try out midjourney AI

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

      @@AidanaDreamer Hmm you're right 💜
      Thank you ❤️

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

      ​@@iUmerFarooq hi , Have you known which about from where get the 3d photos

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

      @@abubakrsiddiqakbarov9036 no I didn't know because I didn't research on it.

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

    Too fast could not follow a single thing

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

      Slow down the video ..plackback speed to 0.25

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

      @@justinajodi382 why should I he made the tutorial

  • @harrachmins-e4733
    @harrachmins-e4733 Рік тому

    your face camera on your working project and seem like you don't know pff we are here to learn not to see your work and give a like :(