About this block

Before and After Design shows the Tend app redesign as a side-by-side pair of Placeholder visuals with a hard constraint called out in the lede: no new screens, no new navigation levels. A ruled change table below names three specific decisions, Navigation, Form density, and Empty states, each with the old state on the left and the new one on the right.

The three changes are one array. The constraint sentence is the distinctive detail: it explains why the redesign took the shape it did rather than letting the visuals speak alone.

When to use

Reach for this block as the evidence section of a redesign case study or on a homepage to show before and after a significant improvement. The installer swaps the client name, the constraint sentence, the two Placeholder visuals, and the three change rows.

A natural flow around it on a Portfolio Pro page:

Before

• Featured work grid

After

• Case study split
• Stats band

What you can display

One strong use is the redesign proof with a named constraint. Other before-and-after layouts:

• Visual rebrand. Logo, palette, and type shown old and new, no change table needed.
• Copy rewrite. Old and new marketing copy in a two-column text diff.
• Information architecture. Old nav tree versus new, with a one-line rationale per change.

Tip: the constraint is the credibility, a redesign with no limit named reads as arbitrary.