Zipic también utiliza controles del sistema, entonces ¿por qué se ve ligeramente diferente? La interfaz de usuario de Zipic se adhiere estrictamente a los cuatro principios fundamentales de "El libro de diseño para todos": proximidad, alineación, repetición y contraste. Estos cuatro principios son simples y fáciles de entender, pero representan la forma más sencilla y viable de llevar una interfaz de usuario al siguiente nivel. Proximidad: Los elementos relacionados se agrupan. En la lista de compresión de Zipic, la miniatura, el nombre, el tamaño y la relación de compresión de cada archivo se muestran uno al lado del otro, formando una unidad visual; mientras que los diferentes archivos están claramente separados. Los usuarios pueden distinguir fácilmente qué información pertenece a la misma imagen de un vistazo. El panel de ajustes también está agrupado por función: los ajustes de salida y de calidad se muestran juntos, y la "ruta de salida" y la "calidad de compresión" no se mezclan. Alineación: Todos los elementos deben estar conectados visualmente. En la barra lateral, la vista de lista y el panel de detalles de Zipic, todo el texto dentro de un mismo elemento está alineado. Puede parecer insignificante, pero si la alineación es incorrecta, toda la interfaz tendrá un aspecto poco profesional. El parámetro `alignment` de SwiftUI se usa ampliamente; `.leading`, `.trailing` y `.center` deben seleccionarse según el tipo de contenido. Repetición: Los elementos visuales son consistentes en todo el sitio. Zipic mantiene un radio de esquina uniforme y todo el texto clicable usa el mismo color. El estilo de los iconos también es consistente: todos usan símbolos SF o iconos personalizados, evitando así la mezcla. Esta consistencia hace que los usuarios sientan que se trata de un producto completo, en lugar de una mezcla de elementos. Contraste: Resalte la información importante. La relación de compresión es el dato que más importa a los usuarios, por lo que se muestra con una etiqueta azul degradada; el nombre del archivo es secundario y se usa una fuente normal; el tamaño original es aún menos importante y se usa gris claro. Distinga claramente entre la información principal y la secundaria, y los usuarios sabrán qué opción seleccionar sin pensar. Estos cuatro principios parecen simples, pero dominarlos a fondo requiere un ajuste constante. Mi enfoque es el siguiente: después de escribir el código, ejecútalo primero para ver el efecto, y si percibo que algo está mal, utilizo estos cuatro principios para comprobarlo. ¿Los elementos relacionados no están lo suficientemente cerca? ¿Hay un problema de alineación? ¿Son inconsistentes los elementos repetidos? ¿Los elementos que deberían estar resaltados no están lo suficientemente resaltados?
