Hugging Face's logo

Spaces:
PeacePixies
/
MotiMeter
Sleeping

App Files Community
MotiMeter
File size: 5,176 Bytes 
13fcba8
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
 
import streamlit as st
from streamlit_lottie import st_lottie
import requests
import json

def load_lottie_url(url: str):
    """Load Lottie animation from URL"""
    try:
        r = requests.get(url)
        if r.status_code != 200:
            return None
        return r.json()
    except:
        return None

def show_welcome():
    # Page configuration
    st.set_page_config(
        page_title="MI Companion",
        page_icon="🤝",
        layout="wide"
    )

    # Custom CSS for styling
    st.markdown("""
        <style>
        .main {
            padding: 2rem;
        }
        .welcome-header {
            text-align: center;
            color: #1E88E5;
            font-size: 3.2rem;
            font-weight: 700;
            margin-bottom: 1.5rem;
            padding-top: 2rem;
        }
        .welcome-subheader {
            text-align: center;
            color: #424242;
            font-size: 1.5rem;
            font-weight: 400;
            margin-bottom: 2rem;
        }
        .feature-card {
            background-color: #f8f9fa;
            border-radius: 10px;
            padding: 1.5rem;
            margin: 1rem;
            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
        }
        .feature-icon {
            font-size: 2rem;
            margin-bottom: 1rem;
            color: #1E88E5;
        }
        </style>
    """, unsafe_allow_html=True)

    # Main content container
    container = st.container()
    
    with container:
        # Header Section
        st.markdown('<h1 class="welcome-header">Welcome to MI Companion</h1>', unsafe_allow_html=True)
        st.markdown(
            '<p class="welcome-subheader">Your Intelligent Partner in Motivational Interviewing</p>', 
            unsafe_allow_html=True
        )

        # Lottie Animation
        lottie_url = "https://assets5.lottiefiles.com/packages/lf20_5tl1xxnz.json"  # Counseling/therapy themed animation
        lottie_json = load_lottie_url(lottie_url)
        if lottie_json:
            st_lottie(lottie_json, height=300, key="welcome")

        # Introduction
        st.markdown("""
            <div style="text-align: center; max-width: 800px; margin: 2rem auto; padding: 2rem;">
                <p style="font-size: 1.2rem; line-height: 1.6; color: #424242;">
                    Embark on a transformative journey with MI Companion, your dedicated partner in mastering 
                    Motivational Interviewing. Whether you're a seasoned professional or just starting out, 
                    our AI-powered platform provides real-time support, detailed session analysis, and 
                    personalized feedback to enhance your MI practice.
                </p>
            </div>
        """, unsafe_allow_html=True)

        # Features Section
        st.markdown("<h2 style='text-align: center; margin-top: 2rem;'>Key Features</h2>", unsafe_allow_html=True)
        
        col1, col2, col3 = st.columns(3)
        
        with col1:
            st.markdown("""
                <div class="feature-card">
                    <div class="feature-icon">🎯</div>
                    <h3>Real-time Analysis</h3>
                    <p>Get instant feedback on your MI sessions with our advanced AI analysis tools.</p>
                </div>
            """, unsafe_allow_html=True)

        with col2:
            st.markdown("""
                <div class="feature-card">
                    <div class="feature-icon">📊</div>
                    <h3>Comprehensive Insights</h3>
                    <p>Track your progress and gain detailed insights into your MI practice development.</p>
                </div>
            """, unsafe_allow_html=True)

        with col3:
            st.markdown("""
                <div class="feature-card">
                    <div class="feature-icon">🤝</div>
                    <h3>Interactive Support</h3>
                    <p>Practice MI skills with our AI companion and receive personalized guidance.</p>
                </div>
            """, unsafe_allow_html=True)

        # Call to Action
        st.markdown("""
            <div style="text-align: center; margin-top: 3rem;">
                <h3 style="color: #1E88E5;">Ready to Enhance Your MI Practice?</h3>
                <p style="font-size: 1.1rem; margin: 1rem 0;">
                    Choose from our features above to begin your journey towards MI excellence.
                </p>
            </div>
        """, unsafe_allow_html=True)

        # Quick Start Guide
        with st.expander("📚 Quick Start Guide"):
            st.markdown("""
                ### Getting Started with MI Companion
                1. **Session Analysis**: Upload your session recordings or transcripts
                2. **Practice Chat**: Engage with our AI companion to practice MI techniques
                3. **Progress Tracking**: Monitor your development over time
                4. **Resource Library**: Access MI learning materials and best practices
                
                Need help? Click the '?' icon in the top right corner for support.
            """)

if __name__ == "__main__":
    show_welcome()