Introducing GlassLayer: Revolutionizing Glass Art Design
I’m thrilled to announce the completion of a web application I’ve been diligently working on for over a year: GlassLayer. This application has been developed for Glass Art Projects, a Los Angeles-based company specializing in custom glass art kits. Traditionally, customers would receive a kit of glass pieces, arrange them on a base glass, and then return the assembled design to the company to create a custom plate. GlassLayer streamlines and modernizes this process, allowing users to design their plates online—faster and more affordably.
Speed and Efficiency
Traditional Process:
- Purchase and receive a glass kit.
- Arrange the glass pieces on the base glass and send it back.
- Receive the finished plate after production.
This method required three separate shipments to complete the design. With GlassLayer, we’ve eliminated two of these steps. Now, you simply design your plate online and receive the finished product directly, significantly reducing the turnaround time.
Cost-Effectiveness
In the traditional method, purchasing a glass kit often led to unused or broken pieces, resulting in unnecessary waste. GlassLayer addresses this issue by allowing you to only pay for the pieces you actually use in your design, maximizing efficiency and minimizing costs.
Key Features for Users:
- Multi-Selection: Hold down the CTRL key to select multiple pieces simultaneously.
- Design Controls: Utilize the Remove, Rotate, and Layer buttons to manipulate selected pieces.
- Drag & Drop: Easily add pieces to your plate from the inventory.
- Undo/Redo: Seamlessly reverse or redo actions during the design process.
- Customizable Base: Use the Plate Material button to change the base color of your plate.
- Color & Transparency: Switch between color palettes and transparent pieces for a broader range of design options.
- Account Management: Register and log in to save or purchase your designs.
- Comprehensive Inventory: Use the accordion menu to access various types of pieces.
Technical Insights for Developers
This project has been my most extensive and time-consuming endeavor to date, offering immense learning opportunities. I would like to express my deep appreciation for Dimitry Baranovsky’s RaphaelJS library and the jQuery team. RaphaelJS, with its robust support for 2D canvas operations and cross-browser compatibility (even in IE7), was invaluable. Additionally, ClassyJS played a pivotal role in streamlining development.
Initially, the project followed a functional coding paradigm. However, as the project grew, the codebase became increasingly complex and unmanageable. After five months of development, I transitioned to an object-oriented approach using ClassyJS, a library inspired by Python’s OOP principles, with which I am well-versed. Rewriting the code in OOP took about a month, but it was worth the effort. The result is a cleaner, more manageable codebase, with approximately 3,000 lines of JavaScript that remain organized and efficient.
Technical Features:
- Advanced Selection: Supports both single and grouped piece selection.
- Dynamic Manipulation: Allows for individual and grouped movement, rotation, layering, and removal of pieces.
- Unlimited Undo/Redo: Provides infinite undo and redo capabilities.
- Replay Functionality: Enables users to replay the entire design process.
- Save & Load: Users can save and load their designs for future modification.
- Piece Bundling: Offers the ability to group pieces into bundles for easier management.
GlassLayer represents a significant leap forward in the glass art design process, combining efficiency with creativity. I’m excited to see how users will utilize this tool to bring their artistic visions to life.
Leave a Reply