Zeba Academy Playground 🚀

A powerful and reusable Flutter package for creating interactive learning playgrounds with experiments, challenges, try-it sections, and progress tracking.

Build engaging educational experiences, coding practice areas, and skill-building interfaces easily with ready-to-use widgets.

✨ Features

🧪 Experiment Cards

Create interactive learning experiments with:

Title
Description
Difficulty level
Completion status
Learning activity indicators

🎯 Hands-on Challenges

Provide practical tasks for learners:

Challenge title
Instructions
Point system
Completion tracking

🧑‍💻 Try-It Sections

Create sandbox-style sections for:

Practice activities
Code exercises
Interactive examples
Learning tasks

📊 Learning Progress

Track learner progress with:

Completed lessons
Total activities
Percentage calculation
Progress indicators

📦 Installation

Add dependency:

dependencies:
  zeba_academy_playground: ^1.0.0

Run:

flutter pub get

🚀 Usage

Import the package:

import 'package:zeba_academy_playground/zeba_academy_playground.dart';

Basic Playground Screen

import 'package:flutter/material.dart';
import 'package:zeba_academy_playground/zeba_academy_playground.dart';


class PlaygroundDemo extends StatelessWidget {

  const PlaygroundDemo({super.key});


  @override
  Widget build(BuildContext context) {

    return const PlaygroundView();

  }
}

🧪 Creating an Experiment

final experiment = Experiment(

  title: "Build Calculator",

  description:
  "Create your first Flutter calculator app",

  difficulty: "Beginner",

  completed: true,

);

Display:

ExperimentCard(
  experiment: experiment,
)

🎯 Creating Challenges

final challenge = Challenge(

 title: "Create Login UI",

 instruction:
 "Design a modern authentication screen",

 points: 100,

);

Display:

ChallengeCard(
 challenge: challenge,
)

📊 Progress Tracking

final progress = LearningProgress(

 completed: 5,

 total: 10,

);

Use:

ProgressBar(
 progress: progress,
)

🧑‍💻 Try Section

TrySection(

 title: "Practice Area",

 child: Text(
  "Start coding here"
 ),

)

🏗 Package Structure

lib/

├── models/

│   ├── experiment.dart
│   ├── challenge.dart
│   └── progress.dart


├── widgets/

│   ├── experiment_card.dart
│   ├── challenge_card.dart
│   ├── try_section.dart
│   └── progress_bar.dart


├── playground_view.dart

└── zeba_academy_playground.dart

🎨 Use Cases

Perfect for:

✅ Coding learning apps
✅ Online course platforms
✅ Student dashboards
✅ Skill development apps
✅ Quiz and challenge systems
✅ Developer education tools
✅ Practice environments

🌟 Why Zeba Academy Playground?

Simple integration
Fully Flutter native
No API required
No backend dependency
Lightweight widgets
Customizable UI
Production ready

🔧 Requirements

Flutter >= 3.0.0
Dart >= 3.0.0

🤝 Contributing

Contributions are welcome!

Steps:

Fork the repository
Create a branch

git checkout -b feature/new-feature

Commit changes

git commit -m "Add new feature"

Push branch

git push origin feature/new-feature

Open Pull Request

📄 License

This project is licensed under the GNU General Public License v3.0.

You are free to:

Use
Modify
Share
Distribute

under the terms of the GPL-3.0 license.

See the LICENSE file for details.

👨‍💻 About Me

✨ I’m Sufyan bin Uzayr, an open-source developer passionate about building and sharing meaningful projects.

You can learn more about me and my work:

🌐 Website:
https://sufyanism.com/

💼 LinkedIn:
https://www.linkedin.com/in/sufyanism

🚀 Your all-in-one learning hub!

Explore courses and resources in coding, technology, and development.

Zeba Academy helps developers and learners grow through practical tutorials, real-world projects, and hands-on experience.

🌐 Main Platform:

https://zeba.academy

💻 Coding Resources:

https://code.zeba.academy

▶ YouTube:

https://www.youtube.com/@zeba.academy

📸 Instagram:

https://www.instagram.com/zeba.academy/

💙 Support

If you like this package:

⭐ Star the repository

🐛 Report issues

💡 Suggest improvements

Happy Learning 🚀