Diseño de apps iOS: Human Interface Guidelines explicadas
Las Human Interface Guidelines (HIG) de Apple son el documento más importante que existe para diseñar apps iOS. Definen cómo debe verse, sentirse y comportarse una app en el ecosistema Apple. Seguirlas no es solo buena práctica — es la diferencia entre una app que Apple destaca y una que los usuarios abandonan después del primer uso.
Las HIG no son un documento estático. Apple las actualiza cada año con WWDC, incorporando nuevos patrones, componentes y filosofías de diseño. En este artículo explicamos los principios fundamentales que aplican en 2026 y cómo impactan directamente en el éxito de tu app.
Los tres principios fundacionales
Apple basa su filosofía de diseño en tres ideas que permean cada decisión:
Claridad
El texto es legible a cualquier tamaño. Los iconos son precisos y reconocibles. Los adornos son sutiles y apropiados. Cada elemento de diseño tiene un propósito funcional. Si algo está en la pantalla, el usuario debe entender instantáneamente por qué está ahí.
Deferencia
La interfaz ayuda a entender e interactuar con el contenido, pero nunca compite con él. El contenido es el protagonista, no el chrome. Los bordes, degradados y sombras se usan con moderación. El espacio en blanco es una herramienta de diseño, no espacio desperdiciado.
Profundidad
Las capas visuales y el movimiento realista comunican jerarquía. Las transiciones ayudan a entender la relación entre pantallas. El movimiento no es decoración — es información. Cuando una vista se desliza desde la derecha, el usuario entiende que puede volver deslizando hacia la izquierda.
Navegación: los patrones que funcionan
iOS tiene patrones de navegación establecidos que los usuarios ya conocen. Respetarlos significa que tu app es inmediatamente intuitiva:
| Patrón | Componente | Cuándo usarlo |
|---|---|---|
| Tab Bar | Barra inferior con iconos | Secciones principales de la app (3-5 tabs) |
| Navigation Stack | Barra superior con back button | Jerarquías de contenido (lista → detalle) |
| Modal / Sheet | Vista que aparece desde abajo | Acciones temporales, formularios, confirmaciones |
| Sidebar | Panel lateral (iPad/Mac) | Navegación en pantallas grandes |
El error más común: usar un hamburger menu (≡) en iOS. Los usuarios de iPhone no lo esperan. Apple no lo usa en ninguna de sus apps. Un Tab Bar es siempre la mejor opción para navegación principal.
Tipografía: San Francisco y Dynamic Type
Apple diseñó San Francisco (SF Pro) específicamente para sus pantallas. Es la fuente del sistema y la base de toda app iOS. SwiftUI la usa por defecto con un sistema de estilos semánticos:
- .largeTitle: 34pt, para títulos principales de pantalla.
- .title: 28pt, para secciones importantes.
- .headline: 17pt semibold, para encabezados de contenido.
- .body: 17pt, para texto de lectura.
- .caption: 12pt, para metadata y texto secundario.
El aspecto crítico es Dynamic Type: el sistema que permite al usuario cambiar el tamaño de fuente globalmente en Ajustes. Tu app debe respetar esta preferencia. Es un requisito de accesibilidad y Apple lo verifica en la revisión.
Color: sistema semántico y accesibilidad
iOS tiene un sistema de colores semánticos que se adaptan automáticamente a light mode, dark mode y alto contraste:
- .label: color del texto principal (negro en light, blanco en dark).
- .secondaryLabel: texto secundario con opacidad reducida.
- .systemBackground: fondo de la app que se adapta al modo.
- .tintColor: el color de acento de tu app (botones, enlaces, controles activos).
Usar colores semánticos en lugar de colores hardcoded es la forma más rápida de tener una app que funcione correctamente en dark mode sin esfuerzo adicional. También garantiza ratios de contraste adecuados para accesibilidad (WCAG AA como mínimo).
Componentes nativos: no reinventes la rueda
iOS provee componentes estándar que los usuarios ya conocen. Usarlos correctamente es diseño inteligente, no pereza:
- Lists: el componente más usado en iOS. Soporta swipe actions, reordenamiento, y sección de headers automáticamente.
- Sheets: modales que se presentan desde abajo con diferentes detents (alturas).
- Alerts y Confirmation Dialogs: para acciones destructivas o decisiones importantes.
- Search Bar: integrada en Navigation Bar con sugerencias y filtros.
- Context Menus: menus contextuales con long press, con previews animadas.
Cada componente nativo viene con animaciones, haptik feedback, y soporte de accesibilidad integrado. Cuando usas un componente custom en lugar de uno nativo, pierdes todo eso y necesitas reimplementarlo manualmente.
Errores de diseño que Apple rechaza
Estos son los errores de diseño más comunes que vemos en apps rechazadas por App Review:
- Botones demasiado pequeños: Apple requiere un mínimo de 44x44 puntos para targets táctiles.
- Sin soporte de Dark Mode: no es obligatorio pero genera quejas de usuarios y afecta ratings.
- Texto no escalable: fuentes con tamaño fijo que ignoran Dynamic Type.
- Navegación confusa: el usuario no puede volver a la pantalla anterior de forma intuitiva.
- Carga sin feedback: pantallas en blanco sin indicadores de progreso.
- Uso incorrecto del Safe Area: contenido que queda detrás del notch o la Home Indicator.
Diseño para todo el ecosistema
Las HIG no son solo para iPhone. Cubren iPad, Apple Watch, Mac y Vision Pro. Cada plataforma tiene sus propias consideraciones:
En iPad, las apps deben aprovechar la pantalla grande con sidebars y multi-columna. En Apple Watch, la interacción se mide en segundos, no minutos. En Vision Pro, el diseño es espacial y los elementos flotan en vidrio.
Un buen diseño iOS no es una pantalla bonita — es un sistema coherente que funciona en cada dispositivo, cada modo de color, cada tamaño de fuente, y cada contexto de uso. Las HIG son el mapa para lograrlo.
¿Necesitas un diseño que cumpla las Human Interface Guidelines y destaque en el App Store? Nuestro equipo diseña apps que Apple ama. daniel@xpandia.co