viernes, 28 de noviembre de 2008

PAGINA DEFINITIVA

La página de AVERIGUA quedó terminada, esta conformada por:

1. index
2. servicios
3. botones
4. metodología
5. formalidad
6. lealtad

Cada uno de estos botones hablan un poco de lo que es AVERIGUA, con información de interés para los clientes como los servicios, los principios de la empresa, el contacto, etc. A continuación describo un poco cada uno de los botones.

*INDEX: es la página principal, en ella se encuentran todos los botones de la página y es la primera con la que tiene interacción el usuario.

*SERVICIOS: se dan a conocer al cliente los servicios con los que cuenta AVERIGUA, los tipos de investigaciones que hace, entre otra información que muestra al usuario el amplia gama de actividades de AVERIGUA.

*CONTACTO: Es una página que da información adicional al usuario para comunicarse con las personas a cargo de AVERIGUA, ya que todo usuario espera siempre tener un mayor acercamiento a una empresa, no sólo a través de la red.

*METODOLOGÍA: Es el proceso que lleva a cabo AVERIGUA en cada uno de sus proyectos, teniendo en cuenta sus objetivos.

*FORMALIDAD: Es parte de la personalidad de la empresa, es la seriedad y compromiso con un proyecto y un cliente

*LEALTAD: Es otro valor más de la empresa con el que se le demuestra y recalca al cliente que no será traicionado, y que se lograrán sus objetivos al acudir a AVERIGUA.

USCROLLBAR

Aunado a esto, la mayoría de las ligas a las que lleva cada botón tienenal ladito una barra que sirve para que el usuario de la página suba o baje en la información, llamado "uscrollbar".

¿Cómo hacer un uscrollbar?

  • haces un rectángulo
  • lo conviertes en movie clip
  • seleccionas dando doble clip
  • agregas el texto con la herramienta adecuada
  • después Dynamic
  • text multilinea
  • Properties
  • window
  • component
  • uscrollbar
  • arrastrar el uscrollbar hasta la ubicación deseada
  • pegar al lado.
  • LISTOOOOOO

EFECTO DE LOS BOTONES
















Como lo describí en su debido momento, los botones de la página de AVERIGUA son: metodología, formalidad y lealtad (para hablar un poco de los valores con los cuáles AVERIGUA lleva a cabo sus prácticas), y, la página home (index), servicios y contactos.

La idea central radica en que al estar en el área de hit de un botón (referente a los valores) la imágen que aparece se convierta a blanco y negro; para esto fue necesario tener la misma imagen en tonos normales y en tonos grises, después de hacer de convertir el objeto a botón, cuando estaba en el área de hit tenía que quitar la imagen a color y pegar la imagen en gris.

Para esto se utilizaba importar, importar a escenario y listo, la imagen se ajustaba en la ubicación exacta. Y listo.
Adicional, también tenía que conjuntar el ñarea donde aparecía el titulo del botón con la imagen, esto se me dificulto mucho porque de hecho batallo mucho con las herramientas de selección (eso desde que utilizamos photoshop, entonces estaba un poco traumanda porque el trabajao se detuvo), pero Alex me explico y pude lograrlo.

Con la ayuda de Alex quedo hecha la página principal.

Avanzando en la página

Después de tener el prototipo de baja fidelidad, la tarea era hacer los archivos en flash para cada botón; primero los tuve que hacer en photoshop porque había filtros que queria utilizar como fondo de la página, los cuáles no encontre en flash: "Texturizado".

Del lado derecho pueden ver cuáles son los primeros prototipos de lo que quería que apareciera en cada botón.

lunes, 3 de noviembre de 2008

Avances

Hola a todos, como ya se habrán dado cuenta, mi página web va a ser acerca de mi empresa "AVERIGUA", y la imagen que se muestra a la derecha es una pequeña muestra de como va quedando mi página Web, tenia dos ideas iniciales como lo pueden ver:

  • El fondo de la página color gris
  • El fondo de la página color azul "AVERIGUA"

La página home va a comenzar con botones que van a describir el trabajo de la empresa y también va a estar vinculada con el resto de los botones.

Algunos tips que aprendí la clase pasada son que existe el color alpha, que entre mayor es el número con que se programan los tiempos en flash, más lento es el efecto, bueno eso siento que va a ser importante si quieren darle un efecto padre a su página.

Continuará...

sábado, 18 de octubre de 2008

CREACIÓN DE WEBS

NAVEGACIÓN.

*Transmitir el contexto al usuario: está vinculado al volumen de información y la manera en que esta información se relaciona con la página. Toda página web debe proporcionar las claves necesarias para situarse en contexto y ofrecer pistas de la estructura u organización de la información.
*“Hacia atrás” e ir a la página anterior: cuando el usuario cliquea un enlace en un documento web, es transportado de un sitio a otro, el enlace se convierte en bidireccional, puedes volver a dónde estabas al accionar el botón “anterior”, y al revés volver a l página de la que habías salido. Una barra de botones pude además contener información de donde te encuentras, los botones “página anterior” y “Página siguiente” son enlaces fijos dirigidos hacia documentos asociados. Al proporcionar botones de paginación y regreso a la página principal y páginas de contenidos, se da al usuario la capacidad de comprender la organización de la información del sitio web. Estos botones no impiden que el usuario acceda a la información en el orden que el mismo establezca, pero si le permite, si lo desea, seguir el orden establecido por el diseñador. Las barras de botones son el lugar más lógico de situar en laces hacia la página principal o hacia otras páginas de menú.

