Documentation

Steps:

• Left: Project Management Panel - Manage your editing projects and user information
• Top: Toolbar - Contains all editing tools and action buttons
• Center: Canvas Area - Main editing workspace
• Right: Properties Panel - Adjust selected element properties and manage layers

Steps:

• Click tools in the toolbar to switch editing modes
• Click elements on the canvas to select them
• Drag elements to move them, drag corners to scale proportionally
• Click blank area outside the canvas to switch to the layer panel
• The right panel automatically switches based on the selected element

Steps:

• Click the top "Insert Image" button to switch to the right-side Insert Image primary panel.
• Enable the "Auto Background Removal" toggle; uploaded or generated product images will automatically have backgrounds removed.

Steps:

• Click the top "Insert Image" button to switch to the right-side Insert Image primary panel.
• Select "Product Photo Generation" in the right panel to enter the Product Photo Generation secondary panel.
• In the Product Photo Generation secondary panel, enter a natural language description and click the "Generate" button at the bottom. Please wait patiently for the product image to be generated.
• Once generated, the product image is automatically inserted into the center of the canvas and a layer is created.

Steps:

• Click the top "Insert Image" button to switch to the right-side Insert Image primary panel.
• Click the "Upload Image" area in the right panel to select local product images.
• After uploading, the product image is automatically inserted into the center of the canvas and a layer is created.

Steps:

• Click the top "Insert Image" button to switch to the right-side Insert Image primary panel.
• Click the "History Images" area in the right panel to select from historical images.
• Selected history images are automatically inserted into the center of the canvas and a layer is created.
• History images can be deleted at any time.
• You can enter the History Images secondary panel to view all history images.

Steps:

• After selecting an image, the right properties panel automatically focuses on the image property controls.
• Adjust parameters in the image property control area with real-time preview.

Steps:

• Select the image and press the Delete/Backspace key
• Or click the delete button at the bottom of the properties panel

Steps:

• After selecting an image element, click the "Copy" button at the bottom of the right properties panel.
• The copied image element is automatically inserted into the canvas and a layer is created.

Steps:

• Click the top "Add Text" button to switch to the right-side Add Text primary panel.
• In the Add Text primary panel, click the "Add Text" button in the right panel to add a text editing box to the canvas.
• After entering text in the editing box, click outside the box to exit edit mode; the text will automatically create a layer.
• The text box can be dragged to move and corners dragged to scale proportionally.

Steps:

• Click the top "Add Text" button to switch to the right-side Add Text primary panel.
• Select a preset style in the right panel; clicking applies it to the canvas and creates the corresponding layer.

Steps:

• After selecting text, the right properties panel automatically focuses on the text property controls.
• Adjust parameters in the text property control area with real-time preview.

Steps:

• Double-click text to enter edit mode and modify content.
• Use the properties panel to set font, size, color, etc.
• The text box can be dragged to move and corners dragged to scale proportionally.

Steps:

• Select the text and press the Delete/Backspace key
• Or click the delete button at the bottom of the properties panel

Steps:

• After selecting a text element, click the "Copy" button at the bottom of the right properties panel.
• The copied text element is automatically inserted into the canvas and a layer is created.

Steps:

• Click the top "Canvas Background" button to switch to the right-side Canvas Background primary panel.
• Click the "AI Generate" button in the right panel to enter the AI Background Generation secondary panel.
• In the AI Background Generation secondary panel, enter a natural language description and click the "Generate" button at the bottom. Please wait patiently for the background to be generated.
• Once generated, the background is automatically applied to the canvas and the background layer is updated.

Steps:

• Click the top "Canvas Background" button to switch to the right-side Canvas Background primary panel.
• Click the "Upload Image" area in the right panel to select local background images.
• After uploading, the background is automatically applied to the canvas and the background layer is updated.

Steps:

• Click the top "Canvas Background" button to switch to the right-side Canvas Background primary panel.
• Click the "History Background" area in the right panel to select from historical backgrounds.
• Selected history backgrounds are automatically applied to the canvas and the background layer is updated.
• History backgrounds can be deleted at any time.
• You can enter the History Background secondary panel to view all history backgrounds.

Steps:

• Click the top "Canvas Background" button to switch to the right-side Canvas Background primary panel.
• Click the "Scenes" area in the right panel to select scene presets.
• Selected scenes are automatically applied to the canvas and the background layer is updated.
• You can enter the Scenes secondary panel to view all scene presets.

Steps:

• Click the top "Canvas Background" button to switch to the right-side Canvas Background primary panel.
• Click the "Colors" area in the right panel, select solid or gradient buttons to enter the secondary panel.
• In the secondary panel, select a color preset; clicking applies it to the canvas and updates the background layer.

