Design Editor Interface
The Canvelete (opens in a new tab) Design Editor provides a professional-grade workspace for creating templates that generate thousands of personalized designs automatically. Every element you place can become dynamic, responding to your business data to create exactly what your customers need.
This guide covers the complete editor interface, tools, and features available in the Canvelete editor (opens in a new tab).
Your Workspace at a Glance
When you open the Design Editor, you'll see a clean, organized workspace designed to keep everything you need within easy reach. The interface flows naturally from left to right: your creative tools on the left, your canvas in the center where the magic happens, and smart assistance on the right that adapts to what you're working on.
Think of it like a well-organized artist's studio. Everything has its place, but more importantly, everything works together to help you create faster and more efficiently than ever before.
Your Project Control Center
At the top of your screen, you'll find everything you need to manage your design project. This isn't just about the technical aspects – it's about giving you confidence and control over your creative process.
Never Lose Your Work
Your design automatically saves as you work, so you never have to worry about losing progress. You can see exactly when your last change was saved, giving you peace of mind to experiment freely. When you're working on important projects, you can create named versions at key milestones – think of them as bookmarks you can return to if you want to explore different creative directions.
Seamless Collaboration
The sharing features let you bring teammates into your creative process without the usual headaches of file versions and email attachments. Set permissions so designers can edit while stakeholders can comment, keeping everyone aligned without stepping on each other's toes.
Set up different permission levels for your team: give designers full edit access, marketing managers comment-only access for feedback, and executives view-only access for final approvals. This keeps your creative process smooth while ensuring everyone stays in the loop.
From Concept to Reality
The export options ensure your designs work everywhere you need them. Whether you're creating social media posts, print materials, or web graphics, you can generate the exact format and quality your channels require.
Left Sidebar
The left sidebar provides access to design tools, layers, and assets through tabbed interface:
Tools Tab
Essential design tools for creating and manipulating elements:
Selection Tools
- Select Tool (V): Default selection and manipulation tool
- Hand Tool (H): Pan around the canvas without selecting elements
Shape Tools
- Rectangle (R): Create rectangular shapes and frames
- Circle (C): Draw circles and ellipses
- Line (L): Draw straight lines and arrows
- Custom Shapes: Access to triangles, stars, polygons, and more
Content Tools
- Text Tool (T): Add and edit text elements
- Image Tool (I): Upload and place images
- AI Generator: Create content using AI assistance
Drawing Tools
- Pen Tool (P): Create custom vector paths and shapes
- Brush Tool: Freehand drawing and sketching
Layers Tab
Hierarchical view of all design elements:
Layer Management
- Layer List: Visual hierarchy of all elements
- Visibility Toggle: Show/hide individual layers (eye icon)
- Lock Toggle: Prevent accidental editing (lock icon)
- Layer Grouping: Organize related elements together
Layer Operations
- Drag & Drop: Reorder layers to change stacking order
- Duplicate: Create copies of existing layers
- Delete: Remove unwanted elements
- Rename: Give descriptive names to layers
Layer Search
- Filter Layers: Quickly find specific elements by name
- Layer Types: Filter by element type (text, image, shape)
Assets Tab
Manage and organize your design resources:
Asset Library
- Uploaded Assets: Your personal image and graphic library
- Stock Photos: Integration with Unsplash and other providers
- Brand Assets: Company logos, colors, and fonts
- Recent Assets: Quick access to recently used items
Asset Management
- Upload: Drag and drop files or browse to upload
- Organize: Create folders and collections
- Search: Find assets by name, tag, or type
- Favorites: Mark frequently used assets
Canvas Area
The central workspace where your design comes to life:
Canvas Features
- Infinite Canvas: Zoom and pan without boundaries
- Rulers: Horizontal and vertical measurement guides
- Grid System: Snap-to-grid for precise alignment
- Guides: Custom alignment guides you can drag from rulers
Element Manipulation
- Multi-selection: Select multiple elements with Shift+click or drag selection
- Transform Handles: Resize, rotate, and skew elements
- Smart Guides: Automatic alignment suggestions
- Snap to Elements: Align with other design elements
Context Menu
Right-click any element or empty canvas area to access:
- Copy/Paste: Duplicate elements (Ctrl+C / Ctrl+V)
- Bring to Front/Back: Change layer order
- Group/Ungroup: Organize multiple elements
- Lock/Unlock: Prevent accidental changes
- Delete: Remove selected elements
Zoom and Navigation
- Mouse Wheel: Zoom in/out at cursor position
- Spacebar + Drag: Pan around the canvas
- Zoom Shortcuts: Ctrl+Plus/Minus for zoom control
- Fit to Screen: Double-click empty area to fit canvas
Right Panel
The properties panel adapts based on your current selection:
Element Properties
When elements are selected, access detailed controls:
Transform Properties
- Position: X and Y coordinates
- Size: Width and height dimensions
- Rotation: Angle in degrees
- Opacity: Transparency level (0-100%)
Style Properties
- Fill: Solid colors, gradients, or patterns
- Stroke: Border color, width, and style
- Shadow: Drop shadow and inner shadow effects
- Blur: Gaussian blur effects
Text Properties
For text elements, additional typography controls:
Font Settings
- Font Family: Choose from system and Google Fonts
- Font Weight: Bold, regular, light variations
- Font Size: Adjustable in pixels or points
- Line Height: Spacing between text lines
Text Formatting
- Alignment: Left, center, right, justify
- Text Decoration: Underline, strikethrough
- Text Transform: Uppercase, lowercase, capitalize
- Letter Spacing: Character spacing adjustment
AI Assistant Panel
Integrated artificial intelligence features:
AI Design Generation
- Prompt Input: Describe what you want to create
- Style Options: Choose from various design styles
- Element Generation: Create specific design elements
- Layout Suggestions: Get AI-powered layout recommendations
Smart Editing
- Auto-resize: Intelligent element resizing
- Color Harmony: AI-suggested color palettes
- Font Pairing: Recommended font combinations
- Content Suggestions: AI-generated text and copy
Keyboard Shortcuts
Essential shortcuts for efficient design work:
Selection and Navigation
- V: Select tool
- H: Hand tool (pan)
- Spacebar: Temporarily activate hand tool
- Ctrl+A: Select all elements
- Escape: Deselect all
Tools
- R: Rectangle tool
- C: Circle tool
- T: Text tool
- I: Image tool
- L: Line tool
Editing
- Ctrl+Z: Undo
- Ctrl+Y: Redo
- Ctrl+C: Copy
- Ctrl+V: Paste
- Ctrl+D: Duplicate
- Delete: Remove selected elements
View
- Ctrl+Plus: Zoom in
- Ctrl+Minus: Zoom out
- Ctrl+0: Fit to screen
- Ctrl+1: Actual size (100%)
Learning these keyboard shortcuts can dramatically speed up your design workflow. Start with the basics like V for select, T for text, and Ctrl+D for duplicate. Once these become muscle memory, you'll find yourself designing much faster and more fluidly.
Mobile and Tablet Support
The Design Editor is optimized for touch devices:
Touch Gestures
- Pinch to Zoom: Two-finger zoom in/out
- Two-finger Pan: Navigate around canvas
- Tap to Select: Select elements with single tap
- Long Press: Access context menu
Mobile Interface Adaptations
- Collapsible Panels: Sidebars can be hidden for more canvas space
- Touch-friendly Controls: Larger buttons and touch targets
- Gesture Recognition: Swipe gestures for common actions
- Responsive Layout: Interface adapts to screen size
Performance Features
The editor is optimized for smooth performance:
Rendering Optimizations
- Hardware Acceleration: GPU-accelerated canvas rendering
- Lazy Loading: Assets load only when needed
- Viewport Culling: Only visible elements are rendered
- Progressive Loading: Large designs load incrementally
Memory Management
- Asset Caching: Intelligent caching of frequently used assets
- Undo History Limits: Configurable history depth
- Automatic Cleanup: Unused resources are freed automatically
- Background Processing: Non-blocking operations
This interface overview provides the foundation for understanding how to navigate and use the Canvelete Design Editor effectively. Each component works together to provide a seamless design experience that scales from simple graphics to complex multi-element compositions.
Next Steps
- Explore Canvas Tools for detailed tool documentation
- Learn about Layer Management for organizing complex designs
- Set up Collaboration for team workflows
- Start creating at canvelete.com/dashboard (opens in a new tab)