Flexible by Design
Flexible by Design
A visual layout editor that enables users to compose flexible interfaces
A visual layout editor that enables users to compose flexible interfaces
Role
Sole product designer
System type
CRM platform
Product
Overview
Overview
Easymaze was built to support highly customizable workflows across different industries and teams. Dynamic Attributes extend this flexibility by allowing users to create and organize custom fields directly within the system. The challenge was designing a layout experience that feels flexible and open-ended, while still guiding users toward clear and maintainable structures.
Instead of removing complexity, the system organizes it through constraints, consistent patterns, and predictable structure without relying on developers for ongoing layout adjustments.
Easymaze was built to support highly customizable workflows across different industries and teams. Dynamic Attributes extend this flexibility by allowing users to create and organize custom fields directly within the system. The challenge was designing a layout experience that feels flexible and open-ended, while still guiding users toward clear and maintainable structures.
Instead of removing complexity, the system organizes it through constraints, consistent patterns, and predictable structure without relying on developers for ongoing layout adjustments.
The Problem
The Problem
Users need flexibility to structure their own layouts, but greater customization often leads to complexity and reliance on technical teams. The challenge was to create a system that supports freedom while maintaining clarity and consistency.
Users need flexibility to structure their own layouts, but greater customization often leads to complexity and reliance on technical teams. The challenge was to create a system that supports freedom while maintaining clarity and consistency.
The Solution
The Solution
I designed a visual layout editor built on a structured grid system. Users can add existing fields, arrange them freely, and shape layouts around their workflows, while the grid ensures alignment, consistency, and structural integrity without requiring technical support.
I designed a visual layout editor built on a structured grid system. Users can add existing fields, arrange them freely, and shape layouts around their workflows, while the grid ensures alignment, consistency, and structural integrity without requiring technical support.
Guiding Principles
Guiding Principles
Empowerment through flexibility
Users should be able to adapt the CRM to match how they work, not the other way around.
Logic without barriers
Users deserve the ability to create advanced rules without relying on admins or developers.
Visually driven
Layouts designed by users, not developers
User centered design
Even the most powerful tools should feel clear, reliable, and easy to use.
Competitive Analysis
Competitive Analysis
I examined how leading CRM systems handle field customization and layout to identify usability and flexibility patterns.
Most offered only basic options, and the more advanced systems were often rigid in display or required technical support to configure effectively.
I examined how leading CRM systems handle field customization and layout to identify usability and flexibility patterns.
Most offered only basic options, and the more advanced systems were often rigid in display or required technical support to configure effectively.
Strengths
Quick setup for flexible workflows
Highly visual and intuitive for adding fields
User-friendly visual editor
Short learning curve
High flexibility and enterprise data modelling
Advanced conditional logic and permissions
Extensive Customization Options
Advanced conditional logic and permissons
Weaknesses
Advanced customization can become messy
Limited layout management
Strict layout options
Configuration requires technical knowledge
Strict layout options
Interface can feel complex for non-technical users.
Key Takeaways
Flexibility increases cognitive load
Platforms that offer powerful logic require technical expertise, creating friction for non-technical users
Usability Trades Off with Depth
User-friendly platforms simplify field creation but limit advanced features
Visual tools lack spatial freedom
Drag-and-drop editors still impose rigid structures, limiting layout control and information hierarchy.
Information Architecture &
Navigation Flow
Information Architecture &
Navigation Flow
Users start at the Dynamic Attributes Hub, the central entry point for all entity-level customizations.
Selecting an entity opens a Grid View, where users can effortlessly switch between Fields and Zones.
From this view, they drill into detail screens to manage specific attributes, keeping a cohesive and repeatable workflow across the system.
Users start at the Dynamic Attributes Hub, the central entry point for all entity-level customizations.
Selecting an entity opens a Grid View, where users can effortlessly switch between Fields and Zones.
From this view, they drill into detail screens to manage specific attributes, keeping a cohesive and repeatable workflow across the system.
A Grid System That Enables Flexibility Without Complexity
Enabling Flexibility Without Complexity
To support deep customization without overwhelming users, Dynamic Attributes were built on Easymaze’s existing 12-column grid system.
This grid system allows fields to scale in fixed increments both horizontally and vertically. Users can create a wide variety of layouts, from full-width sections to multi-column arrangements, while the system maintains consistent alignment and spacing.
They can experiment with different compositions, confident that proportions will remain balanced. This approach enables flexibility while quietly guiding layouts toward clarity and structure.
Allowing users to experiment with layouts freely without worrying about spacing, alignment, or visual imbalance.
To support deep customization without overwhelming users, Dynamic Attributes were built on Easymaze’s existing 12-column grid system.
This grid system allows fields to scale in fixed increments both horizontally and vertically. Users can create a wide variety of layouts, from full-width sections to multi-column arrangements, while the system maintains consistent alignment and spacing.
They can experiment with different compositions, confident that proportions will remain balanced. This approach enables flexibility while quietly guiding layouts toward clarity and structure.
Allowing users to experiment with layouts freely without worrying about spacing, alignment, or visual imbalance.
The 12-column grid structure used across Easymaze
The 12-column grid structure used across Easymaze
An example of how Dynamic Attributes appear within an entity screen
An example of how Dynamic Attributes appear within an entity screen
Creating a Dynamic Zone
Creating a Dynamic Zone
Users start at the Dynamic Attributes Hub, the central entry point for all entity-level customizations.
Selecting an entity opens a Grid View, where users can effortlessly switch between Fields and Zones.
From this view, they drill into detail screens to manage specific attributes, keeping a cohesive and repeatable workflow across the system.
Users start at the Dynamic Attributes Hub, the central entry point for all entity-level customizations.
Selecting an entity opens a Grid View, where users can effortlessly switch between Fields and Zones.
From this view, they drill into detail screens to manage specific attributes, keeping a cohesive and repeatable workflow across the system.
Add fields from the Field Library
Add fields from the Field Library
Open the Field Library and drag field cards into the grid to build the layout.
Open the Field Library and drag field cards into the grid to build the layout.
Resize fields to match the content
Resize fields to match the content
Drag a field’s edge to resize it. All fields support horizontal resizing, and text fields can also expand vertically.
Drag a field’s edge to resize it. All fields support horizontal resizing, and text fields can also expand vertically.
Arrange fields visually
Arrange fields visually
Drag field cards to position them. The grid adapts dynamically and highlights the field’s final placement.
Drag field cards to position them. The grid adapts dynamically and highlights the field’s final placement.
Validate the layout in Preview mode
Validate the layout in Preview mode
Preview the Dynamic Zone to see how the layout will appear in use.
Preview the Dynamic Zone to see how the layout will appear in use.
Designing the Interaction Model
Designing the Interaction Model
The goal of Dynamic Zones was to make layout composition visual, flexible, and approachable, without introducing the complexity often found in customizable systems.
The goal of Dynamic Zones was to make layout composition visual, flexible, and approachable, without introducing the complexity often found in customizable systems.
Adding fields:
balancing clarity and efficiency
Adding fields:
Fields are added from the Field Library sidebar by dragging a field card, or by clicking on it which inserts it into the grid.
The design only includes both interactions to allow users to quickly add multiple fields with “click-to-add”, which is especially helpful during initial system setup, and “drag-and-drop”, allowing users to immediately place field cards in the desired spot.
Fields are added from the Field Library sidebar by dragging a field card, or by clicking on it which inserts it into the grid.
The design only includes both interactions to allow users to quickly add multiple fields with “click-to-add”, which is especially helpful during initial system setup, and “drag-and-drop”, allowing users to immediately place field cards in the desired spot.
Using cards to support spatial composition
Using cards to support spatial composition
Each field appears as a card showing its name and type, acting as a placeholder for the actual field component.
This makes arranging layouts feel more tangible and easier to understand, especially for non-technical users configuring the system for the first time.
Preview mode allows users to switch from cards to real components, helping them validate their layout.
Each field appears as a card showing its name and type, acting as a placeholder for the actual field component.
This makes arranging layouts feel more tangible and easier to understand, especially for non-technical users configuring the system for the first time.
Preview mode allows users to switch from cards to real components, helping them validate their layout.
Layout Editor
Layout Editor
Preview Mode
Preview Mode
Structured resizing for flexible but consistent layouts
Structured resizing for flexible but consistent layouts
Fields can be resized horizontally within the grid, and text fields can expand vertically when needed. The grid ensures alignment and consistency across screen sizes, while still allowing users to create varied compositions, including multi-column layouts or intentional empty space.
This gives users flexibility while preserving clarity and structure.
Fields can be resized horizontally within the grid, and text fields can expand vertically when needed. The grid ensures alignment and consistency across screen sizes, while still allowing users to create varied compositions, including multi-column layouts or intentional empty space.
This gives users flexibility while preserving clarity and structure.
Outcome
Outcome
These interaction patterns allow users to build layouts visually and independently. By combining cards, drag-and-drop, and a structured grid, the system supports customization while maintaining consistency and usability.
These interaction patterns allow users to build layouts visually and independently. By combining cards, drag-and-drop, and a structured grid, the system supports customization while maintaining consistency and usability.
Summary
Summary
Dynamic Attributes are a foundational part of Easymaze’s product vision, enabling customers to shape the system around their own data and workflows. The challenge was to translate this flexibility into an experience that users could manage independently, without introducing the complexity and maintenance overhead typically associated with customizable systems.
By implementing a reusable field library and a visual, grid-based layout editor, this feature made Dynamic Attributes practical and scalable in everyday use. The system balances user control with structural constraints, allowing layouts to be composed freely while preserving clarity, consistency, and long-term maintainability.
The result is a system that supports deep customization while helping users maintain clarity, consistency, and confidence as complexity grows.
More broadly, this work helped establish the architectural patterns and interaction model that support Easymaze’s modular approach to entity screens.
Dynamic Attributes are a foundational part of Easymaze’s product vision, enabling customers to shape the system around their own data and workflows. The challenge was to translate this flexibility into an experience that users could manage independently, without introducing the complexity and maintenance overhead typically associated with customizable systems.
By implementing a reusable field library and a visual, grid-based layout editor, this feature made Dynamic Attributes practical and scalable in everyday use. The system balances user control with structural constraints, allowing layouts to be composed freely while preserving clarity, consistency, and long-term maintainability.
The result is a system that supports deep customization while helping users maintain clarity, consistency, and confidence as complexity grows.
More broadly, this work helped establish the architectural patterns and interaction model that support Easymaze’s modular approach to entity screens.
What Next?
What Next?
Expanding the Model with Dynamic Tabs
Expanding the Model with Dynamic Tabs
Currently, layout management exists at the Dynamic Zone level, but the overall structure of the entity screen remains fixed. The next step is to introduce Dynamic Tabs, adding a new layer to the hierarchy:
Currently, layout management exists at the Dynamic Zone level, but the overall structure of the entity screen remains fixed. The next step is to introduce Dynamic Tabs, adding a new layer to the hierarchy:
Entity
Entity
Dynamic Tabs
Dynamic Tabs
Dynamic Zones
Dynamic Zones
Dynamic Fields
Dynamic Fields
Dynamic Tabs will allow users to organize information into higher-level sections and control visibility at a more meaningful level. Entire tabs can be shown or hidden based on permissions or classifications, enabling screens to adapt to different roles and workflows.
This evolution strengthens the modular architecture of Dynamic Attributes, allowing both structure and visibility to scale with customer needs.
Dynamic Tabs will allow users to organize information into higher-level sections and control visibility at a more meaningful level. Entire tabs can be shown or hidden based on permissions or classifications, enabling screens to adapt to different roles and workflows.
This evolution strengthens the modular architecture of Dynamic Attributes, allowing both structure and visibility to scale with customer needs.
© 2025 Maya Sarel
© 2025 Maya Sarel