Layout

Primero que nada debemos saber que es un layout y básicamente es la distribución equilibrada que podemos apreciar en revistas, periódicos, paginas webs, etc, entonces podemos decir que un layout es  un croquis, esquema, o bosquejo de distribución de las piezas o elementos que se encuentran dentro de un diseño en particular.

En el marketing es utilizado para aludir al diseño o disposición de ciertos productos y servicios en sectores o posiciones en los puntos de venta en una determinada empresa. 

A continuación se pueden apreciar distintos modelos de layout

Bibliografia: 

http://definicion.de/layout/

http://conceptodefinicion.de/layout/

Empezando de 0...

Como ya sabrán, este blog es para subir trabajos e investigaciones de la clase computación publicitaria y la verdad no he tenido muy buena nota jaja así que el licenciado nos dio la oportunidad de repetir los trabajos donde tuviéramos baja nota y así no se vera afectado mi lindo promedio jaja, aquí les va...

Comencemos con la primera investigación la cual fue vectores vs pixel:

Los pixeles:

Los pixeles son básicamente pequeñas celdas cuadradas o rectangulares, cada una con un color propio, sobre una superficie que compone una imagen digital. Con este método de digitalización es posible representar imágenes fotográficas y texturas, pues permite obtener tonos continuos y representar degradados sutiles de sombras y de color. Cada píxel tiene una posición y un color determinados.

Para editar imágenes de píxeles se utilizan programas como Adobe Photoshop, Corel PhotoPaint, Painter, Gimp, etc.

Estas imágenes tienen una característica propia: la resolución, que determina sus posibilidades de impresión y ampliación. Toda imagen de píxeles tiene un tamaño óptimo de impresión. Si es impresa a mayor tamaño su calidad disminuye.

Los vectores:

Las imágenes vectoriales son gráficos digitales compuestos por formas geométricas independientes (segmentos, polígonos, arcos, etc.), con información de posición, tamaño, color, etc. La tecnología más usada para la descripción de estas formas o “vectores” son las curvas de Bézier que estudiaremos más adelante.

Por ejemplo un círculo quedaría definido por la posición de su centro, su radio, el grosor de línea del contorno y su color interior o de relleno. Estas imágenes son completamente distintas a las formadas por píxeles.

Los programas más usuales que generan y editan gráficos vectoriales son CorelDraw y Adobe Illustrator.

La característica principal de los gráficos vectoriales es su capacidad de admitir ampliaciones ilimitadas de tamaño sin perder calidad. Por ejemplo: se puede tomar un logotipo vectorizado, imprimirlo en una tarjeta personal, y luego agrandarlo e imprimirlo en una gigantografía. En ambas imágenes la calidad de impresión será la mayor disponible en la impresora.

Este es un ejemplo de como se ve una imagen realizada con Illustrator (vectores) y una imagen realizada con Photoshop (pixeles)

Bibliografia: http://www.pixelnauta.com.ar/curso2011/photoshop1/clase1/index1.html

Formatos

JPEG
Son las siglas de Joint Photographic Experts Group, el nombre del grupo que creó este formato. jpg es un formato de compresión de imágenes, tanto en color (RGB y CMYK) como en escala de grises. Este  es el formato de imagen más común utilizado por las cámaras digitales y otros dispositivos de captura de imagen.

El formato JPEG comprime el tamaño del archivo utilizando un algoritmo de compresión con perdida, es decir, que para representar cierta cantidad de información, se utiliza una menor cantidad de la misma. En la mayoría de los programas para edición de imagen es posible especificar que tanta perdida de calidad y comprensión deseas para tu archivo. 

En conclusion el formato JPEG sirve para manipular y compartir archivos de imagen fotográfico.

GIF

Son las siglas para Graphics Interchange Format, es un formato gráfico utilizado ampliamente en la WWW (World Wide Web), tanto para imágenes como para animaciones. Este formato puede contener alrededor de 256 colores. Por esta razón, GIF no es un formato recomendado para guardar fotos ya que puedan tener mas que esa cantidad de colores y podría perder gravemente la calidad de dicha imagen.

