Errores comunes al diseñar para dispositivos móviles

Ya tienes una gran idea de aplicación y estás trabajando arduamente para construirla y lanzarla. O está desarrollando un sitio móvil para complementar una versión de escritorio. O tal vez esté refinando un diseño de escritorio para escalar de manera receptiva en los dispositivos.

Cualquiera que sea su objetivo para el desarrollo móvil, antes del lanzamiento, tomemos un breve descanso de ese proceso para asegurarnos de que no está cometiendo algunos de los errores de diseño móvil más comunes.

Créame, vale la pena el tiempo y sus clientes se lo agradecerán.

1. No perfeccionar el conjunto de funciones

Al crear software, es fácil dejarse llevar por la adición de todas estas excelentes funciones. “¿No sería genial si …?” Es una frase peligrosa cuando se trata de cumplir con los plazos y entregar software de calidad.

Si intenta implementar demasiadas funciones, tanto la calidad de la experiencia como el diseño se verán afectados, sin mencionar lo que sucederá con sus plazos.

Al mismo tiempo, no desea enfocarse tan estrechamente que se pierda ideas potencialmente geniales. Ahí es donde entra en juego esta frase: «Sueña en grande, implementa en pequeño».

En la etapa de planificación, ponga cada idea en un papel, sin importar cuán grandiosa o ridícula parezca. Anótelo y considérelo. Sueño grande. Entonces puede estar seguro de que no pasó por alto ninguna gran idea.

Luego, cuando decida qué construir, seleccione solo algunas cosas. De toda esa lista, ¿cuál o dos cosas podrías publicar por su cuenta? Sea implacable al recortar características. Para tener éxito, debe comenzar poco a poco.

Una vez que haya seleccionado una o dos funciones que va a crear, concéntrese todo en crear una experiencia de calidad. Establezca el listón de la experiencia lo más alto posible. Su objetivo debe ser comenzar con una aplicación simple que sea un placer de usar.

Con eso como punto de partida, puede liberarlo antes y averiguar si a alguien realmente le importa el problema que ha resuelto. Luego, puede agregar gradualmente más funciones, pero solo cuando pueda mantener el alto nivel que ya ha establecido para la calidad de la aplicación. Si no puede encontrar una manera de diseñar una función con ese nivel de calidad, no la agregue.

Nunca sacrifique la experiencia por otra característica.

Entonces, sueñe en grande, implemente en pequeño y estará en su camino.

(Gracias a Dan Cederholm de Regate por presentarme esta frase).

2. Deficiente alineación y espaciado

Los desarrolladores a menudo se quejan de que el diseño es difícil. Si tan solo pudiera ser analítico como la programación, lo encontrarían más fácil. Bueno, estás de suerte. Quiero que utilice precisión analítica para asegurarse de que todos los elementos de su diseño estén correctamente alineados. Con eso no me refiero a que tengan que seguir alguna técnica de diseño elegante. Solo quiero decir que todo lo alineado con el borde izquierdo debe estar a la misma distancia. Si sus márgenes son de 10 px, utilícelo en todas partes.

Los elementos deben estar espaciados consistentemente entre sí y tener mucho relleno entre cada elemento. Sé que le han dicho que agregue más espacios en blanco antes, pero realmente es importante.

3. No usar objetivos táctiles del tamaño de un dedo

Cuando intentas colocar todo en la pantalla de un móvil, puede resultar tentador reducir el tamaño de los botones. El tamaño táctil mínimo recomendado es de 44 píxeles cuadrados.

Los dedos y los pulgares vienen en todos los tamaños diferentes, por lo que lo que funciona bien para manos pequeñas puede no funcionar para alguien con manos grandes. Al mantener los objetivos táctiles más grandes que este mínimo, evitará frustrar a los usuarios.

El hecho de que su objetivo de toque debe tener 44 píxeles cuadrados no significa que el contorno del botón tenga que serlo. Puede aumentar el área objetivo más grande que el botón en sí para ayudar a que los toques inexactos sigan activando el botón. Si su botón no está junto a otros elementos con acciones de toque, entonces el botón puede ser un poco más grande sin cambiar el diseño visual.

4. Uso de migas de pan en la navegación

