Start a website redesign by defining the decisions people need to make, the evidence they need, and how they can recover from a mistake. Use AI to explore and refine the interface around that brief. A polished screen is useful only when it supports a useful outcome.

A homepage can look expensive and still leave a visitor stranded. A product page can win a design review while hiding the information a buyer needs. An AI assistant can produce a convincing answer without giving someone a reliable next step.

The design problem begins before the layout. What does this person need to understand, choose or do—and what would make that choice reasonable?

Give the agent a decision brief

AI-assisted design is already more specific than asking for a mockup. Figma’s current documentation describes an agent that can generate and remix designs, adjust layouts, reference connected components and variables, and provide feedback. Its guide identifies the feature as beta, with editing dependent on seat and file access. These are documented capabilities, not results from a hands-on test. [1]

That gives a designer more ways to explore. It does not establish whether the generated experience serves the right audience or solves the right problem.

Instead of prompting “make this more premium,” specify the decision, the available evidence and the constraints. Ask for alternatives with different information priorities. Ask which assumptions each option makes. Treat the response as a design proposal to inspect.

Here is an original Decision Brief to complete before generating screens. It is a practical project tool, not a validated scoring instrument.

Decision Brief: define the work before the layout
FieldWhat to write
Person and situationWho is using this, on what device, under what constraints?
DecisionThe specific choice or action they need to complete.
EvidenceFacts, comparisons or explanations needed to choose responsibly.
UncertaintyWhat the interface cannot know or should not imply.
ConsequenceWhat happens after the action, including meaningful costs.
RecoveryHow someone changes, cancels or corrects the choice.
Success evidenceWhat observation would show the person understood and completed the task.

This brief works whether the interface is a WordPress block pattern, a WooCommerce flow or a custom application. It describes the experience the technology must support.

Design the moment of commitment

Illustrative scenario: a facilities buyer is selecting a replacement component from a B2B catalog. The decision depends on dimensions, compatibility and delivery requirements. The buyer may need a quote rather than immediate checkout.

A large product photograph and an energetic “Buy now” button do not resolve missing compatibility information. A useful design could put specifications beside the selection, show what remains unverified, and offer a route to confirm fit. An assistant could help explain the specifications, while keeping uncertain compatibility explicit.

A sample design prompt might be:

Explore two mobile layouts for a buyer comparing replacement components. Use the existing component library. Keep verified specifications distinct from unknown compatibility. Include a path to request confirmation before ordering. Show how the buyer edits the selection and explain the next step after submitting.

The point is not to force every purchase through an extra screen. It is to match the interaction to the consequence.

GOV.UK’s check-answers pattern gives users a review step before submitting information, with ways to change individual answers while preserving previous input. The transferable lesson is to design review and correction deliberately; the exact pattern still needs evaluation in your own service. [2]

Your design system needs behavior

A library of buttons and colors helps keep an interface coherent. It also needs rules for states and meaning: when a button is disabled, how an error is explained, what a loading state promises, and what confirmation actually confirms.

Document those rules alongside typography, spacing and components. Give AI tools approved examples of empty, loading, error and successful states. Otherwise, a prompt can produce a beautiful collection of unrelated assumptions.

Using an established pattern is a starting point, not proof that your implementation works. GOV.UK explicitly describes the role of user research in deciding whether patterns can be used or adapted. Test the actual workflow with the people who will use it. [3]

Human review belongs at three points: approving the decision brief, selecting a direction using evidence, and evaluating the implemented interaction. A critique generated by a model can suggest issues to investigate. It cannot substitute for watching a person struggle, misunderstand or recover.

Accessibility changes the composition

Accessibility belongs in the first layout discussion. Reading order, keyboard operation, focus, labels, error messages and contrast shape how a decision is presented.

For example, WCAG 2.2’s Level AA target-size criterion specifies at least 24 by 24 CSS pixels, with defined exceptions including spacing. Its focus requirements also matter when sticky elements or overlays obscure controls. These are specific criteria within a broader standard—not a declaration that a screen or site is fully accessible. [4]

Test a complete task with keyboard navigation, zoom and representative assistive technology. Check whether essential information remains understandable without relying on color, hover or animation. A generated accessibility critique is a useful lead, not a conformance assessment.

Motion can explain a state change or connect related views. My recommendation is to provide a reduced-motion experience and keep important content available without waiting for theatrical reveals. WCAG distinguishes different motion requirements; disabling nonessential interaction-triggered animation is specifically a Level AAA criterion. [4]

Make the brand survive the template

Brand differentiation requires decisions that a competitor could not adopt unchanged.

Remove the logo from a proposed page. Does the language, evidence, photography and prioritization still express a recognizable point of view? Or could it represent any business with a new accent color?

This is an editorial test, not a scientific measure. It is useful because it pushes the review beyond surface decoration.

Distinctive art direction and familiar controls can coexist. Reserve experimentation for places where it adds meaning; keep important actions legible and predictable.

Consider trends through that lens. A bento grid helps when its grouping clarifies related information; it can fragment a comparison that needs a shared scale. Oversized typography can establish hierarchy; it can also bury the answer below the fold. Scroll effects can support a story; they can interrupt someone trying to locate a specification. Evaluate the effect on the task before approving the look.

If AI is in the interface, design disagreement

Using AI to make a design and putting AI inside the product are different choices. The latter adds another question: what happens when its suggestion is wrong?

The 2019 CHI paper Guidelines for Human-AI Interaction recommends making capabilities and limitations understandable, helping users dismiss or correct unwanted output, and handling uncertainty. That research predates today’s generative design agents; it supplies useful interaction principles, not a benchmark of current tools. [5]

A recommendation should leave room for inspection and disagreement. Show relevant evidence, preserve the user’s input and make correction understandable. Avoid turning a confident tone into an implied guarantee.

My prediction is that easier generation will raise the value of clear briefs and careful evaluation. More visual options will make choosing well more important. That is an opinion about direction, not a measured productivity claim.

For your next redesign, complete one Decision Brief, generate two genuinely different approaches, and test the same task in both. Observe understanding, completion and recovery. Then choose the screen that helps people make the decision.

Sources

  1. Figma: Work with the agent in design files — Current capabilities, beta status and access conditions.
  2. GOV.UK: Check answers — Review and correction patterns.
  3. GOV.UK: Get started — Research-informed adaptation of design-system patterns.
  4. W3C: Web Content Accessibility Guidelines 2.2 — Accessibility criteria and conformance levels.
  5. Amershi et al.: Guidelines for Human-AI Interaction — CHI 2019, May 4–9, 2019; foundational primary research, not a current generative-tool benchmark.

Sources checked October 5, 2026.