Blog


Splash y logo Del Software Finansys pro 3

Prototipo 3

Splash y logo Del Software Finansys pro

Tecnocoop




Splash y logo Del Software Finansys pro 2

Prototipo 2

Splash y logo Del Software Finansys pro

Tecnocoop 

 




Splash y logo Del Software Finansys pro

Prototipo 1

Splash y logo Del Software Finansys pro

Tecnocoop




Las 7 leyes fundamentales de la experiencia de usuario en interfaces gráficas

Las 7 leyes fundamentales de la experiencia de usuario en interfaces gráficasLa experiencia de usuario no se trata de saber dominar ninguna herramienta, o saber lenguajes de programación, es un área mucho más conceptual que está presente aunque en teoría no pueda verse. La usabilidad que también forma parte de la UX ayuda a que los elementos de una interfaz de usuario sea lo más concreta y usada por el usuario sin que le suponga problema el manipularla.
Por eso, les traigo lo que son para mi las 7 leyes fundamentales de la experiencia de usuario en interfaces gráficas. Leyes que a mi gusto todos deberían de cumplir si se llegan a encontrar con un proyecto donde el usuario tiene que manejar acciones y elementos de forma constante, además de sólo bajar el scroll y dar uno o dos clics.

1. Ley de claridad

image
El usuario evitará los elementos de interfaz que no tengan un significado claro. El ejemplo es la imagen que aparece, donde Gmail tiene como ícono para mostrar todas sus aplicaciones unos simples cuadrados, cuando en realidad debería tener un ícono mucho más visual que le diga al usuario que ahí puede ver sus aplicaciones.

2. Ley de la acción principal

image

El usuario se sentirá más cómodo cuando saben cual es la acción principal que deben hacer. En otras palabras, es hacer que el usuario sepa lo que va a hacer sin que alguien le diga. Por ejemplo el sitio de Twitter en su versión anterior, si un usuario llega no sabrá qué hacer, ya que la acción principal es crear un nuevo tweet pero no hay una opción sumamente visible que le diga al usuario eso. Hay dos opciones para escribir, pero estoy seguro que nadie las habrá notado al ver la imagen.

3. Ley del contexto

image

El usuario espera ver elementos en la interfaz de usuario cercanos al objeto que quiere controlar. Un ejemplo muy bueno de la práctica de esta ley es LinkedIn, la cual te permite editar con un ícono de lapiz el elemento que quieras cambiar. También está un botón de una cámara en señal que puedes cambiar tu imagen de perfil, es decir, hay controles cerca de los elementos que se pueden editar.

4. Ley de los defaults

Los usuarios raramente cambiarán las configuraciones por defecto. La ley de los defaults dice que un usuario muy rara vez cambiará o personalizará todos los elementos que tiene a su alrededor, por lo que es importante que nosotros creemos configuraciones por defecto que sean lo más útiles y prácticas y poco deseables de cambiar.

5. Ley de la acción guiada

image

El usuario probablemente hará algo si se le es pedido que lo haga. A veces necesitan un pequeño empujoncito nuestros usuarios para que realicen un poco de actividades secundarias en nuestro producto o servicio, y si le mostramos sorpresivamente algunas recomendaciones para hacer es muy probable que las haga. Otro ejemplo claro es LinkedIn al pedir calificar o añadir nuevas habilidades a los contactos recién añadidas.

6. La ley de la retroalimentación

image

El usuario se sentirá más confiado si se le provee de una retroalimentación clara y constante. Es un efecto humano el esperar una respuesta a una acción realizada, y en nuestro servicio o producto es lo mismo. Si le damos una retroalimentación a nuestros usuarios de que su acción provocó algo bueno, o malo, lo más probable es que se sientan más confiados en el uso del sistema, lo que les permitirá un mejor uso del mismo.

7. La ley de la facilidad

image

El usuario se inclinará a hacer acciones complejas si éstas son divididas en pasos más pequeños. La imagen da cuenta del principio, ya que mientras a la izquierda tenemos un montón de campos que llenar y poca información o ayuda para saber si está bien llenada, a la derecha tenemos pocos campos con una mejor explicación de lo que tenemos que escribir en cada campo. Esto causa un efecto mucho más agradable a la vista y en general de usabilidad porque el usuario no quiere tener muchas cosas que hacer en una sola pantalla, y de preferencia en muchas páginas tampoco, pero dividir un todo en partes pequeñas es una muy buena forma de acomodar contenido, y más cuando el usuario tiene que intervenir.

¿Son consejos o leyes universales?

A mi parecer no podría llamarlos consejos, porque el hecho de no seguirlos en ningún tipo de proyecto se está arriesgando toda la interactividad y hará que el usuario pierda todo el interés en lo que está usando. Así que sí, son leyes necesarias que deben existir cada vez que hagan un proyecto en donde ustedes tengan que diseñar una interfaz de usuario agradable a todas las personas.

Vía stumbleupon




5 consejos para aprenderse todas las propiedades CSS de forma muy sencilla