Este formato es util para guardar imágenes que tengan grandes bloques de colores planos como ilustraciones simples o logotipos para alguna compañía. Ademas, permite preservar la transparencia. El formato GIF usa un algoritmo de compresión LZW. 

Generalmente el formato de GIF es utilizado para publicidades tipo banners. Su principal utilidad es el despliegue de imágenes animadas para paginas web, cabe destacar que la animación de este tipo de imágenes solo se puede visualizar en cierto tipo de aplicaciones y programas como presentaciones power point o páginas web, pero en hojas de cálculo o documentos de texto las imágenes gif pierden su animación

PDF

Son las siglas de Portable Network Graphics, intenta reunir características de los formatos anteriores. Su desarrollo fue basado en el formato gif, para evitar la perdida de información al comprimir los archivos, básicamente es un sustituto del formato gif. Los archivo tipo gif utilizan un algoritmo de compresión de datos que está patentado, mientras que el formato png no está patentado y no necesita licencia para su utilización.

Sin embargo, a diferencia de GIF, PNG soporta imágenes de 24 bits y permite preservar la transparencia sin asperezas en los bordes. El problema es que algunos navegadores de internet antiguos no permiten visualizar este formato. PNG puede soportar imágenes RGB, con colores indexados, en escala de grises y en modo de mapa bits.

Se considera que el formato jpg es mejor para fotografía digital mientras que los formatos gif y png son mejor para imágenes gráficas.


En la imagen a continuación podremos ver los otros tipos de formatos que existen y una breve explicación de cada uno:

Biblografia: http://www.maestrosdelweb.com/formatos-gif-jpg-png/

Retoques retoques..

En photoshop ademas de poder cambiar el color de los objetos y el fondo como realizamos anteriormente, se pueden hacer pequeños retoques utilizando distintas herramientas, como lo es cambiar el color de cara o colocarle una cara totalmente distinta a una persona.

Esta es la imagen retocada con photoshop

Esta es la imagen original

Photoshop

La semana pasada comenzamos a usar photoshop y la verdad no era muy buena con eso, pero poco a poco y con practica he mejorado.

La tarea de esta semana fue colocarle a una imagen otro fondo y cambiar de color algún objeto, así que tome un restaurante en Paris y a David Beckham y los uní.

Y al unirlos el resultado fue el siguiente:

Como dije antes, también nos toco cambiar el color a un objeto así que cambie el color de la camisa y corbata de David y cambie el color de una manzana, el resultado fue el siguiente:

Empezando con photoshop

Mi logo...

Sketch de mi logo

Logo terminado con Illustrator

Sketch

Colores

En la ultima clase aprendimos sobre los colores, lo que mas me impacto fue lo siguiente:

LOS COLORES NO EXISTEN

Asi es, los colores no existen, simplemente el reflejo de la luz en los objetos. En realidad todos los objetos tienen una base blanca.

Los colores se dan al momento que los objetos debido a su composición rechazan las partículas de luz por lo tanto el objeto toma el color de las partículas aceptadas.

También aprendimos sobre el significado de RGB y CMYK, realmente yo no tenia idea de que significaba eso y me pareció algo muy interesante.

La teoria del color nos sirve para crear armonía en los colores.

• Los colores complementarios son aquellos colores que son opuestos en la paleta de color
• Los colores analogos son aquellos colores que son similares en la paleta de color
• Los colores complementarios análogos son los colores que son opuestos pero a la vez similares
• Triada son 3 colores contrarios

El afiche de los New York Knicks es un claro ejemplo de los colores complementarios ya que el azul y el naranja son opuestos en la paleta de colores. Lo mismo ocurre en el afiche de Los Angeles Lakers, al momento de ver en la paleta de colores se puede apreciar que el morado y el amarillo son opuestos. Esta es una buena técnica ya que son colores que resaltan juntos y hacen llamativo el afiche.

