remarks practices cref best c# design user-interface

practices - remarks c#



DiseƱando mejores GUIs? (10)

Basándose en la respuesta de Vinay, la integración con su plataforma de destino siempre será de suma importancia al diseñar una interfaz. Si estaba desarrollando en Windows, asegúrese de mantenerse fiel a las expectativas de apariencia, uso y usabilidad de esa plataforma. Las pautas de interfaz siempre serán un punto de partida, aunque algunas son mejores que otras. Por mi dinero, las Pautas de interfaz humana de GNOME son un gran conjunto de pautas para diseñar interfaces fáciles de usar, incluso si no está utilizando GTK.

En una nota más general, aprender un buen diseño realmente está aprendiendo a reconocer un buen diseño. Busque algunas aplicaciones que sean realmente intuitivas y luego imite su diseño, estilo, etc. Luego, cuando tenga problemas para implementar una función en particular, busque un análogo adecuado en una de esas otras aplicaciones. Deberá prestar especial atención a cuestiones como agrupación, tabulación, accesos directos, modalidad de diálogo, etc. Creo que encontrará que muy pocos buenos principios de diseño dependen del lenguaje en el que está programando, excepto en la medida en que pueda influir. el conjunto de herramientas y la plataforma a los que apunta.

He estado usando C # por un tiempo, pero realmente no me he centrado en mis habilidades de diseño de interfaz de usuario. En el momento en que los diseño, me encuentro disfrutando del diseño, pero más tarde, miro hacia atrás y veo un trabajo horrible. Me viene a la mente un ejemplo de mi proyecto en el trabajo, donde tuve que usar 127 botones para representar 127 computadoras en nuestro laboratorio. : /

Me preguntaba si alguien podría referirme a un sitio o libro que enseñaría un buen diseño de interfaz de usuario.

¡Gracias!


Creo que la observación y los instintos ayudan tremendamente.

Juega con aplicaciones y profundiza en la funcionalidad que implementaron. Mire especialmente a Apple, ya que giran en torno a la estética. ¿Qué funcionó? ¿Qué no? ¿Por qué funcionó? Comienza a hacerte preguntas mientras juegas con sitios web y software.

Luego jugaría y diseñaría algunos conceptos. Muestre estos conceptos a amigos, tanto técnicos como no. Hágales preguntas como, "Agregar una bebida nueva a la lista" o "Buscar x para mí". Vea cómo reaccionan y difieren el uno del otro. ¿Alguien con un aviso técnico de antecedentes botones más rápido que los no expertos? ¿Deberías combinar elementos juntos?

Esto debería ser divertido. Después de todo, esto es como construir un conjunto de Lego completo y mostrárselo a tu amigo. Él / ella tiene que ver, tocar y jugar con tu creación.


Creo que la mejor idea es practicar. Primero me gusta diseñar mis ventanas en papel (papel en blanco o gráfico). Usa una regla y asegúrate de que las cosas se alineen y estén limpias.

Me viene a la mente un ejemplo de mi proyecto en el trabajo, donde tuve que usar 127 botones para representar 127 computadoras en nuestro laboratorio. : /

Hágase preguntas aquí, ¿qué no me gustó? ¿Cómo puede ser mejorado? ¿Necesitaba desplegable o un cuadro de lista para las computadoras?

También conoce tus widgets de GUI .


He leído el libro de Spolsky Diseño de Interfaz de Usuario para Programadores , así como los clásicos Los Lineamientos de Interfaz de Windows para el Diseño de Software y la Experiencia de Usuario de Windows. Los dos últimos son / fueron buenos libros de referencia. El libro de Spolsky es una lectura maravillosamente entretenida y te enseña a pensar en el diseño de la interfaz de usuario.

Por mi dinero, sin embargo, la mejor manera de diseñar la interfaz de usuario de una aplicación de escritorio es duplicar las soluciones existentes del software popular. Y al "duplicar", me refiero a dos facetas distintas: el mecanismo y la estética.

