Presentacion Final Modding

UNIVERSIDAD CENTRAL DE CHILE
ESCUELA DE INGENIERÍA CIVIL EN COMPUTACIÓN E INFORMÁTICA
FACULTAD DE CIENCIAS FÍSICAS Y MATEMÁTICAS

Proyecto de Título:

Algoritmo Matemático De Vitruvio.
Ricardo Blas Medina Castañeda Presentador
Julio Andrés Fuentealba Vivallo Profesor Guía
Nina Valdivia Arenas Profesor Informante
Leoncio Rubén Jiménez Candía Profesor Informante
@__blas

http://www.linkedin.com/in/blasmedina

Agenda.

 Resumen.

 Introducción.

 Antecedentes.

 Marco Teórico.

 Desarrollo.

 Algoritmo
Matemático De
Vitruvio.

 Conclusiones.

Algoritmo Matemático De Vitruvio @ Tema

Proyecto.rar

Hombre
Vitruvio

Algoritmo De
Número Vitruvio En
Áureas
WEBGL

Análisis
Matemático


Había Una Vez…

2009 FashionClick

Algoritmo Matemático De Vitruvio 2011


Había Una Vez…

¿Cómo sería la experiencia de
usuario si las gráficas y
efectos computaciones que se
conocen en videojuegos o
software de diseño gráfico se
integran dentro de una página
web?


¿En Que Consiste El Proyecto?

1) Utilizando el dibujo de “Hombre de
Vitruvio” como base para encontrar
funciones matemáticas que
represente las extremidades del
cuerpo,

2) Agrupar la funciones matemáticas
en un algoritmo matemático,

3) E Implementar dicho algoritmo
en WebGL.


¿Porqué Se Realiza El Proyecto?

{data}

¿Porqué Se Realiza El Proyecto?

a) Análisis sobre el d) Comprobación de
desempaño de que los browser
los browser con pueden ser
respecto a las utilizados como
nuevas CAD.
tecnologías
gráficas. e) Comprobación
que es posible
b) Análisis crear un
matemático de algoritmo
las proporciones matemático
áureas. para generar
modelo
c) Análisis sobre la tridimensionales
geometría del de cuerpo
Hombre de humano.
Vitruvio.


¿Que Pretende Realizar El Proyecto?

◊ OBJETIVO GENERAL ◊

“Crear Un Algoritmo Matemático
Modelos
Para La Generación De
Tridimensionales Del Cuerpo
Humano Basado En El Dibujo Del
Hombre De Vitruvio De Leonardo
Da Vinci Y Las Proporciones
Áureas”



◊ OBJETIVOS ESPECÍFICOS ◊

a) Identificar las aplicaciones utilizadas para
el diseño bidimensional y
tridimensional de objetos y/o personas.

b) Estudiar los métodos o técnicas de
dibujo computacionales utilizados por los
sistemas de diseño asistido por computadora
(CAD).

c) Establecer las tecnologías y
herramientas gráficas disponibles para los
desarrolladores de sistemas web.




d) Analizar los comportamientos
geométricos del cuerpo humano utilizando el
dibujo del Hombre de Vitruvio creado por
Leonardo da Vinci.

e) Estudiar el número áureo y su relación
con el Hombre de Vitruvio.

f) Crear funciones matemáticas que
representen las partes del cuerpo humano
en un espacio tridimensional.




g) Identificar los browser más utilizados por
los usuarios de internet.

h)Analizar el desempeño de las nuevas
tecnología gráfica de los browser más
utilizados por los usuario.

i) Generar un modelo tridimensional del
cuerpo humano utilizando el algoritmo
matemático propuesto dentro de una
página web.


¿Como Se Van Llegar A Conseguir Los Objetivos?

Matemática en
Análisis Cálculo de
Hombre
Browser puntos claves
Vitruvio

Modelo en Cascada

El modelo de cascada es ampliamente utilizado para
el desarrollo de software por los empleados por el
Departamento de Defensa de EE.UU. y la NASA.


¿Como Se Van Llegar A Conseguir Los Objetivos?

Modelo en Cascada

