YFORM, Micro2media Open Source Green Form Builder with Advanced Service Management Capabilities

Best Online Form Builder

Are you tired of clunky, difficult-to-use form builders? Look no further than YFORM, the best open source form builder solution on the market, with Advanced Service Management capabilities. With its intuitive drag-and-drop interface, customizable templates, and advanced features like conditional logic, YFORM makes creating and managing forms a breeze. Whether you need a simple contact form or a complex multi-step application, YFORM has you covered.

DEMO/LIVE URL (Beta): https://www.micro2media.com/eco-yform/index.php?view=login

Existing demo account (or create your own account 🙂 )

  • Username: org1@micro2media.com
  • Password: Ares34Seli44!@#
  • For Bugs, please raise a ticket HERE!

User Guide: YFORM Service Management & Agile Form Builder

Welcome to the Micro2Media YFORM System. Unlike traditional form builders that simply collect data, YFORM is a comprehensive Agile Service Management tool. It bridges the gap between data collection and project execution by transforming every form submission into a manageable, trackable task within an agile workflow.

Revolutionize Your Operations with the YFORM Online Builder

The YFORM Online Builder is a sophisticated drag-and-drop ecosystem designed to bridge the gap between data collection and agile project execution. By utilizing advanced features like multi-page navigation, eSignature pads, and automated conditional logic, you can transform static paper forms into dynamic, intelligent service portals. This digital transition allows every submission to be automatically converted into a trackable task—such as a Bug or Requirement—within your organization’s workflow. Furthermore, the system supports Draft Entries through local browser storage, ensuring that your team can maintain productivity even in offline environments.

1. Introduction: Why YFORM?

Traditional form builders are “dead ends”—the data sits in a database. YFORM is a “living” system where:

  • Forms generate Action: Every submission automatically creates a Task (Bug, Requirement, Project or Client Support).
  • Advanced Service Management: Track the status of entries through a full Kanban and List interface.
  • Intelligent Logic: Complex, unlimited conditional rules that handle everything from simple show/hide to advanced mathematical calculations.
  • Process Efficiency: Unique “Page Status” management to identify exactly where a user is in a multi-step process.

The Benefits of Switching to Digital

Transitioning from traditional paper-based methods to the YFORM digital environment offers significant operational and ecological advantages:

  • Environmental Impact: Drastically reduce your carbon footprint by eliminating the need for physical paper and chemical-heavy printer ink, contributing to a healthier planet.
  • Cost Efficiency: Save substantial money on stationery, printing hardware maintenance, and physical storage space for archived documents.
  • Automated Approvals: Instead of printing documents for manual signatures and wasting time in transit, use the built-in Signature field and Conditional Logic to automate approval workflows instantly.
  • Enhanced Accuracy: Digital forms validate data (such as Email and URL formats) in real-time, preventing the “human error” often found in messy handwriting or incomplete paper forms.
  • Seamless Integration: Every digital entry flows directly into your Kanban Board or List View, ensuring that data isn’t just stored, but immediately actionable by your team.

2. The Form Builder: Advanced Components

Drag-and-Drop Canvas

The builder uses a three-pane interface: Field Palette (Left), Canvas (Center), and Settings/Logic (Right/Top).

Extensive Field Types

Beyond standard text, YFORM includes professional-grade fields:

  • eSignature: Integrated signature pad for digital approvals.
  • Chrono: Track how long it takes to complete sections of the form.
  • Dual Range Sliders: For complex data filtering.
  • Layout Containers: 2, 3, and 4-column blocks to create professional, responsive layouts.

Page Management & Status Tracking

YFORM allows you to build multi-page forms. Each page has its own Status (TODO, ONGOING, DONE). This is a game-changer for service management, allowing administrators to see which sections of a complex form have been processed.

3. Advanced Conditional Logic

YFORM offers a “No Limitation” logic engine. You can trigger actions based on any field value, or even the Status of a Page.

Building a Rule

  1. Trigger: Select a field (e.g., “Income”).
  2. Operator: Select comparison (e.g., “Greater than”).
  3. Action: Choose from Show, Hide, or Update.
  4. Calculations: In the Update action, you can perform math.
    • Example: %Quantity% * %Price% to auto-calculate a total.

4. Service Management: From Entry to Task

Automatic Task Creation

In the Form Settings, you define a “Target Task Type” (e.g., Client Support).

  • When a user submits the form, the system creates a task.
  • The form data is automatically populated into the task description.
  • Attachments (photos, PDFs) are linked directly to the task.

