tSM Form Designer

Introduction

The tSM Form Designer is a powerful, graphical interface within the tSM (telecommunication Service Management) platform that allows users to create, edit, and manage forms for various entities, such as tickets, products, services, or entirely new custom entities. It offers a flexible, widget-based approach and uses JSON Schema for configuration, ensuring that forms can be easily customized, extended, and integrated with automated processes.

By leveraging a drag-and-drop interface and a JSON Schema-based configuration, the Form Designer enables both technical and non-technical users to:

• Design form layouts visually.
• Configure widgets for specific data bindings and logic.
• Seamlessly integrate forms with backend processes.

Widget-Based UI Composition

1. Modular Design
   Forms are composed of modular widgets, each encapsulating specific functionality (e.g., text fields, numeric fields, date pickers, or checkboxes).

2. Flexible Layouts
   The widget-based approach supports adaptable layouts that can be optimized for desktops, tablets, and mobile devices.

3. Reusable Components
   Widgets can be reused across multiple forms and processes, promoting consistency and reducing development time.

JSON Schema Configuration

1. Standardized Format
   All form configurations use JSON Schema, a widely recognized standard for defining the structure and validation rules of JSON data.

2. Extensibility
   JSON Schema allows for easy extension of data models. Users can add custom properties or validations to suit specific business requirements.

3. API Integration
   Because all public APIs in tSM are documented using the Open API Specification, the use of JSON Schema makes integration with these APIs straightforward.

Process Engine Integration

1. Automated Workflows
   Forms designed in the Form Designer can be integrated with tSM’s Process Designer to automate backend processes (e.g., validations, notifications, data submission).

2. Seamless Interaction
   This integration ensures that any data collected through forms can be passed to microservices for efficient service management.

3. Dynamic Data Handling
   Forms can be configured to react to real-time data from various sources, adjusting fields and validations based on user inputs or system changes.

Custom Entities and Extensions

1. Extend Main Entities
   Users can enhance existing entities (e.g., products, tickets, services) by adding new fields or functionalities.

2. Create Custom Entities
   If existing entities are not sufficient, entirely new entities can be defined to address unique business needs.

3. Metadata Storage
   Form layouts, custom fields, and other configurations are stored as metadata, ensuring consistency and making it easy to manage changes over time.

---

How It Works

1. Design the Layout
   Using a graphical interface, users place widgets onto a form canvas, arranging them for the desired user experience.

2. Configure Widgets
   Each widget can be set up with properties such as labels, default values, data bindings, and logic for conditional display or validation.

3. Define the Schema
   The JSON Schema underpins the form’s data structure—specifying field types, validations, and any custom properties.

4. Integrate with Processes
   Forms can be linked to the Process Designer, which handles business logic behind the scenes (e.g., sending notifications, automating approvals).

5. Publish and Test
   Once created or updated, forms can be published in the tSM environment and tested across different devices.

Drag-and-Drop Interface

1. Simplified Form Building
   The left sidebar of the Form Designer provides a selection of widgets (text fields, numeric fields, date pickers, etc.) that can be dragged and dropped into the design area.

2. In-Place Modifications
   Each widget can be edited and configured on the spot, reducing the need to switch between code views and visual design.

3. Custom Layouts
   Arrange widgets in columns, sections, or tabs to create layouts tailored to your organizational requirements.

Getting Started

1. Access the Form Designer
   Log into the tSM platform and navigate to the Form Designer module.

2. Create or Select a Form
   Start by creating a brand new form or choose an existing one to modify.

3. Design the Layout
   Use the drag-and-drop interface to position widgets within the form.

4. Configure Widgets
   Assign properties, bindings, validations, and any custom logic.

5. Define the Schema
   Review and adjust the automatically generated JSON Schema that outlines your form’s data structure.

6. Integrate Processes
   Use the Process Designer to link your form to automated workflows in the backend (e.g., data submission, notifications).

7. Test and Publish
   Preview the form to ensure it behaves correctly, then publish it so users can access it within the tSM system.

---

Conclusion

The tSM Form Designer is a key component of the tSM platform, providing a user-friendly way to create and manage forms. Its modular, widget-based design and reliance on JSON Schema allow for rapid customization, reusability, and straightforward integration with existing processes. Whether you need to extend existing entities or create entirely new ones, the Form Designer’s drag-and-drop interface, schema-driven configuration, and seamless process integration offer a robust and efficient solution for meeting your organization’s service management needs.