Lección 1 de 0
En Progreso

2.1 : Un enfoque centrado en el usuario para el diseño móvil y un proceso de 5 etapas para su uso

30 junio, 2022

[et_pb_section fb_built=”1″ admin_label=”section” _builder_version=”3.27.4″ background_color=”#7ebec5″ custom_padding=”||0px|” custom_padding_tablet=”||0px|” transparent_background=”off” padding_mobile=”on” make_fullwidth=”off” use_custom_width=”off” width_unit=”on”][et_pb_row padding_mobile=”on” column_padding_mobile=”on” admin_label=”row” _builder_version=”3.25″ background_size=”initial” background_position=”top_left” background_repeat=”repeat” custom_padding=”||0px|” make_fullwidth=”off” use_custom_width=”off” width_unit=”on”][et_pb_column type=”4_4″ _builder_version=”3.25″ custom_padding=”|||” custom_padding__hover=”|||”][et_pb_divider show_divider=”off” disabled_on=”on|on|off” admin_label=”Divider” _builder_version=”3.23.4″ height=”110px” hide_on_mobile=”on”][/et_pb_divider][et_pb_text admin_label=”Text” _builder_version=”4.2.2″ text_font=”PT Sans|on|||” text_text_color=”#ffffff” text_letter_spacing=”2px” background_size=”initial” background_position=”top_left” background_repeat=”repeat” text_orientation=”center” module_alignment=”center” custom_margin=”||0px|” custom_padding=”||0px|” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]

DISEÑO DE EXPERIENCIA DEL USUARIO MÓVIL

[/et_pb_text][et_pb_text admin_label=”Text” _builder_version=”4.2.2″ text_font=”PT Sans||||||||” text_text_color=”#010659″ text_font_size=”72″ text_line_height=”1.1em” background_size=”initial” background_position=”top_left” background_repeat=”repeat” text_orientation=”center” max_width=”660px” module_alignment=”center” custom_margin=”18px||80px|” text_font_size_tablet=”52″ text_font_size_phone=”” text_font_size_last_edited=”on|desktop” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]

Un enfoque centrado en el usuario para el diseño móvil y un proceso de 5 etapas para su uso

[/et_pb_text][/et_pb_column][/et_pb_row][/et_pb_section][et_pb_section fb_built=”1″ admin_label=”Section” _builder_version=”3.27.4″ background_enable_color=”off” custom_padding=”0px|||” custom_padding_tablet=”0px|||” transparent_background=”off” padding_mobile=”on” make_fullwidth=”off” use_custom_width=”off” width_unit=”on”][et_pb_row padding_mobile=”on” column_padding_mobile=”on” admin_label=”row” _builder_version=”3.25″ background_size=”initial” background_position=”top_left” background_repeat=”repeat” max_width=”620px” custom_padding=”0px|||” make_fullwidth=”off” use_custom_width=”on” width_unit=”on” custom_width_px=”620px”][et_pb_column type=”4_4″ _builder_version=”3.25″ custom_padding=”|||” custom_padding__hover=”|||”][et_pb_image src=”https://usercontent.one/wp/www.interactemos.com/wp-content/uploads/2019/09/logo-circular-nuevo.png” show_bottom_space=”off” align=”center” align_tablet=”center” align_phone=”” align_last_edited=”on|desktop” admin_label=”Image” _builder_version=”3.27.4″ width=”20%” custom_margin=”-48px|||” use_border_color=”off” border_color=”#ffffff” border_style=”solid” animation=”off” sticky=”on” always_center_on_mobile=”on”][/et_pb_image][/et_pb_column][/et_pb_row][et_pb_row use_custom_gutter=”on” gutter_width=”2″ padding_mobile=”on” column_padding_mobile=”on” custom_padding_last_edited=”on|tablet” admin_label=”Row” _builder_version=”3.27.4″ background_color=”#01065″ background_size=”initial” background_position=”top_left” background_repeat=”repeat” custom_padding=”50px|||” custom_padding_tablet=”17px|||” custom_padding_phone=”” make_fullwidth=”off” use_custom_width=”off” width_unit=”on” custom_width_px=”830px”][et_pb_column type=”4_4″ _builder_version=”3.25″ custom_padding=”|||” custom_padding__hover=”|||”][et_pb_image src=”https://usercontent.one/wp/www.interactemos.com/wp-content/uploads/2020/02/56e003f7d5095.jpg” show_bottom_space=”off” align_tablet=”center” align_phone=”” align_last_edited=”on|desktop” admin_label=”Image” _builder_version=”4.2.2″ animation_style=”fade” animation_duration=”500ms” use_border_color=”off” border_color=”#ffffff” border_style=”solid” animation=”fade_in” sticky=”on” always_center_on_mobile=”on”][/et_pb_image][/et_pb_column][/et_pb_row][et_pb_row padding_mobile=”on” column_padding_mobile=”on” admin_label=”row” _builder_version=”4.2.2″ background_size=”initial” background_position=”top_left” background_repeat=”repeat” max_width=”620px” custom_padding=”17px|||” make_fullwidth=”off” use_custom_width=”on” width_unit=”on” custom_width_px=”620px”][et_pb_column type=”4_4″ _builder_version=”3.25″ custom_padding=”|||” custom_padding__hover=”|||”][et_pb_text admin_label=”Text” _builder_version=”4.2.2″ text_font=”PT Serif||||” text_text_color=”#363636″ text_font_size=”20″ text_line_height=”1.6em” ul_font=”PT Serif||||||||” ul_line_height=”1.6em” background_size=”initial” background_position=”top_left” background_repeat=”repeat” max_width=”620px” custom_margin=”30px||0px|” text_font_size_tablet=”” text_font_size_phone=”” text_font_size_last_edited=”on|tablet” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]

La web móvil llegó para quedarse. Sin embargo, es importante recordar que tener un sitio web móvil no es la clave del éxito, sino que proporciona el enfoque correcto para la experiencia del usuario móvil que brinda éxito. Adoptar un enfoque centrado en el usuario para el diseño móvil (y otros) puede ayudarlo a tener en cuenta los resultados que desea en lugar de perder el tiempo en diseños poco gratificantes.

La web móvil es una descripción destinada a distinguir el acceso a Internet en una tableta o un teléfono inteligente en lugar de una PC o computadora portátil normal. A medida que el mundo ha adoptado los teléfonos inteligentes en la última década, las empresas han llegado a comprender las ventajas de la restauración para la web móvil. Sin embargo, muchas empresas comienzan con el punto final en mente; “¡Necesitamos una aplicación móvil o un sitio web móvil!” En lugar de considerar por qué sus usuarios la querrían.

Hay ventajas en ofrecer una experiencia web móvil:

  • Existe la oportunidad de satisfacer las necesidades específicas de los usuarios en el momento correcto y en el lugar correcto.
  • Se puede acceder a la web móvil en lugares donde no se puede acceder fácilmente a Internet desde otros dispositivos.
  • El desarrollo para la web móvil puede ser rentable e incluso más barato que los sitios web estándar.
  • Existe la posibilidad de llegar a una base de usuarios mucho mayor (hay más propietarios de teléfonos inteligentes que propietarios de computadoras de escritorio y portátiles).
  • Existe la oportunidad de llegar a un área geográfica mucho más amplia (en los países en desarrollo, los teléfonos inteligentes son a menudo la única forma para que un usuario acceda a Internet).

[/et_pb_text][/et_pb_column][/et_pb_row][et_pb_row use_custom_gutter=”on” gutter_width=”2″ padding_mobile=”on” column_padding_mobile=”on” custom_padding_last_edited=”on|tablet” admin_label=”Row” _builder_version=”3.27.4″ background_color=”#01065″ background_size=”initial” background_position=”top_left” background_repeat=”repeat” custom_padding=”50px|||” custom_padding_tablet=”17px|||” custom_padding_phone=”” make_fullwidth=”off” use_custom_width=”off” width_unit=”on” custom_width_px=”830px”][et_pb_column type=”4_4″ _builder_version=”3.25″ custom_padding=”|||” custom_padding__hover=”|||”][et_pb_image src=”https://usercontent.one/wp/www.interactemos.com/wp-content/uploads/2020/02/acd.jpg” show_bottom_space=”off” align_tablet=”center” align_phone=”” align_last_edited=”on|desktop” admin_label=”Image” _builder_version=”4.2.2″ animation_style=”fade” animation_duration=”500ms” use_border_color=”off” border_color=”#ffffff” border_style=”solid” animation=”fade_in” sticky=”on” always_center_on_mobile=”on”][/et_pb_image][/et_pb_column][/et_pb_row][et_pb_row padding_mobile=”on” column_padding_mobile=”on” admin_label=”Row” _builder_version=”3.25″ background_size=”initial” background_position=”top_left” background_repeat=”repeat” max_width=”620px” custom_padding=”50px||8px|||” make_fullwidth=”off” use_custom_width=”on” width_unit=”on” custom_width_px=”620px”][et_pb_column type=”4_4″ _builder_version=”3.25″ custom_padding=”|||” custom_padding__hover=”|||”][et_pb_text admin_label=”Text” _builder_version=”4.2.2″ text_font=”PT Serif||||” text_text_color=”#363636″ text_font_size=”40px” text_line_height=”1.3em” background_size=”initial” background_position=”top_left” background_repeat=”repeat” max_width=”900px” custom_margin=”16px||30px|” text_font_size_tablet=”” text_font_size_phone=”” text_font_size_last_edited=”on|tablet” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]

El enfoque de diseño móvil centrado en el usuario

[/et_pb_text][et_pb_text quote_border_color=”#7ebec5″ admin_label=”Text” _builder_version=”4.2.2″ text_font=”PT Serif||||” text_text_color=”#363636″ text_font_size=”20″ text_line_height=”1.6em” ul_font=”PT Serif||||||||” ul_line_height=”1.6em” background_size=”initial” background_position=”top_left” background_repeat=”repeat” max_width=”620px” custom_margin=”30px||0px|” text_font_size_tablet=”” text_font_size_phone=”” text_font_size_last_edited=”on|tablet” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]

Hay 5 etapas del ciclo (se supone que todo el desarrollo es cíclico con productos que pasan por múltiples iteraciones durante toda la vida).

Usted evalúa la situación tal como está en este momento (tal vez sea “no tenemos un sitio web móvil” o tal vez sea “nuestra aplicación móvil no está funcionando como esperábamos”, etc.).

Luego, averigua qué es lo que sus usuarios necesitan de usted. Una vez hecho esto, te sientas y priorizas las funciones para tu plataforma móvil y luego trabajas en el diseño de esas funciones mientras te aseguras de poner “móvil primero” y finalmente, revisas y refinas el diseño.

1. Evaluar la situación actual

Sí, la web móvil es una gran cosa. Sí, hay más usuarios de teléfonos inteligentes y tabletas que usuarios de PC / escritorio. Pero (¿y no hay siempre un pero?), No puede suponer que sus usuarios desean utilizar su sitio web a través de esas plataformas. De hecho, investigaciones recientes sugieren que muchos usuarios (en términos generales) usan la web móvil para una variedad limitada de cosas (principalmente citas, correo electrónico, algunas aplicaciones y redes sociales) y que cuando los usuarios tienen una opción, prefieren hacerlo trabajo más complejo desde sus escritorios.

Debe pensar si una aplicación móvil o sitio web totalmente funcional es realmente lo que necesita, o ¿es posible que sus usuarios solo necesiten un pequeño subconjunto de funcionalidades en movimiento y que hagan la mayor parte de su trabajo en un escritorio?

¿Es posible que su base de usuarios esté menos interesada en una experiencia web móvil y más interesada en una experiencia mejorada con los productos y plataformas que ya ofrece?

2. Entendiendo a su usuario

Antes de salir corriendo a hacer cualquier diseño o priorización de características, es importante comprender mejor a sus usuarios y en un contexto móvil.

Necesitas saber cosas como:

  • ¿Cómo prefieren acceder a internet?
  • ¿Cuánto tiempo pasan interactuando con su sitio en este momento?
  • ¿Cuánto tiempo pasan en línea usando un punto de acceso móvil?
  • ¿Qué características serían críticas para proporcionar una experiencia móvil?
  • ¿Con qué se sienten frustrados en su oferta en este momento que podría hacerse mejor a través del móvil?
  • ¿Qué dispositivos están utilizando para acceder a la web móvil?
  • Si tiene más de una persona de usuario, deberá responder estas preguntas sobre cada grupo de usuarios.

También querrás vincular esto en una imagen de “nivel superior”. Salga e investigue las tendencias en su industria y en la web móvil. Es posible que haya notado que las aplicaciones son más populares que la navegación en la web móvil, ¿eso es importante para sus usuarios?

3. ¿Qué ofrecerá su experiencia web móvil?

Luego se trata de priorizar lo que se incluye en su experiencia móvil. Su investigación de usuarios le mostrará lo que sus usuarios desean, pero también debe tener en cuenta lo que la empresa quiere del proceso. Es posible que deba revisar y modificar componentes de la experiencia para manejar conflictos entre los usuarios y la empresa.

La experiencia del usuario es esencial, pero no sirve de nada si no ofrece resultados comerciales. El compromiso puede ser una parte clave para hacer esto bien.

No olvide que demasiada complejidad al principio del ciclo de vida del producto puede ser un gran inconveniente. Priorizar las necesidades también significa no tener miedo de retener ideas para futuros lanzamientos. Un gran producto mínimo viable a menudo puede ser mejor que uno demasiado complejo.

[/et_pb_text][/et_pb_column][/et_pb_row][et_pb_row use_custom_gutter=”on” gutter_width=”2″ padding_mobile=”on” column_padding_mobile=”on” custom_padding_last_edited=”on|tablet” admin_label=”Row” _builder_version=”3.27.4″ background_color=”#01065″ background_size=”initial” background_position=”top_left” background_repeat=”repeat” custom_padding=”50px|||” custom_padding_tablet=”17px|||” custom_padding_phone=”” make_fullwidth=”off” use_custom_width=”off” width_unit=”on” custom_width_px=”830px”][et_pb_column type=”4_4″ _builder_version=”3.25″ custom_padding=”|||” custom_padding__hover=”|||”][et_pb_image src=”https://usercontent.one/wp/www.interactemos.com/wp-content/uploads/2020/02/ux.jpg” show_bottom_space=”off” align_tablet=”center” align_phone=”” align_last_edited=”on|desktop” admin_label=”Image” _builder_version=”4.2.2″ animation_style=”fade” animation_duration=”500ms” use_border_color=”off” border_color=”#ffffff” border_style=”solid” animation=”fade_in” sticky=”on” always_center_on_mobile=”on”][/et_pb_image][/et_pb_column][/et_pb_row][et_pb_row padding_mobile=”on” column_padding_mobile=”on” admin_label=”row” _builder_version=”3.25″ background_size=”initial” background_position=”top_left” background_repeat=”repeat” max_width=”620px” custom_padding=”17px|||” make_fullwidth=”off” use_custom_width=”on” width_unit=”on” custom_width_px=”620px”][et_pb_column type=”4_4″ _builder_version=”3.25″ custom_padding=”|||” custom_padding__hover=”|||”][et_pb_text admin_label=”Text” _builder_version=”4.2.2″ text_font=”PT Serif||||” text_text_color=”#363636″ text_font_size=”20″ text_line_height=”1.6em” background_size=”initial” background_position=”top_left” background_repeat=”repeat” max_width=”620px” custom_margin=”30px||0px|” text_font_size_tablet=”” text_font_size_phone=”” text_font_size_last_edited=”on|tablet” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]

4. Consideraciones de diseño móvil

También habrá consideraciones de diseño específicas para dispositivos móviles. ¿Va a integrar su oferta móvil con su oferta actual? ¿Usarás diseño receptivo o diseño adaptativo si lo haces?

Mucho de esto se reducirá al contexto. Por ejemplo, el contexto en el que se utilizará el dispositivo móvil. Si sus usuarios acceden a la web móvil desde sus escritorios, es increíble, pero muchos usuarios no lo hacen. Intentarán usarlos en el supermercado, en su viaje diario, en el camino a la cafetería, etc. Pero también desde sus sofás y camas y en muchos otros lugares en los que pensamos a menudo.

Eso significa que tendrá que considerar cómo reducir las distracciones y facilitar que el usuario se concentre también en la tarea en cuestión.

Josh Clark, autor de Tapworthy- Designing Great iPhone Apps, ofrece tres categorías para el acceso web móvil:

  • Microtasking: cuando el usuario interactúa con su dispositivo durante períodos breves pero frenéticos de actividad
  • Local: cuando el usuario quiere saber qué sucede a su alrededor
  • Aburrido: cuando el usuario no tiene nada mejor que hacer y busca entretenerse o desviarse

Tener en cuenta estas categorías puede hacer que sea mucho más fácil diseñar para las necesidades del usuario y centrarse en lo que hace que los dispositivos móviles sean diferentes de otras plataformas de acceso.

5. Revisar y refinar

Boceto y prototipo en fases tempranas de iteración. Asegúrese de probarlos con los usuarios. Obtenga comentarios e itere rápidamente.

No olvide asegurarse de que su sitio cumpla con los estándares del W3C.

Luego vuelve al principio e itera. Es por eso que el proceso de diseño centrado en el usuario para dispositivos móviles es cíclico. Bueno, al igual que todos los procesos de diseño centrados en el usuario.

UCD para dispositivos móviles, ¿es realmente diferente de UCD para otras plataformas?

El diseño centrado en el usuario es un diseño centrado en el usuario. El proceso para dispositivos móviles debe ser el mismo que para cualquier otra plataforma. Sin embargo, las plataformas móviles son diferentes de las plataformas de escritorio y portátiles y es importante que un diseñador tenga esto en cuenta al aplicar un enfoque de diseño centrado en el usuario.

El proceso anterior es un proceso UCD estándar, según lo propuesto por Norman y Draper, los arquitectos originales de UCD, pero uno que le pide que reflexione sobre la plataforma móvil antes de continuar con el diseño.

[/et_pb_text][/et_pb_column][/et_pb_row][et_pb_row use_custom_gutter=”on” gutter_width=”2″ padding_mobile=”on” column_padding_mobile=”on” custom_padding_last_edited=”on|tablet” admin_label=”Row” _builder_version=”3.27.4″ background_color=”#01065″ background_size=”initial” background_position=”top_left” background_repeat=”repeat” custom_padding=”50px|||” custom_padding_tablet=”17px|||” custom_padding_phone=”” make_fullwidth=”off” use_custom_width=”off” width_unit=”on” custom_width_px=”830px”][et_pb_column type=”4_4″ _builder_version=”3.25″ custom_padding=”|||” custom_padding__hover=”|||”][et_pb_image src=”https://usercontent.one/wp/www.interactemos.com/wp-content/uploads/2020/02/88e7d0b8d80f001106dd2426a4c04c3a.jpg” show_bottom_space=”off” align_tablet=”center” align_phone=”” align_last_edited=”on|desktop” admin_label=”Image” _builder_version=”4.8.1″ animation_style=”fade” animation_duration=”500ms” hover_enabled=”0″ use_border_color=”off” border_color=”#ffffff” border_style=”solid” animation=”fade_in” sticky=”on” always_center_on_mobile=”on” align=”center” sticky_enabled=”0″][/et_pb_image][/et_pb_column][/et_pb_row][et_pb_row padding_mobile=”on” column_padding_mobile=”on” admin_label=”Row” _builder_version=”3.25″ background_size=”initial” background_position=”top_left” background_repeat=”repeat” max_width=”620px” custom_padding=”50px||8px|||” make_fullwidth=”off” use_custom_width=”on” width_unit=”on” custom_width_px=”620px”][et_pb_column type=”4_4″ _builder_version=”3.25″ custom_padding=”|||” custom_padding__hover=”|||”][et_pb_text admin_label=”Text” _builder_version=”4.0.9″ text_font=”PT Serif||||” text_text_color=”#363636″ text_font_size=”40px” text_line_height=”1.3em” background_size=”initial” background_position=”top_left” background_repeat=”repeat” max_width=”900px” custom_margin=”16px||30px|” text_font_size_tablet=”” text_font_size_phone=”” text_font_size_last_edited=”on|tablet” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]

¿que nos llevamos?

[/et_pb_text][et_pb_text admin_label=”Text” _builder_version=”4.2.2″ text_font=”PT Serif||||” text_text_color=”#363636″ text_font_size=”20″ text_line_height=”1.6em” ul_font=”PT Serif||||||||” ul_line_height=”1.6em” background_size=”initial” background_position=”top_left” background_repeat=”repeat” max_width=”620px” custom_margin=”30px||0px|” text_font_size_tablet=”” text_font_size_phone=”” text_font_size_last_edited=”on|tablet” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]

La web móvil no es un concepto nuevo. Es importante decidir si sus usuarios necesitan instalaciones web móviles y luego seguir un proceso de diseño centrado en el usuario le ofrece la mejor oportunidad de éxito. Existen diferencias significativas en la forma en que funcionan los dispositivos móviles en comparación con otros dispositivos y debe asegurarse de manejar esas diferencias con cuidado para ofrecer el mejor resultado final.

[/et_pb_text][/et_pb_column][/et_pb_row][/et_pb_section]