[OKR] - Editor interface

[c0rtexR]

🎯 Objective

Build a functional, tablet-friendly editor interface for creating and managing workflows using React Flow, with dynamic theming based on user groups, support for multiple inputs/outputs, and avoidance of hardcoded CSS.

✅ Key Results

• Implement a React Flow editor with drag-and-drop, minimap, zoom/pan, and node interaction features. #19
• Develop core node types (Start, End, Input, Output, Logic) with support for multiple input/output connections and dynamic theming per user group. #20
• Ensure compatibility with tablet devices, optimizing touch gestures like pinch-to-zoom and drag-and-drop. #21
• Implement a dynamic theming system that adapts based on user group (e.g., kids, business users), preventing hardcoded CSS. #22
• Add real-time visual feedback and error detection with notifications and visual cues for invalid node connections. #23
• Test with 10 beta users, ensuring 70% find the interface intuitive and tablet-friendly. #24

🏆 Success Criteria

• The editor functioning seamlessly on tablets with React Flow features and dynamic theming.

• Smooth handling of multiple inputs/outputs in nodes and responsive UI behavior during touch interactions.

• At least 70% of beta testers finding the editor intuitive and error-free.

⏳ Timeline

Q3 2024

📝 Additional Notes

• Ensure comprehensive documentation for developers to add custom nodes and extend the editor.

• Maintain close communication via Discord for collaboration between team members working on the editor and theming system.