Miguel Angel Cortés's profile

Tesis - Antiguo Colegio de San Ildefonso

Proyecto de Titulación
Multimedia interactivo para difusión del Antiguo Colegio de San Ildefonso
Proyecto de tesis para obtener el título de Licenciado en Diseño Gráfico de parte de la Universidad Nacional Autónoma de México (Facultad de Estudios Superiores Acatlán). El desarrollo comenzó a finales del 2007 y concluí con el trabajo a principios del 2009.

Este proyecto supone un acercamiento a la producción multimedia interactiva enfocada a cubrir una necesidad de difusión alternativa para el museo mexicano del Antiguo Colegio de San Ildefonso, complementando la labor de la página web y las visitas guiadas dentro del museo. Mediante el análisis de los factores contextuales del Antiguo Colegio de San Ildefonso y sus posibilidades de acción, éste medio de difusión se tradujo en un CD-ROM interactivo de distribución gratuita dentro del museo. Dicho proyecto se compone de información textual, imágenes y videos de apoyo.

El contenido del CD-ROM se organizó en 5 categorías o secciones: Historia, Arquitectura, Murales, El museo y "Extras", las cuales se encuentran interconectadas unas con otras. Ésto se definió desde el comienzo para que el desarrollo de la interfaz de usuario estuviera orientado a este factor de usabilidad.

The contents of the CD-ROM are organized into five categories closely connected to one another: History, Architecture, Paintings, The museum, and Extras. The close related connection among those categories was designed to allow the user's interface  to be interactively manageable.  
Diagrama básico de la interfaz gráfica de usuario.
Basic diagram of the graphical user interface.

El programa contenido en el disco se inicia con una breve animación que simboliza la importancia del Antiguo Colegio de San Ildefonso a través del tiempo, mostrando imágenes de los murales mas representativos así como de la arquitectura en general.

The program starts up with a short animation clip on the importance of the Antiguo Colegio de San Ildefonso through the time, and it contains images of the most representative paintings as well as the architecture of the building. 
Cada sección se distingue por el uso de un fondo de color y una imagen alusiva al tema, de forma que cada una de estas partes posee identidad propia dentro del conjunto que es el programa en general. Las formas utilizadas para la interfaz de usuario responden a una síntesis y abstracción de los elementos arquitectónicos barrocos del inmueble en el que se encuentra el museo.

Each category is distinguished by using specific backgrounds as well as a related image of the themes. Therefore, each section owns a unique identity in the whole set of the program. 
The idea of the  shape-design  in the user's interface came out from synthesis and abstraction elements from the baroque architecture of the museums building. 
Renders de la propuesta de empaque del CD-ROM, de tipo sobre impreso en selección de color.
CD-ROM package design proposal renders.
Para el trabajo impreso también realicé el diseño editorial. Cabe recalcar que durante la investigación consulté gran parte de las tesis sobre diseño gráfico multimedia existentes en la biblioteca de la universidad, y me topé con la desagradable sorpresa de que la importancia que se le da a este aspecto de identidad gráfica en los trabajos impresos es algo carente por parte de muchos diseñadores. Veo este trabajo como una pequeña contribución de parte mía a promover un mayor interés y atención en el diseño gráfico del material que compone este acervo.

I worked on the editorial design of the printed material. It is worth mentioning that during the research I looked up an extensive amount of the existing thesis about multimedia graphic design from the university's library, and I ran into the unpleasant surprise that the aspect of graphic identity on the printed material is lacking of importance from many designers. Thus, I conceive this work as my small contribution to promote a growing interest on the graphic design of the material that constitutes this heritage. 
Estas son algunas capturas de pantalla de la presentación utilizada durante mi examen profesional. Se trata de una animación seccionada en videos de corta duración, esto para poder hacer pausas de acuerdo a los puntos que había que recalcar. El concepto sugiere una "línea guía" que lleva hacia las diferentes secuencias y se mantiene un aspecto visual simple en cuanto a composición y colores. Se le agregó un efecto granulado para darle un toque orgánico, como el de un proyector de cine.

Those are some screen shots taken from my graduation exam. It is an animation divided into short clips in order to make pauses according to the information to point out. This concept suggests a guidelines which leads towards the different sequences keeping a simple visual feature regarding  composition and colors.  As an attempt to give an organic touch, a granulated effect was added, like a film projector. 
Tesis - Antiguo Colegio de San Ildefonso
Published: