# Desktop View

NotionApps provides a full-width desktop experience on larger devices such as laptops, monitors, etc. &#x20;

## Switch between mobile and desktop app previews

In the app builder, you can switch between mobile, desktop, and expanded previews for your application.&#x20;

{% hint style="success" %}
Tip: Use shortcut keys to open previews quickly: \
m → mobile view

d → desktop view

e -> open expanded view/close expanded view
{% endhint %}

<div data-full-width="true"><figure><img src="https://4233028229-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F5ZqDXcVVffWUqEIZVhmn%2Fuploads%2FXx9rZ33YaSGnFCzbjvYK%2FScreenshot%202024-06-08%20at%208.30.46%E2%80%AFAM.png?alt=media&#x26;token=6916d007-7c16-4757-b11c-fede4b7941fd" alt=""><figcaption><p>Mobile view</p></figcaption></figure></div>

<figure><img src="https://4233028229-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F5ZqDXcVVffWUqEIZVhmn%2Fuploads%2F5cbpsH84KoTnirOEmsST%2FScreenshot%202024-06-08%20at%208.32.09%E2%80%AFAM.png?alt=media&#x26;token=23c7f083-697b-44f7-bea3-0d2f4bbda91b" alt=""><figcaption><p>Desktop view</p></figcaption></figure>

<div data-full-width="false"><figure><img src="https://4233028229-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F5ZqDXcVVffWUqEIZVhmn%2Fuploads%2F0nm0lHY8ltJTD3v45K4C%2FScreenshot%202024-06-08%20at%208.33.24%E2%80%AFAM.png?alt=media&#x26;token=aa8f8867-4b37-48e0-a823-746c69bdd038" alt=""><figcaption><p>Click to expand to full-width</p></figcaption></figure></div>

<div data-full-width="true"><figure><img src="https://4233028229-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F5ZqDXcVVffWUqEIZVhmn%2Fuploads%2FdGGlDhTMPZ5tlTXNjIrk%2FScreenshot%202024-06-08%20at%208.33.37%E2%80%AFAM.png?alt=media&#x26;token=63ddb8f7-c583-4afd-b7e1-8285373fe15c" alt=""><figcaption><p>Full width view</p></figcaption></figure></div>

<figure><img src="https://4233028229-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F5ZqDXcVVffWUqEIZVhmn%2Fuploads%2FJ2hFIdCFak55BxHg3toy%2FScreenshot%202024-06-08%20at%208.38.21%E2%80%AFAM.png?alt=media&#x26;token=9991d2d3-7ffe-42b2-b71a-5f52937f493c" alt=""><figcaption><p>Close expanded view</p></figcaption></figure>

## Show mobile view on desktop devices

While the full-width desktop view is the default experience on larger devices, you can configure the app to show a mobile view on these devices. This can be useful for applications that are primarily mobile-only. Please follow this step-by-step guide to enable this behaviour:

1. Go to the app builder
2. Go to the settings of the app
3. Enable "*Show mobile view on desktop"*

<figure><img src="https://4233028229-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F5ZqDXcVVffWUqEIZVhmn%2Fuploads%2FAwrKKu7ZUJE9FZkUabJt%2FScreenshot%202024-06-08%20at%208.50.07%E2%80%AFAM.png?alt=media&#x26;token=adf291e1-b5dc-4a32-b154-4701d100fbbe" alt=""><figcaption><p>Show mobile view on desktop</p></figcaption></figure>

4. Publish your application&#x20;

Now, you will see a mobile view if you open your application on a laptop or any other larger device.&#x20;

<figure><img src="https://4233028229-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F5ZqDXcVVffWUqEIZVhmn%2Fuploads%2F6uNg4RaOkBArkGu0VkOc%2FScreenshot%202024-06-08%20at%208.56.06%E2%80%AFAM.png?alt=media&#x26;token=0df4f8f6-7f51-48ab-80df-20b2b54868a0" alt=""><figcaption></figcaption></figure>