Matemática en
Análisis Cálculo de
Hombre
Browser puntos claves
Vitruvio

Test HTML5 Geometría en el Plan de
dibujo modelamiento

Test WebGL Aplicación Programación del
Proporciones algoritmo
áureas
Identificar el
mejor browser Optimización del
Formulas
algoritmo
matemáticas

Optimización de
formulas



Analizar la geometría
del Hombre de
Vitruvio.

Plantear ecuaciones
matemáticas que
representen la geometría
del Hombre de Vitruvio.

Programar la
ecuaciones matemáticas
y generar un modelo
tridimensional
potencializado con
WebGL.


Numero Áureo

"Se dice que una línea recta
está dividida entre el extremo y
su proporcional cuando la línea
entera es al segmento mayor
como el mayor es al menor.“

EUCLIDES


Numero Áureo Y Su Relación Con La Serie De Fibonacci.

0 0 9 55 1,61764706
1 1 10 89 1,61818182
1 1 1 11 144 1,61797753
2 2 2 12 233 1,61805556
3 3 1,5 13 377 1,61802575
4 5 1,66666667 14 610 1,61803714
5 8 1,6 15 987 1,61803279
6 13 1,625 16 1597 1,61803445
7 21 1,61538462 17 2584 1,61803381
8 34 1,61904762 18 4181 1,61803406


Numero Áureo Y Su Relación Con La Serie De Fibonacci.

{Caracol Áureo}


¿Cuál Es El Mejor Browser Para Visualizar El Modelo?

Test
Test ACID3
HTML5

Test
WebGL

¿ Le mejor Browser?


Test ACID3
Numero de fallas Tiempo de ejecucion (seg)
2 1.82 6
1.7 5
1.8
5
1.6
1.36
1.4
4

FALLAS
SEGUNDOS

1.2 0.99 1.03 3
1 3
0.8
2
0.6
0.4
1
0.2 0 0 0
0 0
Google Opera Safari FireFox Internet
Chrome Explorar

http://acid3.acidtests.org/



Test HTML5
Internet Explorer

Safari

Opera

Mozilla Firefox

Google Chrome

0 50 100 150 200 250 300 350 400 450

Google Chrome Mozilla Firefox Opera Safari Internet Explorer
Scores 328 286 278 253 141
Bonus points 13 9 7 7 5

Puntos (scores)

http://html5test.com/



Test WebGL

http://cycleblob.com/



•Desempeño de
Test ECMAScript y DOM
Nivel 2 (tecnologías
ACID3 muy usadas en la
Web 2.0).

•Evaluación de los
Test diversos
HTML5 elementos del
HTML5.

Test •Renderizado de
WebGL modelo.


Matemático En El Hombre De Vitruvio.

Ecuaciones
identificadas en el Ecuaciones identificadas
Hombre de Vitruvio en el Hombre de Vitruvio
utilizando los apuntes utilizando proporciones
adjuntos con el aurea.
dibujo.

“El Hombre de Vitruvio fue realizado por
Leonardo da Vinci alrededor del año 1492 en
uno de sus diarios”


Matemático En El Hombre De Vitruvio.

Ecuaciones Áureas Ec9 = Ec3
Ec5 = Ec2
Ec10 = Ec4
Ec1
Ec7 = Ec4
Ec6 = Ec3
Ec8
h
Ec11 = Ec4
Ec3
Ec12 = Ec8
Ec2
Ec13 = Ec8
Ec4
Ec14


Ecuaciones Áureas.

Ea1 Ecuaciones Áureas
h Ea3
Ea2 Ea5 Optimizadas
Ea4 Ea7
Ea6 Ea9
Ea8
Ea10 Ea11


Ecuaciones Áureas.

Ecuación recurrente
generadora de proporciones
áureas.

Nombre i Valor Aprox. (%)
Ea1 1 61,8% * h
Un fractal es un objeto semi-
Ea2 2 38,2% * h
geométrico cuya estructura
Ea3 3 23,6% * h básica, fragmentada o
Ea4 4 14,6% * h irregular, se repite a diferentes
Ea5 5 9,0% * h escalas.
Ea6 6 5,6% * h
Ea7 7 3,4% * h
Ea8 8 2,1% * h
Ea9 9 1,3% * h
Ea10 10 0,8% * h
Ea11 11 0,5% * h ≈ 1,6180

