# User Interface Overview

Overview of the application interface and panels.

## Short Summary

This page describes the main interface elements and how to use them effectively.

## Main Interface Elements

### Top Bar

- File operations: Load images, videos, or 3D models.
- Export: Open export settings panel.
- Compare: Toggle between After, Before, and Split view modes.
- View options: Fullscreen and interface scaling.

### Viewport

- Central area displaying your content with applied effects.
- Real-time preview updates as you adjust settings.
- Drag-and-drop zone for loading files.

### Settings Panel (Right Side)

#### Mode Section

- **Algorithm dropdown**: Select visual effect to apply.
- **Style dropdown**: Choose style variant (for ASCII and Bayer).

#### Settings Section

- Canvas size: Width and Height controls (linked by default for images/video).
- Algorithm-specific parameters appear here when you select an algorithm.
- Reset button appears when settings are changed from defaults.

#### Adjustments Section

- **Brightness, Contrast, Saturation**: Global color adjustments.
- **Chromatic Aberration**: RGB channel offset effect.
- **Bloom**: Glow effect controls (strength, radius, threshold).
- **Light Intensity**: Brightness multiplier for final output.
- **Reset button** appears when adjustments are changed from defaults.

#### Palette Section

- Gradient palette bar showing available color palettes.
- Click a palette to apply it, or double-click to edit it.
- Add custom palette button (+).
- Gradient map toggle and settings.

#### Presets Section:

- Save current settings as named presets.
- Load previously saved presets.
- Delete presets.

### Zoom Controls

- Zoom in (+) and zoom out (-) buttons.
- Reset zoom button.
- Displays current zoom percentage.

### 3D Controls Panel (3D Mode)

- Camera position presets.
- Background​
- Ambient Color​
- Ambient Intensity​
- Directional Color​
- Directional Intensity​
- Camera Type (Persp / Ortho)​
- Field of View​
- Light Direction (Directional Light / Ambient Light)​
- Texture​
- Reset Settings​
- Toggle shortcut

### Palette Management Modals

#### Add/Edit Palette Modal

- Create new custom palettes or edit existing ones.
- Color picker for each palette color.
- Add or remove color stops.
- Save or cancel changes.

#### Font Selector Panel (ASCII Algorithms)

- Choose from system fonts, bundled fonts, or Google Fonts.
- Preview font appearance.
- Search fonts.

### Export Settings Panels

#### Image Export Panel

- Filename input.
- Format selection (PNG, JPEG, WebP).
- Output path selection.

#### Video Export Panel

- Filename input.
- Codec selection (H.264, Lossless, GIF, PNG Sequence).
- Quality settings (for H.264).
- Output path selection.

#### 3D Export Panel

- Export type: Image or Video.
- Video settings: Duration, FPS, Loop.
- Codec and quality (same as video export).
- Output path selection.

### Error and Info Modals

- Display error messages, warnings, and informational alerts.
- Show export progress and status.

## Using the Interface

- Panels can be collapsed or expanded by clicking section headers.
- Hover over controls to see tooltips (where available).
- Reset buttons appear automatically when you change default values.
- The interface scales with the UI Scale setting.

## Tips

- Keep the Settings panel open while adjusting effects to see parameter changes immediately.
- Use Compare mode to evaluate your changes against the original.

* * *

See [quick-start](/content/docs/quick-start/index.html) for a practical workflow using these interface elements.