The Kanban Workflow

Manage your form entries using the Agile Kanban board. Drag entries from NEW to ONGOING to DONE.

  • Sub-statuses: For Requirements, use granular steps like “Under Analysis” or “Approved.”
  • Linkages: Connect a Bug task directly to a Requirement task to see how form-reported issues impact your project goals.

5. Approval Process and eSignature

The Approval Process feature enables you to create tasks requiring approval from multiple users in your organization. Each approver can review, approve, and optionally provide a digital signature (eSignature) for document sign-off.

Key Features:

  • Multi-user approval workflow: Assign multiple approvers to a single task
  • Digital signatures: Optional eSignature requirement for formal sign-off
  • Per-user tracking: Individual approval status for each approver
  • Automatic status updates: Overall approval status updates in real-time
  • Document attachment: Attach documents for review and approval

Creating an Approval Process Task

Step 1: Create a New Task
  1. Go to Tasks in the left navigation menu.
  2. Click Create New Task or navigate to Tasks → Create Task.
  3. In the Task Type dropdown, select “Approval Process”.
Step 2: Fill in Basic Task Information
  • Title: Enter a clear, descriptive title.
  • Description: Provide details about what needs approval.
  • Priority: Set the priority level (Low, Medium, High, Critical).
  • Due Date: Set a deadline for the approval process.
  • Status: Automatically set to “ONGOING” when created.
Step 3: Set Up Approval User List
  1. Scroll to the Approval User List section.
  2. Click “+ Add User” to add approvers.
  3. Select users from the dropdown (only organization members are available).
  4. Add as many users as needed—each must approve the task.
  5. Note: Users already selected will not appear again to prevent duplicates.
Step 4: Configure eSignature (Optional)
  1. In the eSignature Required dropdown, select:
    • YES: If digital signatures are required.
    • NO: If only approval is needed.
Step 5: Attach Documents
  1. Scroll to the Attachments section.
  2. Click “Choose File” to upload documents for review/approval.
Step 6: Save the Task
  1. Click “Save Changes” or “Create Task”.
  2. The task is created with:
    • Approval Status: “To Approve”
    • Task Status: “ONGOING”
    • Assigned To: First user in the Approval User List

Setting Up Approval User List

Adding Users
  1. In the Approval User List section, click “+ Add User”.
  2. Select a user from the dropdown.
  3. Repeat to add more approvers.
Removing Users
  1. Click the red “×” button next to the user.
  2. Important: At least one user must remain.
  3. Auto-save: The task saves and reloads automatically.
Changing Users
  1. Click the dropdown next to a user.
  2. Select a different user.
  3. Auto-save: Changes are saved automatically.
What Happens When Users Are Added/Removed:
  • Overall Approval Status resets to “To Approve”.
  • All Per-User Approval Statuses reset to “To Approve”.
  • Task Status resets to “ONGOING”.
  • All eSignatures are cleared.
  • Approval History is cleared.
  • The task auto-saves and reloads.

eSignature Feature

When eSignature is Required

If eSignature Required is set to YES, approvers must provide a digital signature.

Providing a Digital Signature
  1. Access the Signature Pad: Scroll to the Digital Signature section.
  2. Draw Your Signature: Use your mouse or touchscreen.
  3. Clear and Redraw: Click “Clear” to erase and start over.
  4. Complete the Signature: Click “Done” to save and lock your signature.
Editing Your Signature
  • Before Approval: Edit your signature by clicking “Edit Signature”.
  • After Approval: The signature is locked and cannot be edited.
Signature Display
  • Your signature appears as an image preview.
  • The timestamp shows: “Your Name – Date and Time”.

Approval Workflow

Initial State
  • Overall Approval Status: “To Approve”
  • Task Status: “ONGOING”
  • All Per-User Approval Statuses: “To Approve”
  • Assigned To: First user in the Approval User List

Approval Process Flow

  1. First Approver: Reviews, approves, and signs (if required).
  2. Subsequent Approvers: Follow the same process.
  3. Final Approval: When ALL approvers have approved:
    • Overall Approval Status: “Approved”
    • Task Status: “DONE”
    • Success message: “Approved – All approvers have approved/signed-off this task”

Status Updates

  • Per-User Approval Status: Updated immediately.
  • Overall Approval Status: Updated automatically when ALL users approve.
  • Task Status: Updated automatically.

Approving Tasks

Method 1: Using the Approve Button
  1. Open the task from “My Tasks” or “Approval Tasks”.
  2. Review details and attachments.
  3. Click “Approve”.
  4. Your status updates to “Approved”.
