Ahora las aplicaciones en nuestros teléfonos ya se han convertido en parte de nuestra vida. Con tanta experiencia, cada vez descubrimos más que una app también es un ser con huesos, carne y piel. Muchos hablan de experiencia y de tacto; entonces, ¿qué es exactamente una buena o mala experiencia en una app? ¿Qué causa estas diferencias en la sensación? ¿Y cómo deberíamos diseñar apps?

A continuación, tomaré como representantes de las apps de fotos para documentos a tres: «Foto Carnet Inteligente», «Foto Carnet Hermosa» y «Foto Carnet», y las analizaré desde tres dimensiones. Este tipo de apps utiliza principalmente el teléfono móvil para tomar y producir fotos para documentos, resolviendo problemas como la imposibilidad de controlar la foto en los estudios tradicionales y la molestia de tener que buscar un estudio fuera. Pertenece a aplicaciones de herramienta, por lo que se exige mucho para resolver eficazmente los problemas de los usuarios. Por eso diseccionamos las apps en profundidad, observándolas desde tres dimensiones: estructura ósea, carne y piel.

1. Estructura ósea

Como dice el refrán: es más fácil dibujar la piel de un tigre que sus huesos. Lo más básico de una app es su estructura de marco lógico, como la estructura de acero de una casa que sostiene todo el edificio. Cuanto más fuerte es la estructura, más funciones puede soportar la casa. Por ejemplo, con diferentes núcleos de marco, las casas que se pueden construir también son diferentes:

Entonces, echemos un vistazo a su estructura ósea respectiva.

El marco lógico de «Foto Carnet Inteligente» se ve uniforme y simétrico en general. Cuanto más estable es la estructura de una app, más naturales son la extensión de funciones y las mejoras sobre ella. Desde la página de toma de fotos inicial hasta la finalización de la foto para documento, casi no hay operaciones redundantes en todo el proceso, lo que hace que la operación del usuario sea fluida, como beber agua de un solo trago.

La estructura de «Foto Carnet Hermosa» también parece fluida y suave en general, pero al mirarla con detalle, comete muchos errores de diseño de apps: partes incompletas y articulaciones enredadas. Primero, la página inicial: producción y pedidos. Lo que más usan los usuarios es la función de producción y toma de fotos; los pedidos de abajo casi nunca se usan. Cuando el usuario hace clic, descubre que no funciona y regresa de inmediato. Esta gran diferencia en la frecuencia de uso hace que la rama de pedidos sea como una extremidad ausente, completamente inútil; no solo causa redundancia y desequilibrio estructural, sino que también revela la debilidad de las funciones que cubren la estructura. Así que esta parte: ¡eliminar! Desde el principio, entrar directamente a la página de toma. Luego, observe el álbum de la app y la exportación destacados en la parte superior. Un análisis detallado muestra que «Foto Carnet Hermosa» no tiene función local de subir fotos con procesamiento de belleza; su álbum se basa en las fotos tomadas internamente por el usuario. Aquí aparece una confusión lógica; cuando un usuario meticuloso usa esta función, puede pensar que es un bug.

Además, el guardado también se realiza en el álbum interno de la app, no en el álbum del teléfono. El usuario debe seguir muchos pasos y elegir exportar para que la foto se guarde realmente; es como articulaciones enredadas que impiden una extensión fluida.

Subir fotos del álbum local debería ser algo muy sencillo. Entonces, ¿por qué «Foto Carnet Hermosa» no agrega directamente la estructura de subir fotos locales? Esto lo dejaremos para analizarlo junto con «Foto Carnet Inteligente» en la sección de carne, más adelante.