DISEÑO DEL SITIO
Para este paso se toman decisiones de que es lo que quiere el público, que es lo que se quiere decir y como organizar los contenidos. Muchas empresas y organizaciones caen en el error de utilizar sus web para describir su organización, y de forma secundaria ofrecen los servicios, productos e información que busca el usuario medio. A la mayoría de los navegantes no les interesa saber acerca de la empresa.
*Organizando la información: Una web no funcionara sin fundamentos sólidos y lógicos de la organización. La manera como la gente busca y usa información de referencia sugiere que unidades de información más pequeñas y mesuradas funcionan mejor y son más manejables que textos largos y uniformes. Hay cinco pasos esenciales: dividir el contenido en unidades lógicas, establecer jerarquía de importancia, utilizar la jerarquía para estructurar los vínculos entre unidades, construir un sitio que siga de cerca la estructura de información y analizar el éxito funcional y estético del sistema. Un lector aprecia siempre los pedazos cortos de información que pueden ser localizados y visualizados de forma rápida. Pocos usuarios de la red permanecen largo tiempo leyendo grandes párrafos, un troceado moderado de la información conduce, por sí mismo, a la utilización de enlaces; fragmentos sintéticos de información encajan mejor en la pantalla de un monitor.
*Jerarquía de importancia: La mayoría de los sitios dependen de una jerarquía, moviéndose desde el plano general en conjunto, que correspondería a la página principal o home, hasta las páginas más especificas de submenús y contenidos.
*Relaciones: el usuario construye su propio esquema mental, una organización lógica del sitio permite al usuario prever eficazmente dónde puede encontrar las cosas.
*Función: un diseño de web eficaz es el justo equilibrio en la relación que se genera entre las páginas de menú y paginas con contenidos específicos. Los sitios web son una estructura jerárquica poco profunda dependen demasiado de páginas menú extensas que pueden confundir. Un esquema de menús puede ser tan profundo que la información queda enterrada bajo excesivos niveles de menús.
*Recapitulación: Pensar lo que se quiere decir y como se quiere decir. Esboza los limites en los que trabajas, trocea la información en secciones y subsecciones, piensa como se relacionan las secciones entre ellas y construye una tabla de contenidos, que permite al usuario percibir la estructura, la extensión y el flujo narrativo de lo que se intenta mostrar.

ESTRUCTURA DEL SITIO
*Estructura básica de la información: existen 4 maneras de estructurar un sitio web, secuencialmente, en retícula (grid), jerárquicamente y en forma de telaraña (web).
*Secuencias: forma más sencilla de organizar la información, a partir de una cronología, una serie lógica de temas desde lo más general a lo más especifico, o un orden alfabético.
*Retículas (grid): mejor manera de organizar manuales de procedimientos, listados de cursos universitarios o descripciones de casos médicos, Los temas que se presentan así no poseen una jerarquía de importancia especial, pueden ser de difícil comprensión para un usuario que no reconozca las relaciones entre las categorías de información, es adecuada para usuarios experimentados con conocimientos del tema que se trata y de sus organización lógica.
*Jerarquías: mejor manera de organizar cuerpos de contenidos complejos. Se organiza alrededor de una página principal o home, son comunes en instituciones, compañías u organizaciones, solo funciona si el material está bien organizado.
*Telaraña (web): pocas restricciones en cuanto a patrones de uso de la información, imitar el pensamiento asociativo y el flujo libre de las ideas, permitiendo al usuario seguir sus propios intereses y generar modelos únicos, heurísticos e idiosincrásicos, se produce de una gran densidad de enlaces, tanto hacia la información interna como a la externa de otras webs. Puede generar confusión, funcionan bien en webs pequeñas, predominan las listas de enlaces, y en sitios web enfocados a usuarios expertos, o muy instruidos, donde se busque un conocimiento y enriquecimiento sobre la materia más que su comprensión básica.

TEMAS EN EL DISEÑO DEL SITIO
Forma de presentar la información, está regida por parámetros determinados por los objetivos, la logística práctica del medio que se escoge y el público al que va dirigido. Los cuatro temas más importantes referentes a la entrega de información, en función de dos variables fundamentales: el carácter lineal de la estructura de lo presentado y la duración en tiempo del contacto de un usuario típico. Instruir, enseñar, auto información o formación continua y referenciar, son típicas en contextos de redes internas; intranets corporativas o educativas donde el usuario accede con un propósito muy definido.
*Instruir: tienden a presentar un diseño lineal, pocas oportunidades de salirse del curso. Restringir los enlaces a las páginas “Siguiente” y “anterior” garantiza que todos los usuarios recorrerán los mismos contenidos y permite, asegurar el tiempo de contacto de forma más precisa.
*Enseñar: la información que se presenta es más sofisticada y densa.
*Formación continua: el usuario conoce algo sobre el tema, el diseño debe facilitar un acceso ágil a todos los temas y ofrecer una diversidad de enlaces hacia material relacionado. El tiempo de conexión es imprevisible, pero siempre más corto que en las dos anteriores, el usuario no dispone de mucho tiempo. La opción de imprimir el material es un requisito indispensable para este tipo de usuario.
*Referencia: permitirá al usuario acceder a él, encontrar lo que busca e imprimir o descargar fácilmente lo encontrado. Componentes gráficos deberán ser los mínimos y la estructura de contenidos y menús debe organizarse cuidadosamente para que permita una gran agilidad en la búsqueda de recuperación de los resultados para facilitar la descarda de los archivos y su impresión. Tiempo de conexión corto.

