:::: MENU ::::

Blog del taller

  • Jun 15 / 2017
  • Comentarios desactivados en Programa de ejercicio de promoción en redes sociales
Diseño I, Programas

Programa de ejercicio de promoción en redes sociales

3- Programa del ejercicio Promoción en Redes Sociales 2017

1. Objetivos pedagógicos a cumplir

Que el alumno diseñe la gráfica promocional para medios digitales para una empresa de pequeña escala.

2. Contenidos principales

  • Diseño de gráfica para el soporte pantalla
  • Comunicación en redes sociales
  • Lenguajes persuasivos y promocionales
  • Tipologías gráficas en la web (sitios web, banners, placas promocionales, identificación en redes sociales, etc.)
  • Sistemas gráficos

3. Pedido de diseño
Diseñar la estrategia gráfica y comunicacional para redes sociales de una empresa pequeña. El trabajo implica la generación ideas de comunicación y redacción de textos para una promoción compatible con la actividad de la organización asignada, cuya temática será propuesta por el alumno y aprobada por el equipo docente. Las piezas a diseñar son las siguientes:

Sistema gráfico promocional:

  • Imagen de portada específica de la promoción (motivo del ejercicio) para Facebook.
  • 3 placas persuasivas diferentes que mencionen distintos aspectos de la promoción.

Las excusas (empresas) serán provistas por la cátedra. Las imágenes no tienen que ser (necesariamente) de las empresas dadas. Se deben buscar imágenes pertinentes de buena calidad, adecuadas para el mensaje y el tono de las promociones.

Al avatar de la empresa pueden modificarlo si consideran que es necesario.

4. Pautas principales de evaluación

  • Pertinencia estilística: adecuación de la gráfica al tipo de organización y al soporte digital
  • Sistema: coherencia entre las diferentes piezas. Uso adecuado de elementos constantes y variables.
  • Calidad gráfica: armonía de la composición y cuidado de la imagen, tipografías y recursos.

5. Condiciones de la entrega
En una lámina impresa cuyas características serán informadas oportunamente.

El mismo día se se enviará por mail la lámina en formato digital a:

disenobelluccia1@gmail.com

(sin la versión digital la entrega se considerará incompleta)

El formato del panel será jpg o pdf.
Resolución mínima para el jpg: 1920 pixeles (ancho)
Resolución máxima: 4096 pixeles (ancho)
(en caso de ser pdf será en buena calidad pero tratando de evitar un peso excesivo)

Además se enviarán las imágenes individuales en formato jpg: el nombre de los archivos JPG y el modo de presentación responderá a los siguientes criterios:

2017_dg1_redes_Nombre-Apellido_Portada-Facebook.jpg (simulación en contexto)
2017_dg1_redes_Nombre-Apellido_Placa-promocional-1.jpg (ancho 1280 pixeles)
2017_dg1_redes_Nombre-Apellido_Placa-promocional-2.jpg (ancho 1280 pixeles)
2017_dg1_redes_Nombre-Apellido_Placa-promocional-3.jpg (ancho 1280 pixeles)
El avatar y una de las placas se deben mostrar en la imagen 1.

(Los mejores trabajos que resulten de este ejercicio serán publicados en el sitio de la Cátedra, de ahí la importancia de que el material digital solicitado se encuentre en condiciones)

Temas

  1. Danza Aerea BA (escuela de danza) https://www.facebook.com/danzaaereaba/
  2. 5411 Soho Hotel Boutique & Spa (hotel boutique) https://www.facebook.com/5411Soho-Hotel-Boutique-Spa-520011534711942/
  3. Abramar Buceo (Academia de buceo) https://www.facebook.com/AbramarBuceo/
  4. Más Escuela de Cocina (escuela de cocina) https://www.facebook.com/EscuelaDeCocinaMas/

Horario de entrega: 19:30, tolerancia hasta las 20:00 hs. Después de las 20 la entrega tendrá tarde. Sin la entrega enviada por mail, la entrega se considerará incompleta.

  • Jun 15 / 2017
  • Comentarios desactivados en Programa de diseño web institucional 2017
Diseño III, Programas

Programa de diseño web institucional 2017

1. Objetivos

