ivanji / user-adaptive-interfaces Goto Github PK

Creating user adaptive interfaces workshop - Google IO.

In this workshop we learned to use CSS to respect already pre-defined user preferences when rendering web pages.

In this workshop several new CSS properties were used that make for more concise stylesheets. Focused initially on adaptive interactions (allowing for Gamepad + KB, mouse and touch, plus screen readers); layout (using CSS grid and logical properties for internationally adaptive layouts); color (using HSL, adapt to dark/light preferences and accessibility) and subtle animations (adapting to the user's motion preferences).

Specific properties or tricks have been commented for future reference.

Vite is the tool used in this project. Have node.js (v12 or newer) installed and run the following commands:

yarn
yarn start