Cálculos De Puntos Claves.

(Salida)
Puntos de
los B-Spline

(Entrada) Puntos
Configuración
de variables claves

(3) Cálculo de
los puntos
claves de los
brazos

24 P.C.

B-Spline.

{ declaración de los b-sline }
Vista desde el Frente Vista desde Atrás

80 B-SPLINE


Mapa de variables de los puntos en los B-Spline.

Puntos semejante: Punto espejo:
A6 – B3 A2 – B1
A10 – B7 A5 – B4
A9 – B8
A12 – B11


Mapa de variables de los puntos en los B-Spline.

PUNTOS ANCLAJES

SPLINE 1 2 3 6 7 10 11 12

1 0 0 0

2 S1 P1 0 S1 P3 0 S1 P7 S1 P11

5 S1 P11 S1 P12 S1 P7 S1 P10 0 0

6 S2 P11 S2 P12 S2 P7 S5 P3 0 S5 P7 PUNTOS ANCLAJES
S5 P11

9 S5 P11 S5 P12 S5 P7 S5 P10SPLINE 0 1 0 2 3 0 6 7 10 11 12
PUNTOS ANCLAJES 1 0 S9 P11 0 0 0
10 S6 P11 S6 P12 S6 P7 S9 P3 0 S9 P7
SPLINE 1 2 3 6 7 10 11 S1 12
13 S9 P11 S9 P12 S9 P7 S9 P10 2 0 0 0 P1 0 0 S1 P3 S1 P7 0 0
1 0 0 50 0
S1 P11 P7 S1 P12 S1 P7 P11S1 P10 0 0 0
14 S10 P11 S10 P12 S10 P7 S13 P3 0 S13 S13
2 0 S1 P1 S1 P3 S1 P7 0 S1 P11
17 S13 P11 S13 P12 S13 P7 S13 P10 6 0 S2 P11 S2 P12 S2 P7 0 S5 P3 S5 P7 0 S5 P11
5 S1 P11 S1 P12 S1 P7 S1 P10 90 0 S5 P11 P7 S5 P12 S5 P10 0 0
18 S14 P11 S14 P12 S14 P7 S17 P3 S17 S17 P11
6 S2 P11 S2 P12 S2 P7 S5 P3 S5 P7 0 S5 P11
21 S17 P11 S17 P 12 S17 P7 S17 P10 10 0 S6 P11 S6 P12 S6 P7 0 S9 P3 S9 P7 0 S9 P11
9 S5 P11 S5 P12 S5 P7 S5 P10 0 0
22 S18 P11 S18 P12 0 S21 P3 13 0 S9 P11 P7 S9 P12 0
S21 S9 P7 P11S9 P10
S21 0 0
10 S6 P11 S6 P12 S6 P7 S9 P3 0 S9 P7 0 S9 P11
14 S1 P10S10 P11 0 S10 P12 P12 S10 P7 S13 P3 S13 P7 0 S13 P11
101 S1 P2 S1 P6 0 S1
13 S9 P11 S9 P12 S9 P7 S9 P10 0 0
17 S5 P10S13 P11 0 S13 P12 S13 P7 S13 P10 0 0
102 S101 P11 S101 P12 S5 P6 S101 P10
14 S10 P11 S10 P12 S10 P7 S13 P3 0 S13 P7 S14 0 S13 P11
18S101 P10 P11 0 S14 P12 P12 P7 0 S17 P3
103 S101 P2 0 S101 P6 0 S101 S14 S17 P7 0 S17 P11
17 S13 P11 S13 P12 S13 P7 S13 P10 0 0
21S102 P10 P11 0 S17 PS102 P12 P7 0 S17 P10
S17 12 S17 0 0
104 S102 P2 0 S102 P6 0
18 S14 P11 S14 P12 S14 P7 S17 P3 0 S17 P7 0 S17 P11
301 S21 P11 S21 P12 S21 P7 S21 P10 22 0 S18 P11 0 S18 P12 0 S21 P3 S21 P7 0 S21 P11
21 S17 P11 S17 P 12 S17 P7 S17 P10 0 0 0
302 S22 P11 S22 P12 S22 P7 S301 P3 101 S1 P2S301 P7 0 0 S1 P6
S301 P11 0 S1 P10 S1 P12 0
22 S18 P11 S18 P12 0 S21 P3 0 S21 P7 S21 P11
303 S301 P11 S301 P12 S301 P7 S301 P10 102 0 S101 P11 S101 P12 S5 P6 0 S101 P10 S5 P10 0 0
101 S1 P2 0 S1 P6 S1 P10 0
103 S1 P12
S101 P2 P7 0 S101S303 P11 0
P6 S101 P10 S101 P12 0
304 S302 P11 S302 P12 S303 P3 S303 0
102 S101 P11 S101 P12 S5 P6 S101 P10 S5 P10 104 S1020P2 00 S102 P6 0 S102 P10 0 S101 P12 0
103 S101 P2 0 S101 P6 0 S101 P10 0
301 S101 P12
S21 P11 0
S21 P12 S21 P7 S21 P10 0 0
104 S102 P2 0 S101 P6 0 S102 P10 302 S102 P12
S22 P11 0
S22 P12 S301 P3 S301 P7 0 S301 P11
301 S21 P11 S21 P12 S21 P7 S21 P10 0
303 S301 0
P11 S301 P12 S301 P7 S301 P10 0 0
302 S22 P11 S22 P12 S22 P7 S301 P3 0 S301 P7
304 S302 P11 S301 P11
S302 P12 S303 P3 S303 P7 0 S303 P11
303 S301 P11 S301 P12 S301 P7 S301 P10 0 0

