Update app.py

app.py

@@ -1,4 +1,6 @@
 import gradio as gr
+import matplotlib.pyplot as plt
+import numpy as np
 
 # Define the 44 BFI questions
 questions = [
@@ -128,36 +130,101 @@ def compute_bfi_scores(*args):
             score = round(score, 2)
             scores[trait] = score
 
-    # Prepare the output in Markdown format
+    # Prepare the output in Markdown format with explanations
+    explanations = {
+        'Extraversion': "Extraversion reflects how outgoing and energetic you are. High scores indicate sociability and enthusiasm, while low scores suggest a more reserved and solitary nature.",
+        'Agreeableness': "Agreeableness measures your tendency to be compassionate and cooperative. High scores signify kindness and trust, whereas low scores may indicate competitiveness or skepticism.",
+        'Conscientiousness': "Conscientiousness assesses your level of self-discipline and organization. High scores denote reliability and thoroughness, while low scores might reflect a more spontaneous or disorganized approach.",
+        'Neuroticism': "Neuroticism indicates emotional stability and susceptibility to stress. High scores suggest a tendency towards anxiety and moodiness, whereas low scores imply calmness and resilience.",
+        'Openness': "Openness measures your openness to new experiences and creativity. High scores are associated with imagination and curiosity, while low scores may indicate practicality and preference for routine."
+    }
+
     output = "## Your Big Five Personality Traits Scores\n\n"
+
+    # Prepare data for visualization
+    trait_names = []
+    trait_scores = []
     for trait, score in scores.items():
-        output += f"**{trait}**: {score}\n\n"
+        output += f"### **{trait}**\n"
+        if score == "Incomplete":
+            output += "Insufficient responses to compute this trait.\n\n"
+        else:
+            output += f"**Score**: {score}\n\n"
+            output += f"{explanations[trait]}\n\n"
+            trait_names.append(trait)
+            trait_scores.append(score)
+    
+    # Generate bar chart
+    if trait_scores:
+        fig, ax = plt.subplots(figsize=(8, 4))
+        bars = ax.bar(trait_names, trait_scores, color='skyblue')
+        ax.set_ylim(0, max(trait_scores) + 10)
+        ax.set_ylabel('Score')
+        ax.set_title('Big Five Traits Scores')
+
+        # Add score labels on top of bars
+        for bar in bars:
+            height = bar.get_height()
+            ax.annotate(f'{height}',
+                        xy=(bar.get_x() + bar.get_width() / 2, height),
+                        xytext=(0, 3),  # 3 points vertical offset
+                        textcoords="offset points",
+                        ha='center', va='bottom')
+        
+        plt.tight_layout()
+        # Save the plot to a PNG image in memory
+        from io import BytesIO
+        buf = BytesIO()
+        plt.savefig(buf, format='png')
+        buf.seek(0)
+        plt.close(fig)
+        output += "### **Trait Scores Visualization**\n\n"
+        output += f"![Trait Scores]({gr.Image.update(value=buf.getvalue())})\n\n"
 
     return output
 
 # Create the Gradio interface
 def create_interface():
     with gr.Blocks() as demo:
-        gr.Markdown("## Big Five Inventory (BFI) Quiz")
-        gr.Markdown("Please rate the following statements on a scale from **1 (Disagree a lot)** to **5 (Agree a lot)**. If you prefer not to respond to a particular statement, select **'No response'**.")
-
-        # Create a grid layout for better organization
-        with gr.Column():
-            dropdowns = []
-            for q in questions:
-                dropdown = gr.Dropdown(
-                    choices=["No response", 1, 2, 3, 4, 5],
-                    label=q,
-                    value="No response"
-                )
-                dropdowns.append(dropdown)
-        
+        gr.Markdown("# Big Five Inventory (BFI) Quiz")
+        gr.Markdown(
+            """
+            Please rate the following statements on a scale from **1 (Disagree a lot)** to **5 (Agree a lot)**.
+            If you prefer not to respond to a particular statement, select **'No response'**.
+            """
+        )
+
+        # Organize questions into expandable sections by trait
+        trait_question_map = {
+            'Extraversion': [1, 6, 11, 16, 21, 26, 31, 36],
+            'Agreeableness': [2, 7, 12, 17, 22, 27, 32, 37, 42],
+            'Conscientiousness': [3, 8, 13, 18, 23, 28, 33, 38, 43],
+            'Neuroticism': [4, 9, 14, 19, 24, 29, 34, 39],
+            'Openness': [5, 10, 15, 20, 25, 30, 35, 40, 41, 44]
+        }
+
+        dropdowns = []
+
+        with gr.Accordion("Answer the Questions", open=True):
+            for trait, q_indices in trait_question_map.items():
+                with gr.Group():
+                    with gr.Accordion(trait, open=False):
+                        for i in q_indices:
+                            q = questions[i-1]
+                            radio = gr.Radio(
+                                choices=["No response", 1, 2, 3, 4, 5],
+                                label=q,
+                                value="No response",
+                                interactive=True
+                            )
+                            dropdowns.append(radio)
+
         # Submit button
-        submit_btn = gr.Button("Submit")
-        
+        submit_btn = gr.Button("Submit", variant="primary")
+
         # Results display
         result = gr.Markdown()
-        
+
         # Link the button to the function
         submit_btn.click(fn=compute_bfi_scores, inputs=dropdowns, outputs=result)