Docs

Wikiwoop Documentations

Drag-&-Drop Dapp Builder

Welcome to the Drag-&-Drop Dapp Builder, an intuitive platform that empowers users to create and publish websites or mobile applications without any coding knowledge. Managed directly on the platform, users can seamlessly design and publish their projects on the WoopChain network.

  1. Dashboard Sections

    • User Login: Secure login for users to access their accounts using the same credentials as their WikiWoop social app account, ensuring a connected and unified experience.

    • Project Options:
      • Choose from Existing Projects: Quick access to a list of existing projects.
      • Start from Scratch: Option to create a new project from scratch with a guided setup wizard.

  2. Project Management

    • New Project: Easy access to start a new project with a guided setup wizard.

    • Project Overview:
      • Active Projects: List all active projects with status indicators (e.g., Draft, In Progress, Published).
      • Archived Projects: Access to previously completed or paused projects.
      • Project Search and Filter: Search bar and filter options to find projects quickly.

    • Templates Library:
      • Categories: Industry-specific templates (e.g., eCommerce, Blogging, Portfolio, Business).
      • Preview Option: View template demos before selecting.
      • Favorite Templates: Mark frequently used templates for quick access.

  3. Drag-&-Drop Builder Interface

    • Toolbox:
      • Elements: Basic building blocks such as text, images, buttons, forms, icons, and shapes.
      • Widgets: Advanced components including sliders, galleries, maps, contact forms, and social media feeds.
      • Layouts: Pre-defined layout sections like headers, footers, content blocks, and feature sections.
      • Custom Code: Option to add custom HTML, CSS, and JavaScript for advanced customization.
      • Canvas: Main area where users drag and drop elements to build their app or website, with real-time preview.

    • Properties Panel:
      • Style: Customize the appearance of elements with options for colors, fonts, sizes, margins, and padding.
      • Settings: Functional settings for elements such as links, actions, animations, and integrations.
      • Responsive Design: Tools to adjust and preview the design for different screen sizes (desktop, tablet, mobile).

    • WoopI AI Assistant:
      • Suggestions: Real-time design and content suggestions based on user actions.
      • Automation: Automatic layout adjustments, content alignment, and image resizing.
      • WoopI AI: 24/7 assistance for troubleshooting, tips, and guided tutorials.

  4. Media Library

    • Uploads: Upload images, videos, documents, and other media files.
    • Stock Media: Access to a vast library of free premium images and videos.
    • Organization: Tools for organizing media with folders, tags, and search functionality.
    • Editing Tools: Basic image editing tools for cropping, resizing, and enhancing images.

  5. Publishing Options

    • Domain Setup: Simple process to connect custom domains or use provided subdomains.

    • SEO Settings:
      • Meta Tags: Add and edit meta titles, descriptions, and keywords.
      • Sitemap: Auto-generate and submit sitemaps to search engines.
      • Analytics Integration: Integrate with Google Analytics and other analytics tools.
      • Launch Button: One-click publishing to make the project live, with options for staging and preview environments.

    • WoopChain Integration:
      • Direct Publishing: Seamless option to publish directly on the WoopChain network.
      • Blockchain Features: Utilize blockchain features such as decentralized hosting, security, and transparency.

  6. User Management:

    • Team Collaboration: Invite team members, assign roles, and manage permissions.
    • Roles and Permissions: Define access levels for different users (e.g., Admin, Editor, Viewer).
    • Activity Log: Track changes, updates, and activities made by collaborators.

  7. Support and Community:

    • Help Center: Comprehensive help center with FAQs, user guides, and troubleshooting articles.
    • Live Chat Support: Direct support from customer service representatives.
    • User Community: Forums and discussion groups to share tips, ask questions, and get feedback from other users.

  8. Settings:

    • Profile: Manage user profile information, change password, and update contact details.
    • Notifications: Set up email and in-app notifications for project updates, comments, and system alerts.
    • Billing: View subscription plans, manage billing information, and access billing history.
    • Language and Region: Set preferred language and regional settings.

    AI Integration Features

  9. Design Assistance:

    • Smart Layouts: AI analyzes content and suggests optimal layouts to enhance user experience.
    • Color Matching: Proposes color schemes that match the user’s brand and design preferences.
    • Typography Suggestions: Recommends font pairings, sizes, and styles for readability and aesthetics.
    • Content Alignment: Automatically aligns and adjusts content for a balanced and professional look.

  10. Content Generation:

    • Copywriting: Generate text for headers, descriptions, calls to action, and blog posts.
    • Image Enhancement: Auto-correct and enhance uploaded images, including background removal and retouching.
    • SEO Optimization: Provide SEO-friendly content suggestions, keyword placements, and meta descriptions.

  11. Performance Optimization:

    • Speed Insights: Analyze and suggest improvements for page load times and overall performance.
    • Responsive Design: Ensure projects look great on all devices with automatic adjustments for various screen sizes.
    • Accessibility Checks: AI-driven accessibility suggestions to ensure compliance with web accessibility standards.

Conclusion

With the Drag-&-Drop Dapp Builder, creating a professional and functional website or mobile app is just a few clicks away. Leverage our powerful AI tools to streamline your design process, enhance your content, and bring your vision to life without writing a single line of code. Start building today and effortlessly publish your work on the WoopChain network.

Top