COMPONENTES DEL SITIO
*Páginas principales: Todo sitios web se organiza a partir de una página principal o home, que actúa como unto lógico de entrada a un sistema de páginas web, todas las páginas web subordinadas deberían tener un enlace director a ella. Su dirección URL en la red será la dirección que conduzca al usuario hacia el sitio web. Página ideal donde exponer noticias e información de última hora, su gran visibilidad la convierte en un lugar perfecto para colocar un menú de enlaces o una tabla de contenidos de la web.
*Página principal orientada: Se hace imposible mostrar en una sola página de entrada todo el aliento y profundidad de sus contenidos internos, ventajosos para dividir al público en distintos grupos de interés, ofrecerles información más concreta y relevante, acorde a sus intereses.
*La portada: las portadas o paginas de bienvenida de una web, splash screens o “salpicar” la pantalla, para muchos usuarios son un fastidioso click de ratón que los distancia de los contenidos que están buscando, la clave está en evaluar el publico que se tiene y, en función de ello, escoger el tipo de entrada que se desea. El usuario que no desee entrar por la puesta principal siempre tiene la posibilidad de agregar a su lista de favoritos una página más interna. Para el diseño de una página principal lo primero es decidir la cantidad de elementos gráficos de la página, los gráficos imponente un elevado tiempo de descarga. Esta disyuntiva refleja la necesidad de ajustarse a un público diversificado con tantas expectativas. La mejor manera de satisfacer al mismo tiempo las necesidades de un usuario esporádico como las de uno muy especifico que usa la web frecuentemente es ofrecer dos tipos de página principal: una más orientada al público en general, que sea atractiva visualmente, y otra que ponga especial atención en un acceso rápido a los contenidos, con lista de enlaces en formato de texto.
*Retícula base para el diseño de la página: No dejar que el diseño de la página principal domine las estrategias generales del diseño de la web en su conjunto. Si te cansas de tu página principal solo debes cambiar o reorganizar una página; un error en la composición de la retícula base para el diseño de página puede suponer un mísero diseño para miles de páginas que dependan de ella.
*Menús y subwebs: a menos que manejes una web de tamaño reducido necesitaras incluir un submenú que sea accesible desde la pagina principal., no es conveniente cargar la pagina principal con docenas de enlaces, pues el tiempo de descarga puede ser demasiado y su multiplicidad puede descorazonar a muchos usuarios. Submenús se convierten en páginas principales alternativas para subwebs orientadas a un público muy concreto.
*Índices de materias, contenidos del sitio, mapas del sitio: A diferencia del medio impreso, los sitios web ofrecen escasas indicaciones explicitas de la profundidad y extensión de los contenidos. Los índices de materias y de palabras clave de información de la web son una manera de orientación clara del volumen, organización y el contexto de los contenidos que se incluyen. Un índice web debería apuntar a las referencias más relevantes de una palabra clave, e ignorar referencias menores. Los mapas del sitio aportan al usuario una visión general de los contenidos.
*Página novedades: webs requieren una actualización frecuente para que la información que presentan no se vuelva rancia. Se puede considerar la construcción de una página especial de “novedades” donde informar al usuario de las últimas actualizaciones. Cada una de las páginas de la web debería llevar la fecha de la última actualización, para que el usuario pueda estar seguro de que se enfrenta a la última versión.
*Buscadores: herramientas y motores de búsqueda. Los dos sistemas, búsqueda mediante menú o por palabras clave, se complementan. La búsqueda por palabras clave ofrecen al usuario un listado de enlaces específicos para continuar la navegación, pero no aportan una visión global del carácter y la naturaleza de la información la que nos lleva cada uno de ellos, ni tampoco de la estructura que se ha utilizado. Los menús y los índices por materias facilitan esa visión del conjunto global.
*Información de contacto y relación con el usuario: la red es un medio bidireccional, la gente espera poder enviar comentarios, preguntas o sugerencias. Proporciona siempre en un lugar destacado de la web, al menos un enlace a la dirección de correo electrónico.
*Direcciones físicas., números de teléfono, números de fax: el editor web olvida que la comunicación con la organización no se establece solo por el sitio web. La gente querrá llamar por teléfono, enviar una carta o mandar un paquete por fax.
*Mapas, instrucciones de acceso y de aparcamiento: Proporcionar al cliente, visitante o proveedor instrucciones de acceso al lugar físico, se puede utilizar un mapa gráfico o direcciones en formato de texto.
*Bibliografía y apéndices: pueden integrarse en un web para que puedan consultarse a discreción.
*Páginas FAQ: “Frequent Asked Questions” (preguntas más frecuentes); una página donde se enlistan las preguntas más comunes de los usuarios, junto a sus respectivas respuestas.
*Páginas de error del servidor: Aparecen cuando un servidor web es incapaz de localizar una página, debería también proporcionar algún tipo de explicación acerca de por qué se ha producido el erros, sugerir alternativas y facilitar enlaces a la página principal local, al índice de la web o a una página con un buscador.

DISEÑO DE INTERNET FRENTE A DISEÑO DE INTRANET
El principal fin de los sitios web de carácter externo es maximizar el tiempo de conexión, conduciendo al usuario hacia secciones más internas de la web y premiando su curiosidad con información interesante y entretenida. Una buena web intranet, reúne información útil, la organiza en sistemas lógicos y la entrega eficazmente. Nadie quiere que un usuario de intranet vagabundee, debe permitir acceder rápidamente a lo que se desea y aprovechar el tiempo.
*Evolución de la red: colección medio organizada de web listadas en una o más páginas principales maestras, o webs “umbral”, ahorra el tiempo de trabajo, mejora la productividad e incrementa la eficacia con que sus empleados utilizan la intranet de la compañía.

Más acerca de mi página WEB




Como se darán cuenta, mi página WEb va a ser acerca de la empresa AVERIGUA, las imágenes del lado derecho son los bocetos que hize para mi página WEB.


Aunque aun no estan listos los botones del todo, lesmuestro las imágenes que voy a ocupar.

miércoles, 15 de octubre de 2008

CLASE DE FLASH Y DREAM WEAVER

FLASH SEGUNDA CLASE
Abrir programa nuevo
Modify, document y poner las dimensiones de 800 width* 600height
Con un back ground azul o del color que quieras y aceptar
Lo guardamos en file, sabe y le ponemos el nombre de index (todo en minúsculas), se usan los caracteres básicos y nuemeros conocidos, se pone index y lo guardamos en un folder que ya creamos que se llama mini-sitio
Se llama index porque cuando hacemos una página de internet, la red automáticamente llama a la página que se llama index como página principal, solo la primera se llama asi.
Y el fondo lo haces en photo shop con medidas de width 800 por 600 en height, igual con los botones.
SI trabajamos en red la resolución es de 72 dpi, es para internet porque es lo que dan los monitores.
Ok y listo
Regresamos a index, file, import, importo stage o import to library, busca el archivo e importes el fondo, como te lo separa todo por fondos, le pones en las rayitas o el circulito de los layer con play y le das flatte, y junta los layer
File sabe web anty bases, versiones anteriores
Y te muestra como se en diferentes formatos

