How to create multiple flows in XD website for phone and tablet size plus a desktop web browser?

Community Beginner ,
Jan 14, 2022 Jan 14, 2022

Copy link to clipboard

Copied

Hello,

 

Brand new to XD and am wondering if I need to build a different XD website for each phone type and tablet size plus a desktop web browser? Seems like a lot. If the answer is yes, how many site size versions do I need for a small portfolio site? 

 

Thanks so much in advance for any help answering this question.

 

{Renamed By MOD}

Views

218

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Community Professional ,
Jan 15, 2022 Jan 15, 2022

Copy link to clipboard

Copied

Yua can use 3 different size artboards in your project and share for preview. 

Also see August 2020 release of Adobe XD: Introducing Multiple Flows

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Jan 22, 2022 Jan 22, 2022

Copy link to clipboard

Copied

LATEST

Thanks! I will check this out. 

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Community Professional ,
Jan 15, 2022 Jan 15, 2022

Copy link to clipboard

Copied

Hi @alexs6298960, I think considering web resolution (bigger than 1200px wide etc) and a mobile/phone (less than 768px width) is enough for the beginning. It's based on arranging a horizontal UI in a vertical way, when it comes to mobile, let's say you have 3 columns side by side, in mobile resolution those columns are going to be placed o top of each other, think it that way, and those numbers (1200 px and 767 etc) are based on Bootsrap's break points, you can see the whole list here: https://getbootstrap.com/docs/5.0/layout/breakpoints/#available-breakpoints which is a quite common standard, of course it can vary based on the design itself but it's about usually those numbers. Oh and this tutorial looks very useful: https://www.youtube.com/watch?v=Nxi2kBF7uiQ Hope this helps.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Jan 22, 2022 Jan 22, 2022

Copy link to clipboard

Copied

Thanks! This was also very helpful!

 

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines