Gallery
See what others have created
tangiblemining
@tangiblemining
Connecting & Linking
Design a screen or small flow for connecting related items: accounts, tools, pages, contacts, or steps. The user should be able to see what is already linked, choose something new to connect, and confirm the relationship without losing context.
Make the connection logic visible. Show source and target clearly, use a consistent pattern for linked, available, and disconnected states, and make it obvious when a link is directional, bidirectional, or pending approval. If the flow spans multiple screens, keep the previous selection visible as the user moves forward.
Include the moments that usually break these flows: no matches, already connected, connection failed, and edit or remove link. Each state should tell the user what happened and what to do next. Keep the primary action obvious, but let the user back out or revise the connection before it is saved.
What to deliver
- Design a flow that links 3–5 related steps or screens.
- Show the connection state between items before the user commits.
- Use one clear visual system for links, arrows, or step-to-step relationships.
- Include a back, edit, or rewire action where the path can change.
- Add at least one empty or disconnected state with a next step.
To make the flow more engaging, incorporate micro-interactions that respond to user actions, giving immediate feedback and a sense of progress.