Que el alumno rediseñe y produzca un sitio web responsivo para una empresa u organización asignada por la Cátedra, con el objeto de mejorar el rendimiento del sitio existente.

2. Contenidos

  • Códigos de programación (HTML, CSS, Javascript, PHP, etc.)
  • Tecnologías para el desarrollo gráfico de sitiow Web (jQuery, Bootstrap, plantillas, LESS, SASS, etc.).
  • ¿Qué es diseñar para la web? ¿Qué es un buen diseño web?
  • Tipologías web: funciones y características.
  • Sitios Web de empresas e instituciones.
  • Experiencia de usuario (UX) y diseño de interfases gráficas (UI).
  • SEO (optimización del código para motores de búsqueda).
  • Navegabilidad, usabilidad, interactividad y accesibilidad.
  • Diseño responsivo.

3. Requerimiento

Cada alumno desarrollará un sitio web responsivo, de carácter comercial/persuasivo, para una empresa u organización que le será asignada. El sitio podría o no tener más páginas de las que se requieren en este ejercicio, pero a los efectos de unificar el alcance de todos los trabajos, se requiere el diseño y desarrollo exclusivamente de los siguientes elementos:

  • La página principal del sitio (Inicio).
  • Un listado (de productos o servicios), que, eventualmente, podría incluirse en la página principal (si el caso no justificara una página independiente).
  • Una página modelo de uno de los productos o servicios que la organización/empresa ofrece.
  • Un formulario de contacto (sea un popup, una página indepentiente o una sección en la home o en las páginas de producto, según convenga al caso).

Los sitios a rediseñar son:

  1. Marca de bicicletas: http://www.bicicletastomaselli.com
  2. Muebles de oficina: http://www.mygequipamientos.com.ar
  3. Hostería: http://www.lecharme.com.ar

Estos sitios necesitan fundamentalmente mejorar la calidad gráfica, realizar una buena adecuación estilística al emisor y presentar sus propuestas con mayor claridad.

Por tratarse de un ejercicio cuyo resultado no termina en el papel —sino en la pantalla—, a lo largo de las clases los alumnos presentarán sus propuestas en un navegador. En ese sentido, convendrá que quienes cuenten con computadoras portátiles las lleven al taller todas las veces que puedan. Asimismo, para poder probar los sitios en tabletas y teléfonos móviles, convendrá que mantengan una versión accesible desde la web.

4. Pautas de evaluación

  • Calidad gráfica: selección y combinación de elementos gráficos acorde a los estándares de calidad del género en la actualidad.
  • Claridad comunicacional: correcta selección, organización y jerarquización de los contenidos.
  • Adecuación a los códigos funcionales del medio Web: respeto de los códigos de funcionamiento impuestos y ya conocidos por el público.
  • Adecuación estilística: el clima visual de la propuesta gráfica debe resultar adecuado al emisor y al tipo de mensaje.
  • Presentación: cumplimiento de las pautas requeridas.

5. Entrega

La entrega será virtual (no hay que asistir a la facultad) y estará compuesta de dos partes:

  1. Subir el código completo del sitio y el código de la plantilla utilizada via Drive.
  2. Publicación en la Web del sitio desarrollado.
    Seguir la Guía Cómo publicar un sitio via FTP.

El código completo del sitio desarrollado y de la plantilla utilizada debe incluir solamente los archivos del sitio. Muchas plantillas incluyen otras carpetas con recursos y documentación que no forman parte del sitio. Para que no queden dudas sobre la carpeta que necesitamos, es solamente la que incluye la home (página de inicio) del sitio y las carpetas css, js, etc. Cualquier otra carpeta fuera de esa carpeta principal del sitio, por favor no la incluyan en la entrega. Esto aplica tanto al sitio desarrollado como a la plantilla utilizada.

La entrega por Drive debe realizarse subiendo una carpeta con la siguiente denominación:

2017_dg3_web-institucional_Nombre-Apellido

Esta carpeta deberá incluir en su raíz únicamente dos carpetas y un archivo html:

• web
• plantilla
• entrega.html

Ejemplo de la estructura de la carpeta:

Mantener las denominaciones mencionadas.
El archivo «entrega.html» deberá ser editado para incluir los datos del alumno y los links al sitio publicado y al preview del template utilizado.

