added instructions

views/intro_screen.py

@@ -23,7 +23,7 @@ def welcome_screen():
         st.markdown("""<style> .st-emotion-cache-1jicfl2 {width: 50%;} </style>""", unsafe_allow_html=True)
         st.title("Welcome to the Feedback Survey")
 
-        username_input = st.text_input("Enter your first name and press TAB:")
+        username_input = st.text_input("Enter your first name and press TAB. Usernames are case-sensitive.")
         validation_code_input = st.text_input("Enter the validation code to proceed and press ENTER:")
 
         next_button = st.button("Next")

views/questions_screen.py

@@ -223,7 +223,37 @@ def questions_screen(data):
         st.progress(progress)
         st.write(f"Question {current_index + 1} of {len(data)}")
         # st.subheader(f"Config ID: {config['config_id']}")
-
+        st.markdown("### Instructions")
+        with st.expander("Instructions", expanded=False):
+            st.markdown(
+                """
+              
+                """
+            )
+            st.html('''<p style='font-size:large;'>You will be <mark>given a user profile and a travel-related query</mark>. Your task is to <mark>evaluate the generated queries (numbered 1-6)</mark> based on the following criteria:</p> 
+            <p><strong><mark>Relevance</mark>:</strong> Evaluate how well the query aligns with the given cities, filters, and displayed context. Consider whether the query description matches the cities and context provided.
+            <br> Select one of the following options:
+            <ol style="padding-left:2rem;">  
+                <li><b>Not Relevant</b> - The query has no connection to the cities, filters, or displayed context.</li>  
+                <li><b>Somewhat Relevant</b> - The query is partially related but does not fully match the cities or context.</li>  
+                <li><b>Relevant</b> - The query clearly aligns with the cities, filters, and displayed context.</li>  
+                <li><b>Unclear</b> - The relevance of the query is difficult to determine based on the given information.</li>  
+            </ol>
+            </p>
+            <p><strong><mark>Clarity Assessment</mark>:</strong> Evaluate how clear and understandable the query is. Consider whether it is grammatically correct and easy to interpret.
+            <br>Your options are:  
+            <ol style="padding-left:2rem;">  
+                <li><b>Not Clear</b> - The query is difficult to understand or contains significant grammatical errors.</li>  
+                <li><b>Somewhat Clear</b> - The query is understandable but may have minor grammatical issues or slight ambiguity.</li>  
+                <li><b>Very Clear</b> - The query is well-formed, grammatically correct, and easy to understand.</li>  
+            </ol>
+            </p> 
+            <p> 
+            <strong><mark>Persona Alignment</mark>:</strong> How likely is the query to match the persona and reflect a question they would 
+            ask about travel? <br>Your options are: <ol style='padding-left:2rem;'> <li><b>Not Aligned</b> - The user 
+            is not likely at all to ask this query.</li> <li><b>Partially Aligned</b> - The user is quite likely to 
+            ask this query.</li> <li><b>Aligned</b> - The user is very likely to ask this query. </li> 
+            <li><b>Unclear</b> - It is unclear whether the user will ask this query.</li> </ol> </p>''')
         # Context information
         st.markdown("### Context Information")
         with st.expander("Persona", expanded=True):