⚠️ PROTOTYPE STATUS: SketchIDE is currently in active development as a prototype. This is not a production release and is intended for testing, feedback, and development purposes only.

SketchIDE is a visual mobile IDE that enables anyone to build native Android & iOS applications through an intuitive drag-and-drop interface. Built with Flutter for modern cross-platform development, SketchIDE makes app creation accessible without requiring coding knowledge.

mindmap
  root((SketchIDE))
    Visual Design
      Drag & Drop UI Builder
      Material 3 Widgets
      Real-time Preview
      Fixed Device Frame
    Property Management
      Color-coded Properties
      Smart Property Editor
      Sequential Widget IDs
      Auto-validation
    Code Generation
      Flutter Code Output
      Real-time Updates
      Project Management
      Export Support
    Touch System
      Native Touch Handling
      Gesture Recognition
      Multi-touch Support
      Selection System

• Intuitive Drag & Drop Interface with smooth animations
• Fixed Mobile Device Frame (360x640dp) for consistent design
• Property Panel with slide-up animation and visual feedback
• Smart Widget Management with auto-selection and validation
• Real-time Visual Feedback during design operations

• Live Flutter Code Generation from visual components
• Sequential Widget Naming (text1, text2, text3, etc.)
• Project File Management with organized structure
• Cross-platform Output supporting Android and iOS
• Offline Development with local project storage

• Color-coded Property Types: Text (Blue), Size (Green), Color (Purple), Number (Orange)
• Smart Property Validation with real-time error feedback
• Comprehensive Widget Properties for complete customization
• Visual Property Editor with intuitive controls

graph LR
    A[📱 Create Project] --> B[🎨 Design UI]
    B --> C[⚙️ Configure Properties]
    C --> D[🔧 Add Logic]
    D --> E[👀 Preview App]
    E --> F[📦 Export Project]
    F --> G[🏗️ Build App]
    
    style A fill:#e1f5fe
    style B fill:#f3e5f5
    style C fill:#e8f5e8
    style D fill:#fff3e0
    style E fill:#fce4ec
    style F fill:#e0f2f1
    style G fill:#f1f8e9

1. Project Setup: Create new project with basic Flutter structure
2. Visual Design: Use drag & drop to build UI with widgets
3. Property Configuration: Customize widget properties using visual editor
4. Logic Integration: Add interactive behavior (coming soon)
5. Live Preview: See changes in real-time mobile frame
6. Export & Build: Generate Flutter project for compilation

graph TB
    subgraph "🎨 Presentation Layer"
        UI[Views & Widgets]
        VM[ViewModels]
    end
    
    subgraph "🔧 Business Logic"
        SVC[Services]
        CTRL[Controllers]
    end
    
    subgraph "📊 Data Layer"
        MODELS[Models & Beans]
        STORAGE[Local Storage]
    end
    
    UI --> VM
    VM --> SVC
    SVC --> CTRL
    CTRL --> MODELS
    MODELS --> STORAGE
    
    style UI fill:#e3f2fd
    style VM fill:#f3e5f5
    style SVC fill:#e8f5e8
    style CTRL fill:#fff8e1
    style MODELS fill:#fce4ec
    style STORAGE fill:#e0f2f1

• Models: Data structures and business entities
• Views: UI screens and user interfaces
• ViewModels: Business logic and state management
• Services: Core functionality and API communication
• Controllers: Touch handling and user interactions

• Flutter SDK (latest stable)
• Dart SDK (included with Flutter)
• Android Studio / VS Code
• Git

# Clone the repository
git clone https://github.com/sketchide/SketchIDE.git

# Navigate to project directory
cd SketchIDE

# Install dependencies
flutter pub get

# Run the application
flutter run

SketchIDE/
├── lib/
│   ├── controllers/        # Touch & interaction handling
│   ├── models/            # Data structures
│   ├── services/          # Business logic services
│   ├── viewmodels/        # MVVM view models
│   ├── views/             # UI screens
│   └── widgets/           # Reusable UI components
├── assets/                # Images, icons, templates
└── android/ios/          # Platform-specific files

We welcome contributions to help improve SketchIDE! Since this is a prototype, we're especially interested in:

• UI/UX Improvements: Enhance the visual design experience
• Performance Optimization: Improve rendering and responsiveness
• Feature Testing: Help identify bugs and edge cases
• Documentation: Improve code documentation and user guides

1. Fork the repository and create a feature branch
2. Follow the existing code style and architecture patterns
3. Add appropriate tests for new functionality
4. Submit pull requests with clear descriptions
5. Participate in code reviews and feedback

feat: add new widget to palette
fix: resolve touch handling issue
design: improve property panel UI
test: add unit tests for validation
docs: update README with new features

Important Notice: SketchIDE is currently a prototype in active development.

• 🔧 Features may change without notice during development
• 🐛 Bugs and issues are expected and being actively addressed
• 📱 Not ready for production app development
• 🔄 Frequent updates and changes to the codebase
• 💬 Feedback is crucial for improving the final product

• Test the visual editor and report any issues
• Suggest improvements for user experience
• Help identify missing features or functionality
• Provide feedback on performance and stability

• Community Discussion: Telegram Group
• Updates & News: Telegram Channel
• Email Support: developerrajendrahelp@gmail.com

SketchIDE is open source software licensed under the MIT License.

MIT License - Free to use, modify, and distribute

This prototype is provided "as-is" for development and testing purposes. See LICENSE for full details.

🚀 Building the future of visual app development 🚀