# How to create perspective responsive dashboard

**URL:** <https://forum.inductiveautomation.com/t/how-to-create-perspective-responsive-dashboard/104980>\
**Category:** Ignition\
**Tags:** perspective\
**Created:** [April 11, 2025, 1:55am UTC](https://forum.inductiveautomation.com/t/how-to-create-perspective-responsive-dashboard/104980 "2025-04-11T01:55:37Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![soontosr](https://avatars.discourse-cdn.com/v4/letter/s/ed655f/32.png) [@soontosr](https://forum.inductiveautomation.com/u/soontosr)\
**Post date:** [April 11, 2025, 1:55am UTC](https://forum.inductiveautomation.com/t/how-to-create-perspective-responsive-dashboard/104980/1 "2025-04-11T01:55:37Z")

</div>

I would like to develop a responsive Perspective dashboard that is accessible on both desktop and mobile devices. What steps should I take to achieve this?

---

<div class="post-metadata">

**Author:** ![Transistor](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/transistor/32/3380_2.png) [@Transistor](https://forum.inductiveautomation.com/u/Transistor)\
**Post date:** [April 11, 2025, 3:48am UTC](https://forum.inductiveautomation.com/t/how-to-create-perspective-responsive-dashboard/104980/2 "2025-04-11T03:48:18Z")

</div>

Start here:

> **[Perspective Design Tips | Ignition User Manual](https://www.docs.inductiveautomation.com/docs/8.1/ignition-modules/perspective/perspective-design-tips#designing-for-mobile-responsive-applications)**
>
> There are many things to consider when designing for mobile-responsive applications that can run in a web browser. Designs must work everywhere, on any device from a small smartphone to an oversized desktop, in an optimized format, using one design....

---

<div class="post-metadata">

**Author:** ![soontosr](https://avatars.discourse-cdn.com/v4/letter/s/ed655f/32.png) [@soontosr](https://forum.inductiveautomation.com/u/soontosr)\
**Post date:** [April 22, 2025, 4:29am UTC](https://forum.inductiveautomation.com/t/how-to-create-perspective-responsive-dashboard/104980/3 "2025-04-22T04:29:46Z")

</div>

i can't find solution one dashboard view both device.

---

<div class="post-metadata">

**Author:** ![Fran\_Dujmovic](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/fran_dujmovic/32/70280_2.png) [@Fran\_Dujmovic](https://forum.inductiveautomation.com/u/Fran_Dujmovic)\
**Post date:** [April 22, 2025, 6:15am UTC](https://forum.inductiveautomation.com/t/how-to-create-perspective-responsive-dashboard/104980/4 "2025-04-22T06:15:07Z")

</div>

I don't think you can achieve what you described with only 1 view.

In my opinion, the simplest solution would be to use a combination of Breakpoint and Flex containers and design 2 separate dashboard screens - above and below the breakpoint.  
Perspective also has a `dashboard` component, perhaps it will be of some use to you ( [Perspective - Dashboard | Ignition User Manual](https://www.docs.inductiveautomation.com/docs/8.1/appendix/components/perspective-components/perspective-display-palette/perspective-dashboard)).

---

<div class="post-metadata">

**Author:** ![deon.korb](https://avatars.discourse-cdn.com/v4/letter/d/8c91f0/32.png) [@deon.korb](https://forum.inductiveautomation.com/u/deon.korb)\
**Post date:** [April 22, 2025, 6:28am UTC](https://forum.inductiveautomation.com/t/how-to-create-perspective-responsive-dashboard/104980/5 "2025-04-22T06:28:13Z")

</div>

We used a method to retrieve the dashboard config manipulate the positions based on the viewport width.

The script is a bit complicated and I can't share it here, but the gist is to manipulate the following properties for each widget:

```python
widget['position']['rowStart']
widget['position']['rowEnd']
widget['position']['columnStart']
widget['position']['columnEnd']

```

The approach that we took is to discard the original position and simply display the widget in a single column when the viewport is too narrow, with an overflow to allow scrolling vertically. The vertical order is then just determined by the order in the widget configuration.

I am also keen on learning a better way, but this works for us for the time being.