Diferencia entre revisiones de «LC3 2010»

De Casiopea
(Clase 9)
m (Protegió «LC3 2010» ([edit=sysop] (indefinido) [move=sysop] (indefinido)))
 
(Sin diferencias)

Revisión actual del 19:22 1 sep 2010



Año2010
Tipo de CursoOtro
ProfesoresJorge Barahona
Profesor(es) Ayudante(s)Dámaris Sepúlveda
AlumnosSofía Savoy, Gley Riquelme, Waldo López, Francisco Vera, Javiera Burgos, Paula Mancilla, Valentina Pérez, Javiera Albornoz
Palabras ClaveDiseño Centrado en las Personas, Estrategia, Arquitectura de Información, Diseño Front
Carreras RelacionadasDiseño Gráfico,
«Diseño de Interacción» no se encuentra en la lista (Arquitectura, Diseño, Diseño Gráfico, Diseño Industrial, Náutico y Marítimo, Ciudad y Territorio, Formación y Oficio, Interacción y Servicios, Otra, Magíster) de valores permitidos de la propiedad «Carreras Relacionadas».



Por favor, inscribirse en la lista de correo para el curso. Las inscripciones se cierran el viernes.

Clase 1

  • Fecha: Miércoles 23 de junio del 2010
  • Palabras Claves: Lenguaje HTML, medios digitales, diseño centrado en las personas.

Presentación



El desarrollo básico del curso, será la utilización de la wiki como repositorio de conocimiento será fundamental, de modo que exista una documentación del proceso de entrega de trabajos, generando contenido, lo que es parte importante de nuestro estudio.

Lenguaje HTML

Lo que se tratará durante las clases, será la programación en HTML. Este es un lenguaje o código utilizado para la creación de sitios web, y que funciona a base de marcas o etiquetas, determinando cómo debe mostrarse la información en los browsers (navegadores).

Es de gran importancia el saber cómo programar interfaces, cómo lo plasmado en el papel se visualiza en los distintos medios digitales, con los cuales diseñamos experiencia. A través de estos creamos puntos de interacción, relaciones entre softwares y personas y viceversa, siendo un proceso complejo para el diseño.

Al momento de diseñar, existe un proceso productivo en el área de trabajo y con las personas que ejercen diferentes disciplinas, lo que nos ayuda a construir los diseños de mejor manera para los usuarios y para definir de forma clara los distintos escenarios.

Medios Digitales

Los medios digitales son soportes en los cuales se dispone información, y además de internet, podemos encontrar otros como:

  • Pantallas
  • Móviles
  • TV
  • Juegos
  • Consolas de comando

Diseño centrado en las Personas

Existen tres puntos claves que nos proporcionan un ordenamiento y tácticas al momento de diseñar, de esta manera, no nos centramos inmediatamente en buscar la solución, sino que en primera instancia entendemos cual es el problema de la persona.

Planifiación

Estrategia

Es, básicamente, un planteamiento estratégico, en el que las preguntas ¿Qué?, ¿Cuando?, ¿Quienes? y ¿Cómo? son fundamentales.

Se compone de:

  1. Brief: resumen en el cual, la persona con la que trabajaremos, nos dice qué es lo que necesita para que logremos entender la la problemática. El brief tiene tres componentes de gran importancia:
    1. Presupuesto (dinero con el que cuenta la persona para el proyecto)
    2. Contra Brief (preguntas que nacen a partir del brief, las hace el diseñador)
    3. Debrief (se ven los objetivos y permite la generación de mecanismos de medición)
  2. Entrevistas Guiadas: conversaciones con usuarios y/o funcionarios con el fin de adquirir más informacion que ayude al desarrollo del diseño.
  3. Benchmark: análisis comparativo que mide las capacidades de experiencia que hay tras el encargo. También permite tener anotaciones del experto sobre un servicio y generar herramientas de objetivos.


Comportamiento de las Personas

El estudiar el comportamiento de las personas, nos permite comprender sus tendencias y motivaciones, la manera en cómo interactúan con un sistema, pero esto no debe confundirse con el estudio de los sistemas en interacción con las personas, pues en este caso nos centramos en la usabilidad.

Se compone de:

  1. Expert Review: evaluación hecha por expertos
  2. Personas y Escenarios: pensar en el usuario, dónde y en qué condiciones interactúa con un sistema
  3. Evaluación Heurística: análisis de usabilidad
  4. Eyetracking: herramienta de medición