Method 2: Using Per-User Approval Status Dropdown
  1. Open the task for editing.
  2. Scroll to Per-User Approval Status.
  3. Change your status to “Approved”.
  4. Click “Save Changes”.
Method 3: Using eSignature
  1. Provide your digital signature (if required).
  2. Click “Done”.
  3. Your status updates to “Approved” automatically.
Approval Requirements
  • eSignature Required = YES: You must sign to approve.
  • eSignature Required = NO: Approve without signing.
  • All approvers must approve before the task is fully approved.

Per-User Approval Status

Understanding Per-User Status

Each approver has their own status tracked individually.

Status Values
  • “To Approve”: User has not yet approved.
  • “Approved”: User has approved (and signed if required).
Viewing Per-User Status
  1. Open the task.
  2. Scroll to Per-User Approval Status.
  3. See all approvers and their current status.
Updating Your Own Status
  • Change your status from “To Approve” to “Approved”.
  • After approval, your status is locked.

Overall Approval Status

Understanding Overall Status

Automatically calculated based on ALL Per-User Approval Statuses.

Status Values
  • “To Approve”: At least one user has not approved.
  • “Approved”: ALL users have approved.
How It Updates
  • Automatic Calculation: System checks all Per-User Approval Statuses.
  • When ALL are “Approved”: Overall Status → “Approved”.
  • When ANY is “To Approve”: Overall Status → “To Approve”.
Status Display
  • Displayed as a read-only field.
  • When “Approved”, a green success message appears.
Task Status Relationship
  • Overall Approval Status = “Approved” → Task Status = “DONE”
  • Overall Approval Status = “To Approve” → Task Status = “ONGOING”

Managing Approval User List

Adding Users After Task Creation
  1. Open the task.
  2. Scroll to Approval User List.
  3. Click “+ Add User”.
  4. Select a user.
  5. Auto-save: Task saves and reloads.
Removing Users
  1. Click the “×” button next to the user.
  2. Auto-save: Task saves and reloads.
Important Notes
  • Minimum Requirement: At least one user must remain.
  • Reset Behavior: Adding/removing users resets all approval statuses and eSignatures.

Troubleshooting

IssueSolution
Overall Approval Status shows “Approved” but one user hasn’t approvedCheck all Per-User Approval Statuses. Save the task to refresh.
Can’t edit signature after approvingExpected behavior—signatures are locked after approval.
Can’t remove a userEnsure at least one user remains.
Signature not savingDraw a signature, ensure eSignature is required, and click “Done”.
Task not appearing in “My Tasks”Verify you’re in the Approval User List and logged in correctly.
Overall Approval Status not updatingSave the task to trigger recalculation.
Auto-save not workingEnsure you’re editing an existing task and JavaScript is enabled.

Best Practices

For Task Creators
  • Provide clear documentation and attach all relevant documents.
  • Select appropriate approvers.
  • Set deadlines using the Due Date.
  • Use eSignature for legal sign-off.
For Approvers
  • Review all details and attachments before approving.
  • Respond promptly.
  • Draw clear, readable signatures.
  • Verify what you’re approving.

Quick Reference

FieldDescriptionRequired
TitleTask titleYes
Task TypeMust be “Approval Process”Yes
Approval User ListList of users who must approveYes (at least 1)
eSignature RequiredWhether digital signatures are neededNo (default: NO)
AttachmentsDocuments to be approvedOptional
Overall Approval StatusAuto-calculatedRead-only
Per-User Approval StatusIndividual statusAuto-updated

Status Flow

Task Created
    ↓
Overall Status: "To Approve"
All Per-User Statuses: "To Approve"
    ↓
User 1 Approves → Per-User Status: "Approved"
    ↓
User 2 Approves → Per-User Status: "Approved"
    ↓
... (all users approve)
    ↓
Overall Status: "Approved" ✅
Task Status: "DONE" ✅

Keyboard Shortcuts

  • Save Task: Ctrl+S (Cmd+S on Mac)
  • Scroll to Top: Use the scroll-to-top button in the sticky bar

6. Offline & Draft Management

YFORM is designed for field use where internet connection might be spotty.

  • Save as Draft: Users can save their progress locally.
  • Local Storage: Data is kept in the browser until a connection is restored.
  • Draft Dashboard: Manage incomplete entries and resume them at any time.

7. Embedding and Integration

Transform any website into a service portal.

  1. Click Embed Code in the Form Builder.
  2. Copy the provided