304 S302 P11 S302 P12 0 S303 P3 0 S303 P7 S303 P11

10.240 VARIABLES



Configuración de las variables.
• Altura del modelo.

Calculo de los P.C. para la estructura
ósea.
• Puntos AX BX CX DX EX.

Calculo de los P.C. para la estructura
muscular.
• Puntos AA AB AC AD AJ AH AG AE AF
BA BB BJ BK CA CB CJ CK DA DB DC
DD EA EB EC ED.

APROX. Declaración de los B-Spline.
30.720 • Spline Delanteros
VARIABLES • Spline Traseros


Esquema de la implementación.

HTML • Contiene el elemento
HTML5 <Canvas>

• Calcula todos los puntos
PHP claves para Vitruvio 3D
(Algoritmo Vitruvio)

JavaScript • Crea el modelo de Vitruvio
3D en WebGL

• Genera modelo
WebGL tridimensional del
Hombre Vitruvio


Implementación.

La primera
implementación
del algoritmo
matemático es
realizada con la
ayuda de la librería
JavaScript “glge-
compiled.min” y
potencializada con
WebGL.


Implementación.

La segunda implementación del algoritmo
matemático es realizada con la ayuda de la
librería JavaScript “CanvasMatrix4”. y
potencializada con WebGL.


Con investigación, es posible concluir que…

 Utilizando la serie de Fibonacci, es
posible encontrar el valor de la
proporcionalidad áurea y generar
proporciones áureas por medio de la
siguiente ecuación:

 Utilizando tecnologías como HTML5 y
WebGL es posible ocupar el
browser Google Chrome como aplicación
CAD.


Con investigación, es posible concluir que…

 La tecnología WebGL no esta
estandarizada en todo los
browser, solo está en Google
Chrome, Mozilla Firefox y Safari
(versión OsX).

 Es posible crear modelos
tridimensionales de cuerpos humanos
utilizando solo proporciones
áureas.


UNIVERSIDAD CENTRAL DE CHILE
ESCUELA DE INGENIERÍA CIVIL EN COMPUTACIÓN E INFORMÁTICA
FACULTAD DE CIENCIA FÍSICA Y MATEMÁTICA


Presentacion Final Modding

Recomendados

Recomendados

Más contenido relacionado

Similar a Presentacion Final Modding

Similar a Presentacion Final Modding (20)

Presentacion Final Modding