En las imágenes de abajo se aplico la técnica de colores análogos, ya que ambas imágenes tienen una paleta de colores similar, siguen la misma tonalidad, en ambas imágenes se aprecian que son colores cálidos.

                  

Tarea

En estos dias hemos aprendido a hacer afiches publicitarios con Illustrator, de que tamaño deberían ser, los colores, donde debe ir el texto, imágenes, entre otras cosas y los colores, como se clasifican, como hacer para combinarlos, etc. Para mi carrera la cual es Marketing, saber hacer todo esto es muy importante ya que a la hora de diseñar un anuncio publicitario es muy útil saber todo esto para poder vender bien el producto y tener éxito en la tarea asignada.

Este fue el ejemplo que realizamos en clases, aprendimos a colocar las letras dentro de una imagen y a realizar logos de una forma mas sencilla uniendo formas. La imagen que tomamos fue la del logo de apple y aplique la técnica aprendida en clase de los colores, colocar colores que combinen.

El segundo afiche me costo un poco mas, tome el logo de Pepsi y aplique todos los colores de la marca y dentro del logo se puede apreciar el nombre de pepsi cola. 

Fundamentos del diseño

El pasado jueves estuvimos practicando como realizar curvas con Illustrator calcando un logo de nuestra preferencia y ademas debíamos agregar 2 fundamentos del diseño. 

El logo que elegi fue el de Kipling ya que es el lugar donde trabajo y me pareció interesante aprender a hacer el logo.

Los fundamentos del diseño que utilice fueron: 
Relacion figura-fondo; se puede apreciar en el fondo que es negro y encima de este esta el logo de kipling
Secuencia o ritmo; ya que la imagen da una sensación de repetición progresiva.
Espacio; ya que la imagen se realizo en una base.

Gestalt

Gestalt es una corriente de la psicología moderna, la cual se origino en Alemania y consiste en demostrarar que el ser humano no percibe las cosas como entidades sin relación y aisladas, sino que mas bien las organiza, mediante el proceso perceptivo, en totalidades significativas. En cada situación se da una 'figura' o punto de interés y un 'fondo' sin interés. Mientras hay interés la escena aparece organizada de un modo significativo. 

Las reglas de oro de Gestalt

Vive ahora. Preocúpate por el presente en vez de preocuparte por el pasado o el futuro.
Vive aquí. Trata con lo que está presente en vez de con lo que está ausente. El aquí.
Deja de imaginar. Experiencia lo real.
Deja el pensar innecesario. Más bien prueba y ve.
Expresa en vez de manipular, explicar, justificar o juzgar.
Entrégate a lo desagradable y doloroso tanto como al placer. No restringas tu darte cuenta. Arriésgate.
No aceptes otros "deberías" que los tuyos. Debeísmo.
Toma completa responsabilidad por tus acciones, sentimientos y pensamientos. Responsabilidad.
Entrégate a ser como eres. Sé espontáneo.

Diseño

El pasado jueves recibimos una clase sobre diseño donde nos explicaron el concepto, las áreas, las ramas, los fundamentos del diseño, etc.

Basicamente el diseño es una actividad creativa que tiene como fin la creación de piezas u objetos que sean útiles y estéticos, también busca comunicar y transmitir visualmente un mensaje de forma efectiva.

Hay distintas áreas que conforman el diseño tales como: diseño de comunicación visual, diseño gráfico, diseño publicitario, diseño industrial, diseño de moda, entre otros.

Las ramas del diseño son las siguientes:
Editorial: es aquel que diseña todo tipo de libros, periódicos o revistas.
Publicitario: es aquel que diseña anuncios, folleto, etc.
Identidad: es aquel que diseña una imagen corporativa de una empresa

Esto es una pequeña introducción a lo que será el curso de computación publicitaria donde aprenderemos a diseñar tarjetas de presentación, logos, carteles, vallas, etc.

Pixel vs vector

El jueves pasado entregamos una tarea sobre la diferencia entre vector y pixel, la verdad no hice la tarea a conciencia por lo que se me olvido colocar las imágenes jaja así que acá están!

Una imagen con pixeles:

Una imagen con vectores: