Graphisme soustractif [Résolu]

Hello @tous,

J'avoue que je vais avoir beaucoup de mal à m’exprimer sur ma demande.

Je veux simuler une brisure de vitre.
Pour se faire, je crée ma vitre avec un graphisme tout simple, un bête rectangle blanc en PNG avec une transparence à 20% (dans l'exemple ci-dessous, il s'agit d'un dégradé).

Jusqu'ici, pas de souci.

Lors d'un contact, je veux briser cette "plaque de verre". Pour ce faire, j'ai trouvé comment réaliser  graphiquement des cassures


Facile à faire avec Photoshop mais ...

Reste que je ne sais pas pas comment les ajouter  à mon application.

L'idée étant de pouvoir placer au pixel près une image qui remplacerait ce qui existe.
En gros, ma vitre fait 500 pixels et je veux qu'elle se fragilise à un X de 150 pixel, ou 250 voir 378 ...
Pour y arriver, je pense qu'il est impossible d'ajouter un élément graphique mais au contraire, qu'il faut retirer quelque chose.

Est-ce assez clair ?

Pur info, au stade où j'en suis, j'ai crée plusieurs images que j'affiche à chaque choque (collision) mais l'impacte ne correspond pas à l'endroit précis de la collision






Je n'arrive pas à trouver une méthode.
Si vous avez une idée, je suis preneur :)




PS : je n'ose pas vous demander si vous avez une idée (astuce) pour simuler une plaque de verre qui se brise en mille morceaux :D

ba... c'est juste un png transparent d'un sprite en blanc ? fait simple ;)

Salut salut,

Un truc comme ça ?

La vitre est sur un calque avec l'effet Ajouter. Ce que fait que plus une couleur est sombre, plus elle sera transparente. En créant des objets noirs sur ce calque,, ça fait des trous.

La vitre est sur un calque avec l'effet Ajouter. Ce que fait que plus une couleur est sombre, plus elle sera transparente. En créant des objets noirs sur ce calque,, ça fait des trous.

C'est exactement ça :)  :bravos
Je ne connaissais pas cette possibilité.

Je n'ai pas testé mais je suppose qu'avec des nuances de gris on va pouvoir créer des arrondis dans les cassures.

Super. Les masques de fusion de Photoshop peuvent être appliqué ici de cette façon.
Merci beaucoup

Attention, cette méthode ne marche que pour une application destinée à être compilée en exe.
Les shaders sont un peu plus aléatoires en html5, android, iOS et swf.