Jugant amb les · PDF fileArt: fotogametria K i t e (2 0 1 5) C e s i u m J S B e y o n d: T w...

40
Jugant amb les matemàtiques GAME JAM 2016 Jordi Campos Miralles PhD. http://jordicamposmiralles.wordpress.com @submariblau

Transcript of Jugant amb les · PDF fileArt: fotogametria K i t e (2 0 1 5) C e s i u m J S B e y o n d: T w...

Page 1: Jugant amb les · PDF fileArt: fotogametria K i t e (2 0 1 5) C e s i u m J S B e y o n d: T w o S o u l s (2 0 1 3) Art: fotogrametria

Jugant amb les

matemàtiques

GAME JAM 2016

Jordi Campos Miralles PhD.http://jordicamposmiralles.wordpress.com

@submariblau

Page 2: Jugant amb les · PDF fileArt: fotogametria K i t e (2 0 1 5) C e s i u m J S B e y o n d: T w o S o u l s (2 0 1 3) Art: fotogrametria

Intro

Abundants enllaços (per ampliar la informació)

Activitats bàsiques amb Snap!

(s'assumeix coneixements d'Scratch)

Dirigit a un gran ventall d'edats(esperit divulgatiu)

Page 3: Jugant amb les · PDF fileArt: fotogametria K i t e (2 0 1 5) C e s i u m J S B e y o n d: T w o S o u l s (2 0 1 3) Art: fotogrametria

Mapa

GràficsGràfics MúsicaMúsica

ServidorServidor

FísicaFísica

IAIA

InterfícieInterfície

Mecàn.Mecàn.ArtArt

GeneralGeneral

On estan presents

les matemàtiques

als videjocs?

Page 6: Jugant amb les · PDF fileArt: fotogametria K i t e (2 0 1 5) C e s i u m J S B e y o n d: T w o S o u l s (2 0 1 3) Art: fotogrametria

EvolucióT

RS

80

Ass

emb

ly L

ang

uag

e (1

97

9)

En

gin

es:

Cry

/ U

nre

al /

Un

ity.

..

Bre

sen

ham

's li

ne

alg

ori

thm

x

y

5

5

Page 7: Jugant amb les · PDF fileArt: fotogametria K i t e (2 0 1 5) C e s i u m J S B e y o n d: T w o S o u l s (2 0 1 3) Art: fotogrametria

Mapa: General

GràficsGràfics MúsicaMúsica

ServidorServidor

FísicaFísica

IAIA

InterfícieInterfície

Mecàn.Mecàn.ArtArt

GeneralGeneral

Page 8: Jugant amb les · PDF fileArt: fotogametria K i t e (2 0 1 5) C e s i u m J S B e y o n d: T w o S o u l s (2 0 1 3) Art: fotogrametria

General: Al-Khwarizmi A

l-K

hw

ariz

mi (

s.IX

): T

he

Inve

nto

r O

f A

lge

bra

by

C.B

rezi

na

(Ro

sen

Ce

ntr

al, 2

00

6)

Origen de les paraules:

Algorisme

Àlgebra

Al-Khwarizmi →Algoritmi →

Algorisme

Al-jabr → (juntar parts trencades)

Àlgebra

الخوارزمی

Co

mp

en

di d

e c

àlcu

l per

re

inte

gra

ció

y c

om

par

ació

الجبر

Page 9: Jugant amb les · PDF fileArt: fotogametria K i t e (2 0 1 5) C e s i u m J S B e y o n d: T w o S o u l s (2 0 1 3) Art: fotogrametria

General: Àlgebra

f :ℝn→ℝ

x̄=∑i=1

n

x i

n

float mitj(float *X, int n){ int i; float suma;

i=1; suma=0; while ( i<=n ){ suma += X[i]; i++; } return suma/n;}

Àlgebra Programa

variables/

constants

tipus

operadors

funcions

lògica

Ari

stò

til (

s.IV

a.C

.)

Eucl

ide

s (s

.IV a

.C.)

→ LògicaAlgorisme de

la divisió ←

Page 10: Jugant amb les · PDF fileArt: fotogametria K i t e (2 0 1 5) C e s i u m J S B e y o n d: T w o S o u l s (2 0 1 3) Art: fotogrametria

General: Àlgebra

f :ℝn→ℝ

x̄=∑i=1

n

x i

n

float mitj(float *X, int n){ int i; float suma;

i=1; suma=0; while ( i<=n ){ suma += X[i]; i++; } return suma/n;}

Àlgebra ProgramaC

. Wo

lfra

m(2

01

2)

«programming [... is] the way you communicate technical ideas and processes in the modern world. [...] You can view it as a superset evolution of mathematical notation»co

mp

ute

rbas

ed

mat

h.o

rg

Ada Lovelace (s.XIX)

Page 11: Jugant amb les · PDF fileArt: fotogametria K i t e (2 0 1 5) C e s i u m J S B e y o n d: T w o S o u l s (2 0 1 3) Art: fotogrametria

General: Maquinari

Codi Binari

Portes Lògiques

Àlgebra de Bool

Ge

org

e B

oo

le (

s.X

IX)Nombres

pseudo-aleatòrisTª de Nombres / Matem. Discreta, Probabilitat, Estadística

Digitalització, Canvis de base, operacions base 2

Page 12: Jugant amb les · PDF fileArt: fotogametria K i t e (2 0 1 5) C e s i u m J S B e y o n d: T w o S o u l s (2 0 1 3) Art: fotogrametria

Mapa: Gràfics

GràficsGràfics MúsicaMúsica

ServidorServidor

FísicaFísica

IAIA

InterfícieInterfície

Mecàn.Mecàn.ArtArt

GeneralGeneral

Page 17: Jugant amb les · PDF fileArt: fotogametria K i t e (2 0 1 5) C e s i u m J S B e y o n d: T w o S o u l s (2 0 1 3) Art: fotogrametria

Gràfics: PBR

Physically Based RenderingPhysically Based Rendering for Artists

Pla

yCan

vas

We

bG

L

Page 18: Jugant amb les · PDF fileArt: fotogametria K i t e (2 0 1 5) C e s i u m J S B e y o n d: T w o S o u l s (2 0 1 3) Art: fotogrametria

Gràfics: activitats

Activitats

Trajectòries

Text de presentació

Conceptes: Funcions Nivell: 1r-2n ESO

Moviments

Traslacions, rotacions, escalats...

Conceptes: Tranformacions, MatriusNivell: BAT

Page 19: Jugant amb les · PDF fileArt: fotogametria K i t e (2 0 1 5) C e s i u m J S B e y o n d: T w o S o u l s (2 0 1 3) Art: fotogrametria

Mapa: Art

GràficsGràfics MúsicaMúsica

ServidorServidor

FísicaFísica

IAIA

InterfícieInterfície

Mecàn.Mecàn.ArtArt

GeneralGeneral

Page 20: Jugant amb les · PDF fileArt: fotogametria K i t e (2 0 1 5) C e s i u m J S B e y o n d: T w o S o u l s (2 0 1 3) Art: fotogrametria

Art

Imaginació

Far

Cry

Pri

mal

(2

01

6)

Page 22: Jugant amb les · PDF fileArt: fotogametria K i t e (2 0 1 5) C e s i u m J S B e y o n d: T w o S o u l s (2 0 1 3) Art: fotogrametria

Art: fotogrametria

Fo

t og

r am

et r i a

P r o j e c c i ó →

Ce

siu

m J

S

Th

e V

anis

hin

g o

f Et

han

Car

ter

Page 24: Jugant amb les · PDF fileArt: fotogametria K i t e (2 0 1 5) C e s i u m J S B e y o n d: T w o S o u l s (2 0 1 3) Art: fotogrametria

Art: Procedural Generation

Procedural Generation

Spee

dTr

ee

Mo

de

ler

Diamond-Square Alg.

Page 25: Jugant amb les · PDF fileArt: fotogametria K i t e (2 0 1 5) C e s i u m J S B e y o n d: T w o S o u l s (2 0 1 3) Art: fotogrametria

Art: activitat

ActivitatPaisatge

Interior d'una cova

Conceptes: FractalsNivell: 3r-4t d'ESO

- gran complexitat a partir d'un algorisme simple- autosimilitud a diferents escales

Fractals

Page 26: Jugant amb les · PDF fileArt: fotogametria K i t e (2 0 1 5) C e s i u m J S B e y o n d: T w o S o u l s (2 0 1 3) Art: fotogrametria

Mapa: Física

GràficsGràfics MúsicaMúsica

ServidorServidor

FísicaFísica

IAIA

InterfícieInterfície

Mecàn.Mecàn.ArtArt

GeneralGeneral

Page 27: Jugant amb les · PDF fileArt: fotogametria K i t e (2 0 1 5) C e s i u m J S B e y o n d: T w o S o u l s (2 0 1 3) Art: fotogrametria

Física

An

gry

Bir

ds

in t

he

phy

sics

cla

ssro

om

Wik

ipe

dia

4 Gravetat + Col·lisions + Rotacions

2 Gravetat + Col·lisions

2 Gravetat

1 Sense física

Dinàmica dels objectes

Page 28: Jugant amb les · PDF fileArt: fotogametria K i t e (2 0 1 5) C e s i u m J S B e y o n d: T w o S o u l s (2 0 1 3) Art: fotogrametria

Física