Descargar el archivo «entrega2017.html»

A quien le resulte más fácil subir todo el contenido de la carpeta zipeado, por supuesto que puede hacerlo. Solamente les pedimos asegurarse de que al descomprimir el archivo el resultado incluya la carpeta con la denominación solicitada. Obviamente, el zip deberá tener mismo nombre que la carpeta. Por ejemplo: 2017_dg3_web-institucional_Nombre-Apellido.zip

El plazo máximo para subir los archivos de la entrega al Drive es el lunes 17 de julio a las 18 hs.

6. Recursos útiles para realizar el ejercicio

Ver trabajos de alumnos de años anteriores

Tutoriales en video necesarios para el ejercicio:

Tutoriales en video para quienes quieran aprender sobre el tema, más allá del ejercicio:

Software para editar código:

  • Brackets (gratuito, para Mac y Windows)
  • Atom (gratuito, para Mac y Windows)
  • Sublime Text (gratuito, para Mac y Windows)
  • Koala (preprocesador CSS gratuito, para compilar LESS y SASS, para Mac y Windows)

Referecia técnica de código para consultar en caso de ser necesario (a quienes puedan leer en inglés, les recomendamos utilizar las referencias en ese idioma, ya que son mejores y más actualizadas que las que están en español):

Plantillas HTML5:

  • May 15 / 2017
  • Comentarios desactivados en Programa del ejercicio de diseño editorial 2017
Diseño I, Programas

Programa del ejercicio de diseño editorial 2017

Nivel
Diseño I

Ejercicio Nº 2

Diseño editorial

1. Objetivos pedagógicos
Que el alumno diseñe una nota periodística completa de seis páginas, seleccionando y utilizando imágenes usando textos dados por la cátedra.

2. Contenidos principales

  • Reconocimiento y adecuada utilización de los diferentes elementos del diseño editorial (volanta, copete, título, destacados, recuadros, créditos, epígrafes, foliado, etc.).
  • Jerarquización y organización de la información (textos e imágenes).
  • Armado de una grilla básica y consistente con la necesidad del trabajo (márgenes, columnas, módulos, interlineado, etc.).
  • Selección de tipografía/s adecuada/s al problema y cuerpo de las mismas.
  • Ajuste del color tipográfico.
  • Legibilidad.
  • Ajuste tipológico al tipo de revista.
  • Pertinencia estilística, acorde al emisor y público.
  • Selección de imágenes pertinentes y de buena calidad.

3. Pedido de diseño
Este ejercicio consiste en realizar el diseño de una puesta en página de una nota periodística ilustrada con imágenes. La nota deberá desarrollarse en seis páginas de 20 x 28 cm. al corte, a cuatro colores (CMYK). Dicha nota comenzará en página par, por lo tanto el diseño debe pensarse para tres dobles páginas. La primera doble página tendrá el carácter de apertura de nota. El estilo deberá adecuarse al de una revista de interés general, su público es heterogéneo. Es decir que no se dirige a ningún sector en especial (no es una revista de vanguardia, ni de diseño, ni de moda, ni para jóvenes, ni para viejos, etc.). Es para un lector amplio y general.

Cada alumno utilizará la/s familia/s tipográfica/s que considere más adecuada/s así como la grilla de organización de columnas.

Se proveerá la volanta, el título, el texto, el copete y los textos. Las imágenes serán elegidas buscando calidad y pertinencia, y podrán ser utilizadas por el alumno como más convenga a su propuesta (ej. recortadas, reencuadradas, en escala de grises, etc.). Se usarán al menos seis fotografías diferentes.

El alumno redactará los epígrafes de las fotos y los subtítulos. Todos guardarán relación con el tema. Se podrá utilizar los destacados que sean necesarios, como mínimo son obligatorios dos. También deberán contemplar la incorporación de un recuadro de al menos 600 caracteres que llevará título y podrá llevar o no foto (este texto podrá ser extraído de la nota u otro texto aportado por el alumno o simulado).

Tendrán que respetarse muy claramente los códigos del diseño periodistico: importancia y ubicación de los distintos elementos, claridad de lectura, tamaño de la tipografía para cada función, adecuada jerarquización, etc.