Sooooooooooooo
File
Import
Import to stage
Y pegas tu imagen de photo shop
Y para que no se mueva le doy click al candado
Hago tres botones, los selecciones a los tres y le doy en convert to simbol y después movie clip para que estén en un solo frame
Después le doy doble click a la selección completa y después ya puedo editar cada uno de los botones
Le doy click a uno, converto to symbol, botton y ya lo vas editando en up, over, down hit, conforme vaya acabando me regreso al símbolo uno donde están mis tres botones y edito otro
Programarrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrr
Me voy a la escena me meto al símbolo
Se3lecciono un botón, window, properties, y le das En la flechita del cuadro de abajo
On, release, geturl(“nombre de la dirección que va a traer.html”);
Te pasas al otro botón y copias la dirección y pegas en el otro y así hasta el tercero
Le ponemos en file sabe
Le ponemos file sabe as y lo guardas con el nombre del primer botón para que aparezca la información de ese primer botón
Así e importas las imágenes o lo que quieres que salga y así guardas todo
Todo se guarda en swf
Después lo cierras y lo importas a dream weaver que es el programa que ayuda subir los archivos a internet
Entramos a dream weaber
File
new
Html
Lay out
Tablita
3 columnas por 4 lineas, ok
Ayuda a deciden donde va a ir la pagina
Te pones en el cuadrante que quieres
Inser
Media
Flash
Buscas tu archivo swf
De mini-sitio
Insertas primeo el de index que está en swf
Al lado del central al lado podemos crear algo nuevo que es…
Home, nombre del botón 1
Nombre del botón 2
Nombre del botón 3
Para hacer un Nick, selecciones home y abajo aparece Nick y le pones el nombre de la página a la que quieres que te lleve, en este caso index. Html
Después selecciones el botón uno, pones el mismo nombre pero con html y así ya te va creando los links
Lo guardas en file sabe
Después file sabe as y le pones el nombre del botón 1
Y le das insert, media, flash y el swf banksing
Apara subirlo tenemos que tener un servidor

ESTRELLA

1. Ideas iniciales:
  • Una página web que tenga como mínimo 4 botones
  • Tema: AVERIGUA
  • Subtemas: Inicio, quiénes somos, soluciones, sucursales y contacto
  • Una página, formal y que demestre que la empresa es profesional en el ambito de investigación de mercados
  • Una página que pueda explicar de manera rápida e interactiva todo el concepto y funcionalidad de averigua.
  • Uná página que respete los colores, y concepto de averigua
  • Qué sea entendible y fácil de usar

2. Análisis de requerimientos:

  • Usuario: una persona, empresa o institución que requiera de la investigación de mercados, que conozca un poco de las ventajas de esta, que quiera trabajar con una empresa formal, seria, profesional y especializada en la investigación de mercados.
  • Técnicos: computadora con los programas dream weaver, illustrator, photo shop y flash
  • Cliente: Emplear el diseño en una página web, que los botones funcionen adecuadamente, que sea estética, con buena imagen y diseño.
  • Estéticos: crear una página web que tenga buena combinación de colores, con una vista limpia, formal, que exprese lo que es la empresa AVERIGUA.
  • Conceptuales: tener conocimientos acerca de dream weaber, flash, illustrator y photo shop, además de los elementos básicos que requiere una página web.
  • Contenido: información general acerca de averigua, información acerca de las soluciones que ofrece averigua, contactos y alianzas.

martes, 14 de octubre de 2008

PROTOTYPING FOR TINY FINGERS

Para hacer un diseño, el equipo de diseñadores comienzan por hacer bocetos, posteriormente discuten cada punto a detalle para llegar a un sólo diseño; este diseño esta codificado con un software que sirve como herramienta de prototipos, el diseño resultante se muestra a los usuarios para que lo aprueben por medio de calificaciones de los comentarios, así continua el proceso hasta que se llega a un diseño definitivo que fue aprobado por múltiples usuarios.

A la técnica anterior se le conoce como prototipo de baja fidelidad, o lo-fi, que es una herramienta simple y efectiva que ha fracasado por el uso de software. La calidad de un diseño va a depender del número de interacciones del prototipo con los usuarios correspondientes, pero también se tiene que tener en cuenta los costos. Los prototipos originan una idea mucho más creativa.

Los prototipos hi-fi son difíciles de cambiar porque toma mucho tiempo hacerlos, ya que requieren de muchas técnicas; sin embargo, los prototipos en papel son más rápidos y sencillos, sólo necesitas 5% del tiempo en las técnicas y el 95% en idear la idea.

La trojan-meme: es una idea en mente que después se traspasa a otras ideas en mentes nuevas, hay dos leyes importantes: conocer al usuario y saber que el diseñador no es el usuario.

La prueba del diseño, es una evaluación formativa, en la que evalúan un diseño, en diferentes estados y por una comunidad de usuarios; mientras que la evaluación resumen, se hace posteriormente de que se lanzo el diseño, te permite ver qué hiciste bien y que mal, pero muy tarde.

Para construir un prototipo lo-fi: se necesita primero tener el paquete de materiales a usar, después fijar un plazo, construir modelos no ilustraciones (no importa que sólo se plasmen las ideas en papel tal cual son), el siguiente paso es la preparación para una prueba, donde es importante seleccionar a los usuarios que cubran las diversas características de los usuarios potenciales.

En el momento de la prueba es importante primero darles la bienvenida a los usuarios, posteriormente presentar al facilitador, que es la persona líder de la prueba, da instrucciones, hace que los usuarios den opiniones; también la persona que actúa como computadora y que va creando lo que los usuarios van diciendo, los observadores toman notas.

Después se integra un reporte con el resumen y las posibles soluciones o mejoras del diseño.

Me dejo un poco confundida

Así es compañeros, la clase de flash me dejó un poco confundida, son muchos botoncitos los que se necesitan para hacer más botoncitos; pero la verdad es que me gusto mucho eso de los efectos.

Y bien: Para hacer una pánia web necesitamos de dos programas que son, dream weaver y flash.

La diferencia entre flash e illustrator es que flash trabaja con imágenes y no con vectores, trabaja en scenas y estas se dividen en frames.

