Inline Editing Interaction

Here’s a snippet of a project we're working on. Inline editing is a simple, but effective way to quickly manipulate data in context, as opposed to seeing a modal, or being taken to a form.

Saving changes is done by clicking the checkmark or pressing enter/return. Clicking outside of the highlighted input field cancels any changes. I’m not opposed to including an “X” for for cancelling, however I think the quick and approachable nature of this pattern removes the need for that extra assurance.

Follow our team to keep up with our latest designs, and feel free to stop by to learn more about a small studio.

Website | Instagram | Twitter

More by a small studio

View profile