Estructuración

Arquitectura de la Información

La manera de tener una diagramación que permita una comprensión lingüística, corresponde a la arquitectura de la información, ligándose directamente con la rapidez en los sistemas digitales.

Se compone de:

  1. Diseño de Contenidos
  2. Mapas de Navegación: primera representación gráfica de la base de los contenidos
  3. Wireframes: maquetas en las que se utilizan etiquetas reales de los mapas de navegación


Diseño de Interacción

Producción

Diseño de Interfaz

Diseño de Códigos de Interfaz

Primer Encargo

  1. Descargar aplicaciones FTP, como Transmit para Mac o Filezilla para distintas plataformas.
  2. Crear un sitio web que contenga una palabra o un texto. Para esto, primero se crea una carpeta en el escritorio, la cual será nuestra "raíz", que debe contener:
    1. Carpeta "css"
    2. Carpeta "imag"
    3. Carpeta "html"
    4. Documento "index.html" (se crea en un editor de texto y allí se escribe el código de programación)
  3. Leer esta guía y seguir los pasos para la programación del sitio web.

Personajes Relacionados

  • Alan Cooper
  • Jakob Nielsen
  • Donald Norman


--Sofia savoy 02:11 24 jun 2010 (UTC)

Clase 2

  • Fecha: Miércoles 30 de junio del 2010
  • Palabras Claves: Estrategia de diseño, briefing, branding benchmark.

Presentación



Estrategia

Diseñar experiencia en medios digitales

Existe un proceso metodológico que parte con la estrategia, se deben establecer parámetros serios con los clientes, saber qué es lo que quiere la audiencia. Los sitios web son objetos en transición; pareciera que nos llamaran por la "búsqueda de la belleza", pero el diseño va más allá, existe una capa visual y una capa emocional; los productos tienen atributos que conversan con la audiencia. Lo primero es entender el problema, no debe enfocarse en la mano de obra, sino en la reflexión, el pensamiento.

diseñar=pensar el futuro (diseño viene del italiano disegno, literalmente hacemos el futuro)

Un proyecto digital requiere de una reflexión, hablarle a la razón de la otra parte, para que se cumplan las metas propuestas; la creatividad genera ciertas empatías en las personas. Un encargo de diseño es inventar o modificar algo, para que cumpla un rol, con las dificultades de que los clientes generalmente no entregan nada por escrito, y de que es complicado medir nuestro trabajo.


La estrategia responde a las preguntas: ¿qué? ¿cuándo? ¿quiénes? ¿cómo?

Los medios digitales son seres vivos que están continuamente en renovación, en el ecosistema digital, en donde los que evolucionan triunfan, van mutando según el modo de navegar de los usuarios. Se da el ejemplo de Google, el cual se da cuenta de cual es el lugar más valioso de la pantalla (a través de eyetracking), el sector superior izquierdo es el triángulo dorado, donde colocan las referencias pagadas.

Brief

documento que responde preguntas que hacen los diseñadores. Ubicuidad espacio-tiempo

  • Resumen
  • Objetivos: deben estar declarados por el cliente, no es "quiero un sitio web", sino el "para qué"
  • Recursos: cuánto $, debe estar declarado, los recursos pueden ser en dinero, humanos, de infraestructura, etc
  • Metas: Es distinto de los objetivos, sirve para medir el diseño (cumple o no)
  • Tiempos


En el brief se hacen preguntas como quienes son los encargados, los patrocinadores, las competencias, contenidos y las audiencias, especificando sus edades, géneros, segmentación geográfica y psicográfica (aspiraciones).

  1. Contrabrief: son las conversaciones entre la agencia (diseñador) y el cliente (registro por escrito).
  2. Debrief
  • Análisis posterior al trabajo
  • Check-list de cumplimiento de objetivos
  • Cumplimientos de KPIs (key performance indicator)

Conversaciones guiadas

  • Recabar información informal
  • Cuáles son los problemas (no quedar preso del soporte)
  • Distanciarse de las soluciones
  • Pensar y soñar la experiencia (vender experiencia en los medios digitales)

Branding benchmark

brand=marca (haciendo marca)

  • Cuestionar la marca o servicio
  • Medir con sus pares
  • Medir con su influenciador
  • Medir su huella digital
  • UX (user experience)