En flash podemos crear los botones para nuestra página WEb, y ponerles efectos.

lunes, 13 de octubre de 2008

sábado, 4 de octubre de 2008

AVERIGUA

Así es, el nombre de la empresa que cree es "AVERIGUA", es una empresa de Investigación de Mercados:

forma, seria, clara, metodológica, responsable, honesta, eficiente, concreta, entre otras características más.
En fin, les dejo aquí las imágenes del logotipo y diseño de hojas y carpetas. (lado derechoooooooo).

Saludos a todos!!!!!!!!

viernes, 19 de septiembre de 2008

Aprendiendo Illustratior


Pues eh aquí mi creación en mi primera clase deIllustratior, el programa me parece amigable, pero en realidad no conozco mucho de el, en realidad espero, que todo salga muy bien.

BOCETOS INICIALES



Y me la podría pasar boceteando...

Jajajajaja, pues así es, comencé a bocetar y realmente surgieron muchas ideas, así que llegue a un punto en el que dije: ¡¡¡ya basta!!! ahora a analizar; lo interesante es que cada vez tomas nuevas ideas y eres capaz de crear algo nuevo, lo difícil es no perder de vista que debes comunicar un concepto a las personas; por lo tanto NO esta permitido perder los elementos que se quieren transmitir.
En mi caso, quisiera una empresa que se especialice en la investigación de mercados, ya que me agrada esta área, además de que es muy amplia y a mi gusto interesante.
Los elementos que manejaré son: una lupa (por la investigación) y una tipografía que expresa, seguridad, formalidad, confianza, dinamismo...aquí les muestro un poco de mis bocetos y pues ahora a seguir trabajando.
Lindo fin de semana a todos.

lunes, 15 de septiembre de 2008

¡¡¡CHEQUEN ESTO!!!

Navegando por el extenso mundo del Internet me encontré con una empresa que ayuda a hacer logos corporativos; la empresa se llama "infologotipo"; y la página es interesante, entre los temas que nos pueden ayudar están los elementos de un logo corporativo, los colores que se deben usar, entre otras cosas muy interesantes.

Si tienen tiempo y les interesa revisen la página, esta es:

www.infologotipo.com

Saludos a todos y felices fiestas patrias.

Palabras para la conceptualización...

Esto es muy complicado creo yo, porque además de tener la imagen exacta que quieres mostrar, debes encontrar elementos y símbolos necesarios para poder comunicar sin errores el mensaje correcto de tu empresa.

En especial me gustaría enfocarme a una empresa que englobe todos los servicios del marketing, pero no me cierro a la idea de la inv. de mercados; ya que es una de las áreas de la mercadotecnia que más me gusta.

PALABRAS:

  • confiabilidad
  • efectividad
  • exactitud
  • eficiencia
  • puntualidad
  • oportuna
  • formal
  • responsable
  • organización
  • metodología
  • alegría
  • dinamismo

Imagen corporativa, acerca de los REQUERIMIENTOS

Y ahora si a trabajar en la imagen coorporativa, y como ya aprendimos, el primer paso para comenzar a diseñas es la maravillosa estrella y comenzar a conceptualizar, estos son algunos de los requerimientos que necesitamos:
USUARIO: gente buscando tus servicios, que te refresque, que entienda el concepto (merka), legible. Que se vea profesional

