> For the complete documentation index, see [llms.txt](/llms.txt)

# Web SDK UI templates guide

## Introduction

With the release of the [Web SDK 14.44.0](/sdk/web/), a range of new design patterns and layouts have been implemented across all screens and products, to enhance consistency and improve the user experience. Many common issues and bugs have also been fixed as part of this release.

The key changes to be aware of include:

- **Left-aligned text** for improved readability, accessibility and visual flow
- **Replaced illustrations with icons** to ensure consistency and better customization
- **Refined UI** across multiple screens to create a more consistent experience
- **Alignment of media** on introduction and welcome screens to always be above content
- **Buttons** are displayed in full width and responsive to screen size

A number of the Web SDK styling attributes have also been updated or removed with this release. Please refer to the [migration guide](/sdk/web/migration/) for specific details.

The images below offer an illustration of some of the changes that have been made to major SDK screens and components:

| Module                                  | Previous template                                                     | New template                                                        |
| --------------------------------------- | --------------------------------------------------------------------- | ------------------------------------------------------------------- |
| Document selection screen               | ![Former doc selection](./doc_selection_old.png)                      | ![New doc selection](./doc_selection_new.png)                       |
| Document upload screen                  | ![Former doc upload](./doc_upload_old.png)                            | ![New doc upload](./doc_upload_new_a.png)                           |
| Motion intro screen                     | ![Former motion intro](./motion_intro_old.png)                        | ![New motion intro](./motion_intro_new1.png)                        |
| Motion error screen                     | ![Former motion error](./motion_error_old.png)                        | ![New motion error](./motion_error_new1.png)                        |
| Proof of Address selection screen       | ![Former poa selection](./poa_selection_old.png)                      | ![New poa selection](./poa_selection_new1.png)                      |
| Proof of Address capture screen         | ![Former poa capture](./poa_capture_old.png)                          | ![New poa capture](./poa_capture_new1.png)                          |
| Cross-device (desktop) intro screen     | ![Former desktop intro](./cross_device_desktop_intro_old.png)         | ![New desktop intro](./cross_device_desktop_intro_new1.png)         |
| Cross-device (desktop) QR code screen   | ![Former desktop QR code](./cross_device_desktop_qr_old.png)          | ![New desktop QR code](./cross_device_desktop_qr_new1.png)          |
| Cross-device (desktop) SMS screen       | ![Former desktop SMS](./cross_device_desktop_sms_old.png)             | ![New desktop SMS](./cross_device_desktop_sms_new.png)              |
| Cross-device (desktop) URL screen       | ![Former desktop URL](./cross_device_desktop_url_old.png)             | ![New desktop URL](./cross_device_desktop_url_new1.png)             |
| Cross-device (desktop) success screen   | ![Former desktop success](./cross_device_desktop_success_old.png)     | ![New desktop success](./cross_device_desktop_success_new1.png)     |
| Cross-device (desktop) connected screen | ![Former desktop connected](./cross_device_desktop_connected_old.png) | ![New desktop connected](./cross_device_desktop_connected_new1.png) |
| Cross-device (mobile) intro screen      | ![Former mobile intro](./cross_device_mobile_intro_old.png)           | ![New mobile intro](./cross_device_mobile_intro_new1.png)           |
| Cross-device (mobile) success screen    | ![Former mobile success](./cross_device_mobile_success_old.png)       | ![New mobile success](./cross_device_mobile_success_new1.png)       |