En el benchmarck aparecen referencias como

  • SEO:Search engine optimization (posicionamiento de la marca en buscadores)
  • Información cualitativa (construir estrategia al cliente)
  • Cifras y gráficos
  • Screenshots de la competencia
  • Tácticas (se traducen en cosas concretas)

Referencias

  • vista del brief que realiza la oficina ayer viernes
  • Triángulo dorado descubierto por google en el modo de mirar la pantalla por parte de la audiencia[1]

Tarea

En grupos de 3 personas, los alumnos deberán realizar una estrategia digital para una empresa (auto encargo). Las 4 industrias, desde donde se debe elegir una marca chilena real son:

  1. Financieras (bancos, afp, isapres, etc)
  2. Turismo
  3. Productos de consumo masivo
  4. Retail

--Javieraconstanza 05:27 1 jul 2010 (UTC)

Clase 3

  • Fecha: Miércoles 8 de julio del 2010
  • Palabras Claves: Estrategia digital, SEO, co-branding, microtarget.

Presentaciones

Grupo 1

  • Integrantes: Javiera Albornoz, Paula Mancilla, Sofía Savoy.
  • Área: Retail
  • Marca: Multitiendas Johnson's
  • Estrategia: Diseño del sitio e implementación de sistema de compras por internet. Generar confianza en base a esta tendencia y entrar en el mercado de ventas online.


Grupo 2

  • Integrantes: Eleonora Aldea, Valentina Pérez, Alejandra Salinas.
  • Área: Finanzas
  • Marca:ING Capital
  • Estrategia: Realizar campaña para jóvenes que deben afiliarse a una AFP. Crear red social y rediseñar secciones del sitio destinadas a esta información.


Grupo 3

  • Integrantes: Javiera Burgos, Valeria Cerón, Gley Riquelme.
  • Área: Productos de Consumo Masivo
  • Marca: Café Gold
  • Estrategia: Potenciar línea "Gold Sabores" mediante campaña social "Tu actitud, tus gustos, tu café". Rediseñar del sitio web, generar comunidad de seguidores y utilizar redes sociales.


Grupo 4

  • Integrantes: Diego Reyes, Francisco Vera, Waldo López.
  • Área: Turismo
  • Marca: Turismo en Chile
  • Estrategia: Aumentar ventas a través de medios digitales. Generar una identidad innovadora y motivar al público con el uso de redes sociales.


Cada grupo presenta su estrategia digital diseñada para una marca específica. Mientras presentamos surgen términos e indicaciones en cuanto a las tareas:

  • Al exponer un proyecto no utilizar generalismos, siempre apuntar a soluciones objetivas y particulares.
  • Tener en cuenta siempre cual es la postura de la empresa frente al proyecto. Para la empresa el retorno de la inversión, los beneficios y las cifras son factores importantes a considerar. Utilizar cifras realistas.
  • Utilizar visualizaciones y gráficos comparativos para posicionar a la empresa dentro del mercado mostrando situaciones reales con fortalezas y debilidades. Estos rescursos son una estrategia útil para promover una imagen de compromiso y responsabilidad con el cliente asegurando que éste pueda analizar el proyecto más alla de los presupuestos involucrados.


Archivo:Grafico agencias guias.png
Ejemplo de gráfico comparativo















  • SEO (Search engine optimization) consiste en aplicar diversas técnicas para que buscadores de Internet sitúen una página web dentro de las primeras posiciones cuando realizamos búsquedas orgánicas.
  • Co-branding hace referencia a una alianza que forman dos empresas para trabajar juntas, creando una sinergia de marketing.
  • CMS (Content management system) es un conjunto de procedimientos utilizados para administrar el flujo de trabajo en un entorno de colaboración. Pueden ser manuales o computarizados (softwares).
  • Las tendencias son escenciales para el análisis del mercado. Para el desarrollo de una estrategia debemos tener en cuenta problemáticas, tendencias y cifras.
  • Estrategia según audiencia. No olvidar las variables psicográficas de las audiencias para no pasar a llevar micro targets y sus hábitos sociedad con la implementación de nuevos productos o metodologías que alteren la cultura local.

Observaciones

Puntos a considerar (pros y contra) para cada estrategia presentada


Multitiendas Johnson's

  • Es una meta que puede cumplirse.
  • No hay aventura.
  • Existe mercado para realizar la propuesta.
  • No hay cultura de compra vía web.
  • Debe ir unido a distintos medios sociales por falta de confianza.


