Bitácora LC1Paloma López B.

Índice de ClasesClase 1:

Clase 2:

Clase 3:

Clase 4:

Clase 5:

Clase 6:

Clase 7:

Clase 8:

Estrategias del Diseño

Metodología del Diseño

Estudio y Comportamiento del Usuario

U s a b i l i d a d

Arquitectura de la Información

Color e Impresión

Escáner y Formatos de Archivos

Pre prensa Digital + Cascadas de Estilo

27.JunioC L A S E 1

27.Junio

Del Diseño

Nosotros trabajamos para los de-más. Pero, ¿cómo enfrenta el diseño un diseñador desde la perspectiva del trabajo? La mutación del oficio también tiene que ver con el espa-cio. Sabemos que hasta los nombres se reinventan, y el diseño, por su parte, se ha ido reinventando con lo digital. El diseño tiene una metodo-logía. Nuestro oficio se alimenta de todo lo que pasa en el mundo. Noso-tros entonces somos los traductores.

Metodología

-Estrategia-Estudio Usuarios-Arquitectura de la Información-Diseño Visual-Diseño Front (producción)

.Visitar www.losdigitales.com//lenguaje1.wor-dpress.com .crear cuenta slides-hare, flickr y twitter..mandar correo con datos..jbarahona arquitec-turaucv.cl

Estrategia

Benchmark:corresponde a un análisis compa-rativo que muestra ventajas y des-ventajas. Permite tener información de la competencia y del entorno.

Brief

Permite saber si tiene fotos, cuá-les marcas hay para el logotipo, por ejemplo. Es un catastro. Es como una declaración de intenciones.

Conversaciones Guiadas

consiste en hacer preguntas capcio-sas para solucionar posibles proble-mas que puedan tener los usuarios.La conversación con los clientes es técnica. No subjetiva. Eso es algo que todo diseñador debe recordar.

Al plantear una solución se hace siempre sobre una base objetiva.

Coaching

Es la organización junto a ar-gumentos que se muestran.

EMOCIÓN

+

TÉCNICA

=

DISEÑO

04.JulioC L A s e 2

Estrategia de Diseño

.brief

.tabla gantt

.entrevistas usuarios

.modelos y escenarios

.benchmark

.ai

.wireframes

En un proyecto gráfico de comunicación se puede dar la metodología del ciclo.“METODOLOGÍA DEL DISEÑO CENTRADO EN EL USUARIO”.El diseño construye una comunicación con los lazos afectivos de las personas. “AMPLIADOS DEL PRO-DUCTO”. Los objetos del diseño son seres vivos cuando los trato como soportes comunicacionales.

Estrategia

Siempre está presente. El comienzo es compro-meterse. Esto es el encargo y se parte por un Brief.

Brief

Son aproximadamente tres hojas en donde el clien-te cuenta los objetivos del proyecto. Su idea no es burocratizar la relación con el cliente sino hacer-la técnica. Indica también cuáles son los recur-sos de la empresa para hacer el proyecto. Se in-dica a qué segmento de la población de quiere llegar. El Brief es información puntual. Debe en-tregar el máximo de información posible. Es la de-claración escrita del cliente. Son los compromisos.En el Brief también se detallan los jefes del proyecto. Se usan en la industroa publicitaria.En el negocio, es necesario precisarSon especificaciones del proyecto. El Brief manda ante todo, Con él se sabe el tiempo que va a tomar realizar el proyecto. El Brief sirve para saber qué quiere el cliente.

Benchmark

Herramienta para hacer un levantamien-to de ventajas y desventajas. ANÁLISIS DE LA COMPETENCIA, ANÁLISIS FODA.EJ: tomamos ejemplos de otros sitios. Se analizan colores, su utilidad, etc y todo eso termina finalmente en un informe.

No es para copiarle a alguien, sino para revisar las competencias.

Tabla GanttEs cuando se le cotiza al cliente. Es una asignación de tareas en el tiempo y con res-ponsabilidades. Permite distribuir el tiempo asignado a las personas que de-ben hacerlo. Son las faenas. Sirven para distribuir las horas de trabajo, los días, etc.Ambos, la tabla Gantt y el Brief, sirven para cotizar

