Débuter la 3d avec flash

Flash affiche de la 3d depuis sa version cs5. Si vous n'avez pas de version assez récente de flash vous pouvez programmer avec flashdevelop et le compileur flex qui sont gratuits: http://www.flashdevelop.org/

flashdevelop est programmé en basic et flex en java, vous aurez donc besoin des machines msframework et java pour que ça tourne correctement


voici le tout premier des tutoriels d'adobe pour apprendre la 3d. dans ce premier tuto vous allez apprendre à dessiner un simple triangle

[Vous devez être inscrit et connecté pour voir ce lien]

pour apprendre l'assembleur agal vous aurez besoin de sa documentation officielle qui se trouve ici:

[Vous devez être inscrit et connecté pour voir ce lien]

je ne vais pas vous recopier toutes les explications du tuto, je vais me contenter de commenter les deux premiers programmes assembleur qui servent à afficher un triangle sans texture:

Code:

// vertex shader

 m44 op, va0, vc0
 mov v0, va1

// fragment shader

 mov oc, v0

Les shaders

Les shaders sont des programmes exécutés non pas par votre processeur central, mais par le processeur de la carte vidéo. Ils sont donc indispensables pour afficher de la 3d.

On les programme généralement dans deux langages proches du C: le GLSL pour opengl et le HLSL pour directx.

Adobe a choisi une solution multi-plateforme sous forme d'un langage assembleur très simple.


Seulement trois lignes pour calculer de la 3d ?

Les shaders sont des programmes très simples, car tous les calculs complexes sont sous-traités par une librairie graphique (directx, opengl, etc) qui sait calculer automatiquement les projections de matrice, ainsi que les interpolations entre points et pixels.


C'est quoi l'assembleur ?

L'assembleur est la syntaxe utilisée par les langages informatiques les plus primitifs.

Il s'agit de langages rudimentaires qui sont très facile à compiler, vous pouvez à ce propos jeter un oeil à la source du compileur agal. Leur syntaxe est en effet très proche du bytecode exécuté par le processeur.

Les langages assembleur sont beaucoup plus simples que vos langages habituels:

- pas de variables, tableaux, objets, etc... on utilise uniquement les adresses mémoire de le machine.
les assembleur utilisent deux types d'adresse mémoire: les registres qui sont la mémoire du processeur, et les adresses ram

agal est un assembleur très simple qui n'utilise que les registres

- pas de noms à rallonge, les instructions sont écrites en abrégé

- pas de if, for, etc... les assembleurs utilisent simplement des instructions jump, mais agal ne s'en sert pas

- pas de fonctions, à la place on utilise directement des instructions processeur

voici un exemple d'instruction:

Code:

mov vt1, vt0

l'instruction "mov" copie la valeur d'un registre dans un autre
ici on a copié le registre de Vecteur Temporaire zero dans le registre de vecteur temporaire un


Pour chaque shader vous devez réaliser deux petits programmes assembleur:

- un vertex shader qui s'occupe de calculer la projection des points dans l'espace

- un fragment shader qui s'occupe de calculer la couleur des pixels


étudions maintenant les deux programmes de notre exemple:

1/ le vertex shader

le vertex shader est appelé par chaque vecteur pour projeter sa position sur l'ecran

sur les cartes vidéo bas de gamme (particulièrement les téléphones mobiles) le vertex shader n'est pas exécuté par le processeur vidéo, il est exécuté par le processeur central. attention donc si vous ciblez ce type de machine, votre scène doit être "low-poly" c'est à dire afficher quelques gros polygones comme dans les vieux jeux

Code:

// vertex shader[size=14][/size]

 m44 op, va0, vc0
 mov v0, va1

la première instruction m44 est une projection de matrice, c'est grâce à ça qu'on projette les points dans l'espace 3d

cette instruction prend pour arguments:

1 - un registre dans lequel on stocke le vecteur projeté par la matrice

sur cet exemple le registre choisi est le registre "op", signifiant "output". cela veut dire que le résultat obtenu est renvoyé à la carte vidéo.


2 - un registre qui lit l'actuel point du vertexbuffer, un tableau de vecteurs stocké dans la mémoire vidéo. les registres qui lisent ces points un par un s'appellent des "registres d'attributs". un vertex hardware est composé de plusieurs sous-vecteurs qui sont ses "attributs", en règle générale un vecteur de position spatiale et plusieurs vecteurs de uv-mapping pour les différentes couches de texture. sur notre exemple chaque sommet n'a que deux attributs: un vecteur position et un vecteur de couleur.