ING Capital

  • Es una meta utópica (300.000).
  • Considerar sinergía con medios offline para difusión masiva.
  • Considerar sinergía con eventos para crear comunidad activa.


Café Gold

  • Es posible crear una comunidad.
  • Competencia (Nescafé) lleva ventaja a la campaña.
  • Utilizar fallas o explorar áreas que la competencia no ha utilizado aún.


Turismo en Chile

  • Competencia (Explora) tiene imagen muy aspiracional (parece caro).
  • Ventaja ya que ninguna agencia posee redes sociales.
  • La mayoría de los clientes decide por internet.


--Jabu 05:23 9 jul 2010 (UTC)


Clase 4

  • Fecha: Miércoles 14 de Julio del 2010
  • Palabras Claves: Lenguaje HTML, Medios Digitales, Diseño centrado en el usuario, Jacob Nielsen, Usabilidad, Sistemas, Heurísticos, Modelos Mentales, Escenarios y Personas, Código

Comportamiento de usuarios

En el año 1996, Jacob Nielsen comienza a introducir el concepto de Usabilidad dentro del diseño de interfaces, lo cual se vuelve rápidamente peligroso para los diseñadores ya que el diseñador debe estar dispuesto a poner a prueba su diseño. La usabilidad debe ser siempre anónima, el usuario se da cuenta de que existe la usabilidad debido a fallas de ella misma.

Para hablar de la usabilidad en los medios digitales no vamos a referirnos sólo a los sitios web sino que vamos a hablar de SISTEMAS DIGITALES, lo que puede abarcar displays, aplicaciones para móviles, paneles de automóviles, etc.

1. Probar los Sistemas

Esta primera consideración es muy importante, ya que debe quedar siempre claro que no se prueba al usuario, se prueban los sistemas. Incluso, uno puede hilar más fino y reconsiderar el término usuario, ya que muchas veces es mejor referirse a las PERSONAS, pues refleja el verdadero grado de complejidad del asunto, lo que hacemos es tratar de entender a las personas. Jacob Nielsen lo que hace es entregar una herramienta llamada los Heurísticos (que significa "criterios") con los cuales podemos conducir los Test Heurísticos.

¿Qué se hace en los Test Heurísticos? Se mide el lenguaje que se le ha construído a ese medio. Y la única forma de construirle el lenguaje, es conociendo el código de ese medio. Por ejemplo, un libro, es un sistema sofisticado de comunicación, con códigos muy específicos (la lectura de izquierda a derecha, sistema de títulos, el pasar de una página a otra, la ubicación de los números de páginas), y que demoró muchísimos años en instalarse como una convención. Ahora debemos preguntarnos cuáles son los códigos de los medios digitales? Nosotros somos los artesanos quienes deben conocerlo para poder diseñar en él, tal cual como los artesanos antiguos tuvieron que enfrentarse con cómo disponer de las letras, palabras y frases en el caso del libro.

El HTML, es el código de este medio, es la QUÍMICA de este medio. Si lo comparamos nuevamente con la industria del libro el HTML sería análogo a la química de las tintas con las que se imprime.

Existen 10 heurísticas, o principios con los cuales podemos medir la usabilidad de un sistema, son básicamente preguntas sencillas que se le hacen a los usuarios. No es un focus group, ya que en los F.G se les piden opiniones a las personas, en este caso se les hacen preguntas sobre si funciona o no la interfaz. Las preguntas se responde también simplemente con SÍ/NO/NO SÉ.

En estos test heurísticos invito a personas que se encuentren en el target definido en el Brief realizado en el primer paso, en la Estrategia. Existen otros tipos de herramientas para probar los sistemas, como el Expert Review, en el cual un experto revisa el sistema, y el Eyetracking.

Ésto se resume a que hay que entregar un sistema que sirva, que los usuarios quienes son los clientes de la marca lo entiendan y prefieran, para poder convencer de que estas herramientas sirven en hacer nuestro diseño traducimos los datos en números, ya que así no basamos las decisiones en lo emocional (subjetivo).