En lo que respecta al mecanismo , asegúrese de que su UI funcione de la manera en que las personas esperan que funcione. Por ejemplo, si tiene una vista en árbol, asegúrese de que las flechas del teclado funcionen para la navegación. Si su formulario tiene una barra de desplazamiento, asegúrese de que responda a la rueda de desplazamiento de su mouse. En general, los controles .NET proporcionan el comportamiento estándar de forma predeterminada, pero es posible que deba configurar algunas de las propiedades de tiempo de diseño para lograr esto por completo. Tenía una biblioteca de controles con la que estaba trabajando unos años atrás que proporcionaba un cuadro de texto estándar. Lo que descubrí, sin embargo, fue que el texto no se resaltó automáticamente cuando seleccioné el control. Agregué ese comportamiento porque así es como yo (y mis usuarios) esperaba que el control funcionara. Citando a Spolsky, "la consistencia causa facilidad de uso, lo que a su vez causa buenos sentimientos ..." En otras palabras, si los mecanismos de su UI no coinciden con lo que esperan sus usuarios, su UI será una fuente de frustración para su usuarios.

En lo que se refiere a la estética , he descubierto que centrarme en cosas como fuentes, iconos, espacios entre los controles, el uso selectivo del color (me encanta usar degradados), etc. puede ser una manera LARGA de agregar ese sentido de pulir a su interfaz de usuario. Se me conoce por utilizar capturas de pantalla de mapa de bits en Paint para medir el relleno entre controles con el fin de imitar el relleno en las aplicaciones de Microsoft. Cuando divulgo esa información a mis compañeros de trabajo, la mayoría de ellos me mira como si hubiera perdido la cabeza. Pero no puedo decirle la cantidad de éxitos de interfaz de usuario que he tenido simplemente al centrarme en lo que todos los demás consideran insignificante. Insisto en esto simplemente aprovechando toda la investigación que Microsoft ha hecho para hacer visualmente atractivas sus aplicaciones.

Así que mi recomendación sería leer el libro de Spolsky y luego intentar duplicar tantas aplicaciones de Microsoft como sea posible. Para aplicaciones de escritorio, es el enfoque más seguro.


Joel Spolsky escribió un libro llamado Diseño de interfaz de usuario para programadores, que es una buena lectura, y una versión abreviada se puede encontrar en línea .


Lo más importante para enfocarse primero sería el flujo de trabajo de las cosas. Intente encontrar los objetivos que tiene el usuario y cree un modelo que sea lo más eficaz posible para alcanzar ese objetivo. También lea mucho acerca de este uno de los mejores libros para comenzar, es que los reclusos están administrando el asilo.

Sugeriría muchos bocetos aquí. Asegúrese de mantenerlo simplista para centrarse en qué y dónde se colocan las cosas y menos en cómo se ven. Una herramienta como balsamiq es ideal para maquetas rápidas de UI. También revise los patrones de UI para obtener conceptos que funcionen, el libro de Tidwells Designing Interfaces es excelente y el sitio de nuevos patrones de Infragistics son excelentes recursos.

Ahora que tiene una idea de lo que quiere hacer, ahora es el momento de armar la interfaz. En el camino desde el primer boceto hasta el último píxel, siempre prueba el usuario.

Y no siempre siga las pautas de UI, está bien romperlas si tiene un buen motivo. Y, por último, solo obtendrás un efecto 3D libre sin relación en una interfaz :)




Las respuestas ya dan algunos excelentes libros sobre cómo diseñar interfaces específicamente. Me gustaría ayudar con algunas sugerencias para ayudarlo a mejorar su nariz para el diseño. Algunos de estos pueden ser baratos disponibles de segunda mano, o algo que se puede pedir prestado localmente (siempre estoy dispuesto a prestar libros a personas en Perth, Australia Occidental):


Tómese su tiempo y mire otros productos de software. Cada año, empresas como Google y Microsoft invierten millones de dólares en pruebas de usabilidad. Tome lo que aprendió sobre la interacción del usuario y aplíquelo a sus propios productos / proyectos.

Infragistics también acaba de crear una buena referencia para UI Design Patterns, se puede encontrar en http://quince.infragistics.com/ .