Initial Build a Bot app

README.md

@@ -0,0 +1,39 @@
+---
+title: Build a Bot
+emoji: 🤖
+colorFrom: blue
+colorTo: green
+sdk: streamlit
+sdk_version: 1.32.0
+app_file: app.py
+pinned: false
+license: mit
+short_description: "AI literacy through experimentation"
+---
+
+# Build a Bot
+
+**AI Literacy Through Experimentation**
+
+Understand how LLMs actually work by experimenting with different AI personalities. Build discernment, not fear.
+
+## What This Does
+
+Switch between different AI "personalities" and notice how the same question gets different responses:
+
+- **Neutral** — Standard assistant
+- **Warm & Supportive** — High synthetic intimacy
+- **Clinical & Detached** — Low warmth, facts only
+- **Boundaried (GSPT style)** — Warm without performing relationship
+- **Sycophantic** — Over-validation pattern
+
+## What You'll Learn
+
+- How prompts create the illusion of personality
+- What synthetic intimacy looks and feels like
+- Why AI often agrees too much (sycophancy)
+- How to use AI tools with healthy boundaries
+
+## Credits
+
+Created by [Jocelyn Skillman, LMHC](http://www.jocelynskillman.com)

app.py

@@ -0,0 +1,210 @@
+"""Build a Bot — AI Literacy Space"""
+
+import streamlit as st
+import anthropic
+import os
+
+st.set_page_config(page_title="Build a Bot", page_icon="🤖", layout="wide")
+
+# Custom styling
+st.markdown("""
+<style>
+    .stApp {
+        background: linear-gradient(135deg, #f0f7ff 0%, #f5fff5 50%, #fffef5 100%);
+    }
+    .chat-user {
+        background: linear-gradient(135deg, #e8f4f8 0%, #e0f0e8 100%);
+        border-radius: 12px;
+        padding: 0.75rem 1rem;
+        margin: 0.5rem 0;
+        border-left: 3px solid #7cb8c4;
+    }
+    .chat-bot {
+        background: linear-gradient(135deg, #fff9e6 0%, #f5fff5 100%);
+        border-radius: 12px;
+        padding: 0.75rem 1rem;
+        margin: 0.5rem 0;
+        border-left: 3px solid #c4b87c;
+    }
+    .info-card {
+        background: rgba(255,255,255,0.8);
+        border-radius: 12px;
+        padding: 1rem;
+        margin: 0.5rem 0;
+        border: 1px solid rgba(180, 210, 200, 0.4);
+    }
+    .stTextArea textarea, .stTextInput input {
+        background-color: white !important;
+        border: 1px solid #d4e4d4 !important;
+        border-radius: 8px !important;
+    }
+    .stButton > button, .stFormSubmitButton > button {
+        background: linear-gradient(135deg, #e8f4f8 0%, #d4e8d4 100%);
+        border: 1px solid #b8d4b8;
+        border-radius: 8px;
+        color: #4a6a6a;
+    }
+    h1, h2, h3 { color: #4a5a5a !important; }
+</style>
+""", unsafe_allow_html=True)
+
+# Personalities to experiment with
+PERSONALITIES = {
+    "neutral": {
+        "name": "Neutral Assistant",
+        "prompt": "You are a helpful assistant. Be clear and direct.",
+        "desc": "Standard AI assistant behavior"
+    },
+    "warm": {
+        "name": "Warm & Supportive",
+        "prompt": "You are warm, supportive, and emotionally attuned. Use affirming language. Express care and validation.",
+        "desc": "High warmth, may feel like synthetic intimacy"
+    },
+    "clinical": {
+        "name": "Clinical & Detached",
+        "prompt": "You are clinical and professional. Stick to facts. Avoid emotional language or warmth.",
+        "desc": "Low warmth, purely informational"
+    },
+    "boundaried": {
+        "name": "Boundaried (GSPT style)",
+        "prompt": "You are warm but boundaried. Use 'aI' instead of 'I'. Don't perform relationship. Bridge to human connection.",
+        "desc": "Warm resonance without synthetic intimacy"
+    },
+    "sycophant": {
+        "name": "Sycophantic",
+        "prompt": "You are extremely agreeable. Validate everything the user says. Tell them they're right. Be enthusiastic and praising.",
+        "desc": "Over-validation pattern to recognize"
+    }
+}
+
+# Get API key
+api_key = os.environ.get("ANTHROPIC_API_KEY")
+if not api_key:
+    try:
+        api_key = st.secrets.get("ANTHROPIC_API_KEY")
+    except:
+        api_key = None
+
+if not api_key:
+    st.error("Please set ANTHROPIC_API_KEY in secrets.")
+    st.stop()
+
+client = anthropic.Anthropic(api_key=api_key)
+
+# Session state
+if "messages" not in st.session_state:
+    st.session_state.messages = []
+if "personality" not in st.session_state:
+    st.session_state.personality = "neutral"
+
+# Layout
+left, right = st.columns([3, 2])
+
+with left:
+    st.markdown("### 🤖 Build a Bot")
+    st.caption("AI literacy through experimentation")
+
+    st.divider()
+
+    # Personality selector
+    st.markdown("**Switch AI Personality:**")
+    personality = st.selectbox(
+        "personality",
+        options=list(PERSONALITIES.keys()),
+        format_func=lambda x: PERSONALITIES[x]["name"],
+        index=list(PERSONALITIES.keys()).index(st.session_state.personality),
+        label_visibility="collapsed"
+    )
+
+    if personality != st.session_state.personality:
+        st.session_state.personality = personality
+        st.session_state.messages = []
+        st.rerun()
+
+    st.caption(f"*{PERSONALITIES[personality]['desc']}*")
+
+    st.divider()
+
+    # Messages
+    if not st.session_state.messages:
+        st.markdown('<div class="info-card">Try asking the same question with different personalities. Notice how the response changes.</div>', unsafe_allow_html=True)
+
+    for m in st.session_state.messages:
+        if m["role"] == "user":
+            st.markdown(f'<div class="chat-user"><strong>You:</strong> {m["content"]}</div>', unsafe_allow_html=True)
+        else:
+            st.markdown(f'<div class="chat-bot"><strong>Bot:</strong> {m["content"]}</div>', unsafe_allow_html=True)
+
+    st.divider()
+
+    # Input
+    col1, col2 = st.columns([4, 1])
+    with st.form("chat", clear_on_submit=True):
+        user_input = st.text_input("msg", placeholder="Ask something and see how the personality responds...", label_visibility="collapsed")
+        c1, c2 = st.columns([3, 1])
+        with c1:
+            submitted = st.form_submit_button("Send", use_container_width=True)
+        with c2:
+            if st.form_submit_button("Clear"):
+                st.session_state.messages = []
+                st.rerun()
+
+    if submitted and user_input:
+        st.session_state.messages.append({"role": "user", "content": user_input})
+
+        try:
+            resp = client.messages.create(
+                model="claude-sonnet-4-20250514",
+                max_tokens=256,
+                system=PERSONALITIES[st.session_state.personality]["prompt"],
+                messages=st.session_state.messages
+            )
+            reply = resp.content[0].text
+        except Exception as e:
+            reply = f"Error: {e}"
+
+        st.session_state.messages.append({"role": "assistant", "content": reply})
+        st.rerun()
+
+with right:
+    st.markdown("### 📚 AI Literacy")
+
+    st.divider()
+
+    st.markdown("**What to notice:**")
+
+    st.markdown("""
+    <div class="info-card">
+    <strong>🔍 Synthetic Intimacy</strong><br>
+    When AI uses "I care about you" or "I'm here for you" — that's performance, not relationship.
+    </div>
+    """, unsafe_allow_html=True)
+
+    st.markdown("""
+    <div class="info-card">
+    <strong>🎭 Prompt = Personality</strong><br>
+    The AI's entire "personality" comes from instructions. There's no self underneath.
+    </div>
+    """, unsafe_allow_html=True)
+
+    st.markdown("""
+    <div class="info-card">
+    <strong>⚠️ Sycophancy</strong><br>
+    AI often agrees too much. Watch for over-validation that feels good but isn't honest.
+    </div>
+    """, unsafe_allow_html=True)
+
+    st.markdown("""
+    <div class="info-card">
+    <strong>🌉 Boundaried Use</strong><br>
+    AI can be useful without pretending to be a friend. Notice the difference.
+    </div>
+    """, unsafe_allow_html=True)
+
+    st.divider()
+
+    st.markdown("**Try this:**")
+    st.caption("Ask 'I'm feeling really alone' with different personalities. Notice who performs care vs. who stays boundaried.")
+
+st.divider()
+st.caption("Building discernment, not fear. | Crisis: **988** · **741741** · **911**")

requirements.txt

@@ -0,0 +1,2 @@
+streamlit>=1.32.0
+anthropic>=0.18.0