About this block

Challenge Solution opens with a meta line naming the client and project (Ledger, Onboarding redesign, 2025), a section heading Getting teams past the first invite, and a full-width Placeholder at aspect-video. Below a ruled divider two columns lay out the challenge (forty percent of free signups never sent a single invite, stalled at the invite step that required a complete org chart) and the solution (three required steps, everything else deferred to an in-product checklist triggered at the natural moment, two test rounds before any code shipped).

Columns are a two-item array. The two-column split after a single wide image is the simplest honest case framing: one side names what was broken, the other names what changed and why.

When to use

Reach for this block as the opening section of a project case study page, or as a mid-page case moment on a homepage. The installer swaps the meta line for their project, rewrites both column bodies around the real constraint and the real change.

A natural flow around it on a Portfolio Pro page:

Before

• Featured work grid

After

• Visual process
• Impact summary

What you can display

One strong use is the problem-and-fix framing for a product or UX case study. Other uses:

• Before and after. Rename the headings Old approach and New approach and describe the state change.
• Brief and response. An agency block where the left column is the client brief, the right is the chosen direction.
• Research and synthesis. What the research found on the left, what it implied on the right.

Tip: the solution column earns credibility when it names the test rounds and the iteration, not just the final answer.