Warp & Weft Pro User Manual

This document explains how to use the High-Performance Web-Based Weave Generator, detailing controls from the top of the option bar (sidebar) to the bottom.

---

1. Sidebar Controls (Left Panel)

The sidebar is the command center where you control all core textile design parameters. Features are arranged from top to bottom:

1-1. Workspace & Theme

The basic settings area at the very top.

• TOGGLE THEME: Switch between 'Light Mode' and 'Dark Mode'. Reduces eye strain based on your lighting environment.
• SAVE (JSON): Save your current pattern design as a .json file. You can load this file later to modify it.
• SYNC FOLDER: Connect a local folder to load multiple saved JSON design files into the gallery at once.

1-2. Archive & Gallery

• VIEW GALLERY: Opens a gallery popup to view your saved design collection. Visually check past patterns and restore them instantly.

1-3. Textile Algorithm

The core control panel that determines the fabric's structure.

• Structure Grid:
  • Plain: Basic 1:1 interaction. Sturdy and simple.
  • Twill: Digital diagonal patterns (e.g., Denim, Gabardine).
  • Satin: Smooth pattern with long floats for high gloss.
  • Basket: Extended Plain weave creating a checkerboard effect.
  • Jacq (Jacquard): Complex, noise-based organic patterns.
  • Leno: Net-like twisted thread patterns.
  • Pile: Patterns with depth, like towels or velvet.
• Over (N) / Under (M): Set how many threads go over vs. under (e.g., 2/1 Twill).
• Satin Step (S): (Satin only) Adjusts interval between binding points.
• Resolution: Adjust pixel scale. Lower values mean finer, more detailed fabric.
• Mirror: Creates a localized symmetrical (decalcomania) reflection.
• Reset View: Resets zoom and panning to default.

1-4. Project Palette

• Upload Icon: Upload an image to extract colors. AI analyzes the image and recommends thread colors.
• Palette Grid: Displays extracted colors. Click to quickly apply them to threads.

1-5. Warp Channels (Vertical Threads)

• + Button: Add a new thread bundle.
• Color Picker: Change thread color. Use the eyedropper to pick from the palette.
• Count: Input the number of consecutive threads for this color.
• Random Dice (🎲): Generate a random color structure (2-15 items).
• Random Hash (#️⃣): Randomize thread thickness (weighted towards 1-4px).

1-6. Weft Channels (Horizontal Threads)

Manages horizontal threads. Usage is identical to Warp Channels.

---

2. Bottom Action Bar

Final output features located at the bottom of the sidebar.

• GENERATE FINAL REPORT: Creates an 'Engineering Report'. A spec sheet showing pattern type, algorithm, and color data (OKLCH).
• FHD DOWNLOAD (1KM): Instantly download the current pattern as a Full HD (1920x1080) PNG. Optimized for web sharing.

---

3. Main Viewport

• Panning: Drag the mouse to move the fabric around. (Powered by High-Performance Zero-Copy Rendering).
• Mouse Wheel: Use scroll if panning is not active.

---

4. Special Features (Modals)

Report Modal (Spec Sheet)

Appears when clicking "GENERATE FINAL REPORT".

• Engineer's Note: Leave memos about the design.
• Archive Design: Save current state to the Gallery.
• PNG Download: Save the report itself as an image.

AI Color Sampler

Appears when uploading an image in PROJECT PALETTE.

• Drag over a specific area of the image to precisely extract colors from that region.