Visual Process
A vertical sequence of numbered process phases each pairing a Placeholder artefact frame with a short paragraph naming the concrete finding or decision from that phase.
A vertical sequence of numbered process phases each pairing a Placeholder artefact frame with a short paragraph naming the concrete finding or decision from that phase.
The Portfolio Collection unlocks the source for every Portfolio block. All Access unlocks every Collection.
Already purchased? Log in
Visual Process walks through five phases of the Tend onboarding redesign (Discovery, Mapping, Prototyping, Testing, Handoff and ship) as a vertical sequence of rows, each pairing a Placeholder at aspect-4/3 with a numbered phase name and a short paragraph. The captions are concrete: six interviews, nine of 14 required fields deferred, a labelling problem found overnight and revised, all five test teams completing step one in 45 seconds. The lede names the duration: five phases over six weeks.
Steps are a typed array. Showing the primary artefact from each phase as a Placeholder frame is the distinctive structure: it reads as a documented process rather than a summary.
Reach for this block as the process section of a project case study page, after the challenge-and-solution framing and before the impact summary. The installer replaces each Placeholder with the real artefact (wireframe, prototype screenshot, test recording) and rewrites each caption around their actual steps.
A natural flow around it on a Portfolio Pro page:
Before
After
One strong use is a UX or product case study that documents how rather than just what. Other uses:
Tip: a caption that names a specific finding or decision from that phase beats a caption that just describes what the phase was called.