CLIENTE y desarrollador: “Yo”, sentirme identificada, que me guste, que englobe todo lo que quiero expresar, que exprese lo que ofrezco
Calidad, congruente, fácil de entender
TECNICOS:
Illustrator (tener acceso al programa saberlo usar
v Vectores
v Impresión digital (office Max y vectores ó 300 dpi)
v Tiempo
v Papel

CONTENIDO:
Marca
Tarjeta
Hoja membretada

ESTÉTICOS
v No pixeleado
v Colores congruentes
v Materiales
v Tipografía congruente
v Armonía
v Atractivo
v Original
v Congruencia entre los 3 elementos

Primera clase (10 de Septiembre)


Pues bien, comenzamos una vez más, pero ahora aprenderemos acerca de la imagen corporativa y los elementos que se requieren para el diseño.


Para comenzar es importante tener en cuenta dos elementos esenciales: logotipo y marca.


LOGOTIPO: el termino tienes sus origenes del vocablo "logo" que significa tipografía. Investigando un poquito más encontre que un logotipo (coloquialmente conocido como logo) es un elemento gráfico, verbo-visual o auditivo y sirve a una persona, empresa, institución o producto para representarse.


Los logotipos suelen encerrar indicios y símbolos acerca de quienes representan. Históricamente, los artesanos del barro, del cristal, los fabricantes de espadas y artilugios de hierro fino, y los impresores utilizaban marcas para señalar su autoría. Los reyes que sabían firmar además cruzaban los documentos legales con un logotipo de su creación, a mano o con un sello.


Existendiferentes tipos de logotipos, por ejemplo: imagotipo, isotipo, descriptivo, simbolico, acrónimo, entre otros.


MARCA: es un concepto mucho más completo, ya no solo es la imagen, sino todo lo que implica. Una marca es todo aquello que los consumidores reconocen como tal. Es un producto al que se ha revestido de un ropaje tan atractivo que consigue que el producto se desee, se pida, se exija , con preferencia a otros productos. En definitiva , la marca es el nombre, término, símbolo o diseño, o una combinación de ellos, asignado a un producto o un servicio, por el que es su directo responsable. Ésta es quien debe darlo a conocer, identificar y diferenciar de la competencia; debe garantizar su calidad y mejora constante.

Y comenzamos de nuevo...


  • SEGUNDO PARCIAL

viernes, 5 de septiembre de 2008

Y al fin!!!!!!!!!

Y... por fin quedo el CD

Esta es la portada y contraportada (aunque al subirla al blog se distorcionaron los colore, jajajajaja), y vaya que me costo terminarla, jajajajaja ustedes son testigos.

Nos vemos mañanita.

Ya experimentando



Manejar photoshop es todo un "show", pero poco a poco y con paciencia, mucha paciencia, fui logrando crear algo que representara lo que son las baladas, no soy experta en photo shop y mucho menos en diseño, pero hize la lucha, jajajajaja.


Las imagenes anteriores eran los mejores prospectos, posteriormente ya llegue por fin a estrcuturar y definir con exactitud el prototipo.

Proceso del diseño





Decidí que mi disco se llamaría "Love is the reason", siento que es un nombre que expresa lo que es el amor y por lo mismo el género de las baladas, al ser estas música lirica y que evoca a los sentimientos.


Era indispensable que utilizara el color rojo, pues es en todo el mundo el color representativo del amor, simplemente la cultura lo ha adoptado como tal, y de acuerdo a diversos autores, entre ellos Ferrer, el rojo representa AMOR, cariño, fuerza, pasión.


Y estas son las imágenes con las que comenzé a trabajar después de mucho buscar lo que se asemejaba mejor a mi idea, y después de descartar muchas más.

miércoles, 27 de agosto de 2008

DISEÑO Y DESARROLLO

Como pueden ver ya hice más bocetos de mi disco, desafortunadamente sufrí un accidente y no me es posible salir de mi casa;sin embargo, por msn le he preguntado a mis compañeros y amigos que opinan de los diseños y los favoritos han sido el de los cisnes, los novios y el corazón con flores...ustedes ¿qué opinan?

Tenía tres diseños más pero mi computadora quedó inservible, y los perdí; pero, el viernes próximo una amiga me va a apoyar prestándome su computadora para poder usar photo shop, y entonces ya les presento el diseño definitivo de mi CD.

Una disculpa,y seguimos en contacto.

ANÁLISIS DE REQUERIMIENTOS

  • REQUERIMIENTOS DEL USUARIO
  1. Tener un disco de baladas, donde las canciones sean románticas y hablen del amor
  2. Conocer del género musical para saber que pedir
  3. Un disco con presencia, estética y buen manejo del concepto de baladas.
  • REQUERIMIENTOS TÉCNICOS
  1. Tener photo shop
  2. Papel: (en espera) aunque de acuerdo a lo que he investigado favorece el papel cuche.
  3. Impresora: láser 3500
  4. Colores rojo, blanco, tonalidades de azul
  • REQUERIMIENTOS DEL CLIENTE
  1. Aplicar en el proyecto los conocimientos aprendidos hasta el momento acerca de diseño gráfico
  2. Presentar un trabajo que además de expresar adecuadamente la idea (género musical) de forma tangible, también lo haga en esencia (intangibilidad), que tenga argumentos suficientes y verdaderos, que exprese sentimientos y que comunique facilmente con el cliente y usuario.
  3. Un proyecto estético, de calidad, con fundamentos
  • REQUERIMIENTOS DE CONTENIDO
  1. UN cd con 10 canciones del género musical de baladas
  2. Carátula original, fundamentada en conocimientos previos
  3. Lista de canciones en un booklet original
  4. CD también tiene que tener decoración (diseño)
  5. Un CD de calidad (impresión, material, colores, diseño)
  • REQUERIMIENTOS ESTÉTICOS
  1. Buen uso de colores
  2. Impresión de calidad (agradable a la vista, resistente)
  3. Un diseño original y acorde al género musical
  4. Los elementos integradores del CD con una manejo unificado en la idea creativa
  5. Canciones conocidas en el género y segmento de las baladas.
  • REQUERIMIENTOS CONCEPTUALES
  1. Saber del género de baladas
  2. Conocer acerca de los tipos de papeles
  3. Conocer acerca de tipos de impresiones
  4. Manejo de programas de diseño
  5. Manejo de uso de colores
  • RELACIÓN DESARROLLADOR-CLIENTE-USUARIO
  1. Poder transmitir la misma idea que tiene el desarrollador al cliente en primer lugar y posteriormente al usuario, a través de todos los elementos del CD (tangibles e intangibles).

PASO 1: CONCEPTUALIZACIÓN

  • IDEAS INICIALES
  1. Trabajar en un proyecto con el género musical de baladas
  2. Saber que las baladas tienen su origen en la canción folclórica narrativa basada en la parte más dramática de un relato, construida por medio de una serie de diálogos y acciones. Es un poema narrativo corto. La palabra balada se utilizó por primera vez en un sentido general para señalar un poema corto y simple, cantado o no, que podía tener un carácter narrativo o lírico, cruel o amable, sentimental o satírico, religioso o profano y vagamente asociado a la danza. En la música popular del siglo XX se ha convertido en sinónimo de canción de amor lenta. Sin embargo, en el folclore, el término balada se aplica específicamente al tipo de canción popular narrativa descrita anteriormente. Estas canciones representan un tipo de literatura y música que se desarrolló por toda Europa durante la baja edad media. Cuando nació, se trataba de una nueva forma de arte y literatura.
  3. Recabar ejemplos de CD´s de baladas como prototipo del proyecto a realizar
  4. Conocer el significado de los colores, para saber cuales se identifican con el género musical de baladas.
  5. Cuáles son las partes de un Cd (caratula, contra caratula, booklet)
  6. Elementos básicos que debe llevar un Cd y como se conforman (título, lista de canciones, cancionero)
  7. Conocer de los baladistas más famosos
  • JUNTAR IDEAS
  1. Las baladas son un género musical completamente romántico, dirigido a todas las personas enamoradas y a las que no lo están, pero les gusta sentir la música del amor, es completamente lírica y por lo mismo evoca a los sentimientos más lindos y puros del ser humano.
  2. El significado de los colores principales de acuerdo con el libro "El lenguaje de la publicidad" del autor Ferrer, son los siguientes:
  3. Rojo: es el del fuego y el de la sangre, por lo que se le asocia al peligro, la guerra, la energía, la fortaleza, la determinación, así como a la pasión, al deseo y al amor.
  4. Azul: es el color del cielo y del mar, por lo que se suele asociar con la estabilidad y la profundidad. Representa la lealtad, la confianza, la sabiduría, la inteligencia, la fe, la verdad y el cielo eterno.Se le considera un color beneficioso tanto para el cuerpo como para la mente. Retarda el metabolismo y produce un efecto relajante. Es un color fuertemente ligado a la tranquilidad y la calma. Y es muy aceptado por los hombres.
  5. Negro: representa el poder, la elegancia, formalidad, luto.
  6. Blanco: es el color de la pureza,serenidad, equilibrio.
  7. Amarillo: simboliza la luz del sol. Representa la alegría, la felicidad, la inteligencia y la energía, sugiere el efecto de entrar en calor, provoca alegría, estimula la actividad mental y genera energía muscular. Con frecuencia se le asocia a la comida.
  8. En cuanto a los baladistas, entre los más famosos destacan Shakira, Emmanuel, Roberto Carlos, Celine Dion, Ricardo Montaner, entre otros.
  • ACOMODANDO IDEAS
  1. Las canciones que se utilizaran serán en inglés y en español, para evitar barreras del idioma, ya que el amor, es un sentimiento universal.
  2. Los colores más adecuados serán el rojo que evoca al amor, pasión y corazón; se puede complementar con el blanco, ya que es el color de la pureza, como este sentimiento.
  3. Se manejarán temas de artistas conocidos y sobre todo temas populares, o bien, canciones que han trascendido épocas.
  4. Tendrá que llevar un booklet con mínimo la lista de las canciones y los interpretes.
  5. Caratula identica por ambos lados con una imagen que evoque al amor e inmediatamente se identifique como un disco de baladas.
  • ESENCIA FÍSICA
  1. Un disco de baladas que por medio del diseño exprese toda la esencia de las baladas.
  2. Con estética y sentimiento.

lunes, 25 de agosto de 2008

Boceto 2


Pues e aquí el segundo boceto, la verdad es que me gusta mucho más, porque es sencillo, bonito y expresa romanticismo.
Lo digo porque predomina el color rojo, que de acuerdo a un libro que encontre llamado "El lenguaje de la publicidad" significa amor, cariño, pasión, entre otros sentimientos de los cuales se habla mucho en las baladas.
Y también me gusta que no uso el color negro, ya que se me hace un color muy pesado para manejarlo en las baladas.
No se si la ubicación de la palabra "Baladas" sea la mejor, o deba cambiarla, yo creo que si, porque de esta forma al estar en la parte superior no la cubriría nada más al ubicarlo en una tienda, peroooo no lo se, emitan opiniones por favor.

Boceto 1


Aquí tienen mi primer boceto, use de fondo el color blanco porque es pureza, y pienso que las baladas al evocar al amor y los sentimientos se relacionan,ya que considero que el amor es uno de los sentimientos más puros del ser humano, el corazón que se aprecia es porque es el mayor simbolo del amor, y las flores que lo forman es porque en muchas ocasiones una persona cuando quiere dar un obsequio a otra le regala flores, se da mucho entre los enamorados, por lo mismo, es como un CD que es un regalo para las personas románticas.


La letra con la que está escrita la palabra "Baladas" la hize yo (obvio, jajajaja), y aunque falta perfeccionarla, pienso que debe ser en ese prototipo, suave, delicada y delgada; mientras que la flecha que aparece debajo apunta hacia el corazón porque evoca a lo que dicen los enamorados, cuando se enamoran jajajaja: "fue un flechazo al corazón".



Rotafolio de baladas.





Rotafolio

En la clase anterior, tuvimos que exponer los rota folios de nuestro proyecto, la verdad es que me fue muy útil porque me di cuenta de en que posición voy respecto a mi proyecto y todas las cosas que tengo que mejorar.

He seguido haciendo más bocetos de mi carátula para el CD y en lo que aun siento lagunas mentales es en el booklet del CD, pero sigo trabajando en ello.

Después de todo sigo con la idea de manejar un fondo rojo y un corazón hecho de flores, pero no se que tan factible sea usar formas diferentes y colores diferentes como estrellas o algo así, es que no se si tengan el mismo efecto comunicativo con las personas, es decir, yo pienso que un corazón transmite más fácil un mensaje de amor, que una estrella.

Necesito orientación.

Y lo que ya decidi del booklet es que la letra de cada canción va a ir en una "hojita" por separado, pero no se si la decoración de la hoja siga el mismo diseño de la caratula en colores diferentes o con formas diferentes.

¿Qué opinan?

martes, 19 de agosto de 2008

Para mi gusto, una de las mejores baladas.

Escuchenla e interpretenla, para que me ayuden a planear mi proyecto, me gustaría que me dijeran a que colores les recuerda y a que imágenes.

Clase de diseño: "Interpretando música"



Las imágenes anteriores, son prueba de que en la clase pasada, todo el grupo tuvimos la oportunidad de interpretar la música de diferente manera, en un principio me resultó difícil entender qué era lo que se tenía que hacer con exactitud, pero después de dos intentos creo que logre ir más allá de lo que me estaba permitiendo.

Como pueden apreciar, hay diferentes "grafías", por llamarlas de algún modo, de las cuales cada una interpreta un género musical distinto, todo va de acuerdo al ritmo del sonido y la letra de las canciones. También, los colores significan algo, aunque me hicieron falta más tonalidades, intente expresar con cada uno diferentes sentimientos que me transmitían las canciones, por ejemplo, el azul era el mar, el rojo era alegría, etc.

Nunca había hecho una dinámica similar, por lo tanto fue muy interesante, aunado a esto, considero que la actividad pasada me sirvió de mucho para diseñar o estructurar de mejor manera mi proyecto, y así poder entender que es lo que se hace exactamente en el momento de crear una idea innovadora que además también sea capaz de transmitir al público el mensaje o causa real del proyecto.

Puntualizando en el tema de las baladas y de acuerdo a lo que aprendí con la dinámica; pienso que la letra debe ser un estilo de cursiva, y que los colores son en tonos rojos, pero más en tonos rosas porque el rojo se interpreta un poco agresivo, o como advertencia de algo; a pesar de que el corazón, que es un gran símbolo representativo del amor es rojo. Mientras que el color rosa, transmite más ternura y cariño, al igual que los colores azul y amarillo pastel.

Más caratulas









Elizabeth Meza

IDEAS DE CARATULAS PARA EL DISCO

HOLA A TODOS:
ESTOY DEFINIENDO COMO VA A SER LA PORTADA DE MI DISCO, ES POR ESO QUE ME DI A LA TAREA DE BUSCAR ALGUNAS PORTADAS DE DISCOS DE BALADAS QUE YA EXISTEN Y ESPERO QUE ME DEN SU OPINIÓN, ¿OK?...es importante que opinen acerca de los colores, las formas, la letra y otros elementos que consideren importantes.

miércoles, 13 de agosto de 2008

Acerca de los colores

Y hablando del significado de los colores les envio esta información que espero también les sea útil para el diseño de su proyecto, esto es lo que encontré:

Rojo:

· El color rojo es el del fuego y el de la sangre, por lo que se le asocia al peligro, la guerra, la energía, la fortaleza, la determinación, así como a la pasión, al deseo y al amor.

· En publicidad se utiliza el rojo para provocar sentimientos eróticos. Símbolos como labios o uñas rojos, zapatos, vestidos, etc., son arquetipos en la comunicación visual sugerente.

· En heráldica el rojo simboliza valor y coraje. Es un color muy utilizado en las banderas de muchos países.

o El rojo claro simboliza alegría, sensualidad, pasión, amor y sensibilidad.

o El rosa evoca romance, amor y amistad. Representa cualidades femeninas y pasividad.

o El rojo oscuro evoca energía, vigor, furia, fuerza de voluntad, cólera, ira, malicia, valor, capacidad de liderazgo. En otro sentido, también representa añoranza.

Azul:

· El azul es el color del cielo y del mar, por lo que se suele asociar con la estabilidad y la profundidad.

· Representa la lealtad, la confianza, la sabiduría, la inteligencia, la fe, la verdad y el cielo eterno.

· Se le considera un color beneficioso tanto para el cuerpo como para la mente. Retarda el metabolismo y produce un efecto relajante. Es un color fuertemente ligado a la tranquilidad y la calma.

· En heráldica el azul simboliza la sinceridad y la piedad.

· Es adecuado para promocionar productos de alta tecnología o de alta precisión.

· Al contrario de los colores emocionalmente calientes como rojo, naranja y amarillo, el azul es un color frío ligado a la inteligencia y la consciencia.

· El azul es un color típicamente masculino, muy bien aceptado por los hombres, por lo que en general será un buen color para asociar a productos para estos.

o El azul claro se asocia a la salud, la curación, el entendimiento, la suavidad y la tranquilidad.

o El azul oscuro representa el conocimeinto, l integridad, la seriedad y el poder.

Blanco:

· El blanco se asocia a la luz, la bondad, la inocencia, la pureza y la virginidad. Se le considera el color de la perfección.

· El blanco significa seguridad, pureza y limpieza. A diferencia del negro, el blanco por lo general tiene una connotación positiva. Puede representar un inicio afortunado.

· En heráldica, el blanco representa fe y pureza.

· En publicidad, al blanco se le asocia con la frescura y la limpieza porque es el color de nieve. En la promoción de productos de alta tecnología, el blanco puede utilizarse para comunicar simplicidad.

· Es un color apropiado para organizaciones caritativas. Por asociación indirecta, a los ángeles se les suele representar como imagenes vestidas con ropas blancas.

· El blanco se le asocia con hospitales, médicos y esterilidad. Puede usarse por tanto para sugerir para anunciar productos médicos o que estén directamente relacionados con la salud.

· Es un color apropiado para organizaciones caritativas. Por asociación indirecta, a los ángeles se les suele representar como imagenes vestidas con ropas blancas.

· A menudo se asocia a con la pérdida de peso, productos bajos en calorías y los productos lácteos.

Amarillo:

· El amarillo simboliza la luz del sol. Representa la alegría, la felicidad, la inteligencia y la energía.

· El amarillo sugiere el efecto de entrar en calor, provoca alegría, estimula la actividad mental y genera energía muscular. Con frecuencia se le asocia a la comida.

· El amarillo puro y brillante es un reclamo de atención, por lo que es frecuente que los taxis sean de este color en algunas ciudades. En exceso, puede tener un efecto perturbador, inquietante. Es conocido que los bebés lloran más en habitaciones amarillas.

· En exceso, puede tener un efecto perturbador, inquietante. Es conocido que los bebés lloran más en habitaciones amarillas.

· El amarillo es un color espontáneo, variable, por lo que no es adecuado para sugerir seguridad o estabilidad.

· El amarillo claro tiende a diluirse en el blanco, por lo que suele ser conveniente utilizar algún borde o motivo oscuro para resaltarlo. Sin embargo, no es recomendable utilizar una sombra porque lo hacen poco atrayente, pierden la alegría y lo convierten en sórdido.

o El amarillo claro representa inteligencia, originalidad y alegría.

Negro:

· El negro representa el poder, la elegancia, la formalidad, la muerte y el misterio.

· Es el color más enigmático y se asocia al miedo y a lo desconocido ("el futuro se presenta muy negro", "agujeros negros"...).

· El negro representa también autoridad, fortaleza, intransigencia. También se asocia al prestigio y la seriedad.

· En heráldica el negro representa el dolor y la pena.

· En una página web puede dar imágen de elegancia, y aumenta la sensación de profundidad y perspectiva. Sin embargo, no es recomendable utilizarlo como fondo ya que disminuye la legibilidad.

· Es conocido el efecto de hacer más delgado a las personas cuando visten ropa negra. Por la misma razón puede ayudar a disminuir el efecto de abigarramiento de areas de contenido, utilizado debidamente como fondo.

· Es típico su uso en museos, galerías o colecciones de fotos on-line, debido a que hace resaltar mucho el resto de colores. Contrasta muy bien con colores brillantes.

· Combinado con colores vivos y poderosos como el naranja o el rojo, produce un efecto agresivo y vigoroso.

Bibliografía:
http://www.webusable.com/coloursMean.htm