Mobile UI Design with Canva (Complete Guide)

Поділитися
Вставка
  • Опубліковано 16 гру 2024

КОМЕНТАРІ • 86

  • @UBMD
    @UBMD  3 роки тому +3

    Are you not entertained? Tell me your thoughts and comment down below! Or if you just want to talk I'm down for that also.
    Don't have a Canva account? No problem! You can sign up for a FREE account or try a Canva Pro account FREE for 30 days.
    👉Just use this affiliate link partner.canva.com/e4AZnX.

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

      Hi I am new in it. And I have made a project in canva. In which format should I send it to the customer? In what format should I render it ?

  • @wovesprofessional2214
    @wovesprofessional2214 3 роки тому +5

    You are the Canva goat keep going

    • @UBMD
      @UBMD  3 роки тому

      Thank you Woves Professional! I really appreciate the encouragement! 🤘🏽

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

    That's a beautiful video my friend. Some barber told me he needed an app so this information was very useful bro!

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

      Hello the diamond club 2023, I’m happy you enjoyed the video and found it helpful.
      Thank you so much for your time and support!
      Richard

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

      @@UBMD Bro don't thank me but thank Allah (God) that gave us this time ☺️ But I also want to thank you for making time to teach us valuable information to save time and progress faster. Hope we meet in next life too so we can talk about this temporary life. And hope the best for you in this life and in the hereafter. 🤲❤️👍

  • @jadesalem-tedj6837
    @jadesalem-tedj6837 Місяць тому +1

    Super helpful thank you !

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

      Hey there! I’m so happy this video was able to help you out my friend.
      Thank you so much for your time and support. I appreciate it you!
      Richard

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

    Nice! Super helpful for a project I'm working on.👏

    • @UBMD
      @UBMD  6 місяців тому

      Hey there! I’m happy to hear you got some value from this video!
      I appreciate your time and support for the channel. If you ever have any questions about Canva or design in general feel free to come back and comment.
      Richard

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

    Great Content.
    Please Keep Producing
    I'd love more on the mobile UI design

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

      Hello! I'm happy you enjoyed this video. I hope to produce more content in the future, but due to life I'm not able to at this time.
      I appreciate your time and support for the channel!
      Richard

  • @johnarthurgurondiano
    @johnarthurgurondiano 2 місяці тому +1

    Can I set the actual size of rectangular shapes or rounded ? For example the width and height?

    • @UBMD
      @UBMD  2 місяці тому +1

      Hey there! For this project I made the canvas 415x895, but I would do a google search to see what the best size would be for your project.
      Thank you for your time and support for the channel!
      Richard

    • @johnarthurgurondiano
      @johnarthurgurondiano 2 місяці тому

      @@UBMD I mean the actual size of buttons and icons can I set them in Canva?

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

    Wow the video is great, sharp on time, I love it, it is short and precise, what I just want to know is If I can send the design to developer to code the rest features

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

      I really appreciate that Habey Mark! Unfortunately there is no way to export your Canva design to a developer other than a PDF or JPEG. I wish Canva would give developers more information when it comes to UX design.
      I hope this helps you out and thank you for your time and support!
      Richard

  • @TheFuturesGlimpse
    @TheFuturesGlimpse 7 місяців тому +1

    Hi, your designs are great. I'm wondering if you have any template to share. i wanted to make an AR application, the coding would be done by someone else but i have to create the design myself, and i have 0 experience to make it. a template would be very helpful:)

    • @UBMD
      @UBMD  7 місяців тому

      Hey @gram5127, your project sounds really exciting, and I hope you're able to make it a reality. Unfortunately, Canva would not be the best program to pass off to a developer. While this video does show you how to use Canva for UI design, it was really intended to show the viewer that it is possible to get the ball rolling. So, in other words, Canva could be used to design a proof of concept for presentations or a mockup.
      You are better off creating your design in Figma or Sketchup. These two programs provide developers with critical design information in order to develop a functional product.
      I'm sorry I was not much help, but I do appreciate your time and support for the channel. If you have any other questions, just let me know.
      Richard

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

    Love it! Is it possible to create a thumbnail like yours with Canva? The way you make certain elements “pop” out of the mockup is what I’m looking for.

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

      Hi Michael, I’m thrilled you found value in this video! I made a video covering how to make this type of thumbnail a while back. You can check it out at the link below.
      ua-cam.com/video/Aure4RmsTRY/v-deo.html
      If you have any questions feel free to ask and I’ll do my best to help you. Most of these thumbnails are just a matter of finding the right mockup and adding supporting elements.
      Thank you for your time and support Michael, I really appreciate it! 🤘
      Richard

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

      @@UBMD Thank you! I’ll check it out. Do you have a video on how to skew/tilt elements to make them look like they have depth? Canva doesn’t have that option, I believe, so I was wondering if you have any tricks to go around it.
      Love your content! Subscribed.

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

      @@michaelmakrinakis4930 yeah unfortunately Canva does not have a perspective tool which sucks. I've never covered this in any of my video and it might be a good video idea going forward.
      If you find a solution please share it with community.
      Again, thank you so much for your time and support for the channel. I hope I can continuing providing value.
      Richard

  • @Iamshubhg
    @Iamshubhg 9 місяців тому +1

    Hi I am new in it. And I have made a project in canva. In which format should I send it to the customer? In what format should I render it ?

    • @UBMD
      @UBMD  7 місяців тому +1

      Hello @Iamshubhg,
      I hope you're doing well. I wanted to kindly inform you that while the content you provided would be suitable for sharing with a client as a proof of concept or even as a reference for a developer, it may not be sufficient to directly send to a developer for actual work. It's important to note that Canva does not support UI/UX design and does not provide developers with the necessary information to assist with the final design.
      The main purpose of this video was to demonstrate to viewers that it is indeed possible to create visually appealing UI/UX designs using Canva as a proof of concept. I sincerely apologize if this video may have been misleading or if it ended up wasting your valuable time.
      Thank you so much for your understanding
      Richard

    • @Iamshubhg
      @Iamshubhg 7 місяців тому

      @@UBMD Okay brother. Can you make more UX UI videos with proper guide on what software should we use and how to work?

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

    Fuego. Thank you!

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

      I appreciate that CJ Sugarhill, I hope to continue providing value to the community.
      Thank you for your time and support!
      Richard

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

    That was Clean

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

      Thank you roentgen11, the goal of the video was to show viewers you can create UI designs without having to pay for the big box programs. Would this be good to pass off to a developer? No it would not, but if wanted to get your feet we in UI design this could be an option.
      Thank you for your time and support!
      Richard

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

      @@UBMD I know but by clean I meant it was looking great simple and effective, Here in India by clean it means 'nicely done'

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

      @@roentgenishere ohh wow, thank you for that roentgen11! Much appreciated 🙏.

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

      @@UBMD thanks for the content i made a mockup for waste management app watching this video so thank you

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

      That’s really great! I’m happy this video inspired you 🤘

  • @alibyh4295
    @alibyh4295 4 місяці тому +1

    Great job

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

      @@alibyh4295 thank you! I’m happy you found value in this video.
      Thank you for your time and support!
      Richard

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

    How did you get the thumb nail done? The Phones slightly slant

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

      👋 Hey there Uma, this thumbnail was created with a phone mockup I found some place on google. I then added all the little details to give it some dimension.
      If you would like to see how I create my thumbnails you can checkout this video down below. In there I cover the process of making thumbnails in Canva.
      ua-cam.com/video/Aure4RmsTRY/v-deo.html
      Thank you for your time and support Uma. I hope you come back soon!
      Thank you!
      Richard

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

      @@UBMD lovely!! Thank you so much for quick reply.

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

      @@umashenoy5143 happy to help! If you ever have any questions come back and comment away!

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

      @@UBMD sure will come back 😄

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

    brother You r Proooo

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

      Thank you for that my friend! I appreciate your time and support!
      Richard

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

    Hey dear. I appreciate your great effort. Can you explain the best way to save the UI Design in Canva to send it to the client? Thank you❤️

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

      Hello Asan, sorry for not getting back to you sooner. You could export a PDF or PNG for your client to review the design.
      If you have other screens designed I would suggest creating an interactive version with invision. Then you could just send over the invision link for the client to review.
      At this time Canva does not allow for handoff for a developer so you are stuck with an image for now.
      I hope this helps you out. Also thank you for your time and support!
      Richard

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

      @@UBMD my dear, thank you so much for your time. I bought Adobe Xd and everything works out amazingly so far. Thank you so much for your help, may God be with you❤️

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

    Did you create that thumbnail image? If so, which application?

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

      Hello Meowface, this thumbnail was created in Photoshop but can be done with Canva.
      This video below shows you how to achieve this thumbnail look.
      Canva for UA-cam Thumbnails (Easy Start to Finish Tutorial)
      ua-cam.com/video/Aure4RmsTRY/v-deo.html
      Thank you for your time and support!
      Richard

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

      @@UBMD What I mean is, did you design that specific image of those two phones? If so, how? Thanks.

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

      @@MeowfaceMusic oh I see what you’re saying now. Those two phones were a free mockup I found online. I then just added my Canva artwork in them and highlighted some little elements.

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

    Thank you for sharing

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

      Hello Muhammad! Thank you for taking the time to watch my video. I appreciate you and your support.
      Stay safe my friend!
      Richard.

  • @freekrider803
    @freekrider803 3 роки тому +1

    Can u teach how to turn this to app or website

    • @UBMD
      @UBMD  3 роки тому +1

      Hello Dev! Thank you so much for your suggestion. When I created this video the intention was to create a follow up video showing how to pass this off to a developer.
      I was not able to make that video but I’ll play around with it in the future.
      Thank you for your support and time!
      Richard.

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

    How to make it functional please help

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

      👋 Hello Shubhankur, unfortunately Canva does not allow for you to hand off your design to a developer. You could use invision to create a prototype if you created multiple frames, but that’s about it.
      I hope this helps you out!
      Thank you for your time and support!
      Richard

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

      @@UBMD thank you so much

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

      @@shubhankurkashyap5321 always happy to help. Come on back if you have any other questions.
      Thank you again!
      Richard

  • @naingwaiyanaung1242
    @naingwaiyanaung1242 3 роки тому +1

    How to use mock up in canva?

    • @UBMD
      @UBMD  3 роки тому

      Hello! This mock up you seen in the thumbnail was created in PhotoShop, but Canva does allow you to create mock ups.
      Checkout this video as it covers some good ground. I have yet to make a video on this topic but I plan on doing so one day.
      ua-cam.com/video/sBO-cHyRnyM/v-deo.html
      I hope this helps you out!
      Richard.

  • @mohammadamranul9704
    @mohammadamranul9704 3 роки тому +1

    How you Design thumbnails using mockups. please share this tutorial....🙂

    • @UBMD
      @UBMD  3 роки тому

      Hi Mohammad, thank you for your interest in this subject. I plan on covering this in the future. Would you like to see this done in PhotoShop or Canva?
      Thank you for your time and support!
      Richard.

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

    Can you do for a website please

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

      Hi Journal of Life, that is a good video suggestion. I’ve made some videos regarding Canva’s website builder. I have been looking into a good solution for UX in Canva but at this time there is no support for that type of project.
      I’ve been looking for a FREE solution but can’t seem to find anything that would work at this time.
      I’ll keep looking and will post a video once I have a good solution for all of you.
      Thank you for your time and support!
      Richard

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

    How do I deliver the design to the client?

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

      👋 Hey there Somaya, if you just want to send a proof of concept you could just save your design as a image or PDF. At this time Canva does not support any sort of UI pass off.
      This video was intended to show people you can use Canva to create UI designs, but really only to practice or show a proof of concept.
      I hope this video helped you, and thank you for your time and support!
      Richard

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

    is it easier than Figma?

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

      Hello @sweetalert480. Yes.. Yes it is...
      Thank you for your time and support!
      Richard

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

    You're awesome

    • @UBMD
      @UBMD  3 роки тому

      Pedro ABBarros you're the awesome one man! Thank you for your time and support my friend. Stay safe out there! 🤘🏽

  • @syed_ahmed11
    @syed_ahmed11 3 роки тому +1

    keep uploading more video

    • @UBMD
      @UBMD  3 роки тому

      Thank you Syed! I really appreciate it my friend! 🤘🏽

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

    Hi 👋 nice video. By the way, do you know how to import Canva UI design into Android Studio? ☺️ Thanks

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

      Hey Afif Hisham, right now there is no way to export your design to android studio, sketch, Adobe XD and the list goes on. It would be really great if Canva allowed you to do that. For now you can only design and prototype from a flat JPEG.
      I wanted to thank you Afif for your time and support. There are countless videos on youtube and you decided to watch my content, so thank you again my friend!
      Richard.

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

    Dudeeeeee!!!!!!

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

      👋 Hey Magical, I hope you enjoyed the video and found value in it!
      Thank you for your time and support my friend! 🤘
      Richard

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

    Why didn't you show us if it actually works?

    • @UBMD
      @UBMD  2 роки тому +15

      Hey Anna, unfortunately Canva has no prototyping feature so there would be no way to show it working. You could export the different screens as a PNG and uploaded them to a prototyping tool like Invision.
      The goal of the video was to demonstrate that it is possible to create UI designs with Canva. Doing so I was hoping to inspire others Canva users to do the same.
      I hope I answered your question.
      Richard

    • @Chibuike_D._Nze
      @Chibuike_D._Nze 10 місяців тому +1

      Yes you can prototype, just save as video and animate some icons and text.

  • @abcdef6263
    @abcdef6263 3 роки тому +1

    Hi

    • @UBMD
      @UBMD  3 роки тому

      Hello! 🙌🏽🤘🏽

    • @UBMD
      @UBMD  3 роки тому

      Thank you for joining the live event Pardeep! I really appreciate your time my friend! 😁

  • @Mimikins777
    @Mimikins777 7 місяців тому +1

    U were fast as hell but i caught up

    • @UBMD
      @UBMD  7 місяців тому

      Hello BattleBondShowdownist, I apologize for the fast video. I try to always keep my videos short as UA-cam says my viewers spend on average 2 minutes per video.
      I'll be addressing this in future videos.
      Richard

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

    Dafuq! It's too fast