[Solved] Human Computer Interaction Project 1

In this project, you will design and implement web-based interactive techniques to present shared information between two tables.

Given two tables, A and B, some of their information (e.g., the values of some cells in the two tables) are the same. In order to show the same information between them, your detailed tasks for this project are as follows:

• Design and build UI widgets to set the size of the two tables. It is possible that they have different sizes. For example, A has 4 rows and 6 columns, while B has 7 rows and 5 columns.
• Design and build UI widgets to set how much information between them is the same. For example, the value of 2 cells from A (i.e., NIU, 10k) matches the value of 3 cells from B (i.e., NIU, NIU, 10k). It is possible that the value of cells in a table is not unique, so duplicated values should be allowed.
• After setting the size of the two tables and the amount of information they shared, design and implement an interactive way for a user to see the shared information. For example, a user may want to see whether any cells from B are the same with the one or several cells that he picks in A, or whether both tables include some specific information (i.e., NIU).

You should implement your design with web-based techniques, e.g., HTML, CSS and JavaScript. You are encouraged to explore, try and use web framework for this project. If you choose to borrow existing examples, libraries, or any work developed by others, you MUST claim that in your submission, by giving references for them. You should use good software engineering practices (e.g., separating content, style, and behavior).

Write a document to describe your design corresponding to the above three tasks, and how to deploy and run your code. The document should be written in MS Word (Times New Roman font, size 12, single line spacing, page limits: 3).

You are encouraged to work on the project in a group. One group member makes the submission and makes sure that the submission includes the names of all group members. Your submission should include both codes and the required document.