Data
Seconds since page load: 
0
Number of Clicks: 
0
Touch Screen: 
Device type: 
Device name: 
Date: 
Time: 
Window Size
Width:
Height:
Pointer Position in Brower Window
Pointer is off screen
Pointer Position on Screen
Pointer is off screen
Scroll Positions
X - offset: 0 px
Y - offset: 0 px
Motion Data
Number of Datapoints: 
0
Mobile Device Orientation
X-axis (β): 0°
Y-axis (γ): 0°
Z-axis (α): 0°
Linear Acceleration (without gravity)
X-axis: 0 m/s²
Y-axis: 0 m/s²
Z-axis: 0 m/s²
Absolute Acceleration (including gravity)
X-axis: 0 m/s²
Y-axis: 0 m/s²
Z-axis: 0 m/s²
Gyroscope (rotation rate)
X-axis: 0 °/s
Y-axis: 0 °/s
Z-axis: 0 °/s
Calculated Values
Percentages ( + – 100 )
x: 0   
y: 0   
z: 0   
Angle Degrees ( 0 to 360 )
x: 0   
y: 0   
z: 0   
Height: 0 %  
Width: 0 %
Red: 0   
Green: 0   
Blue: 0   
Objects with applied Values
test picture
test picture
test picture
test picture
test picture
test picture
test picture
test picture
test picture
test picture
test picture
test picture
test picture
test picture
test picture
test picture
test picture
test picture
test picture
test picture
Dropdown_01
Dropdown_02
Intersection Observer
Offset of the application of changes :
test picture
Normal Image
No preload, dynamic adaption to screen size.
test picture
Lazy Loading Image
Offset : 3000 px under the browser window
test picture
Further design samples of user interfaces can be found on the website of the design agency Designomat.
www.DESIGNOMAT.tv