mak-elena/ui5-awc-variantsDemo

JavaScript

OSCON 2018 - Adaptive Web Components: Context matters!

See also Shake Demo

Adaptive User Interface Demo

Story

I’m usually getting nervous when travelling. I'm worrying about everything and checking the flight plan every few minutes...

How it might be helped? How can I stay relaxed?

What i need is ... just right information to the right moment ... with NO EXTRA CLICKS!

Showcase

The less time is left till the next trip, the more detailed information about the trip is shown. Time is considered as an extended context factor.

Demonstrates how Adaptive components can be applied to adapt UI to the context and to improve User Experience.

Launch Demo

Built with

openUI5 framework (GitHub: https://github.com/SAP/openui5)
Adaptive Web Components Framework
Generic Sensor API

Description

Demonstrates usage of Adaptive Variants within a UI5 app.

Different details of a trip are shown depending on how many days left till the trip:

more than 7 days - brief infomation
1-7 days: more detailed information
Day of the trip: Full information (including gates)

How to install

Clone the repository.
Ensure nodejs and npm are installed (see node.js)
Ensure grunt installed. If not, execute
```
npm install -g grunt-cli
```

install and start the app itself:

npm install
npm install -g grunt-cli
npm start

open in browser: http://localhost:8080