Update src/streamlit_app.py

src/streamlit_app.py

@@ -1,49 +1,169 @@
 import streamlit as st
 import joblib
 import numpy as np
+import plotly.graph_objects as go
 
-# Load the trained model and scaler
-# Use @st.cache_resource to load them only once for performance
+# 1. Page Configuration (Must be the first command)
+st.set_page_config(
+    page_title="Purchase Intention AI",
+    page_icon="🛍️",
+    layout="wide",
+    initial_sidebar_state="expanded"
+)
+
+# Custom CSS for styling
+st.markdown("""
+    <style>
+    .stButton>button {
+        width: 100%;
+        background-color: #FF4B4B;
+        color: white;
+        font-weight: bold;
+        padding: 0.5rem;
+        border-radius: 10px;
+    }
+    .main-header {
+        font-size: 2.5rem;
+        font-weight: 700;
+        color: #333;
+        text-align: center;
+        margin-bottom: 2rem;
+    }
+    .sub-text {
+        text-align: center;
+        color: #666;
+        font-size: 1.1rem;
+    }
+    </style>
+    """, unsafe_allow_html=True)
+
+# 2. Load Model
 @st.cache_resource
 def load_model():
-    model = joblib.load('src/svm_model.pkl')
-    scaler = joblib.load('src/scaler.pkl')
-    return model, scaler
-
-try:
-    model, scaler = load_model()
-except FileNotFoundError:
-    st.error("Model files not found. Please run train_model.py first.")
+    # Handles both the pipeline (smart) version and separate files version
+    try:
+        # Try loading the smart pipeline first
+        model = joblib.load('src/svm_model.pkl')
+        return model, None # No separate scaler needed
+    except:
+        try:
+            # Fallback to separate files
+            model = joblib.load('src/svm_model.pkl')
+            scaler = joblib.load('src/scaler.pkl')
+            return model, scaler
+        except FileNotFoundError:
+            return None, None
+
+model, scaler = load_model()
+
+if model is None:
+    st.error("🚨 Model files not found! Please run `train_model.py` first.")
     st.stop()
 
-st.title("Purchase Intention Predictor")
-st.write("Adjust the sliders below to predict the user's Purchase Intention (PI).")
+# 3. Header Section
+st.markdown('<div class="main-header">🛍️ Purchase Intention Predictor</div>', unsafe_allow_html=True)
+st.markdown('<p class="sub-text">Adjust the psychometric drivers in the sidebar to predict user behavior.</p>', unsafe_allow_html=True)
+st.markdown("---")
+
+# 4. Sidebar - User Inputs
+st.sidebar.header("🧠 Psychometric Profiling")
+st.sidebar.markdown("Adjust the behavioral scores (1-7 scale):")
+
+def create_slider(label, key, help_text):
+    return st.sidebar.slider(
+        label, 
+        min_value=1.0, 
+        max_value=7.0, 
+        value=4.5, 
+        step=0.1,
+        help=help_text
+    )
+
+att = create_slider("Attitude (ATT)", "att", "The user's positive or negative feelings toward the behavior.")
+sns = create_slider("Subjective Norms (SNs)", "sns", "Social pressure or influence from others to perform the behavior.")
+pbc = create_slider("Perceived Control (PBC)", "pbc", "The user's perception of the ease or difficulty of performing the behavior.")
+eo  = create_slider("Env. Outcome (EO)", "eo", "Expected environmental benefits resulting from the behavior.")
+ec  = create_slider("Env. Concern (EC)", "ec", "General concern for environmental issues.")
 
-# Sidebar for inputs
-st.sidebar.header("User Inputs")
+# 5. Main Content Area
+col1, col2 = st.columns([1, 1.5])
 
