Charter 19 Explore the City Page UI with different screen sizes and data volumes to discover surprises

Charter:

• Verify that despite screen size, user is able to scroll each element into view

Testers:

• Benjamin Ell-Jones

Date:

• 25/07/2024

Duration:

• 45 mins

Scope:

• City page UI/ AQI and Pollutant graphs/charts

References:

• E-charts

Test Approach:

• Explore the Single City page, check that the graphs are viewable in multiple screen sizes.

Notes:

PC monitors

Using Firefox's device emulator, I created a custom pc monitor device and have tested the most common resolutions:

1. 1920×1080 - works fine

Bar is not present as expected

2. 1366×768

Bar is present and works

3. 1280×1024

Bar is present and works

4. 1440×900

Bar is present and works

5. 1600×900

Bar is present and works

6. 1680×1050

Bar is present and works

7. 1280×800

Bar is present and works

8. 1024×768

9. 2560×1440 (QHD)

Might be worth centring the graphs

10. 3840×2160 (4K UHD)

Might be worth centring the graphs

Laptop monitors:

Laptop with HiDPI screen

Seems to function fine

Laptop with MDPI screen

Laptop with touch screen

The scroll bar was hard to select, but that could just be because the simulated touch is poor

Screen shap tests:

Tested all on Firefox

Conclusion

Tested multiple resolutions, it might be worth sorting the centring on the greater resolutions like, 2560×1440 and 3840×2160. The scroll bar however seems to function fine.