Pexalign Documentation
Everything you need to know to evaluate and try Pexalign.
What is Pexalign?
Pexalign is a Pre-Production Alignment Workspace where Product, Engineering, and UX teams resolve UI details before release.
Teams conditionally embed a small JavaScript snippet in their pre-production app builds. When deployed to staging, the script enables alignment capture when the app is viewed through Pexalign. Participants can click anywhere on the page to create alignment markers, add descriptions, and track fixes through a collaborative workflow. Production builds exclude the script entirely.
- Click to place alignment markers at exact pixel positions
- Drag markers to fine-tune placement at any time
- Switch between phone, tablet, and desktop views
- Track alignment status: Created → Correcting → Completed
- Collaborate through comments and assignments
Built exclusively for pre-production
Embed the script in any pre-production environment — never in production: Localhost, Staging, Development, Preview deployments, and QA environments.
Adding the Script to Your App
The fastest way to try Pexalign is to add the script to your localhost app. Add the script tag to your HTML right before the closing body tag, create a session in Pexalign with your localhost URL, and create your first alignment.
Configuring Pre-Production Environments
Use environment checks such as process.env.NODE_ENV !== 'production' to gate the Pexalign script so it only loads in pre-production environments. Never load it in production.
Creating Alignment Sessions
An Alignment Session is a named workspace that groups all alignment feedback for a specific feature, sprint, or review cycle. Each session is tied to a base URL and has a lifecycle: Open → In Review → Closed.
Creating Alignments
An Alignment is a single feedback item pinned to a precise location on your app. Toggle Aligning mode on, click anywhere on the page, and a marker appears. Drag it to reposition, click it to add a description and track its status.
App View vs Board View
App View shows your embedded app with alignment markers overlaid in place. Board View shows all alignments as cards in a structured grid — useful for managing status, filtering, and assigning work.
Multi-Step Alignments
Multi-Step Alignments let you capture sequences that span multiple pages or interactions. Each step is pinned to a different route or state of your app, letting you document entire user flows.
Realigning After App Updates
When your app changes, Pexalign detects breakpoint shifts and version changes. Guided Realignment Mode walks through each affected alignment so you can confirm or reposition markers against the updated UI.
Jira Integration
Push alignments to Jira as issues directly from Pexalign. The integration is available on the Standardize plan and above.
SAML Single Sign-On
Enterprise customers can configure SAML SSO to authenticate users through their identity provider. Supports Okta, Azure AD, and other SAML 2.0-compliant providers.