Mucha gente odia CSS porque son muchos estilos que aprenderse, y además cada propiedad puede tener diferentes valores, y cada valor puede ser diferente en muchos sentidos al funcionamiento ya en el sitio. La verdad es que a diferencia de HTML, donde sólo usamos una minúscula cantidad de etiquetas del total que nos ofrece, en CSS podemos llegar a ocupar la mayoría de las propiedades CSS si queremos que nuestro sitio esté estilizado hasta el último pixel de la pantalla.
Es por eso que les traigo 5 consejos para aprenderse las reglas y propiedades CSS sin tener que memorizarlas y tener que recurrir a un librito salvador o en todo caso a internet cada vez que no recordamos cuál es la propiedades que queremos saber.

1.  Práctica, no copies tus estilos

Mucha gente se cansa de pensar y mejor copia de los proyectos que tiene los estilos y los adapta. No es mala la práctica de hecho, pero es una práctica que debe hacerse cuando ya se domina CSS, no cuando se está aprendiendo. Si se quiere aprender de verdad a usar los estilos la única forma es practicar y practicar hasta el cansancio, ya que de esa forma el cerebro se acostumbra a ver las propiedades a tal punto que ni siquiera tendrás que pensar en qué usar para estilizar tu sitio.

2. Piensa en lo que quieres conseguir

Mucha gente que empieza no sabe ni lo que quiere diseñar con CSS pero ya está buscando la propiedad para hacerlo. Lo primero es pensar muy bien como se quiere el sitio, para después partir con base en esa idea. Por ejemplo, si lo que quieres es cambiar el color de fondo, lo más seguro es que uses la propiedad background-color.
Los nombres de las propiedades son en inglés, por lo que lo más seguro es que si queremos aumentar el margen de un elemento lo que necesitemos es usar la propiedad “margin”, así de sencillo. Hay propiedades como la de “clip” o “display” o “position” que son poco directas en el uso, pero el resto si lo es, por lo que tampoco es difícil en aprenderse las reglas.

3. No uses herramientas visuales, mejor solo código

Otro gran problema es que la gente se acostumbra a usar Dreamweaver o cualquier otra herramienta que ayuda a preparar estilos sin tener que escribir el código. Es una práctica que solo recomendaría cuando ya las dominas y no dispones de mucho tiempo, quieres diseñar muy rápido pues. La gente que no sabe y aprende a usar estas herramientas aprender a usarlas, mas no aprende CSS, y luego con el problema de los sufijos pues hace que el desarrollador o diseñador se confunda mucho más.

4. Trata de imitar el diseño de otros sitios

No hay mejor forma de aprender que imitando el diseño de otros sitios. Yo aprendí así, viendo sitios con diseños muy bonitos o elementos diseñados muy atractivamente, y como yo quería lograr un efecto similar me propuse imitar ese resultado. No es copiar literalmente el CSS de ese elemento, es imitarlo sin tener que ver sus propiedades, porque un elemento o diseño puede verse igual con 20 propiedades o con 5, todo depende de cuanto detalle puedas encontrar en el. Todo esto hará que mejores en el uso de las propiedades, y por ende que las aprendas.

5. Obtén un patrón para trabajar

La gente que no sabe programar tiende a programar de varias formas cada vez que lo hace, pues no encuentra una forma de programar que se adecue a sus necesidades. En CSS es lo mismo, la gente que no sabe diseñar con CSS tiende a usar diferentes estilos para las mismas partes de un sitio web. No es malo pero si para hacer un fondo usas diferentes propiedades lo más probable es que nunca aprendas correctamente a diseñar un fondo para un sitio.
No es que todos los sitios sean iguales, pero con la práctica aprendes que ciertas reglas CSS son para partes específicas de un sitio, como por ejemplo el box-sizing para la etiqueta body y html. Todo esto se aprende leyendo, viendo el formato de expertos, pero al final teniendo un estándar de trabajo, donde tu sabes y aplicar estilos de acuerdo a las etiquetas y secciones de tu sitio.




HTML5 ya es declarado como un estándar

  • 1 enero, 2015
  • Tips

Después de casi 6 años en que surgió la idea y concepto de la siguiente evolución de HTML fue que todo el mundo en internet empezó a prepararse para adoptar en sus sitios y aplicaciones web la tecnología de HTML5. HTML5 no solo es la siguiente versión de lo que fue HTML4, también representa un nuevo paradigma donde prácticamente cualquier cosa que quieras construir y mostrar al público es posible. Ya no hay un límite sobre lo que un sitio puede ser o puede tener, además de que la integración con cualquier tipo de dispositivo hace posible todavía más expandir este estándar hacia mucha más gente.
El World Wide Web Consortium (W3C) le ha dado luz verde al HTML5 como estándar, de tal forma que para este día cualquier navegador, sistema y aplicación que haga uso de ello puede estar seguro que los ajustes ya son multiplataforma. Para los usuarios representa que debería ver los sitios y cualquier contenido web de la misma forma en cualquier dispositivo, claro, con diferente experiencia de usuario para unos de acuerdo el medio, pero la funcionalidad debe ser la misma.

La verdad es que si no estamos involucrados en el avance de HTML5 no podríamos darnos cuenta que con HTML4 sólo teníamos acceso a sitios web estáticos y un poco de Flash. Ahora tenemos toda una gama de aplicaciones y usos que no hubieran sido posibles sin esa evolución de internet y estos estándares.