Tabular-LLM-Study-Forward-Simulation

Sleeping

App Files Files Community

luulinh90s commited on Sep 15

Commit

19201aa

•

1 Parent(s): 0c987e6

update

Browse files

Files changed (3) hide show

templates/attribution.html +6 -9
templates/index.html +5 -5
templates/introduction.html +2 -2

templates/attribution.html CHANGED Viewed

@@ -79,11 +79,11 @@
     <div class="container">
         <h1>Understanding Attribution Explanations</h1>
         <p>
-            Attribution explanations highlight specific parts of a table—such as rows, columns, or cells—that are most relevant to the answer provided by a TableQA system. These explanations help you understand which data points the system considered important when generating the answer.
         </p>
         <h2>Example: 1947 Kentucky Wildcats Football Team</h2>
         <p>
-            Statement to verify: "The Wildcats kept the opposing team scoreless in four games."
         </p>
         <table>
             <tr>
@@ -142,25 +142,22 @@
             </tr>
         </table>
         <p>
-            In this example, the TableQA system has highlighted specific rows and cells to explain its reasoning:
         </p>
         <ul style="text-align: left;">
             <li>The entire rows for games 2, 4, 5, and 9 are highlighted in yellow.</li>
-            <li>Within these rows, the "Opponents" column cells containing "0" are highlighted in green.</li>
         </ul>
         <p>
-            These highlights indicate that the system identified four games where the opposing team did not score, verifying the statement as true. The yellow highlighting shows the relevant rows, while the green highlighting represents the cells containing fine-grained information needed to verify the statement.
         </p>
         <p>
             By using different colors for highlighting, the system provides a more nuanced explanation:
         </p>
         <ul style="text-align: left;">
             <li>Yellow highlights (rows): Show the overall context of the relevant games.</li>
-            <li>Green highlights (cells): Pinpoint the exact data points (opposing team's score of 0) that directly answer the question.</li>
         </ul>
-        <p>
-            This multi-level highlighting helps users quickly grasp both the broad context and the specific details that support the system's answer.
-        </p>
         <p>
             During the experiment, you will use explanations to simulate model prediction. Your task will be to look at the provided explanations and simulate the model prediction on the Statement (TRUE or FALSE).
         </p>

     <div class="container">
         <h1>Understanding Attribution Explanations</h1>
         <p>
+            Attribution explanations highlight specific parts of a table—such as rows, columns, or cells—that are most relevant to the answer predicted by a TableQA model. These explanations help you understand which information of the input the system considered important when predicting the answer.
         </p>
         <h2>Example: 1947 Kentucky Wildcats Football Team</h2>
         <p>
+            Statement to verify: "The Wildcats kept the opposing team scoreless in 4 games."
         </p>
         <table>
             <tr>
             </tr>
         </table>
         <p>
+            In this example, the TableQA model has highlighted specific rows and cells to explain its prediction:
         </p>
         <ul style="text-align: left;">
             <li>The entire rows for games 2, 4, 5, and 9 are highlighted in yellow.</li>
+            <li>Within these rows, the "Opponents" column cells containing "0" or "scoreless" are highlighted in green.</li>
         </ul>
         <p>
+            These highlights indicate that the system identified four games where the opposing team did not score, verifying the statement as TRUE. The yellow highlighting shows the relevant rows, while the green highlighting represents the cells containing fine-grained information needed to verify the statement.
         </p>
         <p>
             By using different colors for highlighting, the system provides a more nuanced explanation:
         </p>
         <ul style="text-align: left;">
             <li>Yellow highlights (rows): Show the overall context of the relevant games.</li>
+            <li>Green highlights (cells): Pinpoint the exact information (opposing team's score of 0) that directly answer the question.</li>
         </ul>
         <p>
             During the experiment, you will use explanations to simulate model prediction. Your task will be to look at the provided explanations and simulate the model prediction on the Statement (TRUE or FALSE).
         </p>

templates/index.html CHANGED Viewed

@@ -133,10 +133,10 @@
 </head>
 <body>
     <div class="container">
-        <h1>Trustworthy LLMs for Table QA</h1>
-        <div class="instruction">
-            Let's get started! Please input your name, enter a random number as your seed, and select one of the explanation methods for your experiment.
-        </div>
         <form id="method-form" action="{{ url_for('index') }}" method="post" onsubmit="return validateForm();">
             <label for="username">Hi there 👋👋👋 ! What is your name?</label>
             <input type="text" id="username" name="username" required>
@@ -160,7 +160,7 @@
                 </div>
             </div>
-            <button type="submit">Start Experiment</button>
         </form>
     </div>
 </body>

 </head>
 <body>
     <div class="container">
+        <h1>Let's get started! Please input your name, a random number, and select one of the 4 explanation methods for your experiment.</h1>
+<!--        <div class="instruction">-->
+<!--            Let's get started! Please input your name, enter a random number as your seed, and select one of the explanation methods for your experiment.-->
+<!--        </div>-->
         <form id="method-form" action="{{ url_for('index') }}" method="post" onsubmit="return validateForm();">
             <label for="username">Hi there 👋👋👋 ! What is your name?</label>
             <input type="text" id="username" name="username" required>
                 </div>
             </div>
+            <button type="submit">Start</button>
         </form>
     </div>
 </body>

templates/introduction.html CHANGED Viewed

@@ -194,14 +194,14 @@
             </tr>
             </table>
             </body></html>
-            <h3>Model says this Statement is:</span> TRUE</h3>
             </body></html>
             "></iframe>
         </div>
         <div class="outro">
             <h2>Your Task</h2>
-            <p>Your task in this experiment is to evaluate different methods that explain how a TableQA model predicts an answer (for example, TRUE). You will be given the explanation and simulate what the TableQA model will predict.</p>
         </div>
         <div class="button-container">

             </tr>
             </table>
             </body></html>
+            <h3>Model thinks this Statement is:</span> TRUE</h3>
             </body></html>
             "></iframe>
         </div>
         <div class="outro">
             <h2>Your Task</h2>
+            <p>Your task in this experiment is to evaluate methods that explain how a TableQA works. You will be given an explanation and asked to simulate what the TableQA model will predict (The model will verify as TRUE or FALSE).</p>
         </div>
         <div class="button-container">