Trazando una estética de los datos Comments Off
Jose Luis de Vicente nos muestra la importancia del diseño de la información y como a lo largo del tiempo se ha usado para visualizar datos complejos de una manera clara y fácil de entender a través de gráficos. La evolución de esta técnica, acompañada de los cambios tecnológicos, ha hecho que se puedan generar gran variedad de técnicas, abarcando mas datos y mostrándolos de maneras mas atractivas.
Trusted computing Comments Off
Saps que és el DRM? Coneixes els teus drets com a usuari dels teus productes digitals? música, pel·lícules… i del teu hardware?
Si en vols saber més:
DRM
Models mentals Comments Off
Exercici en el que analitzavem el model mental d’una persona que vol llogar un cotxe. En el nostre cas vam escollir dos models oposats, un perfil econòmic i un personalitzat. Després de plantejar les diferents preguntes que poden sorgir, hem fet aquest gràfic que il-lustra les preferències de cada perfil.
L’equip de treball l’hem format: Rolando Medina, Eduardo China, Joan Ardiaca i Iban Beldarrain.
El código se transforma en algo visual… Comments Off
¡¡¡¡¡¡CONTROL + ENTER!!!!!!
eyeOS Comments Off
eyeOS es un escritorio virtual multiplataforma, libre y gratuito, basado sobre el estilo del escritorio de un sistema operativo. El paquete básico de aplicaciones que vienen por defecto, incluye toda la estructura de un sistema operativo y algunas aplicaciones de tipo suite ofimática como un procesador de textos, un calendario, un gestor de archivos, un mensajero, un navegador, una calculadora y más. El paquete entero está autorizado bajo la licencia libre AGPL. Existe un sitio paralelo que provee aplicaciones externas para eyeOS, llamadas eyeApps.
Se trata de un nuevo concepto en almacenaje virtual, el cual se considera como revolucionario al ser un servicio clave para el Web 2.0 ya que dentro de una web que combina el poder del actual HTML, PHP, AJAX y JavaScript para crear un entorno gráfico de tipo desktop.
La diferencia entre otros entornos desktop al hacer posible iniciar el desktop eyeOS y todas sus aplicaciones desde un navegador web. No se requiere instalar ningún software adicional, ya que solo se necesita un navegador que soporte AJAX, Java y Macromedia Flash (dependiendo de las aplicaciones que se deseen correr).
Step by step Comments Off
Traçant una estètica de les dades Comments Off
En aquesta conferència enmarcada dins del prograqma del Medialab-Prado 2007, José Luis de Vicente ens ofereix una exposició acurada sobre l’estètica de les dades i la seva evolució en el temps, alhora que ens aporta reflexions interessants de com influeix en les dades exposades, la forma com es representen.
En el disseny de la informació, és important el concepte de pensar amb els ulls. Un dels primers exemples d’aquest principi, el trobem l’any 1855 amb les cartes figuratives de Joseph Minard, que venen a ser plasmacions de grans derrotes històriques en un espai geogràfic concret i en un temps continuat.
Aquestes cartes son un punt d’inflexió a partir del qual, la representació gràfica, esdevé un element clau en la comunicació de dades, que es manté vigent fins a l’actualitat.
Un altre exemple històric sobre disseny de la informació el trobem el mateix any a Londres, on John Snow representa sobre un mapa, les repercussions que va tenir la còlera en aquella ciutat.
Més recentment, agafant el relleu d’aquests precursors, apareix Dataset que es basa en la representació de dades estàtiques de forma tabular, on cada columna representa una variable diferent.
A partir dels any noranta es comencen a introduir patrons de disseny de la informació més dinàmics, aconseguint entendre sistemes de visualització de dades complexes amb representacions senzilles.En aquesta mateixa dècada cal esmentar el concepte “Data Mining” que consisteix en extreure informacions útils, de grans conjunts de bases de dades.
Ja en la actualitat un altre nivell de sistema de representació són els coneguts “núvols de tags”, que utilitzen una tècnica anomenada folksonomia, i permeten caracteritzar diferents elements d’un sistema, en categories semàntiques.
En l’anomenada Web 2.0, gràcies als “tags” i als “sistemes d’etiquetatge” aplicats al món dels blogs, ja són els propis usuaris els qui classifiquen les dades de la manera que els sembli més adient per a cada post.
A nivell personal, d’aquesta conferència, n’extrec la idea bàsica, que és molt important realitzar una bona representació gràfica de les dades, que sigui senzilla, lògica, funcional i dinàmica i que ajudi a l’usuari/receptor a percebre i entendre aquesta informació d’una manera adequada. Com més assequible, per dir-ho així, sigui aquesta informació mes eficaç serà la interacció.
ActionScript Comments Off
ActionScript es un lenguaje de programación orientado a objetos utilizado en especial en aplicaciones Web animadas realizadas en el entorno Adobe Flash (la tecnología de Adobe para añadir dinamismo al panorama Web). Fue lanzado con la versión 4 de Flash, y desde entonces hasta ahora, ha ido ampliándose poco a poco, hasta llegar a niveles de dinamismo y versatilidad muy altos en la versión 9 (Adobe Flash CS3) de Flash…
A ver qué nos espera…
Flash(r)evolution Comments Off
In January 1993, Jonathan Gay, Charlie Jackson, and Michelle Welsh started a small software company called FutureWave Software and created their first product, SmartSketch. A drawing application, SmartSketch was designed to make creating computer graphics as simple as drawing on paper. At first, it did not gain enough of a foothold in its market. As the Internet began to thrive, however, FutureWave began to realize the potential for a vector-based web animation tool that might easily challenge Macromedia’s Shockwave technology. In 1995, FutureWave modified SmartSketch by adding frame-by-frame animation features and re-released it as FutureSplash Animator on Macintosh and PC. By that time, the company had added a second programmer Robert Tatsumi, artist Adam Grofcsik, and PR specialist Ralph Mittman. The product was offered to Adobe and used by Microsoft in its early work with the Internet (MSN). In December 1996, Macromedia acquired the vector-based animation software and later released it as Flash, contracting “Future” and “Splash” of the FutureWave name.
- FutureSplash Animator (April 10, 1996): initial version of Flash with basic editing tools and a timeline.
- Macromedia Flash 1 (November 1996): a Macromedia re-branded version of the FutureSplash Animator.
- Macromedia Flash 2 (June 1997): Released with Flash Player 2, new features included: the object library.
- Macromedia Flash 3 (May 31, 1998): Released with Flash Player 3, new features included: the movieclip element, JavaScript plug-in integration, transparency and an external stand alone player.
- Macromedia Flash 4 (June 15, 1999): Released with Flash Player 4, new features included: internal variables, an input field, advanced ActionScript, and streaming MP3.
- Macromedia Flash 5 (August 24, 2000): Released with Flash Player 5, new features included: ActionScript 1.0 (based on ECMAScript, making it very similar to JavaScript in syntax), XML support, Smartclips (the precursor to components in Flash), HTML text formatting added for dynamic text.
- Macromedia Flash MX (March 15, 2002): Released with Flash Player 6, new features included: a video codec (Sorenson Spark), Unicode, v1 UI Components, compression, ActionScript vector drawing API.
- Macromedia Flash MX 2004 (September 9, 2003): Released with Flash Player 7, new features included: Actionscript 2.0 (which enabled an object-oriented programming model for Flash)(although it lacked the Script assist function of other versions, meaning Actionscript could only be typed out manually), behaviors, extensibility layer (JSAPI), alias text support, timeline effects.
- Macromedia Flash MX Professional 2004 (September 9, 2003): Released with Flash Player 7, new features included all Flash MX 2004 features plus: Screens (forms for non-linear state-based development and slides for organizing content in a linear slide format like PowerPoint), web services integration, video import wizard, Media Playback components (which encapsulate a complete MP3 and/or FLV player in a component that may be placed in an SWF), Data components (DataSet, XMLConnector, WebServicesConnector, XUpdateResolver, etc) and data binding APIs, the Project Panel, v2 UI components, and Transition class libraries.
- Macromedia Flash 8:
- Macromedia Flash Basic 8 (released on September 13, 2005): A less feature-rich version of the Flash authoring tool targeted at new users who only want to do basic drawing, animation and interactivity. Released with Flash Player 8, this version of the product has limited support for video and advanced graphical and animation effects.
- Macromedia Flash Professional 8 (released on September 13, 2005): Released with the Flash Player 8, Flash Professional 8 added features focused on expressiveness, quality, video, and mobile authoring. New features included Filters and blend modes, easing control for animation, enhanced stroke properties (caps and joins), object-based drawing mode, run-time bitmap caching, FlashType advanced anti-aliasing for text, On2 VP6 advanced video codec, support for alpha transparency in video, a stand-alone encoder and advanced video importer, cue point support in FLV files, an advanced video playback component, and an interactive mobile device emulator.
- Adobe Flash CS3 Professional (as version 9, released on April 16, 2007): Flash CS3 is the first version of Flash released under the Adobe name. CS3 features full support for ActionScript 3.0, allows things to be converted into ActionScript, adds better integration with other Adobe products such as Adobe Photoshop, and also provides better Vector drawing behavior, becoming more like Adobe Illustrator and Adobe Fireworks.
- Adobe Flash CS4 Professional - the new version of flash, codenamed, “Diesel” - not to be confused with the latest public prerelease of the Flash 10 Player, code named “Astro” - contains inverse kinematics (bones), basic 3D object manipulation, object-based animation, an enhanced text engine, and further expansion on AS 3.0..
Font: Wikipedia
Clase magistral de Ignacio Comments Off
Un aplauso para Ignacio de la clase de diseño Web. Estas son las clases que necesita un desarrollador Web y que no puede encontrar ni en libros ni en la red. Alguien profesional dedicado al sector que nos cuenta sus trucos y secretos que opina sobre los diseños de otras páginas., que aporta links de [...]Alquilar un coche Comments Off
Ejercicio Definir el modelo mental de una persona que quiere alquilar un coche para el fin de semana
Modelos Mentales Comments Off
Es la representación mental que se hace una persona de su realidad exterior. Nos sirve para simplificar la realidad y procesar más rápido nuestra respuesta en la interacción con nuestro entorno.
Boxes and Arrows - What Is Your Mental Model? An Interview With Indi Young By Chris Baum
User Interface Engineering - SpoolCast: Reviewing Mental Models with Indi Young By Jared Spool
Ejemplos mentales
Diseño_Web Comments Off
Ejercicio de la clase de Diseño web, con Nacho Zorraquin. El ejercicio consistía en realizar un analisis comparativo entre dos webs que fuesen competencia directa. El analisis debia de tener unas pequeñas referencias en cuanto a la usabilidad, funcionalidad y diseño. El trabajo se realizó en grupos aleatorios.
En nuestro caso elegimos dos tiendas que se dedican a la venta de aparatos de informatica, electrodomesticos, ordenadores, musica… En primer lugar tenemos MediaMarkt, y por otro lado PcCity. Son tiendas que son competencia clara aunque existan otras diferentes a estas con similares productos.
Trabajo realizado por: Israel, Ivan, Joan, Alba, Toni, Gioia, Patricia y jorge
Modelos mentales / Perfiles Comments Off
Definición del modelo mental de una persona que se plantea alquilar un coche.
Ejemplo de modelos mentales en función de dos perfiles determinados: familia numerosa y grupo de jóvenes.
Acordándome del arquitecto de la información… Comments Off
El arquitecto de la información que estructuró las funcionalidades de mi móvil (un Motorola U6, creo) consiguió el domingo que yo, mientras apagaba el despertador de mi móvil (dormida), acabara borrando tooodos los mensajes de texto que tenía sin que ni siquiera me enterara (claro, estaba dormida).
Cuando me di cuenta al cabo de unas horas, después del desconcierto inicial, de pasar al nopuedeserquepongaquehayceromensajes y de apagar y encender el móvil varias veces, pasé a analizar (con cierta amargura, he de decir) cómo podía ser que todo su contenido se hubiera desvanecido sin ni siquiera darme cuenta de ello… Entre nopuedeser y nopuedeser, me puse a “navegar” por los menús de mi móvil buscando una respuesta y descubrí que el proceso para conectar o modificar una alarma del despertador es similar al de la petición de borrado de todos los mensajes, con la diferencia de la tecla inicial de acceso.
Si tenemos en cuenta que estaba dormida (¿lo he dicho ya?) y que las teclas para entrar a la alarma y a los mensajes están una al lado de la otra… ¿resulta extraño pensar que, llevada por automatismos, acabara reproduciendo los pasos de configuración de la alarma en el menú de mensajes borrando así todo su contenido??
Sé que suena absurdo y que un arquitecto de la información no puede llegar a prever todas las situaciones disparatadas ante las que se puede encontrar un usuario y que hay cosas que son impredecibles pero… ¿¡realmente hacía falta que la opción de borrado de todos los mensajes apareciera en el cuarto lugar de un menú principal?! ¿No hubiera sido más conveniente “esconderla” (como dice Máximo) en otros niveles secundarios de funcionalidad? Para mí al menos sí… porque, eso sí, el cabreo conmigo misma no me lo quita nadie…
[Este post está basado en hechos reales. Ningún arquitecto de la información ha sido maltratado antes, durante o después de la escritura de este post.]
Análisis de Usabilidad Comments Off
Hemos hecho un ejercicio de análisis de comparación de la usabilidad de dos sitios competidores. He juntado algunas de las preguntas que uno se puede hacer para determinar la usabilidad de un sitio web. Casi todas estas han surgido a lo largo del ejercicio y al comentarlos en clase, pero si se me ocurre alguna más, intentare añadirla.
Usabilidad
Se identifica bien de quien es sitio y a que se dedica?
Se identifica bien el sistema de navegación?
el usuario puede seleccionar los textos para copiarlos?
Diseño adaptable al tamaño de la ventana?
Es el tamaño de la tipografía correcto?
si hay banner cerca del logo, confunde?
Accesibilidad
tiene un saltar a contenido para que desde un movil o un ciego
tienen alt las imágenes?
explica de que va la pagina?
Tiene accesos de teclado?
Esta centrado el contenido en la ventana del navegador?
Se puede ver en un móvil?
Buscabilidad
indexación en google
esta bien hecho el seo?
Semántica
separación css/contenido
si esta en flash, esta insertado mediante javascript
Es necesario que este en flash? Se puede hacer sin?
Diseño
Usa bien el recurso de las imágenes?
Es consistente la estética
Como se ve en 800 x 600?
Influyen los banners mas de la cuenta en la percepción general de la estética?
Si hay animación en el banner, distrae demasiado del contenido?
Lanzaderas de selección de idioma: comunican algo?
Modelos mentales - alquiler de un coche Comments Off
Este a sido un ejercicio de desglosar un proceso mental a la hora de buscar un coche para alquilar un coche para un fin de semana. Parece mentira como algo que a simple vista parece tan sencillo acarrea tantas dudas, y como la mente humana puede procesar la mayoría de ellas sin darse casi ni cuenta. Lo estoy dividiendo por fase de proceso.
Las mas relevantes
Cual es el sitio mas barato?
Hay algún coche en oferta?
Cuanto cuesta?
Esta disponible?
Es seguro?
Puedo pagar con tarjeta?
Donde?
Que sitios he usado en el pasado?
Me trataron bien?
Me pareció barato?
Alguien me ha comentado algún sitio bueno?
Internet o tienda física?
Cuál es el sitio más barato?
Cuál es el sitio más cercano?
Como?
Como voy hasta allí?/Cual es la URL?
Que tal es la atención al cliente?/Como funciona la web?
Puedo alquilar?
Que?
Hay algún coche en oferta?
Cuanto vale?
Me gusta?
Es el más adecuado?
Esta disponible?
Que coche quiero?
Como es?
Es seguro?
Cabremos todos?
Cabrá el equipaje?
Es fácil de aparcar?
Gasta mucha gasolina?
Cuantos kilómetros incluye al día?
Es Diesel o gasolina?
Lleva airbag?
Lleva gps?
Lleva cadenas?
Lleva rueda de socorro?
Que mapas lleva el gps?
Lleva entrada ipod?
Lleva dvd?
Lleva manos libres?
Como?
Lo puedo probar?
que paso si lo estropeo
como funciona el seguro?
Viene cargado de gasolina?
Que pasa si lo devuelvo tarde?
Que pasa si me lo roban?
Que pasa si me quedo colgado en la carretera?
Lo tengo que devolver con el deposito lleno?
Tengo que pagar un deposito de garantía?
como quiero pagar?
Puedo pagar con tarjeta?
Puedo fraccionar el pago?
Analisis de dos competencias. Comments Off
El ejercicio consiste en escoger dos competencias de mercado y analizar las diferencias en cuanto a funcionalidad, usabilidad, diseño y accesibilidad. En este caso hemos analizado las paginas web tanto de Media Markt como de Pc City, ambas conocidas empresas en distribuir productos informaticos, audiovisuales, fotograficos…etc
MEDIA MARKT // www.mediamarkt.es
Funcionalidad negativa
- Limitación de productos
- No se puede comprar online
- No podemos comprar productos
- No hay buscador de productos
Funcionalidad positiva
- Buen tratamiento del usuario a nivel de inserción a la empresa (el usuario tiene.
- Facilidad para acceder como trabajador de media Marka).
Usabilidad positiva
- Línea de navegación siempre presenta. De esta forma el usuario sabe en que sección se encuentra en cada momento.
- Navegación más sencilla y predecible tanto en el menú horizontal como vertical.
- La jerarquización del producto es mas clara.
Usabilidad negativa
- La navegación se ralentiza debido a la excesiva utilización de recursos flash.
Diseño positivo
- Buena estructura de las botoneras. Cuidado de los márgenes tanto superior como inferior.
- Pequeñas animaciones en las ofertas que le da un diseño mas efectista a cada producto
- Logo fácil de reconocer y buena colocación.
Diseño negativo
- Dificultad de lectura en las ofertas topográficamente y por el sobrecarga de información poco operativa.
- La botonera inferior con información de la empresa no tiene buena legibilidad.
PC CYTY // www.pccity.es
Funcionalidad positiva
- Podemos visualizar los productos fácilmente.
- Comprar online.
- Tiene un buscador de productos.
- Comprar precios.
- Muestra los productos mas buscados por los usuarios.
Funcionalidad negativa
- El carrito de compra no funciona correctamente.
Usabilidad positiva
- Organización de los productos por precio, disponibilidad y marca.
- Buscador de productos por precio.
Usabilidad negativa
- El menú de la derecha esta mal jerarquizado con excesiva seccione.
- Los dos menús compiten entre si a nivel de importancia creando confusión al usuario.
Diseño negativo
- El aspecto grafico esta en un segundo plano.
- El logo no esta bien integrado y no tiene una ubicuidad propia.
- Saturación de colores.
- Mala organización de los banner de publicidad que llegan a entorpecer a las botoneras.
- Es impersonal con respecto a su identidad corporativa.
Diseño negativo
- La información de los productos es mas clara, ordenada y legible.
Nos gusta lo complejo y necesitamos lo sencillo Comments Off
Desde que nos levantamos hasta que nos acostamos, muchas de las acciones que realizamos implican desenvolvernos en sistemas y tecnologías diversos. Poner la lavadora, atender una llamada, realizar una compra por Internet, arrancar el coche, descongelar algo en el microondas, etc. Son muchas de las acciones pensadas para hacernos la vida más fácil y esto quiere decir que no le dediquemos demasiado tiempo. Traducido en un simple término: rapidez. No por ello, estos sistemas y tecnologías son simples sino que están diseñados para que nos resulten a todos sencillos, incluida la información que contienen.
La arquitectura de la información es la organización que le damos a esa información y a las funcionalidades dentro de un sistema determinado. Es decir, es diseñar la información para que sea intuitiva, accesible, reconocible y utilizable. Puede que el término no lo hayamos escuchado muchas veces pero sus resultados se encuentran por todas partes, hasta en la palma de nuestra mano.
Un sistema complejo diseñado para su fácil y rápido uso es el de los teléfonos móviles. Sin darnos cuenta, en uno o dos pasos podemos realizar muchísimas operaciones dentro de ese mismo dispositivo: encender el móvil, consultar la agenda, atender una llamada, mandar un mensaje, programar la alarma… o incluso navegar por Internet, escuchar música o intercambiar ficheros.
Son acciones que no entendemos cómo es posible que funcionen, pero una buena arquitectura de la información puede lograr que olvidemos este factor y las tengamos como las acciones más sencillas y cotidianas que conocemos.
Modelos Mentales / ejercicio Comments Off
El ejercicio propuesto, trataba de definir el modelo mental de una persona que quiere alquilar un coche. Partiendo de esto, la persona en la que nos tenemos que transformar, toma diversos perfiles. Cada uno de ellos generan diferentes intereses, por lo tanto también preguntas a la hora de abarcar el problema.
Dichos intereses propios de cada perfil, son también válidos para otros perfiles, aunque a diferentes niveles de priorización.
Espero que la imagen ilustre mejor la explicación:
Este ejercicio se realizó en común por: Patricia, Nuria, Gioia, Laia y Alba.
modelosMentales Comments Off
Modelos mentales.
¿Que son? ¿Para que sirven?
Un modelo mental es la representacion, contrucción, de un entorno exterior que tenemos nosotros en la cabeza. Los modelos mentales sirven para organizar, conocer las prioridades, y resolver los problemas de la manera mas sencilla posible.
Un modelo mental contiene minima información y esta sujeto a posibles cambios. Las personas deben de ser capaces de evaluar las consecuencias de un cambio en el modelo mental. Los modelos mentales no son completos, no contienen todos los elementos del sistema que quieren representar, sino solo los que son útiles para el proposito del usuario.
El ejercicio de modelos mentales de la clase de Arquitectura de información, consistía en definir un modelo mental de una o varias personas, que quieren alquilar un vehiculo para llevar acabo una tarea determinada.
¿Qué preguntas nos hacemos a la hora de alquilar un vehiculo determinado?
Trabajo realizado por: Israel, Aaron, Toni, Arturo y Jorge.
Profesor: Maximo Castagno
Emergy-C Comments Off
A través de la iniciativa Emergy-C, Jon Doucette propone una alternativa para un diseño web más ecológico. Basado en el gasto energético causado por el consumo de los monitores y uniéndose a alternativas como el Blackle de Google, Doucette propone una paleta de colores de bajo brillo que consumen poco más de lo que consume el negro en la pantalla.
* #822007 (rojo óxido)
* #000000 (negro)
* #b2bbc0 (azul verdoso)
* #19472a (verde bosque)
* #3d414c (cobalto)
* #ffffff (blanco)
Dissenys amb CSS Comments Off
A la següent web (CSS Remix) fan un recull de diverses webs que destaquen pel seu disseny, totes elles amb tecnologia CSS.

^^
——————————————————————————————————————————————————
Análisis Comparativo entre dos Sitios Web Comments Off
Elegimos los dos partidos políticos tradicionales de España: Partido Popular, y PSOE.
Página del Partido Popular
- Acierta con el uso de los colores institucionales.
- Trabaja con una diagramación en 2 partes, tienen doble reticulación en la página de inicio, pierde la unidad yendo de un menú superior a otro menú en la parte media que separa o corta el sitio en dos.
- La noticia principal por lo general carece de imágenes, no ayuda a destacar. Las imágenes no son aprovechadas para atraer al lector o usuario.
- Desaprovecha las ayudas de menús como el desplegable superior que utiliza el PSOE.
- Menu lateral da la sensación de banners, y la ubicación en la página inicial (de la mitad hacia abajo) creemos que no corresponde a la correcta.
- La imagen en general es muy plana, no utilizan cambios de tipografía.
- Dedican y subutilizan el espacio en secciones estáticas y aburridas, como el apartado de “Accesibilidad RSS”, en el que en 7 párrafos pretenden explicar su uso. Mucho más acertado el manejo en la página del PSOE, por ubicación (superior derecha) y con una línea de texto: “RSS Mantente Informado”.
- Lo más llamativo es el banner superior que, sin embargo, al contrario de lo que se pretende, no se lee como un link, sino como una cabecera integrada.
- No hay acceso a la información, los espacios están subutilizados, la información no está jerarquizada ni por colores, ni por tipografía.
- En la presentación de la noticia principal no hay un correcto manejo en la línea de lectura. Es demasiado larga, pesada y aburrida.
Página del PSOE
- Mantiene en general sus colores institucionales.
- Trabaja a 5 columnas, visualmente 3, con una cabecera constante en todas las páginas.
- Maneja una noticia principal, y otras secundarias reforzadas por imágenes. En general es formato periódico, con secciones similares a las de un periódico digital: blog, videos, agenda, documentos.
- Está claro su nivel jerárquico, logo, noticia principal (a doble columna y con fotografía principal), reforzado por el tamaño de la letra, colores y negritas.
- Aunque no de manera óptima, propone un menú desplegable para acceder a las diferentes secciones, aprovechando el espacio.
- El banner principal (ubicado en la cabecera) no se integra dentro de todo el conjunto; a diferencia de la cabecera del PP, que en base al tratamiento y juego de su logo y colores corporativos, da mayor unidad.
- Aire y contraste adecuado, fondo blanco y texto negro.
- Desacertado el manejo de la botonera derecha superior, y que en teoría pretende acceder al resto de secciones (incluyendo el inicio). Conforma un bloque aislado, dan por hecho que sus símbolos son legibles y de conocimiento general, y abusan del rollover “rojo” como color corporativo, entre otras fallos.
- Propone secciones fijas estandarizadas.
Ejercicio realizado en conjunto con el alumno: Eduardo China
Ejercicio modelo mental (alquiler de coche) Comments Off
Aquí va un exercici sobre els models mentals a la hora d’estructurar una web. És una estructura simple però espero que serveixi, per que a la classe anterior no vaig poder venir per la feina i vaja…és el que he fet a partir de l’exercici de grup.
grup: Patricia,Gioia,Núria i Laia
Common Crafts - explanation in plain english Comments Off
Explicaciones simples, cortas, divertidas y muy visuales sobre los nuevos servicios sociales de la web 2.0 usando dibujos recortados y las manos. Realmente consiguen comunicar conceptos nuevos y relativamente complejos de una manera amena y comprehensible. Existen desde 2003 y fueros pioneros en este tipo de videotutoriales en papel.Visita su web.
"Google Docs in Plain English"
"Social Media in Plain English"
Online Photo Sharing in Plain English
Blogs in Plain English
Social Bookmarking in Plain English
Social Networking in Plain English
Wikis in Plain English
RSS in Plain English
Podcasting in Plain English
Modelos mentales / ejercicio Comments Off
Modelos mentales
Ejercicio para definir el modelo mental de un usuario que va a alquilar un coche
el ejercicio se basa en una primera lluvia de preguntas que surgen al ir a alquilar un coche sin seguir ningún tipo de orden lógico y una segunda parte donde damos un valor a cada pregunta surgida en relación con la importancia que ésta tenga para alquilar el coche, en mi caso (y la de mi equipo) me he visto en la necesidad de crear varios perfiles de usuario ya que habían ciertas preguntas que se vuelven prioritarias según el tipo de uso se le dé al coche.
el ejercicio en pdf lo encontrarás aquí
Accessibilitat Comments Off
La accesibilidad web se refiere a la capacidad de acceso a la Web y a sus contenidos por todas las personas independientemente de la discapacidad (física, intelectual o técnica) que presenten o de las que se deriven del contexto de uso (tecnológicas o ambientales). Esta cualidad está íntimamente relacionada con la usabilidad.
Cuando los sitios web están diseñados pensando en la accesibilidad, todos los usuarios pueden acceder en condiciones de igualdad a los contenidos. Por ejemplo, cuando un sitio tiene un código XHTML semánticamente correcto, se proporciona un texto equivalente alternativo a las imágenes y a los enlaces se les da un nombre significativo, esto permite a los usuarios ciegos utilizar lectores de pantalla o líneas Braille para acceder a los contenidos. Cuando los vídeos disponen de subtítulos, los usuarios con dificultades auditivas podrán entenderlos plenamente. Si los contenidos están escritos en un lenguaje sencillo e ilustrados con diagramas y animaciones, los usuarios con dislexia o problemas de aprendizaje están en mejores condiciones de entenderlos.
Si el tamaño del texto es lo suficientemente grande, los usuarios con problemas visuales puedan leerlo sin dificultad. De igual modo, el tamaño de los botones o las áreas activas adecuado puede facilitar su uso a los usuarios que no pueden controlar el ratón con precisión. Si se evitan las acciones que dependan de un dispositivo concreto (pulsar una tecla, hacer clic con el ratón) el usuario podrá escoger el dispositivo que más lo convenga.
via wikipedia.


















