Skip to content

Web Interface Guide

This guide documents the full web UI shipped with the AlphaFold3 Mac Port.

The top navigation bar is available on every page and includes:

  • Home / reset: clicking the logo returns to the home page and resets the current prediction form.
  • System status badge: shows model availability and hardware summary.
  • Theme toggle: switches between light and dark themes.

Home Page: Submit Predictions

The home page is split into two main areas:

  • Prediction setup (left/main)
  • Job history (right or below on smaller screens)

Prediction Setup

The prediction setup workflow includes these UI elements.

  1. Job metadata controls
  2. Job name field (with random-name helper).
  3. Seed controls (manual seed or auto-seed behavior).

  4. Data pipeline toggle to enable/disable MSA/template search.

  5. Input import tools

  6. PDB fetch panel for importing structures by 4-character PDB ID.
  7. File upload for JSON/PDB/CIF/mmCIF inputs.

  8. Import warnings/error banner when parsing fails or fields are adjusted.

  9. Entity builder

  10. Add entities by type: protein, RNA, DNA, ligand, ion.
  11. Reorder entity cards with drag-and-drop.
  12. Configure copy count and delete entities.
  13. Per-entity input controls:
  14. Protein/RNA/DNA sequence editor with validation and residue counters.
  15. Protein PTM editor with residue grid and per-residue PTM selection.
  16. Ligand editor with CCD code mode or SMILES mode.

  17. Ion selector for common ion types.

  18. Restraint editor (restraint-guided docking)

  19. Add/remove restraints by category:
  20. Distance restraints
  21. Contact restraints
  22. Repulsive restraints
  23. Per-restraint controls include chain, residue, atom, target/sigma/threshold, and weight fields.
  24. Guidance controls include guidance scale, annealing mode, and diffusion start/end steps.

  25. Validation warnings appear inline (for example, missing chains or invalid ranges).

  26. Preview modal before submission

  27. Job summary: name, seeds, pipeline mode, chain/residue counts, and entity list.
  28. MSA cache status:
  29. Checking
  30. Cache hit (with size/timestamp)
  31. Cache miss
  32. Optional cache usage toggle.
  33. Final submit/cancel actions.

Job History Panel

The job history UI includes:

  • Search box
  • Status filters (all/running/completed/failed/queued)
  • Pagination controls
  • Job cards showing:
  • Status badge
  • Time metadata
  • Chain/residue/sample counts
  • Progress bar for active jobs
  • Inline error details for failed jobs
  • Actions: cancel, reuse inputs, delete (with confirmation)

Job Page: Progress and Results

When a job is selected, the /job view shows either live progress or completed results.

Live Progress View

For pending/running jobs, the page shows:

  • Job metadata header (name, status, chain/residue/sample counts)
  • Cancel button (when cancellation is valid)
  • Stage indicator across pipeline/model phases
  • Progress bar with percentage and stage-specific messaging
  • Error banner for failed jobs

The page receives progress events over WebSocket and updates in real time.

Completed Results View

For completed jobs, the page provides the following sections.

  1. Results header
  2. Back to jobs
  3. Reuse inputs

  4. Job metadata and sample selector

  5. Confidence summary cards

  6. pTM
  7. ipTM (complexes)

  8. pLDDT

  9. 3D structure viewer

  10. Interactive Mol* visualization of the selected CIF.

  11. Restraint overlays (distance/contact/repulsive) with pass/fail coloring.

  12. Analysis plots

  13. Per-residue pLDDT bar chart with confidence bands.

  14. PAE heatmap with hover tooltips.

  15. Sidebar actions and tables

  16. Downloads:
  17. Selected sample CIF
  18. Confidence JSON
  19. ZIP bundle of all outputs
  20. Open output directory in Finder (local-only)
  21. Sample ranking table with pTM/ipTM/pLDDT and top-ranked marker.
  22. Restraint satisfaction panel:
  23. Satisfied/total summary
  24. Per-restraint details with expected vs observed distances

UX Notes

  • The UI is optimized for local execution on macOS and expects API access from the same machine by default.
  • Validation is performed both client-side and server-side. Use /api/validate for preflight validation in automation workflows.
  • For keyboard-driven workflows, keep using CLI mode and the API together with this UI.