En general, podemos detectar a simple vista que «Foto Carnet» tiene una estructura compleja y abarrotada; parece llena de contenido, pero la experiencia real muestra que muchas funciones son débiles. Esto comete el error de la hinchazón vacía y hueca. El viejo maestro Steve Jobs dijo: "Simple can be harder than complex." Ante la complejidad, aún hay muchas cosas que eliminar. A continuación, veamos las flechas discontinuas en la sección de recorte manual. Cuando el usuario regresa tras un procesamiento insatisfactorio de blanqueamiento, cambio de fondo o cambio de ropa, siempre salta al módulo de recorte manual en lugar de volver al paso anterior de manera ordenada. Se puede ver que la instrucción goto en el programa se abusa de ella (nota: si la instrucción goto no se usa bien, es fácil terminar como Jiumozhi, que no logró aprender la técnica y terminó con los meridianos invertidos). Esto es una muestra de insuficiencia técnica, y también es la fuente del diseño que, al final, obliga a los usuarios a ser guiados al modo de retoque manual en segundo plano. Observemos otro punto: el problema de contradicción entre el diseño estructural de la app y la presentación real de funciones. Al principio, el flujo comienza con la selección del tipo de foto para documento; cada tipo tiene diferentes estándares. Sin embargo, al cambiar el fondo más tarde, se ofrecen libremente varios colores de fondo. Si el usuario no tiene el conocimiento correspondiente, el resultado será que la foto no cumple con los requisitos. En el diseño posterior de la carne, se olvidó la intención original, creció contra el hueso y se sembraron genes patógenos.

En la antigüedad, los ciegos adivinaban el destino palpando los huesos; hoy, los científicos dominan la técnica de reconstrucción craneal. Tras el análisis de la estructura ósea anterior, solo desde el diagrama del marco lógico, ¿no son estas estructuras similares a las siguientes?

2. Carne

Obviamente, con solo un esqueleto no se puede ser una persona completa. Para correr, se necesita la coordinación de varios músculos para generar potencia explosiva e impulsar el funcionamiento de un sistema.

Las apps de fotos para documentos se centran en permitir que el usuario produzca fotos de manera conveniente, reducir la barrera profesional de la fotografía, liberarse del fondo del estudio fotográfico y del retoque manual con Photoshop, y acortar el camino que hay que recorrer. Entonces, sus músculos centrales deben poder completar funciones como tomar fotos fácilmente, reemplazo automático de fondo, belleza inteligente y recorte de tamaño. Por eso, a continuación analizamos su carne.

Quién sabe qué pollo tiene la textura más firme, crujiente por fuera y tierno por dentro, con mucho mordisco y rico en ATP; cada quien tiene su opinión. Aquí no daré demasiados juicios. Afortunadamente, las aplicaciones de herramienta son trabajo técnico; solo si tienes el diamante adecuado te atreves a ponerlo sobre la mesa. Así que penetraré desde las estructuras externas visibles para encontrar pistas. Principalmente analizaremos el diseño de las apps desde la función central de reemplazo de fondo. A continuación se muestran los resultados del reemplazo automático de fondo de cada app sin ajustes finos:

«Foto Carnet Inteligente» «Foto Carnet Hermosa» «Foto Carnet»

En cuanto a los bloques musculares, «Foto Carnet Inteligente» tiene dos grandes funciones: reemplazo inteligente de fondo con un clic y ajuste fino manual. «Foto Carnet Hermosa» tiene función de reemplazo de fondo, pero no puede ajustarse manualmente. «Foto Carnet» tiene funciones de recorte automático y ajuste fino manual. En cuanto al efecto del trabajo muscular, después del reemplazo de fondo, «Foto Carnet Inteligente» maneja bien los detalles, la imagen es bastante suave, aunque aún necesita mejorar en pequeños detalles locales. «Foto Carnet Hermosa» aún debe mejorar el reemplazo de fondo; además, al no poder ajustar manualmente, si el reemplazo de fondo deja imperfecciones, no podrá cumplir con los estándares de las fotos para documentos, y la experiencia del usuario se verá muy reducida. «Foto Carnet» hace un reemplazo de fondo aceptable, solo que el procesamiento de la imagen no es suave. En cuanto a la eficiencia del trabajo muscular, «Foto Carnet Inteligente», aunque tiene una técnica de reemplazo de fondo más fuerte, tarda más en reemplazar el fondo, el pincel de ajuste fino es pequeño y la imagen no se puede ampliar; la experiencia del usuario resulta un poco trabajosa. Este diseño, en cambio, restringe el despliegue de su tecnología. Si este pequeño diseño funcional de carne no se coordina estrechamente con el diseño estructural de hueso, es fácil que cause un funcionamiento deficiente y trombosis. «Foto Carnet Hermosa» tarda un poco más en el reemplazo de fondo. «Foto Carnet» es más rápida en el recorte del fondo, pero usa un ajuste fino por clic, no un pincel para pintar, lo que hace muy laborioso el ajuste fino de los detalles posteriores y afecta la calidad de la imagen. En cuanto a la coordinación muscular, «Foto Carnet Inteligente» agrega una evaluación del entorno de toma antes de la función de reemplazo de fondo, lo que bloquea y filtra eficazmente parte de las fotos de mala calidad, haciendo que el procesamiento final de la foto sea más eficiente. El diseño de apps no es una simple superposición de funciones; todas sirven para resolver el problema central. Esta es la razón por la que la coordinación entre los músculos periféricos y los músculos centrales no solo produce una gran potencia explosiva, sino que también muestra un cuidado humanista más delicado.