2. Entender las motivaciones de las personas

  • Modelos Mentales: Conocer las motivaciones de las personas nos permiten dibujar esas motivaciones, y presentarlas de una forma fácil de entender y que permite la empatía.
  • Construcción de Personas y Escenarios: Inventamos a personas que serían usuarios de nuestro sistema para poder entender de mejor manera para quiénes estamos diseñando. Detalladamente describimos, con nombre y apellido a estos usuarios ficticios y los ubicamos dentro de su escenario.
  • Etnografía : No trabajamos sólo para los aspectos geográficos de las personas, trabajamos para personas de carne y hueso que existen de verdad. Permite adentrarnos de una manera etnográfica a las motivaciones de las persona. Para esto es clave la observación, ver a las personas a las que les voy a hablar.

Enlaces Relevantes

--Aldeapardo 00:01 16 jul 2010 (UTC)

Clase 5

  • Fecha: Miércoles 21 de julio del 2010
  • Palabras Claves: Organización de Contenidos, Arquitectura de la Información, Metodologías de Trabajo, Búsquedas Orgánicas, Card Sorting, Jesse James Garrett

Arquitectura de la Información

Hablamos de Arquitectura de la información, entendiendo que los usuarios, habitan los medios; y a pesar de las similitudes, todos los usuarios lo hacen de forma diferente. Son los usuarios quienes hacen que los sistemas, muten, cambien. Entendemos los medios digitales como un ecosistema, y comprendemos que en nuestra vida diaria nos acompañan; esto ocurre por que los usuarios consumen de los medios y así, éstos pueden evolucionar según las necesidades de uso. Así mismo, los medios o bien evolucionan para adpatarse a los usuarios o desaparecen.

¿Cómo evolucionan los medios digitales?

Los medios digitales, mutan a través de los contenidos. El diseñador construye esta base para que los contenidos se desplieguen, los usuarios los consuman y así pueden evolucionar, es decir, cambiar sobre la base de lo que el diseñador plantea en un principio, y con el uso de las personas, evoluciona.

Google, por ejemplo, posee un buscador Spotlight actualmente, sin embargo en un principio, no era así; poco a poco ha evolucionado hasta esto, debido a la forma en que las personas utilizaban el sitio.

Para que el diseñador pueda comprender, y hacer crecer un medio digital, se deben ordenar, distribuir, analizar minuciosamente los contenidos; pero además, deben ser fácilmente encontrados, sino, no existen, pues el usuario no puede acceder a ellos. Se debe comprender la construcción de un medio digital, como un medio "biológico", que evoluciona, pero además su contenido debe relacionarse con otros medios, para que se pueda tener fácilmente acceso a él.

Las personas exigen que los contenidos lleguen a ellos, por ejemplo, si deseo comprar un vino, voy a poner en google "vinos", y los resultados arrojados, los primeros son con los que tomaré una decisión. Pero, ¿cómo se posiciona un contenido en google? Esto ocurre gracias a búsquedas orgánicas.

Siguiendo lo anterior, los contenidos de un sitios web, son los que "encuentran" al usuario, por eso es tan importante que el diseño llegue a quienes solicitan la información, es decir, el contenido debe ser accesible. Cuestionarse el diseño desde los contenidos, pues no hay diseño digital, sin ellos.

W3C y HTML

Es un consorcio internacional que produce recomendaciones, una suerte de stándar para la construcción de sitios web y buenas prácticas de uso. El HTML es usado para describir la estructura y el contenido en un sitio web. La importancia de cumplir estas recomendaciones, es que para que los contenidos puedan acercárse a los usuarios, éstos deben vincularse entre ellos y así mismo vincularse con buscadores, lo que es vital, para encontrar algo. Cuando éstas, recomendaciones, o stándares son cumplidos, la búsqueda orgánica se realiza fácilmente, y se puede acceder a los contenidos dentro del sitio web.

Organización de Contenidos

La reflexión inicial al enfrentar un problema de diseño digital, consiste en conocer, cuál es el contenido.

Para comenzar, es bueno ordenar los contenidos jerárquicamente, es decir, crear un índice de contenidos, los que bien pueden ser desde texto a imágenes, e incluso archivos multimedia.

Card Sorting

Para realizar una organización de categorías centrada en el usuario, el arquitecto de información dispone de técnicas de ayuda en la toma de decisiones, como es la denominada 'card sorting' u ordenación de tarjetas.

La técnica de 'card sorting' se basa en la observación de cómo los usuarios agrupan y asocian entre sí un número predeterminado de tarjetas etiquetadas con las diferentes categorías temáticas del sitio web.