Steps:

• Click the top "Canvas Size" button to switch to the right-side Canvas Size primary panel.
• The panel top shows the current canvas size, below shows multi-platform standard preset sizes.
• Select a preset size based on your needs; clicking applies it to the canvas and updates the canvas size.

Steps:

• Click blank area outside the canvas; the right panel automatically switches to the layer panel.
• Top layers display in front; bottom layers display at the back.
• Background layer always stays at the bottom of the canvas and cannot be moved or edited.
• Drag layers to reorder; dragging uses snap linkage for smooth user experience.
• Click the eye icon to toggle layer visibility.
• Click the pencil icon to rename layers.

Steps:

• Click the top "Save Project" button to switch to the right-side Save Project primary panel.
• Enter a project name or use the preset name (starting with aluo_project_).
• Click the "Save" button at the bottom and wait for data processing.
• After successful save, the left project list updates automatically and displays the saved project file.

Steps:

• Click the top "Download Image" button to switch to the right-side Download Image primary panel.
• Use the preset filename or customize the filename.
• Use the default format or select the desired download format.
• Choose to download in original size or high definition (2x resolution).
• Click the "Download" button at the bottom and wait for data processing.
• After successful download, the image is saved locally automatically.

Steps:

• Visit the Product Photo Editor page (AI Product Photo Editor in the navigation bar)
• Upload 1-5 reference images (supports JPG, PNG, WEBP formats, max 20MB per file)
• Enter a natural language description of your editing needs (e.g., "Change product color to red", "Add a coffee cup")
• Select output format and aspect ratio (optional)
• Click the generate button and wait for AI processing (usually 30-90 seconds)
• Download directly or continue editing after generation

Steps:

• Change color: "Change product to blue"
• Add elements: "Add a coffee cup on the desk"
• Replace background: "Change background to beach scene"
• Adjust composition: "Center the product"
• Modify details: "Remove text labels from product"

Steps:

• Click the AI assistant icon in the bottom right corner to open the chat window
• Enter your question or request
• AI will provide professional answers and suggestions based on context
• Continue asking follow-up questions; AI remembers conversation history
• Start a new session or view conversation history as needed

Steps:

• Feature consultation: "How do I remove image backgrounds?"
• Design suggestions: "What background suits this product image?"
• Troubleshooting: "Why can't I upload my image?"
• Creative inspiration: "Give me some e-commerce banner design ideas"
• Quick tutorials: "Teach me how to use layer management"

Steps:

• Enable "Auto Background Removal" in the Insert Image panel
• Upload images with complex edges (e.g., people, pets)
• AI automatically recognizes and preserves detailed edges
• Processing time ranges 3-10 seconds depending on image complexity
• Generated transparent background images work in various scenarios

Steps:

• Click the "Insert Image" button at the top to switch to the Insert Image panel
• Select "Product Photo Generation" in the right panel to enter the generation panel
• Enter a detailed product description (e.g., "a red coffee mug on a wooden table")
• Select output format (JPG/PNG/WEBP) and aspect ratio (1:1, 16:9, 3:2, etc.)
• Choose the number of images to generate (1, 2, or 4 variants)
• Click the "Generate" button and wait 30-90 seconds
• Generated images are automatically inserted into the canvas center and a layer is created

Steps:

• Hold left mouse button and drag in canvas blank area to box-select multiple elements
• Or hold Shift key and click multiple elements for multi-selection
• Selected elements can be moved together by dragging
• Scale proportionally through unified bounding box corners
• Supports rotation control points for batch rotation
• Press Delete/Backspace to batch delete selected elements

Steps:

• Alignment guides appear automatically when dragging near other elements
• Guide types include: horizontal center, vertical center, edge alignment, etc.
• Slight snapping effect when elements align
• Guides display as blue dashed lines and disappear after mouse release

Steps:

• Enable "Auto Background Removal" in the Insert Image panel
• Upload images with complex edges (e.g., people, pets)
• AI automatically recognizes and preserves detailed edges
• Generated transparent background images work in various scenarios

Steps:

• Supports generating 1, 2, or 4 variant images
• Choose from multiple aspect ratios (1:1, 16:9, 3:2, etc.)
• Supports JPG, PNG, WEBP output formats
• Asynchronous processing allows continuing other operations during generation
• Automatic notification upon completion

Steps:

• Click the top "Undo/Redo" button to revert the previous action.
• Click the bottom "+" and "-" buttons to zoom the canvas display ratio.
• Click the bottom "Reset" button to reset the canvas display ratio.