Imagina que estás navegando por una aplicación y has trabajado en 4 niveles de profundidad. Después de leer ese contenido, desea subir un nivel, pero accidentalmente toca el nivel «Inicio» en las rutas de navegación. Ay. Eso es como un botón de reinicio para su trabajo anterior navegando a esa sección. Ya hemos establecido que debido a los pequeños objetivos táctiles, los usuarios a menudo tocan accidentalmente los elementos incorrectos.

Se recomienda un simple botón «Atrás» en la barra de título de una aplicación (no es necesario en dispositivos Android con un botón de retroceso de hardware). Muchos desarrolladores piensan que están facilitando las cosas a sus usuarios al agregar una navegación de estilo de ruta de navegación al encabezado, lo que permite a los usuarios volver al nivel que deseen.

Es preferible que el botón Atrás cambie su etiqueta según la página a la que lo llevará. Por lo que podría leer «Configuración» o «Usuarios» dependiendo de cuál era la vista anterior.

5. Logotipos en las barras de título

En un esfuerzo por marcar más claramente una aplicación, los diseñadores a menudo colocan el logotipo de la empresa en un lugar destacado en la barra de título, reemplazando el nombre de la página en el proceso. Esto está bien para la primera página donde es posible que el usuario no necesite contexto. Pero en las páginas siguientes, desea reservar el espacio de la barra de título para el título de la página. Esto ayuda a dar contexto al usuario y les informa del contenido que deben esperar encontrar más adelante en la página.

La aplicación de Twitter para iPhone maneja esto bien, colocando un logotipo simple en la barra de título de la primera página, pero en todas las páginas posteriores reemplazándolo con el texto del título estándar.

Si su diseño necesita una marca más sólida, debe revisar sus esquemas de color y estilos, en lugar de simplemente forzar logotipos más grandes en la interfaz.

6. No realizar pruebas de usabilidad

No está en condiciones de juzgar con precisión la usabilidad de los proyectos en los que está trabajando de cerca. Los conceptos que pueden parecer complicados al principio le resultan naturalmente ahora que ha estado inmerso en ellos durante meses. Lo que sucede es que revisamos y probamos nuestro propio software, sin darnos cuenta de nuestros propios prejuicios. No obtener opiniones externas es un gran error. No querrás que la primera vez descubras que una pantalla no es intuitiva cuando un cliente furioso llama para quejarse.

Las pruebas de usabilidad son fundamentales para el proceso de diseño. Entonces, ¿por qué tanta gente lo evita? Simple: no se dan cuenta de lo fácil que es hacerlo. Cuando hablo de pruebas de usabilidad no me refiero a contratar a una empresa con batas blancas para hacer un estudio de una semana en el que analicen de cerca su diseño.

En su lugar, busque un amigo que nunca antes haya oído hablar de su sitio. Empiece por darles un poquito de contexto como, «¿Qué piensas de esta aplicación de lista de tareas pendientes?» Ni siquiera tiene que decirles que es suyo (la retroalimentación puede ser más directa). El siguiente paso es fácil: solo míralos usarlo. Preste atención a las pantallas en las que se atascaron, cuándo se detienen a leer el texto y cuándo comienzan a tocar los botones. Descubrirá rápidamente áreas que no son tan intuitivas como podrían ser.

A menudo, los pequeños cambios marcarán una gran diferencia. Una información sobre herramientas bien ubicada puede ser suficiente para explicar un concepto y mostrar al usuario dónde debe tocar a continuación. Mantenga sus pruebas informales y pruébelas con 3-5 personas. Aprenderás mucho.

Conclusión

Hay muchos errores que podría estar cometiendo, pero esta breve lista lo ayudará a comenzar. Los dos conceptos más importantes son perfeccionar su conjunto de funciones y realizar pruebas de usabilidad. Hágalo bien y todo lo demás encajará en su lugar.

Si esta publicación describe partes de su experiencia móvil, no se preocupe. Todos son errores fáciles de cometer. Pero si los evita, su experiencia móvil será mucho más limpia y enfocada.

¿Ha estado cometiendo alguno, o quizás todos, estos errores? ¿Qué no-nos agregarías para el diseño móvil? Háganos saber en los comentarios a continuación.