El pasado 28 de Octubre de 2007 pubilcamos un artículo titulado “Creación de interfaz” en el que se incluían dos imágenes de ejemplos de formularios.
Ejemplo 1: Formulario con transparencias y botones personalizados.
Ejemplo 2: Rejilla transparente sobre una imagen de fondo.
Cómo hemos venido comentando, queremos que vosotros como betatesters de V7 seáis miembros activos y decisorios en el desarrollo y que podáis ayudarnos con vuestras valoraciones e ideas. En el caso del interfaz gráfico y los estilos visuales nos gustaría que a partir de este momento aportéis todas las ideas, bocetos e imágenes que consideréis oportunos y que puedan formar parte de los futuros manuales de estilo. Además, los estilos que se decidan pasarán a formar parte de las diferentes cajas utilizadas en el almacén y plantillas de V7. Por este motivo entramos en una fase donde iremos avanzando en la presentación de diseños que queremos que sean valorados por el mayor número de betatesters y, por supuesto, todos los diseños que recibamos serán publicados para que podáis también votarlos, con el fin de quedarnos con los más votados y valorados por vosotros que sois los que vais a utilizarlos en vuestros desarrollos.
A continuación, os presentamos los primeros bocetos de 4 estilos de formulario para que los votéis y valoréis. Por favor, sed lo más sinceros y críticos, tanto si os gusta mucho como si no os gustan nada. A partir de vuestras opiniones y aportaciones iremos avanzando hacia la selección de los estilos consensuados por todos, que serán utilizados tanto en el almacén de objetos como en las futuras plantillas.
Estilo classic
El objetivo de este diseño es la sencillez y que el diseño sea casi el mismo en cualquier sistema operativo, ya que no incluye ningún aspecto gráfico avanzado. Con esa finalidad, el objetivo se alcanza si el formulario es claro y eficaz cuando lo usa el usuario final.
Estilo contemporary
Este formulario cuenta con un diseño y tipografía particulares.
Estilo web 2.0
En este diseño destacan los colores fuertes y el tamaño grande de las fuentes.
Estilo cappuccino
Este diseño combina colores en tonos café y chocolate con reflejos y degradados.
Con los distintos diseños que hemos visto no solo es cuestión de seleccionar preferencias en los colores, que por otro lado también otorgan funcionalidad o usabilidad, sino que también se trata de diseñar las posiciones, tamaños, orden, etc. de los controles.
Vamos a ver a continuación algunos de los parámetros fundamentales que debemos concretar y definir a la hora de diseñar nuestros formularios si queremos que nuestras aplicaciones además de parecernos bonitas a cada uno – eso va en los gustos -, sean cómodas y rápidas de usar, en una palabra aplicaciones intuitivas. A continuación vamos a ver unos ejemplos de parámetros a valorar:
Literales: Alineación, es distinto que el literal que se adjunta a un control de edición esté alineado a la izquierda o a la derecha, por supuesto también influyen el tipo y tamaño de la fuente. Otro aspecto fundamental es su posición: ¿delante del control edit?, ¿al lado?, etc.
Controles de edición: Con volumen o sin el, en los ejemplos de estilos unos controles edit están a nivel y otros hundidos. ¿Cómo es mas legible la información? Otras características pueden ser la transparencia, solo lectura, etc.
Colores: Calidos, fríos, alto contraste, etc. Evidentemente las tonalidades influyen en la predisposición para usar una u otra aplicación, el tiempo que la usamos, etc.
Botones: Tamaño, fuente, icono, color en pulsación, etc. Estas características influyen en la usabilidad de una opción y el que sea intuitivo pulsarla o no.
Imágenes: Cabecera, pie, lateral, etc.
Todos los controles: Así sucesivamente.
Esperamos vuestras valoraciones y votaciones. Podéis indicar cuales seleccionáis como candidatas y cuales no.
La dirección para enviar los correos es: formacion@velneo.com. Lo que nos gustaría que nos enviaseis es una de estas dos opciones:
1º) Capturas de pantalla de la presentación preliminar del formulario o partes del formulario (botones, controles, etc.), programados en vuestro servidor.
Para poder ver la presentación prelimar de un formulario con vDevelop en V7, hay que editar el formulario en el dock de vista central, estando seleccionado el formulario y no algún control del mismo, pulsar la tecla “Inicio”. Esta vista preliminar nos permite introducir información en los campos, lo que le da un aspecto de ejecución real a la presentación preliminar.
2º) Cread un usuario en vuestro vServer con acceso restringido a los sitios en cuestión, que no sea supervisor, y nos enviáis la dirección del servidor, usuario y contraseña de acceso, así como la caja y formulario de ejemplo.
Gracias por vuestra colaboración.
- Valorar esta entrada
(Sin votos) - Comentarios (14)
- Comentar
- Imprimir
Por astillero #
Yo sin duda me quedo con el clásico. Me gusta lo sencillo.
Los otros, aunque son originales resultan demasiado coloridos..
Por roma7612901 #
Muy interesante y constructiva esta decición.
En orden de Gustos el cuarto me agrada mas por la combinacion de colores haciendo mas vistoso los formularios.
Cuando te refieres a que podemos proponer diseños te refieres a que usemos las betas y te enviemos las capturas, o es poosible que enviemos las capturas de otras aplicaciones que tambien podrian ser interesantes en cuanto a la combinacion de colores y texturas. Ademas a que direccion enviariamos las capturas?
Saludos
Por juan_figueroa #
Creo que lo teneis ya muy estudiado porque así lo haceis en las plantillas, pero a mí los botones aceptar, cancelar y opciones me gustan más en la posición arriba y derecha porque, además, es dónde se suelen encontrar en los navegadores y en las aplicaciones para cerrar y modificar la visibilidad de las pantalla.
Por juan_figueroa #
Creo que lo teneis ya muy estudiado porque así lo haceis en las plantillas, Mepero a mí los botones aceptar, cancelar y opciones me gustan más en la posición arriba y derecha porque, además, es dónde se suelen encontrar en los navegadores y en las aplicaciones para cerrar y modificar la visibilidad de las pantalla.
Me gusta el diseño 1 por su simplicidad y el cuarto, por su colorido discreto.
Por salvador #
Bueno… me parece fantástco hasta que niveles estais estudiando el interfaz gráfico y de hecho, yo partcularmente, creo que como cualquier otro programador, tambien he intentado personalizar mis desarrollos y darles un toque un tanto especial, que no me parezcan todos iguales. Mi tendencia es a buscar la forma de tener la minima cantidad de información y que no queden saturados de campos. Y quizás, por esa razón habitualmente huyo de elementos ornamentales como fondos llamativos y transparencias en los campos que deba editar el usuario. Es por ejemplo el caso de la rejilla que presentais un poco mas arriba que muestra el fondo sobre los campos que muestran datos. No es que no quede bonito pero a la larga, un formulario que se abre todos los días para trabajar es así como mas espartano
A mi me han gustado el primero y el cuarto, es decir el clásico y el cappucino pero claro eso es cuestión de gustos.
Tambien parece desde mi punto de vista que los botones siempre deberían presentar algun tipo de relieve que los distinga de otros elementos decorativos. Que el usuario vea claramente que son para pulsar. En ese sentido, el formulario segundo y tercero, tampoco se adaptaptan a lo que yo consideraría práctico, puesto que no presentan ese relieve caracteristico o volumen. Tambien en ese sentido, el primer formulario, lo cumple de forma impecable. Así como el cuarto, que presenta relieve tanto en el pagecontrol como en los botones.
Y si tuviera que votar por uno de los cuatro, sin duda me quedaba con el primero, el clasico, que muestra tonos suaves. Es cuestion de gustos.
Un saludo a todos.
Salvador Jover
Por tcirac #
El primero y el cuarto. Aunque soy de la opinión que para la usabilidad de una aplicación el diseño ha de ser sencillo, con colores suaves que no cansen la vista y distraigan la mirada de lo realmente importante, que son los datos.
Personalmente me gustan los diseños simples, con algún detalle que le de clase, pero que no sea estridente. Para mi gusto los tres últimos diseños son demasiado recargados como para ponerlos en una gestión o contabilidad.
El formato de campos del primero y cuarto me parecen fenomenales. Es fundamental que se vea donde empieza y acaba el área editable.
Me gustaría sugerir que en las plantillas apareciera un botón “Aceptar y seguir” y otro “aceptar” ambos con teclas de acceso rápido.
El tema de transparencias es muy interesante, pero hay que utilizarlas con mucho arte para no hacer un formulario ilegible.
Salu2
Por r_baena #
Mi valoración es la siguiente por orden de aceptación:
1º) Estilo capuccino: es elegante, fácil de leer, la fuente es limpia y amplia, incluye detalles modernos de diseño como el refejo, los botones de aceptar y cancelar son botones (es decir, con relieve lo que lo diferencia de las pestañas), los campos de edición se ven claramente por el hundido y es intuitivo. Los colores pastel son elegantes y no cansan la vista.
2º) Estilo classic: es muy intuitivo, fácil de leer, buenas fuentes y de gran sencillez en el diseño y en la utilización. También se pueden incluir las razones del anterior.
3º) Estilo contemporary: me gusta poco porque parece más una ficha de presentación de datos que de edición. Los botones aceptar, cancelar… no se difirencian que son botones.
4º) Estilo web 2.0: no me gusta nada, los colores son muy intensos y se comen la vista. Por otro lado, no es el hecho en sí de los colores fuertes, sino que, según mi opinión, no están bien combinados.
Como sugerencia indicar que sería bueno que a los botones de acción se vierá cuál es la tecla de acceso rápido.
Muchas gracias por vuestro esfuerzo.
Por soporte #
Hola,
Conteporary y Web 2.0 … a la papelera de reciclaje … no venderíamos una aplicación ni a un ciego (jaja). En serio … esos dos, nada de nada. Los otros me parecen bien.
Un saludo.
Por fjpnovo #
Buenos dias:
Opino lo mismo: Contemporary y Web 2.0 no me gustan demasiado. Los otros dos están muy bien.
Un saludo,
Fran.
Por agonzalez #
Muchas gracias a todos por vuestros comentarios e interés en este tema tan importante.
Roma7612901 disculpad que no haya puesto la dirección en el artículo, ya la he incluido. La dirección para enviar los correos es: formacion@velneo.com. Lo que nos gustaría que nos enviaseis es una de estas dos opciones:
1º) Capturas de pantalla de la presentación preliminar del formulario o partes del formulario (botones, controles, etc.), programados en vuestro servidor.
Para poder ver la presentación prelimar de un formulario con vDevelop en V7, hay que editar el formulario en el dock de vista central, estando seleccionado el formulario y no algún control del mismo, pulsar la tecla “Inicio”. Esta vista preliminar nos permite introducir información en los campos, lo que le da un aspecto de ejecución real a la presentación preliminar.
2º) Cread un usuario en vuestro vServer con acceso restringido a los sitios en cuestión, que no sea supervisor, y nos enviáis la dirección del servidor, usuario y contraseña de acceso, así como la caja y formulario de ejemplo.
Saludos.
Por eic #
Bueno, ya veo que habéis incluido una dirección para enviar las sugerencias. Sin embargo, quería hacer un comentario más o menos general.
Me parecen bien los estilos, aunque dudo mucho que use alguna vez alguno de ellos. Me recuerdan a los estilos de Access. Puede que alguien los use (y de hecho, he visto pequeñas aplicaciones de usuarios particulares que los usan), pero dudo que alguien que quiera hacer algo un poco más serio saque de ellos más que, quizá, alguna idea para algún control.
Me parece más interesante la idea de las plantillas actuales, que marcan un estilo sencillo pero con algún componente visual agradable. A medio camino entre el classic y el capuccino. Es mucho más usable.
Por eso, casi podría decir que no sé si merece la pena invertir mucho tiempo en los estilos “complejos”, porque su uso va a estar más restringido, y pueden servir sólo para sacar ideas. Pero claro, desde el punto de vista de Velneo es una manera de que la herramienta entre por los ojos, sobre todo viniendo de una historia en la que su mayor estigma fue la falta de contenido visual en los desarrollos finales.
Saludos,
Fran Varona
Por frueda #
Buenas a todos, la verdad es que a mi gusto es como del resto, el classic y el capuccino están OK, sin embargo, rompo una lanza en favor de Web 2.0, y no por lo de Web 2.0, sino porque en mi trabajo, necesito que usen aplicaciones personas con discapacidades visuales y me vuelvo loco por conseguir un formulario “accesible” a estas personas, yo cambiaría el nombre de Web 2.0 por “Accesible”. La verdad es que estoy seguro que estos contrastes fuertes ayudan a “ver mejor” a aquellos que lo necesiten.
En realidad, sería estupendo poder seleccionar un formato visual dependiendo del usuario que inicia sesión, ya que no es lógico poner un formulario Accesible a una persona con su capacidad visual “normal”.
Por guillermo #
Pues a mi me han gustado los cuatro.
Creo que es muy interesante disponer de una gran variedad de intrefaces, que vayan mas allá de un simple cambio de colores.
En definitiva, se trata de que una aplicación pueda variar completamente de estética, en función del perfil o tipo de negocio al que queramos acceder.
Un saludo, GAV
Por desarrollo #
En cuanto a interface de usuario soy de los que tiran a lo simple.
En algún sitio leí que la aplicación debe ser “transparente” y dejar al usuario concentrarse en su trabajo, así que si por mi fuese las haría transparentes.
No, en serio, creo que más que proponer estilos “radicales” o “distintos” que muestran las posibilidades de diseño con V7, sería más interesante plantear estilos básicos basados en apariencias ya conocidas por el usuario, como por ejemplo algún estilo visual de Vista, o de Mac, o de alguna distribución linux, o de aplicaciones de éxito y ámpliamente conocidas por los usuarios (gmail, gmaps, gdocs, etc), que al final es lo que más les va a atraer; lo que ya conocen y les gusta.
De los propuestos en el post me quedo con el classic, y el resto los odio profundamente. Si un cliente me los pidiese así, ya se que se pueden hacer, pero…
Interesante propuesta.
Un saludo,
DomK