A modern teen-focused social chat web application built with Flutter, featuring a Frutiger Aero aesthetic — glassmorphism, vibrant gradients, smooth animations, and a floating navigation bar.
- Check-in — Log your feelings to track your mood on a calendar
- Feed — Browse and interact with posts from peers
- Post — Create and share posts with tags
- Find Friends — Discover and connect with other users
- Profile — Manage your username, personal info, posts, and favorites
- Frutiger Aero UI — Glassmorphism cards, animated transitions, and polished micro-interactions
Make sure you have the following installed before running the app:
| Tool | Version | Download |
|---|---|---|
| Flutter SDK | ^3.x (Dart SDK ^3.11.5) |
flutter.dev/docs/get-started/install |
| Dart SDK | Included with Flutter | — |
| Chrome (for web) | Latest | google.com/chrome |
| Android Studio (for Android emulator) | Latest | developer.android.com/studio |
| Xcode (for iOS, macOS only) | Latest | Mac App Store |
Verify your Flutter setup by running:
flutter doctorAll checkmarks should be green for your target platform.
git clone <https://github.com/Ni-Kyu/TeenChatAppUI.git>
cd flutter_application_1flutter pub getflutter run -d chromeflutter run -d androidflutter run -d windowsflutter devices| Package | Purpose |
|---|---|
connectivity_plus |
Detect online/offline status |
uuid |
Generate unique IDs for posts & comments |
flutter_animate |
Smooth micro-animations |
lib/
├── main.dart # App entry point
├── models/ # Data models
│ ├── post.dart
│ ├── comment.dart
│ ├── user_profile.dart
│ ├── peer_profile.dart
│ └── mood_entry.dart
├── screens/ # Full-page screens
│ ├── home_screen.dart
│ ├── feed_screen.dart
│ ├── post_screen.dart
│ ├── profile_screen.dart
│ └── find_friends_screen.dart
├── state/ # App state management
├── theme/ # Color palette & theme tokens
└── widgets/ # Reusable UI components
flutter testflutter build apk --releaseflutter build web --releaseflutter build windows --release