An Interesting Hackathon Experience Doing the below project 🙂
TABLELess Graphical User Interfaces(Hello D3.js)
Use Modern Browsers’ capabilities to provide richer more data driven User Interfaces to the users. (Get away from Tables and Divs !)
Banking Use Case
– Menus – Animated – no Divs
– Menus – Dynamic and Data Driven
– Deposits and Withdrawals – Tree View
– Deposits and Withdrawals – Color Coded based on Data – no Tables
– Balance – Color Coded based on Data
– All Transaction Data – Dynamic Content and Auto Adjusting Graphics
Future steps
– Explore Animation and layouts of D3.js
– Transform day to day transactional UIs to rich graphical and data driven UIs
## Use Modern Browsers’ capabilities to provide richer more data driven User Interfaces to the users. (Get away from Tables and Divs !
## Explore and use the capabilities of JavaScript Library D3.js (Data-Driven Document) http://d3js.org/. See how graphics can be used in regular transaction based applications as well for more enriched user experience and also for better end user data processing
## Newbie in D3.Js . Had to learn and use the technology simultaneously. Animating trees involves steep learning, had to skip that part
## A complete user story of End User Viewing his/her banking transactions in a graphical UI could be completed. Learnt the basics of D3.js
## D3.js library usage. Capabilities of modern browsers to render interesting and useful graphics. Web and browser technologies are not yet fully utilized in the current web applications – lot of scope here.
## What’s next for TABLELess Graphical Web – Learn Animation and use it effectively for end user experience and data processing. Make web UIs graphically intensive and useful
Video -> https://vimeo.com/133877012