🎨 OurCreativity

Revolution Edition v5.0

Platform Komunitas Kreatif Generasi Berikutnya

Merangkai Imajinasi, Menghidupkan Karya.

Lihat Demo · Laporkan Bug · Ajukan Fitur

---

🌐 English Quick Start

OurCreativity is a creative community platform built with React 19, TypeScript, and Tailwind CSS. It showcases creative works across five divisions: Graphics, Coding, Video, Writing, and Memes.

Quick Setup

git clone https://github.com/ardelyo/ourcreativity.git
cd ourcreativity
npm install
cp .env.example .env  # Add your Supabase credentials
npm run dev

📖 For detailed setup instructions, see docs/SETUP.md (available in Indonesian with key technical details)

---

📋 Daftar Isi

• English Quick Start
• Tentang Proyek
• Fitur Utama
• Tech Stack
• Memulai
• Struktur Proyek
• Dokumentasi
• Kontribusi
• Governance
• Tim Pengembang
• Lisensi

🌟 Tentang Proyek

OurCreativity adalah platform ekosistem digital yang dirancang untuk menjadi wadah utama bagi para kreator dari berbagai disiplin ilmu. Dibangun dengan filosofi "Luminous Design", platform ini menawarkan pengalaman visual yang mendalam, elegan, dan futuristik.

Versi 5.0 (Revolution Edition) menandai transformasi total dari antarmuka pengguna, menghadirkan:

• ✅ Interaksi yang cair dan responsif
• ✅ Performa tinggi dengan optimisasi modern
• ✅ Struktur navigasi berbasis Bento Grid yang intuitif
• ✅ Nuansa atmosferik dan pencahayaan dinamis
• 🆕 Master Update v5.0 — Lihat Detail Perubahan Besar
• 🆕 BrowserRouter dengan URL yang persisten dan shareable
• 🆕 Error Boundary untuk penanganan error yang user-friendly
• 🆕 Fetch Error States dengan retry functionality

✨ Fitur Utama

🎨 Desain Luminous

Antarmuka yang hidup dengan kedalaman visual, efek glassmorphism, dan pencahayaan ambien yang bereaksi terhadap interaksi pengguna.

🧩 Lima Divisi Kreativitas

Divisi	Deskripsi
🖼️ Grafis	Galeri visual untuk seni digital, UI/UX, dan ilustrasi
💻 Coding	Showcase untuk rekayasa perangkat lunak dan eksperimen kode
🎬 Video	Teater sinematik untuk karya gambar bergerak
✍️ Menulis	Ruang editorial untuk literatur dan jurnalisme
😂 Meme	Pusat budaya internet yang dinamis dan penuh humor

📱 Pengalaman Pengguna Premium

• Animasi Fluid — Transisi halaman menggunakan Framer Motion
• Creation Studio v2 — Editor multi-fungsi (Slide, Code, Text, Video)
• Dynamic Island — Navigasi adaptif dan cair
• Responsif Total — Optimal di desktop, tablet, dan mobile

🛠️ Tech Stack

Proyek ini dibangun di atas fondasi teknologi web modern:

Kategori	Teknologi
Framework	React v19
Bahasa	TypeScript v5.8
Build Tool	Vite v6
Styling	Tailwind CSS v3 (File-based Config)
Animasi	Framer Motion
Routing	React Router DOM (BrowserRouter)
Database	Supabase
Ikon	Lucide React
Error Handling	React Error Boundary

🚀 Memulai

Prasyarat

Pastikan Anda telah menginstal:

• Node.js v18 atau lebih baru
• npm atau yarn

Instalasi

1. Clone repositori

   git clone https://github.com/ardelyo/ourcreativity.git

2. Masuk ke direktori proyek

   cd ourcreativity

3. Instal dependensi

   npm install
   # atau
   yarn install

4. Jalankan server pengembangan

   npm run dev
   # atau
   yarn dev

5. Konfigurasi Environment

   cp .env.example .env
   # Edit .env dengan kredensial Supabase kamu

6. Buka di browser

   http://localhost:5173
   

📖 Untuk panduan setup lengkap termasuk Supabase, lihat Panduan Setup

Perintah Tersedia

