Student Social Behavior Patterns
An Interactive Research Demonstration
Research Question:
How do students' social interaction patterns correlate with academic performance and wellbeing indicators?
Methodology:
- 127 participants (UR students, ages 18-22)
- 8-week longitudinal study
- Self-reported data via mobile app
Key Finding:
Significant positive correlation (r=0.75, p<0.01) between weekly social interactions and wellbeing scores
Traditional Presentation Format
Key Finding: We found a significant positive correlation (r=0.67, p<0.01) between weekly social interactions and self-reported wellbeing scores across 127 participants.
Demographics:
- 56% female, 44% male
- Mean age: 19.8 years (SD=1.2)
- Class distribution: 31% first-year, 28% sophomore, 24% junior, 17% senior
Results Table:
| Metric | Mean | SD | Range |
|---|---|---|---|
| Social interactions/week | 13.3 | 4.2 | 3-24 |
| Wellbeing score (1-10) | 5.9 | 1.9 | 2-10 |
| Academic performance (GPA) | 3.7 | 0.6 | 2.1-4.0 |
Figure 1. Mean wellbeing scores by class year (N=127)
Conclusion: Higher social interaction frequency correlates with improved wellbeing scores and marginally higher academic performance.
👆 This is how research is typically presented. Static, linear, non-explorable.
👇 Below is the same data, but interactive. This is what we're teaching you to build.
Interactive Exploration
Filter Controls
Class Year
Gender
GPA Range
2.0 - 4.0
Age Range
18 - 22 years
Social Interactions vs. Wellbeing Score
Sample Participant Profile
Click any data point to see full profile
Select a participant from the chart or table to view their profile
Current Selection
Participants: 127 (100%)
Correlation: r=0.75 (strong)
P-value: p<0.01 (significant)
Mean Values
Social interactions: 13.3/week
Wellbeing score: 5.9/10
GPA: 3.7/4.0
Quartile Analysis
Top 25% social: Wellbeing 8.0/10
Bottom 25% social: Wellbeing 4.1/10
Difference: +95% wellbeing
About This Interactive Format
This entire page is ~200 lines of HTML, CSS, and JavaScript.
You could build something like this in 30-60 minutes by:
- Describing what you want to an AI assistant (Claude or ChatGPT)
- Refining through conversation
- Deploying to a free hosting service
The data is fake, but the format is real. This is what's now possible for presenting research, analysis, or any findings where interactivity adds value.
Key Libraries Used:
- Chart.js (data visualization)
- Vanilla JavaScript (interactivity)
- Tailwind CSS (styling)
Total external dependencies: ~50KB
Total load time: <1 second
Cost to host: $0 (GitHub Pages)