-# Create sliders for each feature based on the data's 1-7 scale
-att = st.sidebar.slider("Attitude (ATT)", min_value=1.0, max_value=7.0, value=4.0, step=0.1)
-sns = st.sidebar.slider("Subjective Norms (SNs)", min_value=1.0, max_value=7.0, value=4.0, step=0.1)
-pbc = st.sidebar.slider("Perceived Behavioral Control (PBC)", min_value=1.0, max_value=7.0, value=4.0, step=0.1)
-eo = st.sidebar.slider("Environmental Outcome (EO)", min_value=1.0, max_value=7.0, value=4.0, step=0.1)
-ec = st.sidebar.slider("Environmental Concern (EC)", min_value=1.0, max_value=7.0, value=4.0, step=0.1)
+# Prepare Input
+input_values = np.array([[att, sns, pbc, eo, ec]])
 
-# Prepare input data
-input_data = np.array([[att, sns, pbc, eo, ec]])
+# Handle Scaling
+if scaler:
+    final_input = scaler.transform(input_values)
+else:
+    final_input = input_values # Pipeline handles scaling internally
 
-# Scale the input
-input_scaled = scaler.transform(input_data)
+# Real-time Prediction (or on button click)
+prediction = model.predict(final_input)[0]
+# Clip prediction to 1-7 range for visuals
+prediction = max(1.0, min(7.0, prediction))
 
-# Predict
-if st.button("Predict Purchase Intention"):
-    prediction = model.predict(input_scaled)
-    st.subheader(f"Predicted Purchase Intention Score: {prediction[0]:.2f}")
+with col1:
+    st.subheader("📊 Prediction Result")
     
-    # Optional: Interpretation
-    if prediction[0] > 5.5:
-        st.success("High Purchase Intention")
-    elif prediction[0] < 3.5:
-        st.warning("Low Purchase Intention")
+    # Gauge Chart for PI
+    fig_gauge = go.Figure(go.Indicator(
+        mode = "gauge+number",
+        value = prediction,
+        domain = {'x': [0, 1], 'y': [0, 1]},
+        title = {'text': "Purchase Intention (PI)"},
+        gauge = {
+            'axis': {'range': [1, 7]},
+            'bar': {'color': "#FF4B4B"},
+            'steps': [
+                {'range': [1, 3.5], 'color': "#f8f9fa"},
+                {'range': [3.5, 5.5], 'color': "#e9ecef"},
+                {'range': [5.5, 7], 'color': "#dee2e6"}
+            ],
+            'threshold': {
+                'line': {'color': "red", 'width': 4},
+                'thickness': 0.75,
+                'value': prediction
+            }
+        }
+    ))
+    fig_gauge.update_layout(height=350, margin=dict(l=20,r=20,t=50,b=20))
+    st.plotly_chart(fig_gauge, use_container_width=True)
+
+    # Text Interpretation
+    if prediction >= 5.5:
+        st.success("**High Probability**: User is very likely to purchase.")
+    elif prediction >= 3.5:
+        st.info("**Moderate Probability**: User is undecided.")
     else:
-        st.info("Moderate Purchase Intention")
+        st.warning("**Low Probability**: User is unlikely to purchase.")
+
+with col2:
+    st.subheader("🕸️ User Profile Analysis")
+    
+    # Radar Chart for Inputs
+    categories = ['Attitude', 'Social Norms', 'Control', 'Outcome', 'Concern']
+    r_values = [att, sns, pbc, eo, ec]
+    
+    fig_radar = go.Figure()
+    fig_radar.add_trace(go.Scatterpolar(
+        r=r_values,
+        theta=categories,
+        fill='toself',
+        name='User Profile',
+        line_color='#00CC96'
+    ))
+    
+    fig_radar.update_layout(
+        polar=dict(
+            radialaxis=dict(
+                visible=True,
+                range=[0, 7]
+            )),
+        showlegend=False,
+        height=350,
+        margin=dict(l=40,r=40,t=20,b=20)
+    )
+    st.plotly_chart(fig_radar, use_container_width=True)
+
+st.markdown("---")
+st.markdown("###### *Model: Support Vector Machine (RBF Kernel) | Data Scale: 1 (Strongly Disagree) - 7 (Strongly Agree)*")