En cuanto a la pregunta que quedó al principio, ¿por qué «Foto Carnet Hermosa» no tiene función de subir imágenes? Podemos ver los siguientes problemas:

Cuando los usuarios suben imágenes para procesar y hacer fotos para documentos, como las imágenes externas al sistema son variadas e incontrolables, no son tan estandarizadas como las generadas dentro del sistema; en el paso del reemplazo de fondo, el sistema puede reconocer y reemplazar automáticamente. Esto, evidentemente, exige una tecnología muy alta. Entonces, ¿cómo diseñan la solución a este problema? «Foto Carnet Inteligente» filtra las imágenes subidas con normas; las que no cumplen son eliminadas (kill). «Foto Carnet Hermosa» es más violenta: honrar al soberano y expulsar a los bárbaros, rechaza cualquier elemento externo. «Foto Carnet» es más hábil: abre completamente los brazos, ofrece un marco móvil y permite el recorte manual. Pero toda solución genera nuevos problemas. La política de apertura parcial de «Foto Carnet Inteligente» no maneja bien a algunos peces que escapan de la red; algunas imágenes subidas dejan espacios con el marco de la imagen, lo que hace que un usuario meticuloso sienta que es un bug del sistema y dañe su reputación. El diseño completamente cerrado de «Foto Carnet Hermosa», sin embargo, agrega la función de álbum de la app desde el principio, lo que provoca una contradicción lógica en la estructura y una distorsión del hueso. El recorte manual de «Foto Carnet» está bien, pero el control manual carece de normas correspondientes; luego hay problemas de recorte de tamaño y de nitidez de la imagen. Si se optimiza esta parte y se combina con un ajuste fino deslizante, el efecto será mejor. Aunque adoptaron diferentes soluciones para subir imágenes, algunos pensarán que los usuarios generalmente se toman sus propias fotos para documentos, y que esta función de subir imágenes no sirve de mucho y es como un hueso de pollo: poca carne, pero da pena tirarlo. Pero al diseñar la carne, ¿acaso hemos considerado quiénes son nuestros usuarios? ¿Acaso los evaluadores como nosotros, que no nos atrevemos a publicar nuestras fotos, somos vegetarianos? Si no me dan buena carne, les voy a dar su merecido.

Por lo tanto, en el diseño de la carne, no solo los músculos funcionales internos deben formar una cohesión central, sino que también se debe considerar la coordinación con el diseño de hueso subyacente para alcanzar un equilibrio de juego cooperativo.

3. Piel

Aunque arriba hicimos un análisis interno del sistema, esta sociedad es una que juzga por las apariencias y por el linaje. Sin una piel presentable, es imposible sobrevivir en el mundo de las apps. Según las estadísticas de AppFigures, en 2014 la App Store ya tenía 1.21 millones de aplicaciones iOS. Para que una app sobreviva en el mundo, necesita demasiadas cualidades externas: diseño de UI, diseño de UX, nombre, etiquetas, reputación en el círculo de amigos, etc. A continuación, analizaremos desde el diseño de UI y UX.

