---
name: direct-manipulation
description:
  Los usuarios interactúan directamente con objetos en lugar de comandos
  abstractos. Use cuando diseñe editores, interfaces drag-and-drop, o sistemas
  de manipulación visual.
metadata:
  author: ux-ui-skills
  version: "1.0"
  category: design-principles
---

# Manipulación Directa

## Resumen

Los usuarios interactúan directamente con objetos en pantalla, viendo el
resultado inmediato de sus acciones. Es más intuitivo que ingresar comandos o
navegar menús.

## Origen

- **Autor**: Ben Shneiderman
- **Año**: 1983
- **Fuente**: "Direct Manipulation: A Step Beyond Programming Languages"

## Características

### Visibilidad de Objetos

- Objetos de interés siempre visibles
- Estado actual representado visualmente
- Opciones disponibles perceptibles
- Sin comandos abstractos

### Acciones Incrementales

- Operaciones pequeñas y reversibles
- Feedback inmediato
- Cambios visibles en tiempo real
- Exploración sin riesgo

### Reversibilidad

- Cada acción se puede deshacer
- Estados anteriores accesibles
- Errores fácilmente corregibles
- Experimentación segura

## Aplicación en Diseño

### Drag and Drop

- Mover archivos arrastrando
- Reordenar listas
- Organizar layouts
- Conexiones visuales (diagramas)

### Resize y Transform

- Handles para redimensionar
- Rotate con gestos
- Crop con marquee
- Scale con pinch

### Editores Visuales

- WYSIWYG text editors
- Design tools (Figma, Sketch)
- Video editors (timeline)
- Code editors (live preview)

### Controles Interactivos

- Sliders en lugar de inputs numéricos
- Color pickers visuales
- Maps con pan/zoom
- Charts interactivos

## Ejemplos

- **Figma**: Diseño completamente visual
- **Trello**: Cards que se arrastran entre columnas
- **Google Maps**: Pan, zoom, street view
- **iOS Photos**: Gestos para editar
- **Notion**: Bloques arrastrables

## Anti-patterns

- ❌ Comandos de texto para acciones visuales
- ❌ Formularios para lo que podría ser visual
- ❌ Sin feedback durante la manipulación
- ❌ Acciones no reversibles
- ❌ Manipulación sin mostrar resultado

## Beneficios

- Menor curva de aprendizaje
- Mayor sensación de control
- Exploración más natural
- Errores más fáciles de detectar
- Más engagement

## Métricas

- **Task Completion Time**: Más rápido con manipulación directa
- **Error Rate**: Errores detectados durante acción
- **Learning Time**: Tiempo para dominar
- **User Satisfaction**: Preferencia por interfaces directas

## Principios Relacionados

- [[affordances]] - Objetos que invitan a manipulación
- [[feedback-principle]] - Resultado inmediato visible
- [[nielsen-user-control]] - Control directo del usuario

## Referencias

- Shneiderman, B. (1983). "Direct Manipulation: A Step Beyond Programming
  Languages"
- Hutchins, E. et al. (1985). "Direct Manipulation Interfaces"
- https://www.interaction-design.org/literature/article/direct-manipulation


---
Source attribution: vjrivmon
Original project: https://github.com/vjrivmon/Setup-Software-IA/blob/b5c895079bd4577e4bdd0d9b81565b53090be50d/.claude/skills/ux-ui/design-principles/direct-manipulation/SKILL.md
License: MIT
License information: https://opensource.org/license/mit
Original upstream instructions; downloaded from Dave AI.

## Upstream license notice

MIT License

Copyright (c) 2025 Vicente Rivas Monferrer

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.



# Dave AI resource metadata

Creator / publisher: vjrivmon
Original project: https://github.com/vjrivmon/Setup-Software-IA/blob/b5c895079bd4577e4bdd0d9b81565b53090be50d/.claude/skills/ux-ui/design-principles/direct-manipulation/SKILL.md
Attribution basis: Recovered original package and original project license at a pinned revision

Fields of work: Design, Development & Engineering
Roles: Frontend Developer, Graphic Designer, Product Designer, UX Designer, UX Writer
Specialties: Cross Platform, Design
Tools: Figma, Notion
Country applicability: Country not specified
Classification basis: Source catalog labels
Instruction SHA-256: 8721627da9cf234f8794c771607b881b485d84457c93ed8d41cc4971b0f96fa4
Metadata reviewed: 2026-10-27
This metadata supersedes earlier Dave AI catalog attribution. Original instruction and supporting files are preserved.