el arte de la caja de cosas perdidas
DESCRIPTION
Proceso creativo para la creación del libro interactivo La Caja de Cosas Perdidas, disponible en el App Store para iPad.TRANSCRIPT
El arte de
©2012 — Ding Dong StudiosTodos los derechos reservados. Queda prohibida la reproducción total o parcial de todos los contenidos de este sitio bajo cualquier método incluídos el tratamiento digital sin la previa y expresa autorización por escrito de los titulares del copyright.
Este libro fue diseñado utilizando Kreon Light para su publicación digital.
Ding Dong StudiosEl arte de La Caja de Cosas Perdidas
Monterrey, Nuevo León; México. 2012
10 9 8 7 6 5 4 3 2 1
El arte de La Caja de Cosas Perdidas
5
Dedicamos nuestro esfuerzo y trabajo a cada una de nuestras familias. A aquellos que nos acompañaron, ayudaron y se preocuparon junto a nosotros en el desarrollo
de La Caja de Cosas Perdidas.
Especialmente a José Alberto Ruiz, quien permanecerá siempre en nuestros corazones.
El arte de La Caja de Cosas Perdidas
6
El arte de La Caja de Cosas Perdidas
7
Este libro es el resumen de un año de trabajo, aprendizaje, descubrimientos y experien-cias que nos han transformado como personas y profesionistas. La Caja de Cosas Per-didas nació de la idea de integrar nuestras pasiones y conocimientos con la tecnología y nuevas tendencias. La historia es una invitación a la aventura, a confiar en uno mismo y a recordar que las personas que queremos siempre se quedarán en nuestro corazón.
La Caja de Cosas Perdidas cobró vida gracias a Meli, Kiki, Pal, Maricarmen y Daniel, que lograron capturar la escencia de sus personajes y el mundo en el que se desenvuelven y a Silvia, por documentar y formalizar el proceso y su distribución. También a Naty Cebrián por darle la voz que nos acompaña en esta aventura.
Sin duda, este año nos deja una gran lección de vida, de sacrificios y aprendizajes, de superar nuestras expectativas y la de los demás, de reforzar nuestra amistad y de cum-plir un sueño.
Esperamos que al ver las siguientes páginas reconozcan la evolución de nuestro trabajo y enriquezca su experiencia al disfrutar de la aplicación La Caja de Cosas Perdidas.
¡Gracias!Ana Lucía Villegas
Directora
El arte de La Caja de Cosas Perdidas
8
El arte de La Caja de Cosas Perdidas
9
Diseño de Personajes
Diseño de personaje: Melissa DávilaModelado 3D: Paloma LealRigging: Jaime GarzaAnimación: Maricarmen Villarreal, Daniel GonzálezShading: Daniel González
Nina como chef, fotógrafa y científica. Variación de estilos de ojos.
Nina es definitivamente el personaje de La Caja de Cosas Perdidas que más cambios tuvo desde su concepción hasta el resultado final. Queríamos crear una niña amigable, curiosa y muy activa, con un rostro memorable.A continuación les mostramos la evolución de Nina, desde los primeros bocetos hasta los renders finales.
El arte de La Caja de Cosas Perdidas
12
El arte de La Caja de Cosas Perdidas
13
Al final Nina es una niña más grande, alta con un distintivo suéter con su inicial al frente y botas altas amarillas.Nina conserva la esencia que tenía en su conceptualización como el cabello rojizo, su suéter y sus ojos tiernos.
El arte de La Caja de Cosas Perdidas
14
El arte de La Caja de Cosas Perdidas
15
Del 2D al 3D
Vistas frontal y laterales de la geometría en wireframe (arriba) y oclusión ambiental (abajo)
El arte de La Caja de Cosas Perdidas
16
El arte de La Caja de Cosas Perdidas
17
Para hacer los renders de Nina dividimos la textura en tres partes: cuerpo (izquierda), rostro (centro) y cabello (derecha)
Además, dado que la geometría no tiene los elementos faciales, los mantuvimos como parte importante de la textura del rostro, así si quería-mos una determinada expresión, sólo era cuestión de “cambiarle la cara” a Nina
El arte de La Caja de Cosas Perdidas
18
La mamá está diseñada en base a la versión final de Nina. Sigue el mismo estilo de geometría, con un tono de cabello similar y las mismas piernas largas. A diferencia de Nina, el cuerpo de la mamá está diseñado para parecerse más al de una mujer.
Diseño de personaje: Melissa DávilaModelado 3D: Paloma LealRigging: Maricarmen VillarrealAnimación: Daniel GonzálezShading: Daniel González
El arte de La Caja de Cosas Perdidas
19
El arte de La Caja de Cosas Perdidas
20
Del 2D al 3D
Vistas frontal y laterales de la geometría en wireframe (arriba) y oclusión ambiental (abajo)
El arte de La Caja de Cosas Perdidas
21
En el caso de la mamá de Nina fueron necesarios sólamente dos texturas, una para el cuerpo y otra para el rostro y cabello.
Las expresiones se hicieron de la misma manera que Nina.
El arte de La Caja de Cosas Perdidas
22
Henry es un cocinero amigable y extravagante. Representa la de-spreocupación de la niñez. Para este personaje buscábamos que su cuerpo grande y su sonrisa enorme lo asimilaran a un pastelillo gi-gante. La expresión facial de Henry expresa la felicidad de trabajar en lo que a uno le gusta.Diseño de personaje: Melissa Dávila /
Kiki VillarrealModelado 3D: Paloma LealRigging: Maricarmen VillarrealAnimación: Daniel González Maricarmen VillarrealShading: Daniel González
El arte de La Caja de Cosas Perdidas
24
Del 2D al 3D
Vistas frontal y laterales de la geometría en wireframe (arriba) y oclusión ambiental (abajo)
El arte de La Caja de Cosas Perdidas
25
Texturas y expresiones.
El arte de La Caja de Cosas Perdidas
26
El arte de La Caja de Cosas Perdidas
27
El arte de La Caja de Cosas Perdidas
28
Lis es una fotógrafa reservada e independiente. Con sus fotogra-fias representamos la parte cultural de la historia. Con ella quisimos mostrar la importan-cia de compartir lo que a uno le gusta. Lis, con su aspecto alto y delgado se convierte en una chica de la ciudad.
Diseño de personaje: Melissa Dávila Daniel GonzálezModelado 3D: Paloma LealRigging: Maricarmen VillarrealAnimación: Daniel González, Maricarmen VillarealShading: Daniel González
El arte de La Caja de Cosas Perdidas
29
Izquierda: Referencias de modelación.
Abajo: Pruebas de color para determinar la ropa de Lis.
El arte de La Caja de Cosas Perdidas
30
Del 2D al 3D
Vistas frontal y laterales de la geometría en wireframe (arriba) y oclusión ambiental (abajo)
El arte de La Caja de Cosas Perdidas
31
Texturas y expresiones.
El arte de La Caja de Cosas Perdidas
32
El arte de La Caja de Cosas Perdidas
33
El arte de La Caja de Cosas Perdidas
34
Diseño de personaje: Melissa Dávila Anie VillegasModelado 3D: Paloma LealRigging: Maricarmen VillarrealAnimación: Daniel González Maricarmen VillarrealShading: Daniel González
Tino es un científico carismático e hiperactivo que con su tamaño cautiva a los demás. Con él quisimos representar la pasión por hacer lo que a uno le gusta y por eso mismo la frustración de a veces no poderlo lograr.
El arte de La Caja de Cosas Perdidas
35
Izquierda: Tino era origi-nalmente mucho más alto que la versión final.
Abajo: Referencia de modelación de la versión final de Tino.
El arte de La Caja de Cosas Perdidas
36
Del 2D al 3D
Vistas frontal y laterales de la geometría en wireframe (arriba) y oclusión ambiental (abajo)
El arte de La Caja de Cosas Perdidas
37
Texturas y expresiones.
El arte de La Caja de Cosas Perdidas
38
El arte de La Caja de Cosas Perdidas
39
El arte de La Caja de Cosas Perdidas
40
El abuelo de Nina es el único personaje que no hicimos en 3D ya que no aparece activa-mente en la historia, a pesar de ser el más apegado a Nina y parte crucial del desarrollo de
Nina y su abuelo compartieron muchos momentos bonitos juntos antes de que nuestra historia comenzara.
El arte de La Caja de Cosas Perdidas
42
El arte de La Caja de Cosas Perdidas
43
La historia de “La Caja de Cosas Perdidas” se desarrolla en el edificio de apartamentos donde vivía el abuelo de Nina. A lo largo del cuento vamos conociendo todos los espacios donde Nina se aventura,
y cada uno de los diferentes departamentos está diseñado acorde al personaje que lo habita.
Así pues, tenemos un gran laboratorio donde Tino hace sus experimentos, una cocina desordenada donde Henry prepara pasteles y un estudio muy limpio donde Lis trabaja en sus fotografías.
A continuación les presentamos los espacios de “La Caja de Cosas Perdidas”
Diseño de Espacios Ilustraciones: Kiki Villarreal
Asistentes: Melissa Dávila y Anie VillegasStoryboard: Melissa Dávila y Kiki Villarreal
El arte de La Caja de Cosas Perdidas
44
El arte de La Caja de Cosas Perdidas
45
En el edificio de departamentos donde vivía el abuelo hay muchos vecinos particulares y sabemos quiénes son por sus tapetes de bienvenida.
De izquierda a derecha: una fotógrafa, un científico, un chef, un artista y un músico.
Edificio de departamentos
El arte de La Caja de Cosas Perdidas
46
Manejo de capas Para darle un sentido de unidad y ambiente a las escenas trabajamos con un largo proceso de capas donde cada capa aporta algo a la forma, iluminación y textura de la escena.
El arte de La Caja de Cosas Perdidas
47
El arte de La Caja de Cosas Perdidas
48
Proceso de capas para la cocina de Henry.
El arte de La Caja de Cosas Perdidas
49
La cocina de Henry.
El arte de La Caja de Cosas Perdidas
50
El laboratorio de Tino (arriba) y el estudio de Lis por capas (derecha).
El arte de La Caja de Cosas Perdidas
52
Esquema de colores
Cada capítulo tiene su propia paleta de colores, acorde a la personalidad de los personajes que habitan en cada departamento.
El arte de La Caja de Cosas Perdidas
53
Las fotografías que Lis ha tomado en sus viajes, parte del juego de encontrar diferen-cias en el capítulo de Lis.
El arte de La Caja de Cosas Perdidas
54
El arte de La Caja de Cosas Perdidas
55
Utilería de los distintosdepartamentos.
Juegos y actividades
Uno de los elementos más divertidos de La Caja de Cosas Perdidas son sus juegos y actividades.
Estos fueron construidos utilizando el mismo sistema de manejo de capas que el resto de las escenas y cada uno de los elementos interactivos es independiente del resto.
Izq: El desordenado apartamento del abuelo, ayuda a Nina a encontrar los obje-tos que necesita.
El arte de La Caja de Cosas Perdidas
58
Arriba: Sketch rápido del acomodo de los elemen-tos en el juego.
Derecha: Los elementos del juego para hacer pasteles.
Página siguiente: Layout final del juego.
El arte de La Caja de Cosas Perdidas
59
Del storyboard al iPad
Izquierda: El Storyboard com-pleto de La Caja de Cosas Per-didas fue dibujado a lápiz y en papel, considerando la ori-entación de cada ilustración. Algunas son verticales y otras horizontales.
Derecha: Comparación del dibujo de storyboard hasta la ilustración final como aparece en el iPad.
El arte de La Caja de Cosas Perdidas
62
El arte de La Caja de Cosas Perdidas
63
El arte de La Caja de Cosas Perdidas
64
El arte de La Caja de Cosas Perdidas
65
“Brilla como una estrella en medio del cielo, pues somos parte de una constelación.”
El arte de La Caja de Cosas Perdidas
66
El arte de La Caja de Cosas Perdidas
67
Imagen
Estudios de Layout
Hicimos varias pruebas para determinar el layout final que queríamos en la aplicación.
Derecha: Layout oficial.
El arte de La Caja de Cosas Perdidas
69
El arte de La Caja de Cosas Perdidas
70
Pruebas de página de bienvenida para la aplicación.
Derecha: Página de bienvenida oficial.
El arte de La Caja de Cosas Perdidas
71
El arte de La Caja de Cosas Perdidas
72
Diseñamos una tipografía para utilizar al inicio de cada una de las páginas del libro.
Derecha: Kreon, tipografía auxiliar.
El arte de La Caja de Cosas Perdidas
73
Kreon LightAa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp Qq Rr Ss Tt Uu Vv Ww Xx Yy Zz0 1 2 3 4 5 6 7 8 9
Kreon RegularAa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp Qq Rr Ss Tt Uu Vv Ww Xx Yy Zz0 1 2 3 4 5 6 7 8 9
Kreon LightAa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp Qq Rr Ss Tt Uu Vv Ww Xx Yy Zz0 1 2 3 4 5 6 7 8 9
El arte de La Caja de Cosas Perdidas
74
Logotipo
cosas
El arte de La Caja de Cosas Perdidas
75
Izquierda: Estudios de logotipos.
Arriba: Logotipo oficial.
El arte de La Caja de Cosas Perdidas
76
El arte de La Caja de Cosas Perdidas
77
Programación Programación: Anie VillegasDiseño de Interacción: Silvia López Anie Villegas
La caja de cosas perdidas está programada en Xcode utilizando cocos2d, un framework experto en crear juegos 2d y aplicaciones interactivas.
El desarrollo de la misma fue apoyado por los foros especializados en estas herramientas.
Actualmente es compatible con iOS6.
El arte de La Caja de Cosas Perdidas
78
Animación por sprites
Las animaciones que aparecen en La Caja de Cosas Perdidas sigui-eron un proceso diferente a la animación tradicional, ya que las
imagenes se despliegan a través de código computacional.
Después de animar a los personajes en 3D en Autodesk Maya, se texturizaron y se renderizaron con el acabado que tienen. De todos los cuadros que se renderizaron, seleccionamos los más distintivos
de la acción y esos se pusieron en una hoja de sprites, con la cual se despliegan en el iPad a través de código.
El arte de La Caja de Cosas Perdidas
79
El arte de La Caja de Cosas Perdidas
80
El arte de La Caja de Cosas Perdidas
81
Botones e indicadores
El arte de La Caja de Cosas Perdidas
82
Música y Sonido Diseño Sonoro: Paloma Leal Charles
Música original: Paloma Leal CharlesNarración: Naty Cebrián
La Caja de Cosas Perdidas cuenta con piezas musicales originales, efectos de sonido y una narradora que
cuenta la historia haciendo las voces de todos los personajes.
El arte de La Caja de Cosas Perdidas
83
Naty Cebrián, narradora de La Caja de Cosas Perdidas
Piezas musicales:
— Nina Detective— Descubriendo la luz— Capturando momentos— Brillando como una constelación— Siempre Conmigo — Parte de la Aventura — La Caja de Cosas Perdidas
El arte de La Caja de Cosas Perdidas
84
Silvia López GuerraImagen y MercadotecniaDiseño de Interacción
Paloma Leal CharlesMúsica original y Diseño sonoro
Dirección de NarrativaModelación 3D
Daniel González SánchezProducción
Textura, Sombreado, Iluminación y Animación 3D
Ana Lucía Villegas GonzálezDirección
ProgramaciónDiseño de Interacción Asistente de Ilustración
Créditos
El arte de La Caja de Cosas Perdidas
85
Kiki Villarreal ArmendaizDirección de Arte y Storyboard
IlustraciónAnimación 2D
Melissa Dávila MontemayorDirección de Arte y Storyboard
IlustraciónDiseño de Personajes
Maricarmen Villarreal SáenzAnimación 2D
Animación y Modelación 3DRigging
Naty Cebrián Narración
Jaime Garza Rigging
Agradecimientos Adrián Cantú
Cecilia VillegasGabriel MagallónAlonso BocanegraErnesto VillegasHéctor RamírezGermán VázquezHernán Martínez
Jesús TreviñoJosé Luis RodríguezMoraima Campbell
Oscar KaiPablo RamírezRené Allegretti
Juan Carlos Aguado
Créditos
Hecho en México
Monterrey, Nuevo León.
“La Caja de Cosas Perdidas” es un cuento interactivo para tabletas móviles escrito, producido, diseñado y programado en su
totalidad por estudiantes mexicanos.
©2012
www.lacajadecosasperdidas.com