De lectores: tipografías, antialisado y celulares

minombresbond, un lector asiduo de este blog y colega amigo, se enganchó con el tema “Tipografías y web” y pasó un montón de información que me parece más que interesante destacar.

Por un lado, un cuadro con todas las fuentes éstandar de la web en diferentes cuerpos y variantes.

Además destaca “otro tema pertinente es el renderizado de las fuentes: el anti-aliasing y el hinting, que en la web lo notamos mucho por el escalón en el grosor de una fuente al incrementar levemente el cuerpo cuando se cruza el umbral de comienzo de aplicación del antialiasing.” Nos comenta un poco el tema de patentes involucrado en el asunto y, para los diseñadores que utilizan Mac, un interesante artículo que compara el antialisado en Mac y PC, porque no se ven igual las tipografías en un SO que en otro. Utilizando el cuadro anterior, elaboraron esta tabla en la que se indica desde qué cuerpo (en px) se utiliza el antialisado en XP.

Tipografía Tamaño en pixels con antialisado (anti–aliasing)
Regular Bold Italic Bold Italic Small Caps
Andale Mono* 18 11 18 18 21
Arial 18 11 18 12 21
Arial Black 17 17 17 17 20
Comic Sans MS 16 11 16 11 18
Courier New - 16 - 17 -
Georgia 17 17 17 17 20
Impact - - - - -
Times New Roman 18 14 21 18 21
Trebuchet MS 17 12 17 12 20
Verdana 17 17 17 17 20

En otros sistemas operativos, también nos comenta sobre tipografías en Linux.

DroidRespecto a las tipografías utilizadas en celulares, nos cuenta que “escondido en el kit de desarollo para Android, (el sistema operativo basado en linux para celulares promovido por Google), viene una familia llamada Droid (son 3 variantes: serif, sans y mono), una fuente muy completa que incluye soporte para alfabetos latinos extendidos, y tambien báltico, cirílico, griego, turco, provista por Ascender Corporation, especialista en diseño de fuentes para pantalla.”
“Aunque todavía no está clara la licencia que trae esta fuente desde este blog se puede descargar.”

También nos pasa la lista de fuentes de Mac OS X incluidas en el I-Phone.

Como bonus (!) nos pasa el link a Relato Sans, la fuente de nuestro colega argentino Eduardo Manso, para descargar sin costo en la sección free-fonts del sitio de Fontshop.

Alejandro Lo Celso

Y por si fuera poco, nos cuenta de la charla del próximo sábado 15 de diciembre: Alejandro Lo Celso hablando sobre el lunfardo y rocambole como diseñar una tipografia para rufianes y malandras, en la Gutenberg auspiciado por la udgba.

¡Gracias minombresbond!

IPhone Ming

Irene 25 jun 2007 Todo 15 comentarios

¿Todavía no salió a la venta y ya lo metieron en otro celular?
La interfaz del IPhone en un Motorola MING A1200.

Parece que la responsable es la empresa Tricastmedia, y es parte de su desarrollo TWUIK . O sea que en los teléfonos con JavaME se pueden incluir interfaces animadas, como es el caso de la UI del IPhone. Obviamente el Ming tiene además pantalla touch screen, o sea que bien puede disfrazarse de IPhone :)

IPhone y MS Surface: interfaces intuitivas

Irene 21 jun 2007 Tecnología Todo 5 comentarios

Estuve mirando los videos de presentación de estas dos tecnologías. Ambas tienen pantallas táctiles de múltiples entradas y ambas utilizan los gestos para controlar los elementos en la pantalla. Lo cual hace que ambas sean muy intuitivas.

El IPhone es un celular inteligente, con detalles como el sensor de orientación que rota la imagen cuando cambiamos la orientación del teléfono. La tecnología multi-touch parece permitir más acciones gestuales que los actuales touch screen para, por ejemplo, modificar la visualización de las fotos.
Presentación del Iphone

Microsoft Surface, es una gran pantalla táctil (30 pulgadas), con funcionalidades sobresalientes en cuanto a interacción con objetos externos. Por ejemplo, al apoyar una cámara de fotos digitales automáticamente (¿mediante bluetooth, wifi?) copia y despliega las fotos que están en la cámara, o al apoyar un celular despliega las características del modelo y podés arrastrar ringtones u otros elementos o apoyando la tarjeta de crédito podés arrastrar la cuenta y calcular la propina. En este caso la tecnología multi-touch permite la participación de más de un usuario, en diferentes acciones paralelas.
Presentación de la Microsoft Surface

Es un secreto a voces que la MSS no propone nada nuevo. Hace un mes Gizmowatch comentaba las Top 15 tecnologías de visualización interactiva, donde se ve la inspiración del MSS. Tampoco el IPhone comienza de cero. Hace rato que la tecnología touch screen está en los celulares y que estos tienen posibilidad de ver videos, escuchar música, manejar emails, etc.
Lo que se ve en ambos es un diseño de interfaz increíble (algunas más propias que otras) sumado a posibilidades más que interesantes de interacción con otros elementos.

Ambos productos están prometidos para este año, el IPhone (U$S 500) para este mes y la MS Surface (U$S 10 mil) para fines de año.

Demostración extendida del IPhone

Demostración extendida de la Microsoft Surface

Laboratorio de datos y vectores

Irene 11 jun 2007 Tipografía Todo 1 comentario


En Bestialab podemos encontrar experimentos visuales interactivos. Son de clases tan diversas como simulaciones de comportamientos animales, elementos cuadrúpedos que siguen al cursor y tipografías líquidas.
Todos estos artilugios son creados por Bestiario, una empresa española que se dedica a crear espacios interactivos que permiten visualizar contenidos complejos, convirtiendo la información, su estructura y sus relaciones en un entorno espacial navegable de forma no lineal y escalable, resultado de la fusión entre modelos matemáticos, tecnología multimedia y arquitectura efímera.

Recto

Irene 14 feb 2007 Todo 2 comentarios

En mi época de facultad he hecho diseños ‘locos’ como el que más. El diseño-desorientador-de-usuarios es muy típico de esa época. Y está perfecto que así sea, porque es el momento de experimentar, de poner a prueba las teorías y ver cómo caen.
Recuerdo un software que diseñé para manejo del color… y lo que más grabado me quedó fue la cara de espanto del programador cuando dijo “¡Pero esto no tiene un solo ángulo recto!”. Y yo orgullosa contesté “Es cierto”.
Qué salame.

Ahora sé que la idea no es proponer nuevos paradigmas visuales con cada trabajo, sino hacerle la vida más fácil al usuario/cliente/ser humano que deba usarlo. Y a veces es necesario cambiar algo que existe, pero solo si es realmente superador.

Una cosa a tener en cuenta es el tiempo de aprendizaje de una interfaz. Por ejemplo, al ir a tomar un ascensor, tenemos pocos segundos para comprender de un vistazo la estructura de ordenamiento de esa interfaz… y encontrar el comando para indicarle al aparato a dónde queremos ir. Y si bien parece difícil complicar una interfaz en donde hay unos pocos botones con un par de jerarquías a lo sumo… los invito a que vean estos ejemplos que se esmeran para complicarle la vida al usuario:

Ejemplos de interfaz

Link original
Más ejemplos

[Fuente Duopixel]

Ecopixel

Irene 25 ene 2007 Color Todo 3 comentarios

Imagen \'robada\' de 86400 :)

Si Google tuviera la pantalla negra ¿Gastaríamos menos luz?
Dicen que sí, porque muchos la usan como página de inicio por default y el blanco gasta más luz, al menos en los monitores de Tubo de rayos catódicos (CTR), porque los LCD emiten siempre y tapan los pixels que no usan.
La diferencia es de 59 contra 74 watios.

Una lista del gasto que representa cada color (según leo aquí):

Negro 59W
Verde 60W
Marrón 60W
Azul 60W
Aceituna 61W
Púrpura 61W
Verdeagua 61W
Gris 62W
Verde 63W
Azul 65W
Rojo 65W
Gris claro 67W
Cian 68W
Fucsia – 69W
Amarillo 69W
Blanco 74W

Si esto los indigna, pueden firmar esta masiva (¡tiene solo 4 firmas!) petición online.

O sea que si quieren darse aires de diseñador-eco-web tienen que usar colores oscuros. Eso sí, cuando nuestros usuarios tengan que usar anteojos de plástico no reciclable por tratar de leer nuestras poco legibles páginas, habrá que contarles todo lo que ahorraron en luz estos años y lo bien que le hizo al planeta.

Más información:
EcoIron

Un mundo de informaciones

Irene 19 sep 2006 Tecnología 7 comentarios


QRCode Un nuevo tipo de código, ya no de barras, es el QR Code (Quick Response codingen). Actualmente este código está siendo utilizado en Japón, por ejemplo en las cajas de hamburguesas de MC Donald’s para que a través de tu celular puedas obtener información nutricional adicional.
QRCode Mc Donalds

QRCode 2D

A diferencia del código de barras que solo tiene información a lo ancho, este sistema tiene información a lo largo y a lo ancho del código, por lo cual se le llama 2D.
Para que el celular decodifique esta información hay que bajarse un software en la web o directamente desde el celular en la url semacode.org/ota.
Ya hay una extensión de Firefox que convierte tu url a QRCode.

Las aplicaciones son infinitas…. desde una tarjeta personal, información en un programa de tv, hasta tatuajes (me creía re-piola y ya encontré un video que muestra un QRCode en un tatuaje, pucha). Ah, también en un blog, para suscribirse a través del RSS en el celular.

Más información sobre el QRCode.

Si ya se entusiasmaron, sepan que ya dicen por ahí que esta tecnología, aunque nueva para nosotros, ya fue superada por los FPCodes (FinePictureCodes) un producto de Fujitsu, que promete ser no invasiva en el diseño.

Cuando pase el temblor

Irene 12 jun 2006 Rediseños 6 comentarios

El caso de blog que había comentado que estaba al límite de no ser un blog (algunos opinaban que no lo era), Terremoto.net ¡rediseñó!

Terremoto.net

Una buena noticia es que al haberse pasado a WordPress, va a aceptar comentarios en los nuevos posts y se va a poder navegar por categorías.
Personalmente me hubiera gustado que siguiera la estética anterior para no perder identidad, más allá del cambio tecnológico.

Navegando fonts

Irene 8 abr 2006 Tipografía 4 comentarios

TypeNavigatorTypeNavigator [inglés] tiene una interesante y quizá intuitiva manera de navegar las tipografías: desde sus características morfológicas mostradas de manera visual y no desde su nombre.
En el caso de las manuscritas, por ejemplo, permite seleccionar según la herramienta utilizada. También podemos elegir según el tipo de remate, ángulo, peso, etc.
La única desventaja que le veo es que puede ser algo complejo para alguien que no sabe demasiado y todo este despliegue lo abruma, aunque claro que puede ayudar para aprender.

[Fuente HTML Life]

Em-izquierdo

Irene 15 oct 2005 Tecnología 7 comentarios

Creo que todos los que tenemos auto hemos soñado con un aparato como el driv-e-mocion, que permite enviarle mensajes al conductor del vehículo que está detrás nuestro, mediante un panel luminoso colocado en nuestra luneta trasera.

driv-e-mocion

Lástima que los mensajes están precargados y en inglés.

[Fuente Pixel y Dixel]

футбол онлайн, live football, canlı izle, football streaming, football forum, football forums, canlı maç, football highlights, maç özeti, live football streaming, stream live football, free football streaming,

Switch to our mobile site