AI Import

To use the AI Import feature, you need an Anthropic API key. You can register the API key from "Help & Settings" on the AI Import screen.

• Obtaining an API Key
  Visit Anthropic Console, create an account, and obtain an API key.
• Registering the API Key
  Tap the "Help & Settings" button at the top of the AI Import screen and enter the API key in "Anthropic API Key".

Practice Mode: Practice mode is available to try out the AI Import functionality. You can confirm component detection results using sample data.

1. Open AI Import

Tap the add item button ("+") in the toolbar on the editing screen, and select "AI Import" from the menu.

2. Select an Image

Import a screen image using one of the following methods on the AI Import screen:

• Select Image
  Tap the "Select Image" button to select an image from your photo library.
• Practice
  Select a sample by title from the Practice section to try out AI Import:
• Control Panel (31 items) — Regular components (labels, buttons, value fields, meters)
• Matrix Tables (9 items) — Matrix (tabular data)

3. Select Detection Mode

Choose a detection mode according to the image content:

• Without Matrix
  Detects regular components (labels, buttons, value fields, meters, etc.). Suitable for screens without tabular layouts.
• Matrix Only
  Detects only matrices (tabular layouts). Suitable for screens containing tabular layouts.

4. Run Analysis

Tap the "Analyze" button, and AI will analyze the image to detect components. When detection is complete, a list of detected components will be displayed.

5. Review and Edit Detection Results

You can review and edit information for each component in the detected components list:

• Component Type
  Change the component type (Label / Button / Value Field / Meter / Matrix) using the Picker.
• Title
  Edit the text displayed on the component.
• Unit (Value Field / Meter only)
  Toggle units automatically detected by AI on/off by tapping. Examples: "°C", "kg", "pcs", "%", etc.
• Editable (Value Field only)
  Tap the pencil icon to toggle whether the value field is editable.
• Background Color and Text Color
  View the background color and text color of components with color circles.
• Borders (Matrix only)
  Review and change the presence of borders determined by AI.
• Header Background Color (Matrix only)
  View the header background color with a color circle labeled "H".

6. Place on Page

Tap the "Place Selected" button to place the detected components on the page being edited. Components are placed based on their position and size in the image.

7. Re-analyze

If the detection results are not as expected, you can re-analyze using the "Re-analyze" button.

Detectable Components

• Label — Text display
• Button — Button
• Value Field — Numeric display/input field
• Meter — Meter (gauge)
• Matrix — Data table (row/column grid)

Automatically Detected Information

• Position and Size
  Detects the position and size of components in the image as percentages.
• Text Content
  Recognizes Japanese and English text.
• Background Color and Text Color
  Detects component colors by color name (Red / Blue / Green, etc.).
• Numeric Units
  Automatically extracts units from value field or meter titles. Example: "85.23 °C" → unit: "°C", decimal places: 2
• Decimal Places
  Automatically determines the number of decimal places from the displayed numbers.
• Matrix Structure
  Detects number of rows/columns, presence of headers, and presence of borders.

Tips for Improving Detection Accuracy

• Image Quality
  Use clear, in-focus images.
• Image Size
  Larger images provide better accuracy.
• Margins
  Crop to include only necessary components without unnecessary parts.
• Detection Mode
  Select the appropriate detection mode (Without Matrix / Matrix Only) according to the image content.

Analysis results are cached on device. When analyzing with the same image and instructions (additional instructions) combination, results are loaded instantly from cache without API calls.

• Checking Cache
  When results are from cache, "(Cached)" is shown in the detection results header.
• Getting Fresh Results
  To get new analysis results without using cache, tap the "Re-analyze" button.

Cache saves API call costs and time when repeatedly analyzing the same image.

• Device Assignment
  Components placed by AI Import do not automatically have device names assigned. Set device names for each component in the inspector after placement.
• Fine-tuning
  The position and size of placed components can be manually adjusted after placement.
• Deleting Components
  Unwanted components can be selected and deleted. To delete all placed items at once, use Undo.
• Color Customization
  Colors can be changed in the inspector after placement.
• Editing Matrices
  For placed matrices, refer to the Matrix documentation to configure templates and device offsets.
• About Cost
  AI Import uses Claude Haiku 4.5 (low cost).

When using the AI Import feature, the selected image is sent to Anthropic's Claude API for processing. Please be careful if the image contains confidential information.

In Practice mode, images are not sent to the server. Sample data is stored within the app and works offline.