El nombre completo del alumno figurará en la primera doble como autor de la nota y servirá para identificar el trabajo.

4. Pautas principales de evaluación

Organización editorial y comunicación: pertinencia de las decisiones del diseño: selección tipográfica, ancho de calles, márgenes y columnas, tamaño y color tipográfico de los textos, copetes, títulos, epígrafes, etc., ubicación y tamaño de las imágenes, jerarquización gráfica, recorridos de lectura, etc.

  • Calidad gráfica general: armonía de la puesta en página, coherencia de las decisiones adoptadas, adecuación a los estándares altos de calidad en mensajes similares. Cercanía o lejanía respecto de los modelos analizados.
  • Pertinencia tipológica y estilística: ajuste al perfil del emisor y el público.
  • Presentación: Calidad, cuidado y ajuste a la consigna de la entrega.
  • Pertinencia y calidad imágenes: elección y utilización (tamaño, encuadre, jerarquías, tratamiento).

5. Presentación
Se presentará cada doble página montada sobre una cartulina gris claro de 35×50 cm. Cada alumno entregará tres láminas. Se incluirá un pequeño rótulo con los datos de la cátedra, del alumno y los docentes.
El mismo día se se enviarán por mail las tres dobles páginas en formato digital a: disenobelluccia1@gmail.com (sin la versión digital la entrega se considerará incompleta)

El formato de la entrega será jpg de buena calidad. Consistirá en 3 imágenes
(una por cada doble página) de 1920 px de ancho.

El nombre de los archivos JPG responderá al siguiente criterio:
2017_editorial_Nombre-Apellido_doble-1.jpg
2017_editorial_Nombre-Apellido_doble-2.jpg
2017_editorial_Nombre-Apellido_doble-3.jpg
El asunto del mail incluirá el apellido y nombre del alumno y la comisión a la que pertenece.

(Los mejores trabajos que resulten de este ejercicio serán publicados en el sitio de la Cátedra, de ahí la importancia de que el material digital solicitado se encuentre en condiciones)Horario de entrega: 19.30 hs. Tolerancia hasta las 20:00 hs. Luego de ese horario la entrega tendrá tarde.

Temas:
1- Isla de Pascua
2- Brasilia
3- Bob Dylan
4- Juego de los tronos

Enlaces para descargar los archivos de texto de las notas (en el mismo archivo comprimido están los cuatro archivos .doc)

http://catedrabelluccia.com.ar/wp-content/uploads/2017/05/temas-editorial-2017.zip

 

  • May 15 / 2017
  • Comentarios desactivados en Programa del ejercicio interfaz para videojuego 2017
Diseño II, Programas

Programa del ejercicio interfaz para videojuego 2017

1. Objetivos pedagógicos a cumplir

Que cada estudiante diseñe un sistema de baja complejidad para la interfaz de un videojuego.

2. Contenidos principales a tratar en las clases

  • Función del diseñador gráfico en la industria del videojuego
  • Reconocimiento y diferenciación entre géneros o mecánicas
  • Elementos de la interfaz
  • Interacción del usuario
  • Pertinencia estilística
  • Análisis y diagnóstico de videojuegos similares a cada tema.
  • Detección de ejemplos de alto rendimiento.

 3. Pedido de diseño

Cada alumno diseñará el sistema gráfico de un videojuego que incluirá las siguientes piezas:

  • Marca producto e ícono
  • Splash screen
  • Menú principal
  • Ganar
  • Pantalla de selección
  • In game

Splash Screen: Es una pantalla de presentación, de corta duración, que aparece previo a la carga del menú principal.

Menú principal: Es la pantalla donde se acceden a las opciones generales del juego y es la primera con interacción para el usuario.

Ganar: Es una pantalla o Menú emergente donde se felicita al usuario por un logro y generalmente se le comunica un desbloqueo de alguna función del juego. Por ejemplo un nuevo escenario disponible.

Pantalla de selección: Sirve para que el usuario decida entre varias opciones a dónde se va a dirigir en el juego. Por ejemplo selección de niveles o lugares para recorrer o investigar.

Los temas y detalles de cada uno, se pueden ver aquí.