De esta forma, partiendo del comportamiento de los propios usuarios, es posible organizar y clasificar la información de un sitio web conforme a su modelo mental.

Semántica

El contenido está separado de la presentación, y de esta manera, el mismo contenido puede verse en distintas plataformas. Cuando esto se lleva a cabo de buena manera, la W3C los valida, ya que para Google, es más fácil traer el contenido, cuando está organizado, pues para ellos es más barato y más sencillo facilitar el contenido a los usuarios.En ese sentido, cuando los sitios están ordenados, su valor respecto a la usabilidad, sube; y así, los sitios tienen mayor usabilidad. Dentro de eso contexto, se valora también la economía de los contenidos, para que no aparescan repeticiones.

Respecto al trabajo con los clientes, es bueno presentarle pruebas, para que así, pueda reflexionar y comprender los valores de lo presentado.

Mapas de Navegación

Un mapa de navegación es la representación gráfica de la organización de la información de una estructura web. Expresa todas las relaciones de jerarquía y secuencia y permite elaborar escenarios de comportamiento de los usuarios. También grafica, de modo que todos los profesionales participantes en un proyecto lo tengan claro, diferencias entre páginas dinámicas, administrables o estáticas.

El principal valor de un mapa de navegación es que permite anticipar errores de organización de la información, de modo de corregirlos fácilmente.

Un mapa de navegación no puede tener más de 3 niveles. Así, se busca evitar el desequilibrio entre amplitud y profundidad de la información. La amplitud se refiere a la cantidad de secciones o páginas de igual jerarquía a las que se puede acceder desde el inicio o desde secciones concentradoras de contenidos y se expresa horizontalmente en un mapa. La profundidad se grafica de manera vertical e indica el número de opciones de jerarquía decreciente que hay dentro de una misma sección.

Cuando un esquema de organización es muy amplio, el usuario puede confundirse al tener tantas alternativas, por lo que es bueno, acotar bien el menú por ejemplo del home de sitio web. A la vez, un esquema muy profundo, implica pocas opciones a las que acceder desde el home, pero hace que el usuario deba a travesar un largo camino de "clicks" para llegar al contenido que le interesa.

WireFrames

Se trata de la reflexión misma de como el usuario va a visualizar el sitio. Es un bosquejo de la ubicación de los elementos en pantalla.

Un wireframe grafica básicamente:

  • Elementos de navegación: menús, accesos directos e hipervínculos.
  • Elementos de información: contenidos de texto e imágenes.
  • Elementos de interacción: herramientas o funcionalidades que el usuario puede realizar.
  • Elementos de apoyo: ítems de ayuda y orientación, como mapas de navegación o faqs.
  • Elementos promocionales: espacio dedicado a banners publicitarios o a destacados internos del propio producto.

Es recomendable, no llenar de grafía el wireframe, es decir evitar el uso de colores, tipografías específicas, etc. pues lo que se quiere enfatizar, es como el usuario conversa con el sitio, y como no tiene, capa emocional, es más sencillo, establecer donde se ubican los puntos de interacción de los contenidos, pues se facilita la abstracción.


Encargo

  • Índice de Contenidos
  • Mapa de Navegación
  • Card Sorting
  • Wireframes

Enlaces Relevantes

-Valeuche 19:27 21 jul 2010 (UTC)


Clase 6

lovemark (Fidelización)

No hay que hacerle mucho caso a las personas. La experiencia de los expertos

  • El etiquetado:

Como se llaman las secciones (Home, Inicio). Es una situación cuestionable. Cada sección debe tener muy definido su nombre. Cuando uno arma el mapa de navegación, los nombres que le damos a las secciones serán a la larga las que irán en el código XHTML (de los contenidos).

La importancia de discutir los contenidos con expertos, con las personas. Esta situación nos ayuda a entrar más en los contenidos y comenzar a desplegarlos, esta discusión es muy importante dentro de la arquitectura de la información.

  • Los recursos

Entregarle motivos al público para entrar a un sitio web, como por ejemplo regalar PDF con las partituras a los músicos, entendibles, listos para imprimir, con el logo de la empresa, excelente diseño y GRATUITO. Eso genera que el público vuelva la próxima vez a comprar directamente un catálogo con partituras y continuar visitando el sitio web. Uno vuelve a un sitio web porque constantemente está pasando algo, tiene que ver con las actualizaciones.

Cuando se organizan los contenidos debemos ir dejando un camino o guias al público

  • Menu auxiliar

Menus con cosas que no son de una importancia primera para las personas. El sentimiento secundario.

  • Grilla

Las variables y la flexibilidad del sitio web está limitada por la grilla que destinemos en un primer momento, en esta grilla definimos la cantidad de columnas, espacios entre columnas, tamaños, entre otros para posteriormente incorporar el diseño dentro de la grilla.

--Waldoignacio 22:30 28 jul 2010 (UTC)


Clase 7

  • Fecha: Miércoles 4 de Agosto del 2010
  • Palabras Claves: Lenguaje HTML, medios digitales, Arquitectura de la información, Identidad.

Corrección de los Encargos

Se deben tener claras las ventajas de comprar por internet, para que el consumidor confíe y use esa herramienta digital.

Los productos se llenan de motivos, eso forma la identidad del producto.


El Lenguaje


El lenguaje hacia el consumidor debe ser cercano, en un nivel más confiable y amable, puesto que la mente siempre piensa en relacionar los productos con la vida propia del consumidor. La información a la cual el consumidor quiere llegar debe ser accesible, esto quiere decir que el contenido debe esstar vivo, siempre en movimiento, disponible.

Los productos son para las personas. La dirección al cliente se ve hacia tú, usted o de forma neutral

Se tiene que buscar una lingüística dirigida al público que se quiere llegar, sin tener que transgredir la identidad de la marca.


Sobre los Wireframes

El color le asigna un factor emocional al cliente y alarga las decisiones. Por esto mismo, cuando se construyen los wireframes, sólo se utiliza blanco y negro y fuente Helvética Regular. Así se crea una estructura neutral y el cliente no se confunde con el diseño del producto. Puesto que el cliente es difícil, sólo para las interfaces se utilizan colores.

Los consumidores

Los consumidores no buscan las marcas, sino que buscan las soluciones a los problemas transversales. Un ejemplo de esto lo podemos ver en Vivo conectado

  • La publicidad interruptiva no es la que el cliente busca.
  • Se muestra la emocionalidad de los temas tocados.
  • La comunicación es participativa. El cliente habla de parte de los sitios webs.
  • Los premios de Vivo son elementos que el ciente busca a partir de la comunicación.

Los Buscadores

El título de un sitio está estrictamente relacionado a lo que contiene. Este título se nombra en el header del sitio. Cuando los buscadores leen que el título se repite, suben de ranking al sitio. Mientras más se repita, más accesible será.


Encargo

Diseño de Interfaz


--Paula Mancilla


Clase 8

  • Fecha: Miércoles 11 de Agosto del 2010
  • Palabras Claves: Lenguaje HTML, medios digitales, Arquitectura de la información, Identidad, Wireframes, Marketing


Corrección de trabajos

Wireframes

Los wireframes deben estar comentados (con un círculo negro y letra blanca). Sirve mucho para mostrárselo al cliente. Este se lleva los impresos de manera que los puede rayar.

En ellos también debemos especificar el "http://ww.... " de manera que es mucho mas fácil para el programador entender el diseño. Por ejemplo, hablamos de el sitio de Wireframes Magazine que es, wireframes.linowski.ca. Esto quiere decir que el sitio, está dentro de otro sitio mas grande que se llama linowski.ca.

Los Wireframes son temas de discusión, no son solo responsabilidad del criterio de quién los hace, si no que se necesita del criterio de muchas personas para poder llegar a un buen final en ellos. Tienen un carácter de responsabilidad compartida, ya que depende de todos para llegar a un buen producto.

Los wireframes pueden ser una trampa para el que los hace, ya que es muy fácil caer en el diseño de lo emocional, en la interfaz. Lo cual después, la momento de hacer la interfaz, no lleva a solo pintar nuestro wireframe, lo cual es un ERROR!

Si el wireframe es fome, o tiene algún problema, esto, posteriormente, se refleja inevitablemente de algún modo en la estructura del sitio. De manera que el proceso se diseño se convierte en un trámite.

El wireframe tiene que convocar una discusión, a formar una mesa redonda, a una instancia de taller.

En los wireframes se establecen las normas gráficas que tendrá el sitio, por ejemplo el tamaño de las imágenes. No usar muchas altas.


Marketing: "ser o parecer"