TAREA:Se harán dos grupos. Cada uno recogerá una tabla gantt, un benchmark, etc. y entregara además un Retail.TIPS:amorales arquitecturaucv.clDebe tener cotización y sólo hasta el lunes se harán preguntas. El viernes entonces veremos dos propues-tas, que deben venir impresas, con un PDF de respaldo.

08.AgostoC L A S E 3

H YPERTEXT

T RANSFER

TP ROTOCOL

+S ECURE

Escáners

Mientras más BITS tiene una foto, más información entrega.

Escalar una imagenSi quiero una imagen de 10x10 en 20x20 y de 300 DPI, ten-go que escanearla en 600 DPI. Si la quiero de 30x30 debo es-canearla al 300% y la resolución del escáner debe ser del doble.La relación de escalar está en el escáner, no en el Photoshop..

HistogramaInformación técnica de los colores de la imagen.

la importancia del archivo origi-nal no es menor. Porque hace sentido.

Yo puedo decirle a una imagen que ten-ga 72 DPI pero depende de dónde lo im-primo el cómo se vaya a ver finalmente.

EL TRAMADO. Si escaneo una imagen que está en el diario, ésta tiene una lineatura. Por lo tanto se trama la foto que está impresa sobre el papel.

*resolución de las imágenes y las líneas de impre-soras LPI. Escribir en la bitácora y subir al blog.

Al guardar una imagen, se descarta el JPG, por-que quita mucha información.Y lo que quere-mos es tratar de ganar información, no perderla.

JPG y GIF son formatos de pérdi-da, porque coomprimen información.

El EPS se ocupa para borrar el fondo y que esté traslúci-do. TIF es el formato más fiel y más rico en información

18.JulioC L A S E 4

La Usabilidad

Usabilidad es la facilidad de uso de una página web, o cualquier sistema que interactúe con el usuario.Mediante el estudio del usuario logra-mos evaluar la facilidad que éste tiene para interactuar con el producto. Asi ob-tenemos el nivel de usabilidad que posee.

La ISO (Organización Interna¬cional para la Estan-darización), que trata las normas de la garantía de calidad, define la usabili¬dad segun dos criterios:

• ISO/IEC 9126: esta se refiere al tema de comprensión y uso de un software, ade-más de lo exter¬no que atrae al usuario.• ISO/IEC 9241: esta se refiere a la efectividad con que el usua¬rio se desenvuelve en el uso del software.Jakob Nielsen es considerado uno de los per-sonajes más im¬portantes en el tema de la usa¬bilidad, y define características que la identifican:• Entendible• Novedoso• Comprensible:

• Inteligente• Atractivo

Ahora, la manera en que medi¬mos la usabili-dad, es mediante distintos tipos de evaluaciones:

• Heurística por expertosEsta evaluación es hecha por especialistas en usa-bilidad, que determinan los elementos buenos y malos de una interfaz, usando ciertos criterios. Bas-ta que par¬ticipen 5 evaluadores para obte¬ner un 75% de los problemas de la interfaz puesta a prueba.

• Test de usuariosEsta evaluación es hecha en la¬boratorios en los que se observa el comportamiento del usuario, respecto de la interfaz, y los pro¬blemas con los que se encuen¬tra.• Eye TrackingAquí se evalúa, con unas má¬quinas especia-les, el movimien¬to de los ojos; hacia dónde y de qué manera el usuario observa la interfaz.

• AccesibilidadEn este test se evalúa que los usuarios logren acceder a la in¬terfaz y a su contenido (sin im¬portar el entorno), observando también la capacidad que tienen los diseños para ser usados.

• Expert ReviewEs el análisis hecho por expertos en los que no es necesario la presencia de usuarios, ya que complementa al res-to de las eva¬luaciones de usabilidad.

Finalmente todas estas evaluaciones nos per-miten medir que el sistema este bien diseña-do y que tenga estética, para atraer y agra-dar al usuario; que sea efiicaz, visible y que cumpla con los estándares impuestos; que el usuario lo comprenda, tenga control sobre él y que disponga de ayudas; y que a partir de lo evaluado exista una prevención de errores, que es uno de los criterios mas estudiados.

