Hi everyone, I’ve nearly finished developing my first web app, and have done so all through the UI builder at 1080 px. I’m now getting to the point where I’d like to make my site mobile friendly. I’ve been doing some research, and have seen many people say it is best to start with a mobile first approach, then to later expand it to desktop. I will keep this in mind for next time, but unfortunately it is too late for that now.
All of my elements are in either rows or columns, and when using responsive design they work fairly okay with different screen sizes. My main issues though are things like repeating groups, and various other elements and texts that are compressed and don’t translate well to mobile. I’ve seen some say that they have doubled the groups on each page with one desktop and one mobile, and set conditionings to make one visible over another depending on the size of the screen. This seems like it could work for pages without many workflows, but some of my pages have a number of dozens of workflows, making this too tedious even with backend workflows handling most things. The same idea goes with the “mobile version” page. The workflows will still need to be duplicated, which can cause more work down the line.
The final option appears to be to use conditional designing, where various elements have different types of conditions depending on the screen size. This seems simple in the fact that nothing needs to be duplicated, but I’ve heard that many conditions can cause slowness on a page and confusion in the future, where you aren’t sure what element is causing what to happen and whatnot.
Anyway, if anyone could offer me some advice I would be greatly appreciative. Thank you in advance!