Perintah	Deskripsi
npm run dev	Menjalankan server pengembangan
npm run build	Build untuk produksi
npm run preview	Preview build produksi

📂 Struktur Proyek

ourcreativity/
│
├── 📁 components/        # Komponen UI Reusable
│   ├── BentoGrid/
│   ├── Navbar/
│   ├── CreationStudio/
│   └── ...
│
├── 📁 pages/             # Halaman Aplikasi
│   ├── Home.tsx
│   ├── Karya.tsx
│   ├── Tim.tsx
│   └── ...
│
├── 📁 lib/               # Utilities & Helpers
│   └── supabase.ts       # Supabase client
│
├── 📁 docs/              # Dokumentasi (Bahasa Indonesia)
│   ├── versions/         # Arsip Riwayat Versi
│   ├── ARSITEKTUR.md
│   ├── KOMPONEN.md
│   └── ...
│
├── 📄 App.tsx            # Komponen Root & Routing
├── 📄 index.css          # Global Styles
├── 📄 tailwind.config.ts # Konfigurasi Tailwind
├── 📄 vite.config.ts     # Konfigurasi Vite
└── 📄 README.md

📚 Dokumentasi

Dokumentasi teknis lengkap tersedia dalam Bahasa Indonesia:

Dokumen	Deskripsi
🚀 Panduan Setup	MULAI DARI SINI - Install & konfigurasi
✨ Master Update v5.0	BARU! - Ringkasan fitur revolusioner v5.0
🗄️ Database	Schema & query Supabase
🏗️ Arsitektur Sistem	Struktur kode dan keputusan teknis
🛣️ Routing	BARU! - Panduan lengkap sistem routing
🧩 Komponen UI	Panduan penggunaan komponen
📄 Halaman	Detail implementasi setiap halaman
🚀 Deployment	Panduan peluncuran ke produksi
🤝 Kontribusi	Standar kode dan alur kerja
📝 Catatan Pengembang	Catatan teknis dan TODO
📜 Riwayat Versi	Sejarah evolusi proyek

🤝 Kontribusi

Kontribusi sangat kami hargai! Untuk berkontribusi:

1. Fork repositori ini
2. Buat branch fitur (git checkout -b fitur/FiturBaru)
3. Commit perubahan (git commit -m 'Menambahkan FiturBaru')
4. Push ke branch (git push origin fitur/FiturBaru)
5. Buat Pull Request

📖 Baca Panduan Kontribusi dan CONTRIBUTING.md untuk informasi lebih detail.

🏛️ Governance

OurCreativity is governed transparently with clear ownership and decision-making processes.

Key Governance Documents

Document	Purpose
MAINTAINERS.md	Project leadership, responsibilities, and decision framework
ROADMAP.md	Future direction and planned features
CHANGELOG.md	Release history and what changed
CONTRIBUTING.md	How to contribute to the project
AUTHORS.md	All contributors and their roles

Escalation & Support

• Questions? GitHub Discussions
• Bug Reports? GitHub Issues
• Security Issues? See SECURITY.md

👥 Tim Pengembang

Ardelyo Lead Developer & Designer

DoctorThink Code Refactoring & Documentation

⚠️ Penggunaan Brand & Lisensi

📝 Penting Dibaca!

OurCreativity adalah proyek open source untuk edukasi, dengan aturan sederhana:

✅ Kode: Bebas dipakai (MIT License)

• Gratis untuk belajar, modifikasi, dan pakai di project sendiri
• Boleh untuk komersial
• Boleh fork dan distribute

⚠️ Brand: Dilindungi

• JANGAN pakai nama "OurCreativity" untuk website/project kamu
• JANGAN copy logo dan identitas visual kami
• Tujuan: Menghindari kebingungan di komunitas

📖 Baca detail lengkap: BRAND_USAGE.md (Bahasa Indonesia, mudah dipahami!)

📄 Lisensi

Hak Cipta © 2025 OurCreativity

Proyek ini dilisensikan di bawah Lisensi MIT.
Lihat file LICENSE untuk informasi lebih lanjut.

---

Dibuat dengan ❤️ dan ☕ oleh Tim OurCreativity Edisi Coding

"Merangkai Imajinasi Kita."