25.JulioC L A S E 5

Arquitectura de la Información

Entendemos por arquitectura de la información, la mane-ra en que analizamos y organizamos la información para que el usuario sea capaz de comprenderla y manejarla.Para convertirnos en arquitectos de la información, vamos a to-mar como ejemplo a Edward Tufte, diseñador y estadístico de la Universidad de Yale. Él se dio cuenta de que la capacidad de almacena-miento de las compu¬tadoras era mucho mayor que la del cerebro y que, el ser humano, desde siempre ha usado la información para tomar decisiones y ha construído elementos para tener y transformar datos en información.

Pero otro elemento muy importante es la comunicación, y Tufte plantea que transformar los datos en información, no es suficiente, por lo que hay que trans-formar la información en comunicación, basándonos en unidades discretas.Las unidades discretas son elementos de diseño capaces de formar los datos y transformarlos eficientemente para producir la comunicación.Un ejemplo claro de esto son los widgets, que traen infor-mación desde una base de datos y la grafican de una ma-nera determinada, para obtener la información del dato.

Otro ejemplo de esto, fue la invención del mapa del metro de Lon-dres. Este fue creado en 1931 por un electricista llamado Harry Beck, y consistía en un diseño esquemático y ordenado, basado en el diagra-ma de los circuitos eléctricos, para que la gente pudiera ubicarse.

Su diseño fue muy influyente para los mapas que se diseñarían después, incluso el actual, tiene el mismo diseño que usó Beck, siendo muy importante que su eficacia proviene de la manera en que se organiza el contenido.Algunos personajes importan¬tes en la arquitectura del diseño son:

• Richard Saul Wurman: arquitecto que creó el concepto de “arquitectura de la información”, con el fin de hacer la información comprensible.

• Louise Rosenfeld y Peter Morville: ambos bibliotecólogos y autores del libro que di-funde el uso de la arquitectura de la inform a c i ó n .

• Jesse James Garrett: es director de estrategias para la experiencia de los usuarios, y muestra esto en la crea-ción de un protocolo de dibujos para la navegación:1º Parte en base al brief, para ver los objeti-vos del sitio, y las ne¬cesidades del usuario.2º Se basa en el requierimien¬to del contenido, que es funda¬mental para que el diseño sea efectivo.3º Sigue con las especifica¬ciones funcio-nales que arrojan el requerimiento fun-cional pro¬veniente del usuario. El diseño debe ser capaz de entender y estudiar al usuario.4º Se emplea la arquitectura de la información para

construir un espacio digital con esta informa¬ción.5º Luego se hace el diseño de la interacción, para ver cómo se hace algo para que funcione, sin re-inventar, sino que optimizando los elementos.6º Llegando al final tenemos el diseño de la información, que está ligado al de la interfaz y al de la navegación.7º Finalmente obtendremos el diseño visual, que será el resul¬tado de este proceso complejo.

01.AgostoC L A S E 6

Color e Impresión

Dentro del diseño, existen fac¬tores importantes y fundamentales que son aplicados a diferentes dimensiones; una de estas es la impresión.La imprenta se desarrolla en base a diferentes cambios y pro-gresos, desde algo tan básico y fundamental como los ti-pos móviles, hasta la imprenta digital que conocemos hoy en día.

Un ejemplo concreto y común, es el uso del “PDF” (Portable Document For-mat). Adobe es una empresa de softwares, que inventa una tecnología postcrip “WYSWYG” (What You See is What You Get) que es “lo que ves es lo que ob-tienes”, y dentro de esta tecnología, está PDF, que entre sus variables, está la de la impresión como concepto importante. Así, permi-te definir el uso que se le dará al archivo se¬gún las resoluciones.

Otro punto importante y signifi¬cativo en todo este asunto, es el de las llamadas resoluciones.Tendremos tres tipos de reso¬luciones como base:

•Nivel de Impresión, que corres¬ponde a los 300 DPI (dots per inch - puntos por pulgada)•Nivel Medio, que corresponde a los 150 DPI•Nivel Pantalla, que corresponde a los 72 DPI

