Hello all,
I have a perspective application which is designed for PC now the customer wants to view that application in the mobile phone too; however, some of the components in the PC application are quite big like the tables, cards, …
What would be the best strategy to design for both? Is it with the use of a column container?
Hi,
I can’t talk in a broad scope on best practices to develop mobile applications in Ignition, but the last couple of months I’ve been developing using the Perspective module, and I think the key to make responsive applications that work both for desktop and mobile versions is to use Flex containers and Breakpoint containers.
If you are familiar with web development, HTML and CSS, you might find very easy to implement Flex containers in your Perspective views.
One thing that helped me a lot to get an idea on how to start designing applications with Perspective is the following elective course from IA:
Building in Perspective Course at Inductive University
I haven’t tried their “Design Fundamentals” course yet, but this one might be more relevant to your initial question:
Design Fundamentals Course at Inductive University
You might want to give those a chance and maybe that could help 
Thank you very much for your response. Appreciate the knowledge and experience you shared 
Good points above
I stay away from the column container. It's super clunky at the moment, but imo also has very limited use-cases. Flex and breakpoint are my go-tos
Thank you very much, Nick. Appreciate it.
Agreed on the column container statement. To add some detail to that statement, I find that most use-cases I would have for a column container (displaying dynamically sized labels/entry fields/buttons that wrap to fit whatever screen size is used) can just as easily be handled by setting a row flex container to allow wrapping of its child components. From there it’s just a matter of playing with the position properties of each child component (e.g. grow/shrink/basis) until your view looks the way you’d like.
A helpful tip that I wish I knew about when I started working with Perspective is that the “position.basis” property on components can take a number of different formats. By default, components are assigned a basis in pixels, but you can assign them to be percentages as well, or even just set them to “auto.” It probably seems ridiculously simple to anyone with a background in web design, but I’d wager that most Ignition users do not usually come from that camp.
As far mobile design goes, I don’t know that there’s any singular thought on what the best mobile SCADA design principles are (if there is, and I’m in the dark on this, someone please clue me in!). What I have seen others do, and have done myself, is create “card” based screens where each device on screen would have its own card with just the most important, high-level info shown on the card by default, but have more device details expand out below the device card when the card is tapped on. I like to think of it as a more mobile-intuitive equivalent to a desktop application’s popup. I have found this approach to work great when creating a mobile version of a “process” or P&ID-style screen. With mobile, you have virtually unlimited vertical real estate to display things in that manner. I suppose one could argue the same is true on desktop, but the customers I have worked with would definitely complain if a desktop window had a scroll bar on it, where I’ve never heard any complaints about swiping up and down on mobile. Anyway, hopefully there’s something of use for you in my mobile rant.
Thank you very much for sharing your valuable knowledge! Really appreciate it.