Cuando se vende un producto, primero debo poder ver el producto. Luego, de esto se desprenden otras opciones:

  1. Comprarlo
  2. Ver catalogo
  3. Contacto. Cuando nos metemos a esta salida, nos concentramos solo en el contacto y no en el producto que nos gusta, por lo tanto, podemos perder toda la información que habíamos obtenido por nuestras preferencias.

La página junta productos para poder ser comprados mas que para exponerlos solamente. La función del sitio es exponer productos que se venden, por lo tanto el acto final es la venta de productos, de manera que el sitio, debe hacer todo lo posible para que el producto se venda. De manera, que a veces es necesario crear sistemas nuevos para que los clientes puedan realizar el acto final.


Argumentar nuestro trabajo

Los argumentos de los análicis de los sitios tienen que ser objetivos, no subjetivos. No podemos hablar de nuestras apreciaciones personales sobre lo que vimos en el sitio, ya que estas pueden ser malas para mi, pero para otro pueden ser buenas y tener mejores argumentos para defender el sitio. Poe ejemplo el sitio de la "Rock and Pop". No es sufciente decir que es un sitio desordenado, ya que el dueño de la radio puede decir que es así porque es un sitio rockero y los rockeros son desordenados. Debemos ir mas allá.

Para ésto, debemos usar el lenguaje técnico, y demostrar de manera casi cientifica, por lo tanto objetiva, los argumentos que tenemos para explicar los cambios que se hacen en un sitio. De manera que el cliente esté de acuerdo contigo.

Para crear nuestro argumento técnico, necesitamos pruebas de lo que decimos, los antecedentes: confusión de íconos, portes, baners, poder guiarse con la interfaz, problemas de AI, etc.

Para poder llegar a estos criterios, uno debe adentrarse a temas desconocidos a través del estudio, para lograr usar un lenguaje adecuado. Por eso se inventan técnicas para traspasar nuestros argumentos de diseño a un gráfico (lenguaje conocido para gerentes).

Para lograr hacer estos gráficos se usan diferentes métodos, como graficar respuestas de test heurísticos, participación en el medio, etc.

construcción de sitio

Carpetas

  1. vperez
    1. index.html
    2. imag
    3. pag
    4. aux
    5. docs
    6. css



Sitios visitados en clases:

--Valentinaperez 00:26 21 ago 2010 (UTC)


Clase 9

  • Fecha: Miércoles 18 de Agosto del 2010
  • Palabras Claves: Lenguaje HTML, medios digitales, Arquitectura de la información, Identidad.

Katherine Exss: Diseñadora Gráfica egresada de e[ad] Actualmente trabaja como arquitecta de la información en Ayer Viernes

La Arquitectura de Información no es un protocolo, ni tampoco se encasilla solamente al mundo web. Esta sirve para cualquier tipo de disciplina. Al momento en que un cliente necesita a un diseñador, este último debe transformarse en un experto en cuanto a nivel de conocimiento de la información con la que trata. De este material se hace una recopilación de lo que realmente sirve; el diseñador debe captar los objetivos esenciales que el cliente necesite. Tras la selección se asocian unos con otros. Y mediante un mapa conceptual se ordena el contenido y sus diferentes reorganizaciones. Se crea un Mapa de Navegación a partir del proceso. Luego se hacen Jerarquías. ¿Qué es lo que se quiere ver? ¿Qué es lo que se hará en el espacio gráfico?

El Mapa de Navegación es fundamental en el proceso de diseño, con este uno puede ver la extensión total del proyecto, lo cuál debe ser comprensible por el cliente y no solamente para uno.

La COMUNICACIÓN está ligada directamente con los recursos gráficos, lenguaje visual y herramientas y software

Existen 2 diferentes polos, el primero se refiere a la información y fundamentos. El segundo gráfica y estilos. El punto medio es el mensaje, el cuál se debe transmitir eficientemente.

Al momento de las evaluaciones, el cliente no es específico al momento de evaluar el sitio, al cuál se le deben sacar las respuestas del porqué no le gusta parte del diseño. Hay que actuar con un poco de psicología.

Los pasos a seguir para la creación del sitios nunca se deben saltar.

Reconvención mediante el oficio. Los diseñadores gráficos debemos tener conocimiento de otras áreas.

"El Diseño Gráfico es un medio. No un fin

--Diego Reyes Vielma