4. Pautas principales de evaluación

  • Adecuación estilística: es la mayor o menor pertinencia del estilo gráfico propuesto (tipo de imágenes, logotipo, tipografías, organización del plano, cromática, etc.) al rubro del producto y al perfil particular del caso.
  • Calidad gráfica: es la armonía estética, la coherencia y el ajuste de los elementos gráficos propuestos para inscribirse dentro de los estándares altos de su tipo.
  • Coherencia sistémica: las piezas gráficas deben mantenerse dentro de un sistema y a la vez cumplir los diferentes objetivos comunicacionales.
  • Ajuste técnico: que cumpla los aspectos técnicos y formales con el pedido enunciado (con los ajustes que se le hagan en clase).

 5. Límites

La marca, selección tipográfica, tipo de imágenes y demás decisiones gráficas quedan a criterio del alumno y no se ponen límites o restricciones técnicas mientras se cumpla con los parámetros de estilo, llamado de atención, singularidad, calidad, etc. fijados.

6. Entrega

  • Entrega de archivos digitales armado según mockup provisto aquí.
    • 2017_Videojuego_SS_Nombre-Apellido.JPG (splash screen)
    • 2017_Videojuego_MM_Nombre-Apellido.JPG (Main Menu)
    • 2017_Videojuego_PS_Nombre-Apellido.JPG (Pantalla selección)
    • 2017_Videojuego_PG_Nombre-Apellido.JPG (Pantalla ganar)
    • 2017_Videojuego_IG_Nombre-Apellido.JPG (In game)
    • 2017_Videojuego_IC_Nombre-Apellido.JPG (Ícono)

7. Links de referencia

  • May 15 / 2017
  • Comentarios desactivados en Programa del ejercicio de diario 2017
Diseño III, Programas

Programa del ejercicio de diario 2017

1. Objetivos pedagógicos a cumplir

Que los estudiantes logren, en grupos de 3 miembros, diseñar el prototipo de un diario de circulación masiva y uno de sus suplementos temáticos, de un nivel competitivo en el medio periodístico argentino.

 

2. Contenidos principales

La prensa escrita: definiciones, crisis actual, los diarios online, convergencia digital/papel, la inevitable parcialidad de la prensa.
Los diferentes elementos del diseño editorial (títulos, subtítulos, volantas, copetes, destacados, misceláneas, epígrafes, pastillas, recuadros, infografías, fotografías, créditos, etc.).
La/s tipografía/s adecuada/s al tipo de problema.
Cuerpos tipográficos y funciones.
Color tipográfico.
Legibilidad.
Jerarquización y organización de la información (textos e imágenes).
Grilla básica y consistente con la necesidad del trabajo (márgenes, columnas, módulos, interlineado, etc.).
Tipologías de periódicos y sus estilos.
Relación entre publicidades y notas, estructura y organización general.
Diagramación y ritmo de publicación.
Logotipos y portadas de periódicos.

 

3. Pedido de diseño

Cada grupo de alumnos diseñará un diario de un tipo característico (económico, interés general, sensacionalista) y un suplemento.
El rendimiento del diseño se verificará en un prototipo símil impreso en tamaño 40 x 28 cm. Cada tema tendrá adjudicado un diario real del cual tomará el contenido. Se podrá adaptar la redacción de titulares, copetes, subtítulos etc.
La pauta publicitaria del diario ocupará un 25% de mismo (en total serán 3 páginas de publicidad, 2 para el cuerpo principal y 1 página para el suplemento). Dicha pauta deberá contener avisos de 1/2, 1/3 y de página. No habrá publicidades de página completa.

 

Diario sensacionalista:
Referente: ejemplar del diario Crónica.
El prototipo a diseñar tendrá, al menos las siguientes páginas:

  • Tapa (además se entregarán 2 tapas sueltas, una de una edición habitual y otra que refleje una noticia extraordinaria);
  • contratapa;
  • las 4 primeras páginas del cuerpo principal;
  • 1 página de turf (con solo 1/2 página de datos de tablas de carreras);
  • 1 página de reportaje;
  • 1 página que contenga: el pronóstico del clima, horóscopo y otro tema a elección (tres temas en una misma página);
  • 2 página de espectáculos, TV y chismes;
  • 1 página de contenido a elección;
  • suplemento de deportes (8 páginas, con tapa).

Es decir, cuerpo central: 3 pliegues, suplemento: 2 pliegues.

 

Diario económico:
Referente: ejemplar del diario El Cronista Comercial.
El prototipo a diseñar tendrá, al menos las siguientes páginas:

  • Tapa (además se entregarán 2 tapas sueltas, una de una edición habitual y otra que refleje una noticia extraordinaria);
  • contratapa;
  • las 4 primeras páginas del cuerpo principal;
  • 2 páginas de datos económicos (que contenga tablas y gráficos);
  • 1 página de contenido a elección (por ej. espectáculos);
  • 1 página con un reportaje a un personaje (a elección);
  • 1 página con datos del tiempo, carta de lectores, agenda, etc. (mínimo tres temas diferentes en una página);
  • 1 página con notas de opinión (diagramar con o sin columna fija o con invitados)
  • Suplemento de viajes y estilo (8 páginas, con tapa).

Cuerpo central: 3 pliegues. Suplemento: 2 pliegues.

 

Diario de interés general:
Referente: ejemplar del diario Clarín.
El prototipo a diseñar tendrá, al menos las siguientes páginas:

  • Tapa (además se entregarán 2 tapas sueltas, una de una edición habitual y otra que refleje una noticia extraordinaria);
  • contratapa;
  • Las 4 primeras páginas del cuerpo principal;
  • 2 páginas de la sección de deportes;
  • 1 página de la sección económica (que contendrá tablas y gráficos);
  • 1 página con un reportaje a un personaje (a elección);
  • 1 página con datos del tiempo, agenda, carta de lectores, (mínimo tres temas diferentes en una página);
  • 1 página de opiniones y editorial;
  • Suplemento de espectáculos (8 páginas, con tapa).

Cuerpo central: 3 pliegues. Suplemento: 2 pliegues.

 

4. Pautas principales de evaluación

La evaluación del trabajo tendrá en cuenta:

4.1. Ajuste tipológico: es la correcta adecuación del estilo del diario propuesto a la tipología asignada.
4.2. Singularidad: El diario debe diferenciarse de sus competidores, pero al mismo tiempo mantenerse dentro de su tipología.
4.3. Organización editorial y comunicación: Es el resultado de la pertinencia y corrección de las decisiones del diseño editorial. Selección tipográfica, ancho de calles, márgenes y columnas, tamaño y color tipográfico de los textos, copetes, títulos, epígrafes, ubicación y tamaño de las imágenes, jerarquización gráfica, recorridos de lectura, etc. Implica comprender la función de cada uno de los elementos editoriales y las exigencias a las que está sometido, diseñar teniendo en cuenta esta funcionalidad, dar coherencia al sistema con la necesaria versatilidad.
4.4. Calidad gráfica general: armonía de la puesta en página, coherencia de las decisiones adoptadas, adecuación a los estándares altos de calidad en mensajes similares.
4.5. Presentación: calidad, cuidado y ajuste a la consigna de los prototipos entregados.

 

5. Trabajos prácticos especiales

  • Análisis de un diario.
  • Trabajo sobre copia de modelo.

 

6. Temas

Los tipos seleccionados son:

Diario de interés general
Referentes del género: Clarín, La Nación.

1) El Reportero, y suplemento El Crítico (espectáculos)

2) Expreso, y suplemento La Butaca (espectáculos)

 

Diario económico
Referentes del género: El Cronista Comercial, Ámbito Financiero.

3) Plaza Económica, y suplemento El Viajero (viajes)

4) Jornada Financiera, y suplemento Explorar (viajes)

 

Diario sensacionalista
Referentes del género: Crónica, Diario Popular.

5) Mirá, y suplemento El Tablón (deportivo)

6) Flash, y suplemento Estadio (deportivo)

 

7. Condiciones de la entrega

Se requiere la presentación de dos prototipos armados (diario y suplemento) y dos tapas sueltas.
Cada contratapa tendrá nombre y apellido de los alumnos de cada grupo y los de sus docentes (nombre y apellido).

Algunos links de interés

Páginas:1234567...25