Con esto queda claro que la impresión es un ejercicio muy delicado y muy complejo. Pero no se queda en los elementos a imprimir, ni en la forma en que estos se imprimirán; existe otra dimensión que le otorga un nuevo sentido a todo esto, que es precisamente el color.Pensemos el color de dos mane-ras, como “aditivo” y “sustractivo”.

El modelo aditivo, que en este caso es RGB (rojo, verde y azul) trabaja con los pixeles de la pantalla, mientras que el modelo sus-tractivo CMYK (cian, magenta, amarillo y negro) trabajan con los puntos impresos.Con el sistema sustractivo, aparece una forma de impresión más fiel a lo que observamos, que es la cuatricromía; esta se basa en la conformación de la imagen según los colores cian, magenta, amarillo y la suma de estos, que es el negro.

22.AgostoEn Pre Prensa digital no tiene tanto sentido usar JPG porque luego se ex-porta a PDF y la calidad de la imagen es muy baja porque fue doble pérdi-da de información. Pre Prensa Digital es todo lo digital antes de la prensa.El formato GIF fue inventado para la internet. Maneja 256 colores.

TIFy EPS (Encapsulado Postscript)se manejan en Pre Prensa Digital.El RAW es un formato que genera capas de la imagen, por lo tanto permite tener más información de la misma. Es como el ne-gativo de una foto. No tiene compresión. Se inventó porque el TIF no era suficien-te. Coloca más capas de información a pro-pósito de la cantidad de BITS que tiene.

C L A S E 8

Postscript y Truetype

Postscript permite dibujar vectorialmente. Lo in-ventaron para las tipografías, Permitía escalarlas. Hay dos tipos de tipografías: Postscript y Truetype.Imprimir un archivo Postscript tiene una familia ti-pográfica que puede ser escalada vectorialmen-te. Eso produjo la revolución de las impresoras. Las grandes impresoras tienen embebido el formato Postscript. Al mandar una foto a InDesign por ejemplo, las grandes impre-soras hacen un vuelo rasante y sale un error postscript, debido a que uso una tipografía y postscript no la lee. Eso era antes.

Luego Adobe y Postscript se asociaron y se separa-ron. Entonces Apple inventó una tipografía que pudie-ra ser leída por todos los formatos. Nació Truetype.

En las grandes impresoras, al ir con un ar-chivo Ps trae consigo el archivo Indesign con imágenes. Y tengo dos alternativas. Hago un PDF o una serie de películas.Ambos me van a permitir hacer plan-chas de impresión. Las impresoras de tiro digital todavía no imprimen tan bien.

Cascadas de Estilo

Los estilos son abreviaciones para que una tipogra-fía pueda ser ocupada. Las guardo en una memoria.Las hojas de estilo en cascada (Cascading Style Sheets, CSS) son un lenguaje formal usado para definir la presentación de un documento estruc-turado escrito en HTML o XML (y por extensión en XHTML). El W3C (World Wide Web Consor-tium) es el encargado de formular la especifica-ción de las hojas de estilo que servirán de están-dar para los agentes de usuario o navegadores.

La idea que se encuentra detrás del de-sarrollo de CSS es separar la estructu-ra de un documento de su presentación.

T A R E A :

Publicar Bitácora. Explicar qué son las cascadas de esti-lo. Estilos de carácter y de párrafo.

Estilos de Párrafo y Carácter

Los estilos de párrafo y carácter se uti-lizan si se desea basar un nuevo esti-lo en el formato de un texto existenteSi se selecciona un grupo en el panel Estilos, el nuevo esti-lo formará parte de dicho grupo.

Las hojas de estilo en cascada (Casca-ding Style Sheets, CSS) son un lenguaje formal usado para definir la presentación de un documento estructurado escrito en HTML o XML (y por extensión en XHTML).

El W3C (World Wide Web Consortium) es el encargado de formular la especificación de las hojas de estilo que servirán de estándar para los agentes de usuario o navegadores.La idea que se encuentra detrás del de-sarrollo de CSS es separar la estructu-ra de un documento de su presentación.