10 errores en el diseño de aplicaciones

ByLuis

Un gran post en el que se nos explica diez errores que se cometen cuando se diseña una aplicación, un resumen sería el siguiente:

  • Controles no estándares: los enlaces, botones, radio buttons y demás controles tienen una utilidad específica y estándar. Cambiar el comportamiento no es lo correcto y no hace más que confundir al usuario.
  • Inconsistencia: diferentes cosas para una misma utilidad, usa lo mismo en el mismo lugar para la misma acción.
  • Acciones no perceptibles: se debe saber qué acción realiza un control a simple vista. Si hay que investigar para qué sirve algo no cumple su cometido.
  • Controles sin reacción: cada control debe indicar 3 cosas: mostrar a los usuarios el estado actual, cómo se interpretan los comandos y qué está pasando.
  • Malos mensajes de error: no basta con decir que hay un error, sino que es lo que ha pasado y que se puede hacer para solucionarlo.
  • Preguntar por lo mismo dos veces
  • No hay valores por defecto: os valores por defecto sirven para que haya más rapidez en las respuestas, para enseñar mediante el ejemplo y para dirigir a usuarios novatos.
  • No explicar cómo funciona la aplicación: en aplicaciones estándar eso no es muy problemático, pero en otras aplicaciones hay que explicar qué se puede conseguir y cómo y no únicamente acceder a la aplicación.
  • No indicar qué se hace con la información
  • Mostrar características internas: al usuario no le importa y no llegará a entender cosas internas de la aplicación, por lo que no es necesario que el usuario lea.

Top-10 Application-Design Mistakes

Vía / dzone

Similar Posts

aSSL: SLL sin HTTPS

ByLuis

aSLL es una librería bajo licencia MIT que implementa una tecnología similar a SSL pero sin HTTPS.
aSSL permite al cliente negociar una clave secreta aleatoria de 128 bits con el servidor usando un algoritmo RSA. Una vez que la conexión se ha establecido, los datos se enviarán y recibirán usando el algoritmo AES.
aSSL está compuesto por algunos ficheros Javascript y componentes en el servidor. En un futuro habrá puertos para cada uno de los lenguajes web más importantes (PHP, Java, Perl, Python, TKL, …).
aSSL
Vía / WebAppers

|

Clipping de vídeo usando HTML5 y SVG en Firefox4

ByLuis

La verdad es que Firefox4 está de lujo, y las demos que ofrece Mozilla son increíbles. De una de ellas he sacado cómo hacer clipping en vídeos usando HTML5 y la posibilidad de incrustar SVG (sólo funciona en Firefox4).

El método es sencillo, tengo un SVG que muestra el contorno y los botones de play y pausa, además tiene un clipPath que se usará para el estilo clip-path del vídeo:

SVG

Vídeo

Javascript

var play = document.getElementById('play');
var pause = document.getElementById('pause');
var video = document.getElementById('video');
play.addEventListener('click', function() {
    play.style.display = 'none';
    pause.style.display = 'block';
    video.play();
  }, true);  
pause.addEventListener('click', function() {
    play.style.display = 'block';
    pause.style.display = 'none';
    video.pause();
  }, true);  
video.addEventListener("ended", function() {
    play.style.display = 'block';
    pause.style.display = 'none';
    video.pause();
  }, true);

El vídeo es el mismo que el de la demo de Mozilla, he puesto el borde semi-transparente para que se vea el clipping como va.

Demo

Vía / Project London Trailer

| |

Prism: aplicaciones web en tu escritorio

ByLuis

prism.pngPrism es una nueva forma de entender las aplicaciones web, se trata de un punto intermedio entre una aplicación web y una aplicación de escritorio.
Mediante Webrunner podemos ejecutar aplicaciones web en nuestro escritorio. No se trata como en el caso de Adobe AIR y Microsoft Silverlight que pretender crear una alternativa de la web. Se trata de extraer del navegador aplicaciones web y ejecutarlas (mediante XUL) en nuestro escritorio, por lo que estas aplicaciones web podrán hacer uso de HTML, JavaScript, CSS, y <canvas>.
Una buena alternativa para las aplicaciones web que se hacen para empresas.
Prism
Gracias Dani por el aviso

oEmbed: formato para URLs de contenido EMBED

ByLuis

Bueno, el título es algo difícil de entender, pero el concepto es fácil, oEmbed es un formato para devolver información sobre URLs que muestran contenido incrustable: imágenes, vídeos, …

Por ejemplo para Flickr sería:

http://www.flickr.com/services/oembed/?url=http%3A//www.flickr.com/photos/bees/2341623661/

Y el resultado en formato JSON sería:

{
  "version": "1.0",
  "type": "photo",
  "width": 240,
  "height": 160,
  "title": "ZB8T0193",
  "url": "http://farm4.static.flickr.com/3123/2341623661_7c99f48bbf_m.jpg",
  "author_name": "Bees",
  "author_url": "http://www.flickr.com/photos/bees/",
  "provider_name": "Flickr",
  "provider_url": "http://www.flickr.com/"
}

Existen librerías PHP y jQuery que funcionan con proxy para obtener la información.

Learning oEmbed: Convert Links Into Embedded Content