Developed advanced 2D design features in the Kigma Framework, enhancing its interactive UI and expanding its capabilities in the design and architecture industry. The project involved integrating features like image cropping, equidistant inference, and object selection on the canvas, providing users with a seamless and dynamic design experience.
Key Features
Image Cropping
• Implemented an interactive image cropping tool, allowing users to precisely crop images within the canvas for detailed design work.
Equidistant Inference
• Developed a feature to automatically infer equidistant lines and spaces in designs, improving accuracy and alignment in user-created layouts.
Object Selection
• Enabled users to select, move, and manipulate objects within the canvas, making the design process more intuitive and efficient.
Floorplan Format Support (DXF, DWG, SVG)
• Added support for DXF, DWG, and SVG formats, enabling users to import and work with professional-grade floorplan designs.
npm Integration
• Published 20+ release packages to internal npm, streamlining the integration of Kigma into various projects and improving its accessibility for developers.
Technology Stack
Layer
Technologies
Frontend
react:^16.13.1, typeScript:^4.3.5, mobx:^6.0.4
Backend
Java, MySQL
Deployment
webpack:4.46.0
Challenges
Performance Optimization
Modularizing a complex framework while maintaining backward compatibility posed significant technical challenges.Ensuring smooth and responsive interactions on the canvas while handling complex 2D design operations, especially with large image sizes and intricate layouts.
Scalability
Managing the framework’s performance and scalability as more advanced design features were added, ensuring the system could support a growing user base and more intensive workloads.
Integration Flexibility
Balancing flexibility and ease of integration for developers, while maintaining a seamless experience when introducing new design formats (DXF, DWG, SVG) and APIs.
Achievements
Successfully developed and deployed advanced 2D design features, improving user engagement and interaction with the platform, established a robust API with clear property value standards, leading to more efficient data management and analytics. Published 20+ Kigma release packages to npm, expanding the framework’s use and simplifying integration for teams.