sur cet exemple le premier attribut (position spatiale) est dans le registre va0, soit "vector attribute 0"

les vertexBuffers sont passés au shader par la méthode setVertexBufferAt()


3 - un registre qui stocke la matrice (ATTENTION les matrices font 4 vecteurs, il faut donc sauter trois registres avant d'utiliser le suivant). Il s'agit d'un "registre de constante", car la matrice est constante sur la totalité des points du vertexbuffer

sur cet exemple le registre s'appelle vc0, soit "vector constant zero"

les matrices constantes sont passées au shader par la méthode setProgramConstantsFromMatrix();




La seconde instruction "mov" copie une couleur. Elle prend deux arguments:

1 - le registre de vecteur "v0" qui signifie "vary". Ces registres servent à assurer la communication entre le vertex shader et le fragment shader, qui va récupérer cette valeur interpolée par la carte graphique en fonction de l'endroit où on se trouve sur le triange

2 - un second registre d'attribut va1. il s'agit du deuxième attribut stocké dans chaque point: un vecteur de couleur.


2/ le fragment shader

le fragment shader est appelé par chaque pixel pour calculer sa couleur

il est toujours exécuté par la carte vidéo, excepté le cas particulier où le rendu hardware n'est pas possible, le fragment shader sera alors émulé par le processeur central et son exécution sera très lente

les fragment shader sont les programmes qui sollicitent le plus le processeur vidéo car ils sont appelés sur chaque pixel de chaque triangle tracé. ces programmes doivent donc être optimisés à la ligne près, et vos jeux doivent prévoir une baisse de résolution pour les petits processeur vidéo

Code:

// fragment shader[size=14][/size]

 mov oc, v0

il copie simplement la couleur stockée dans le registre vary 0 "v0", vers le registre d'output color "oc"


Prenez bien le temps de tripoter le tutoriel d'adobe avant d'aller plus loin... bon courage !

Ce serait bien s'il y avait des images et un aperçu du résultat final. Ca donnerait plus envie de lire, déjà que le tuto est anglais...^^"

Pour l'instant je me suis juste occupé de décortiquer les trois lignes d'assembleur pour familiariser les débutants avec cette syntaxe ancestrale.

Traduire tout le tuto d'adobe on verra quand j'aurai le temps. En attendant je vous suggère de vous entraîner à l'anglais car tous les langages de programmation sont en anglais.

Voici la meilleure technique pour apprendre n'importe quelle langue. On considère qu'un livre contient toutes les bases d'une langue, il suffit de relire plusieurs fois un seul livre. Ca fonctionne avec les romans, les pièces de theâtre, ou même les bandes dessinnées. 

Vous choisissez votre écrivain anglophone préféré, vous achetez le livre en version originale, vous achetez le dictionnaire français/anglais et le bescherelle anglais, et vous relisez dix fois le livre jusqu'à avoir tout compris. Vous voilà incollable en anglais.

Merci pour le tuto :D

C'est vrai que le rendu hardware c'est pas évident pour des débutants... Normalement on débute la 3d par du rendu software afin de bien comprendre toutes les étapes de calcul pour afficher un triangle, mais là c'est bourré de calculs horribles niveau bac+2... or avec le rendu gpu vous n'avez pas besoin de comprendre ces calculs là car ils sont faits automatiquement.

T'as pas un autre tuto pour les débutants ?^^

Je peux pas faire plus simple que les tutos d'adobe.
Le rendu hardware c'est compliqué c'est comme ça... et c'est pas vraiment pour un niveau débutant.

marcellus_wallace a écrit:

Normalement on débute la 3d par du rendu software afin de bien comprendre toutes les étapes de calcul pour afficher un triangle,

Je parles par rapport à ca :D

pas le temps...

pour attaquer la 3d il faut s'armer de beaucoup de courage et de patience, c'est très compliqué

On a tout notre temps^^

bah fais les tutos adobe alors ;)

sinon y'a la 3d webgl pour javascript, le langage est plus simple que l'as3 et les shaders c'est du glsl qui est plus facile que l'assembleur

Ok on va essayer ca alors : )