«Foto Carnet Inteligente» «Foto Carnet Hermosa» «Foto Carnet»

Desde el punto de vista de UI, la página principal de «Foto Carnet Inteligente» es limpia y ordenada. La página de toma de «Foto Carnet Hermosa» también es bastante limpia, pero al observar con detalle, la barra de menú inferior y el área de captura son ambas negras, y la transición entre zonas funcionales no es evidente. En la ley de la Gestalt hay un principio: cuando los objetos están demasiado cerca, pensamos que están relacionados; este diseño fácilmente causa confusión visual. La página principal de «Foto Carnet» presenta un color gris verdoso, lo que da una sensación sombría; además, los textos e imágenes redundantes reducen en gran medida la estética. Desde el punto de vista de UX, «Foto Carnet Inteligente» ofrece consejos de toma dinámicos, lo que no solo no afecta el diseño general de la página, sino que también brinda una sensación directa, cálida y cercana. «Foto Carnet Hermosa» coloca los consejos de toma en la barra de menú inferior, aumentando el costo de interacción del usuario. En «Foto Carnet», al hacer clic en el consejo de toma en la esquina superior derecha, solo hay un contenido: "2 pulgadas se usa principalmente para pasaportes"; el consejo es demasiado burdo y casi no tiene valor.

Esto también nos dice: en el diseño de UX e iconos, la distancia entre tú y el usuario, ¿es un intercambio amistoso cara a cara o un golpear mecánico y desconocido a la puerta? Si no hay sorpresa dentro de la puerta, seguramente habrá arrepentimiento.

Parece que el diseño de «Foto de Carnet Inteligente» es bastante bueno, pero no te alegres demasiado pronto. A menudo, si no cometemos errores de día, entonces haremos locuras en un día nublado.

Ahora la proporción de pantalla de los teléfonos móviles principales es 16:9, es decir, 78; la proporción de una foto de carnet de 2 pulgadas es 1.34. ¿A qué se acercan estos números? ¡A la gran proporción áurea! Pero desde la página de reemplazo de fondo se puede ver que toda el área azul superior y el área blanca de la barra de menú inferior están claramente desproporcionadas. Según el cálculo, la proporción es de 2.52. Una mejor manera es que la barra de menú inferior del diseño de UI pueda mostrarse flotante, o que la imagen pueda mostrarse en tamaño grande, dando a las personas un fuerte impacto visual. En cuanto al UX, «Foto de Carnet Inteligente» utiliza algoritmos de reconocimiento facial para cambiar automáticamente el fondo de la imagen, lo que ciertamente requiere tiempo de procesamiento, pero según una encuesta de Compuware, 5 segundos es el tiempo máximo de espera que los usuarios pueden tolerar para cargar una página web; el 50% de los usuarios abandonará si se supera este tiempo. Esto también puede servir como referencia para la velocidad de procesamiento de una aplicación.

Si una APP puede hacer que los usuarios se sientan enamorados, entonces esta regla puede ignorarse. Pero lo más doloroso es que «Foto de Carnet Inteligente» muestra en el UX este texto: «Esto tardará bastante». Es como si estuviera esperando el autobús en silencio al borde de la carretera y, de repente, alguien a mi lado me dijera: «El autobús va muy despacio». En ese momento me doy cuenta y estoy aún más de acuerdo con esa lentitud, así que respondo: «Sí, va muy despacio».

Las personas tienen seis sentidos y experimentan un producto en todo momento. Una experiencia de APP es como una cita a ciegas: ¿has impresionado a tu usuario? El diseño es una disciplina muy profunda, y yo soy demasiado superficial, así que no analizaré más.

Lo anterior se ha probado según la versión de iOS. Del hueso, la carne y la piel, cada APP tiene su alma vital. Sobre este organismo, no podemos crear una vida de manera unilateral; necesita más reflexión para alcanzar el equilibrio de la vida.

Fuente: http://www.woshipm.com/pd/178927.html