Bàsic Col·lisions Cossos rígids Cossos tous Fluids

Bullet Physics

Cry Engine

Creation Engine – Fallout 4

Page 29: Jugant amb les · PDF fileArt: fotogametria K i t e (2 0 1 5) C e s i u m J S B e y o n d: T w o S o u l s (2 0 1 3) Art: fotogrametria

Física

Caiguda de cossos: «Ragdoll physics»

Cinemàtica i Cinemàtica Inversa

Bàsic Col·lisions Cossos rígids Cossos tous Fluids

Phy

sica

lc

Gam

asu

tra

– S.

Yeu

ng

Dra

wlo

gic

.co

m

Page 31: Jugant amb les · PDF fileArt: fotogametria K i t e (2 0 1 5) C e s i u m J S B e y o n d: T w o S o u l s (2 0 1 3) Art: fotogrametria

Mapa: IA

GràficsGràfics MúsicaMúsica

ServidorServidor

FísicaFísica

IAIA

InterfícieInterfície

Mecàn.Mecàn.ArtArt

GeneralGeneral

Page 32: Jugant amb les · PDF fileArt: fotogametria K i t e (2 0 1 5) C e s i u m J S B e y o n d: T w o S o u l s (2 0 1 3) Art: fotogrametria

IA: EvolucióA

.Tu

rin

g (

19

50

)

Nim

rod

(1

95

1)

Intel·ligència Artificial

Dar

tmo

uth

C

on

fere

nce

(1

95

6)

De

ep

Blu

e (

19

97

)

Alp

ha

Go

(2

01

6)

Videojocs: heuristics, cheating, idiotic AI

Page 33: Jugant amb les · PDF fileArt: fotogametria K i t e (2 0 1 5) C e s i u m J S B e y o n d: T w o S o u l s (2 0 1 3) Art: fotogrametria

IA: bases

j1

j2

1

j2

2

j2

3

j2

4

j1

1

j1

2

j1

1

j2

1

j1

1

j1

2

j1

3

j2

1

j2

2

j2

1

j1

1

Versió simplificada del joc del Nin:

1 pila de 5 pedres

Mar

I/O

Retro-accióRetro-acció

EntornEntorn

AccionsAccions pròpiespròpies

Espai de cercaEspai de cerca

Les tècniques varien si coneixem:● tot l'entorn / una part● conseqüències / probabilitats● feedback instantani / ajornat● ...

Page 35: Jugant amb les · PDF fileArt: fotogametria K i t e (2 0 1 5) C e s i u m J S B e y o n d: T w o S o u l s (2 0 1 3) Art: fotogrametria

IA: Machine LearningM

arI/

O

Retro-accióRetro-acció

EntornEntorn

AccionsAccions pròpiespròpies

Machine LearningArbres de decisió

Xarxes Neuronals,Deep Learning...

R.P

en

ton

(Gam

ed

ev)

Forb

es

Page 36: Jugant amb les · PDF fileArt: fotogametria K i t e (2 0 1 5) C e s i u m J S B e y o n d: T w o S o u l s (2 0 1 3) Art: fotogrametria

Mapa: Interfície

GràficsGràfics MúsicaMúsica

ServidorServidor

FísicaFísica

IAIA

InterfícieInterfície

Mecàn.Mecàn.ArtArt

GeneralGeneral

Page 37: Jugant amb les · PDF fileArt: fotogametria K i t e (2 0 1 5) C e s i u m J S B e y o n d: T w o S o u l s (2 0 1 3) Art: fotogrametria

Altres àrees

Cyb

eri

thV

irtu

aliz

er

InterfícieMúsica

Servidor

Procedural

Co

nce

rt P

roce

du

ral

En

crip

taci

ó

Mecànica

Use

eco

no

mic

«g

ame

th

eo

ry»

to a

nal

ise

the

vid

eo

gam

e

des

ign

Kinect

Page 40: Jugant amb les · PDF fileArt: fotogametria K i t e (2 0 1 5) C e s i u m J S B e y o n d: T w o S o u l s (2 0 1 3) Art: fotogrametria

Crèdits

● Fonts:● Press Start 2P: http://www.fontspace.com/codeman38/press-start-2p ● Xolonium: http://www.fontspace.com/severin-meyer/xolonium

● Mapa: https://openclipart.org/download/215997/computer_inside.svg ● HAL: https://en.wikipedia.org/wiki/HAL_9000● 3D pipeline:

● http://www.xojo3d.com/tut002.php● http://www.lambdacube3d.com

● La majoria d'imatges enllacen a la font i/o tenen el nom relacionat al costat

Jordi Campos Miralles @submariblau

http://jordicamposmiralles.wordpress.com

Play2Learn project

Vídeos sobre Computació

Vídeos sobre Matemàtiques