Web Page Design in Adobe XD (2020)

[@PhysicNationOfficial]

Where do you find inspiration for color scheme? Do you just use a palette generator?

[@DesignSense]

Some time I am taking colors from some others design but mostly iam making colors for my self.

[@thegabischip]

Your videos are inspirational. I can hardly wait for the next video. 🙃

[@DesignSense]

Thank you😊, stay tuned for more videos.

[@kapil_joshi_]

Super design bro, i love it 👌 👌

[@DesignSense]

Thank you

[@mdsohagrana9092]

Great, it's helpful. Waiting for next tutorial

[@DesignSense]

Thanks, stay tuned 😊

[@kriptoedits9978]

Hey bro how to add this design in our editor

[@akankshasamar9837]

Awesome... My eyes can't go anyway away from screen

[@DesignSense]

Nice, stay tuned thanks😊

[@user-sq3tr6jm6y]

when you download font DIN?

[@manoja9972]

is right and left side gap mandatory

[@DesignSense]

Yes.

[@fabioalexandreaulason-line2070]

1:06 What would the name be like that?

[@shamaasif9152]

0:48 how did you make it can you give a tutorial please

[@DesignSense]

That is just the pen tool not too complicated.

[@abhisheknapit1244]

when do u upload prototyping animation tutorial for this project?

[@DesignSense]

I was busy in some projects that why i didn't upload but i will try to upload tutorials about prototype soon, thanks

[@saipyaesonethu5572]

It's really useful. Thank sir!!!

[@DesignSense]

Most welcome 😊

[@tomasz3727]

When I downloaded these images from the link, they had a white border . How can i remove it ? I want to have the same as the video

[@DesignSense]

You have to edit it a little bit, in Adobe Illustrator CC because these illustrations are different from our design style. Give the same colors like our page, and remove unnecessary things from the illustrations. For more help contact us on our Facebook page. Thanks Facebook: web.facebook.com/DesignSense2070/

[@tomasz3727]

@@DesignSense thanks

[@toshiodocs]

wheres the xd file like the others videos ? I usually download to compare and take the icons and illustrations

[@DesignSense]

Actually after this recording i have lost that file, because of crashed the xd. Thats why i didn't add the source file, sorry

[@jaikumar7875]

Thanks for sharing the video with us. Do you have any suggestions for photography and videography websites? Is there any UI design you would recommend?

[@DesignSense]

Yesterday i have uploaded a video about apps showcase landing page design, but next i will try for this thanks😊

[@ScottWissing]

Can you do a video where you take these designs from XD to Wordpress? These design videos are excellent but getting them into website format seems really difficult to recreate. Thanks a lot.

[@DesignSense]

Sorry not this time but in future 😊, btw you can easily export all the things, thanks for your appreciation 😊

[@dominiquegaetane1913]

Hello, thank you so much for this amazing videooo :) as i am very new to all this, i was wondering, once you done with the design, can you use it to make your website on Wordpress ? if yes then how does it work please ?

[@DesignSense]

It need to be coded and then covert it to WordPress. I hire coders for it. Thanks.

[@wkwkalnd]

please how to prototype scroll animation

[@DesignSense]

Soon i will upload a video for prototyping. Thanks

[@kurniawanfatahullah6552]

Good design, but how do you upload that design to your website? please make tutorial how uploaded design to website

[@DesignSense]

Sure, I will try thanks

[@aaa-f8z9w]

How did you change color of vector image ? Downloaded image is blue,but your image is red. Please teach me.

[@DesignSense]

Actually i have edited that illustration in Adobe Illustrator CC. Easily you can edit any illustration in AI. Thanks

[@aaa-f8z9w]

@@DesignSense Thanks. I’l try it .

[@ionasequeira6131]

Nice video... buy why aren't you using repeat grids? Thats a cool feature.

[@mhd_daraei1768]

nice work 😍

[@DesignSense]

Thank you 😊

[@smsaran]

Nice, where do you download or get the illustration vector images.

[@DesignSense]

Freepik.com

[@smsaran]

@@DesignSense Thank you 😊

[@smsaran]

Waiting for your next design work 👍

[@sazzad.ms71]

This is a great design on my eyes. Would you please provide me the images you used, so that I can try by Following your steps. A big Appreciation for your presentation

[@DesignSense]

Download the source file. The link is given in the description. Thank you

[@chamaldezilva]

nice! what is the font you used?

[@DesignSense]

Font name: DIN

[@daliakasab2739]

How can i get image 3D like this ??

[@DesignSense]

From freepik.com

[@kriptoedits9978]

How to upload it to Google

[@fabrizziogz]

Are these designs only as prototypes or can they be directly converted to HTML/CSS pages? (Nice video btw!)

[@DesignSense]

This is just the design and prototype, you can code it itself, but if you are not a developer you can use other tools to make it a real responsive landing page like webflow, Anima etc

[@hieule8054]

Your video is great. I hope you can make more videos and more often :D

[@DesignSense]

Thanks you, stay tuned.

[@MrSleep-le9qt]

How do I run the project so that it looks the same as in the intro?

[@DesignSense]

You have to required some animations for that in prototype.

[@faiqueyusuf5070]

bro can you please give me the exact Illustration : 1-5 image file that you have used .it would be a great help

[@DesignSense]

Please download the source file, the link is given in the description. You'll find that illustration.

[@ganeshkumarm3240]

Can u plzzz share the image..any website available for this images

[@DesignSense]

Download it from freepik. Com the link is mentioned in the description.

[@Eslam-886]

please, in 20 second the slide(our customer say) how do you do that

[@DesignSense]

It is with the help of prototype transitions, i will soon upload a tutorial about prototype. Thanks

[@Eslam-886]

@@DesignSense Thank you so much for your constant support.

[@luqmanxd]

how to add the animations

[@its_kolim5812]

Please upload more this type of videos because it's can help beginners designer.... Anyway it's awesome video 👌

[@DesignSense]

Sure soon we will upload more videos like this, stay tuned thanks 😊

[@latrellxie617]

Great video! Although the buttons and textures that we can interact with mouse clicks seemed to be just text in the presentation. I was wandering that how you can turn this beautiful work into an actual interactive website. Or Indesign is just same as Adobe XD which works only for prototype presentations for people such as clients or students.

[@DesignSense]

There are many ways to convert this design to actual website design, soon i will upload tutorials for webflow, in which i will show you how to design, build and launch a actual website in webflow. Thanks

[@tixtoe]

@@DesignSense I think you forgot to upload broo

[@DesignSense]

@@tixtoe sorry for late. Soon i will upload after 2022 trends videos.

[@kartikyadav4128]

amazing work brother. love from India

[@DesignSense]

Thanks bro, stay tuned

[@nikyabodigital]

How did you put color assets on your color picker??? please teach me

[@DesignSense]

Just simple make a shap and give it any color, then select that shape and press the plus + button in the color panel. 😊

[@kriptoedits9978]

How to connect this UI design to our code I mean back end

[@DesignSense]

This is only the design concept, but there are many ways to convert this design to real project, such as webflow etc.

[@ushahaloi9204]

What is the size of the artboard bro. By the way nice work.

[@DesignSense]

1920 x 1080, thank you 😊

[@ushahaloi9204]

@@DesignSense how did you exported it.

[@DesignSense]

@@ushahaloi9204 just select the artboard, and press Ctrl + E then you can export it in any format 😊

[@melissaramphort]

how this become interactive on a website?

[@DesignSense]

There are many ways to convert this design to the actual interactive site, like webflow, etc

[@melissaramphort]

@@DesignSense I use Elementor, what is the format name of those designs?

[@DesignSense]

@@melissaramphort it is just the wireframe, You should make this design again in elementor, just you can exports the assets from this design like illustrations, icons etc.

[@farahtasnim23]

Whats the price of 7 web pages and 7 app design pages

[@DesignSense]

Contact us on: Facebook: web.facebook.com/DesignSense2070/ . Or. . Instagram : DesignSense99

[@trishaaidasyahputri1181]

I really enjoy your design and this helpful tutorial and I hope you'll upload the prototyping animation soon! 😊

[@DesignSense]

Thanks, soon will upload more tutorials stay tuned.

[@jamievdj2824]

Where do you get those images

[@DesignSense]

The link is given the description.

[@Thanveer634]

Bro how to crop a image in xd...?

[@DesignSense]

You can mask an image with any kind of shape, by just clicking right button and mask to object.

[@prasaddhend5500]

Can you please provide the used material files

[@DesignSense]

The links of these illustrations are mentioned in the description.

[@prasaddhend5500]

Sir please provide folder link in one place to download all files used in tutorial

[@Atseo]

How you use this as web?

[@DesignSense]

It is just the design, for real responsive site, you need to code it. Thanks

[@Eslam-886]

Please, how can i download the new fonts (adobe xd)

[@DesignSense]

Easily you can download every font free font just download it and install it😊

[@Eslam-886]

@@DesignSense I did, but the fonts didn't show up on xd ?

[@DesignSense]

@@Eslam-886 Once you install a new font, if the font not showing in xd, then restart your xd or restart your PC.

[@Eslam-886]

@@DesignSense Thank you bro , you're the best

[@zackatka]

Help pleaseee, how to continue artboard after already made one ?)))

[@DesignSense]

You can enlarged the artboard by just selecting and drag it down.

[@zackatka]

DesignSense I mean create new one , like another side slide ))

[@DesignSense]

@@zackatka select the artboard right click on it, and paste another side. If you don't understand please contact on our Facebook page we will guide you, thanks

[@zackatka]

DesignSense thanks 😊

[@anitanirmal27]

Hi can you make Graphic designing Tutorials plz

[@DesignSense]

Yes, i already have make videos, for what do you need a tutorial?

[@anitanirmal27]

@@DesignSense pls give link I want see that

[@DesignSense]

Sorry I didn't get your point what do you mean by graphic designing videos? My all tutorials about graphic designing🤐. And the graphic designing trends videos for 2021 will be soon uploading.

[@anitanirmal27]

@@DesignSense ok thanks, can you make 'a man working at office' graphics in illustrator

[@DesignSense]

@@anitanirmal27 yes i have make a video about that please watch it, Link: kzbin.info/www/bejne/qnrWqqt9r6tlpdE

[@ItsMcRon]

How long do these usually take?

[@DesignSense]

If you design it normally it takes 2 or 3 hours, but it depends on you.

[@restyourmind8988]

Why didn't you show how to make the animation when you scroll down? with the comment sections

[@DesignSense]

It is a different topic, i will upload a tutorial about prototype.

[@restyourmind8988]

@@DesignSense Okay thanks :)

[@rishabhsharma2744]

I loved it, could you please help me where to get these 3D images pngs for website

[@DesignSense]

You can access to these kind of illustrations for free from (freepik. com), you also find it on shutter stock etc but thats are paid. Also these illustrations links are given in the description. Thanks

[@rishabhsharma2744]

Your designs are awesome and thanks for your reply, are you Indian ???

[@DesignSense]

@@rishabhsharma2744 welcome 😊. No from Pakistan.

[@rishabhsharma2744]

How's the situation there due to this corona

[@rishabhsharma2744]

Only for this reason i m asking nationality nothing else

[@nextro5922]

And what, after u design? How u connect that with html

[@Arvind.cr7]

Export them to Zeplin from XD

[@rag6418]

Can develop website only from xd

[@DesignSense]

Adobe xd is for designing and prototype. You can use for development other tools.

[@MarcRossmann]

Would make sense to have narration on what is done. Music screams at you. You concertante o music and not actions.

[@DesignSense]

Soon we will do that. Thanks for the feedback.

[@universalduggal1708]

Where did you get the images from?

[@DesignSense]

From freepik.com. Thanks

[@Eslam-886]

Great work, it's an awesome video 👌 But I need the source of the Logo (Business ideas)

[@DesignSense]

I have design roughly this logo for this web page design, it is not for commercial use😊😊, thank you

[@JEsterCW]

So good

[@DesignSense]

Thank you 😊

[@seveto3911]

69 comments and my coment ❤️. Very good design 🖍️

[@DesignSense]

Thanks brother 😊

[@sadiaislam1249]

how to save the template plz show

[@DesignSense]

Simple, select the artboard and just press Ctrl+E, then you can save that template in any format. Thanks 😊

[@rusdiachyar5788]

awesome 👌 But I need the source of the images that you use, maybe you can provide the links to download?

[@DesignSense]

The source links is given in the description, thansk😊

[@shaz7777-e7d]

Very impressive... Upload a video which shows how to code..

[@DesignSense]

Thanks 😊

[@lucienlch]

the links of the logo is available ! please, the links (excuse my , y not speak english

[@DesignSense]

I have just roughly designed that logo for this landing page🤐.

[@ahsanulhaquenehal9112]

Bro u are good ! make a tutorial about illustrator

[@DesignSense]

Sure, i will upload tutorials about illustrator, thanks

[@sharjeelahmad3457]

Great stuff! 👌

[@DesignSense]

Thanks 😊

[@abadul21]

Excellent

[@DesignSense]

Thanks

[@stanislawprovince8642]

Very nice,thank you

[@DesignSense]

Thanks 😊

[@RezoUI]

Thanks!

[@DesignSense]

Welcome 😊

[@RezoUI]

@@DesignSense Please make more Adobe XD videos. Thanks

[@ruwanwlr9388]

Thanks

[@DesignSense]

You're welcome 😊

[@Sacas-dk8bq]

y la animación???

[@69cornelix]

Webdesign Kennisbank | Cees Spelt Educatieve Webdesign Wegwijzer www.webdesignkennisbank.nl Welkom in de Wereld van Webdesign! Jouw Webdesign Startpunt!

[@mildcomments]

Thank you....

[@DesignSense]

Thanks

[@decoygd1014]

Good designs :0

[@DesignSense]

Thanks

[@rajsuthanofficial7585]

Awesome

[@DesignSense]

Thank you.

[@DotaNoob]

Great ! Cooool

[@DesignSense]

Thanks 😊

[@E-learning-online]

THIS FONT IS PREMIUM?

[@kizitodaka9417]

EXCELLENTO!

[@DesignSense]

Thank you 😊

[@danielignacio168]

thanks master!

[@DesignSense]

Welcome 😊

[@crazyberlin]

Love from Pochinki

[@DesignSense]

Thank you ❤️

[@oneabcd]

wooooowww que perroooooo!!!

[@vlhz69420]

Good designing but could you not use such overrated music? Ruins the video