WebGL

[César Vonc]

Salut,


Ça fait un moment que je n'ai pas posté sur le forum !


La raison est que j'utilise beaucoup moins C4D qu'avant, m'ayant orienté professionnellement dans le domaine du web, où il y a, entre autre, beaucoup de boulot, et surtout rémunéré de manière plus juste, je trouve, par rapport au métier d'infographiste (car plus obscur, donc la facture passe mieux ?).



Je m'intéresse beaucoup au WebGL qui permet, comme son nom l'indique, d'afficher de la 3D directement dans le navigateur, avec des performances qui commencent à être à la hauteur de ce que nos machines peuvent fournir !



Voici deux petites démos qui mettent en valeur la manipulation d'objet, les animations, l'interactivité, et le rendu des matériaux (on se refait pas, oui, je sais :icon_mrgreen:) :


https://code.vonc.fr/details/105/image_01.png (https://vonc.fr/3sdre/iframe/gode/)

https://code.vonc.fr/details/106/image_01.png (https://vonc.fr/3sdre/iframe/boite/)



Techniquement, c'est du JavaScript avec la bibliothèque ThreeJS qui fait le pont avec WebGL, l'effet de gélatine est tiré de mon plugin Gélatine, calculé via GPU, les shaders sont personnalisés, le format de fichier 3D est créé pour la cause, ce qui permet d'intégrer ce qu'on veut dedans, comme de l'animation PLA, sans toutes la lourdeur des autres formats tel que FBX ou autre.



Je me demande quel business pourrait-il y avoir derrière, ça reste assez rare sur les sites web mais je pense qu'il y a moyen de faire quelque chose avec, qu'en pensez-vous ? Seriez-vous intéressés ?



Pour le coup j'utilise C4D pour exporter mes objets et mes animations. :thumbup1:

[yayaprod]

Génial ! l'animation est juste très réaliste et avec la superbe cynématique lorsque l'on bouge l'objet avec la souris ,c'est vraiment top. La qualité des textures est aussi très réaliste, la présentation efficace. Je pense qu'il y a du gros potentiel à venir !! avenir !!!
Yaya °):icon_clap:

[Rudy]

Salut César, c'est juste hallucinant comme procédé, je parle de l'animation.

Et bravo pour le taf :icon_wavey:

[Floc]

Effectivement ça marche super bien et le rendu est nickel.:thumbup1:

Pour répondre a ta question juste ou une deux réflexions comme ca.
Je sais que dans le domaine du luxe ils sont assez friands de VR 360 de leurs objets, mais dans ce secteur la je pense que tu rentrerai plutôt en concurence avec les photographes.
Les objets sont prééxistant et ils sont TRES exigeant sur les visuels (pour pas dire chiants). de plus en général on parle plutots de collections dans ces cas là. (J'ai un coloc photographe justement au bureau qui bosse pour une grande marque et je sais donc un peu comment ca se passe). Vu ce qu'ils sont près a payer pour ce genre de truc, et le boulot qu'engendrerai la modé, etc… je suis pas sur que ce soit très rentable.

Par contre en voyant la boite d'aspirine peut être que dans le domaine du "mode d'emploi" il y aurai a faire. Mais la la question devient plutot : est ce que tu voudrai attaquer des clients en direct, ce qui semblerai etre la démarche a suivre dans ce cas.
Genre aller voir ikea (qui en aurai de l'avis de toute la planete un besoin absolument indispensable ! ) , ou n'importe quelle boitte qui vend des truc a monter ou en kit, et leur proposer quelque chose ?
ou proposer tes services, ou même ta technologie a une agence ?

Au passage tu est freelance ou tu travaille pour une boite ?

[diego1968]

Salut Cesar !
C'est vraiment super ton truc, il y a énormément de possibilité notamment dans la vente en ligne, pouvoir voir un objet/produit sous tout ses angles de manière dynamique c'est sans doute l'avenir. Des secteur comme l'ameublement, l'eclectro…) Les musées aussi pour leurs boutiques. Les notices d'utilisation en ligne. La collaboration entre équipes et annonceurs. Tout ce qui permet de mieux appréhender un produit sans l'avoir sous la main :sweatdrop:

Les matériaux sont supers, qu'est-ce que cela donne avec un objet transparent ? l'aspect reste-il cohérent ?

Je n'y connais rien en techno web :sweatdrop:, mais quel sont les plus apportés par ta solution comparé à un Sketchfab ?

Bravo en tout cas pour ton travail :thumbup1:

[beta125du17]

Effectivement ton truc est top.
Le gros plus pour moi c'est l'interactivité, tu changes de couleurs comme tu veux, et ca reste raisonnable en temps de chargement.

Effectivement, je diras que cette technologie est plutôt tournée vers les produits de luxe, ou coutant un certain prix, ou alors dès qu'on fait un peu de configuration différentes.
exemple : configurateur automobiles (certains sont ignobles et pas performants), prêt à porter, aéronautique, industrie navale...

Tu as quelques choses sous la main, à creuser

[gr4ph0s]

Pas longtemps sur plugincafe on a eu la demande http://www.plugincafe.com/forum/forum_posts.asp?TID=14230

Ton truc est bien cool et il y a plein d'utilisation pour tout ce qui est industrie et commercial. J'avais taffé dans une boite qui faisait que des configurateurs, ça permettais aux vendeur de montrer direct au client, puis de proposer un devis pour ces modèles exactes.

[Aurety]

C'est juste super impressionnant. Le gode est hallucinant :ninja: surtout en transparent :sweatdrop:

[César Vonc]

Merci à tous !


Yaya : Y a moyen de s'amuser, oui, c'est un sextoy mais avec de l'architecture ça fonctionne très bien aussi ! :biggrin:


Rudy : Merci !


Floc : Je pensais proposer au client final directement, mais pourquoi pas à des agences, ça ne change pas grand chose, je pense.
Ça me semble également plus destiné aux produits de luxe car ils mettent un soin particulier à leur présentation. Tu veux dire qu'ils ont des oursins dans les poches, même en ce qui concerne la présentation de leurs produits (photos ou 3d) ?

Les produits d'emballage me semblent adaptés aussi, la personnalisation du packaging prend du sens.

Ikea, oui, tout ce qui est à nature mode d'emploi comme tu dis, faudrait que je fasse une petite démo en ce sens. :icon_smile:

Je travaille dans une boîte mais est également freelance avec une activité différente.


Diego : Plein de secteurs me semblent adaptés, oui ! Après perso je m'occuperai juste de la partie web, je ferai sûrement appel à des gens comme vous en freelance pour faire de la modé, si y en a beaucoup. :icon_mrgreen:

L'avantage par rapport à Sketchfab, c'est de proposer des solutions sur-mesure permettant de personnaliser le modèle 3D via un système de configurations, par exemples, une interactivité avec l'objet et des animations plus poussées.

Tu as une version transparente avec de la déformation, dans l'exemple du vibromasseur.


Beta : C'est clair que les configurateurs de bagnoles efficaces sont rares et le rendu visuel est souvent très limité, alors qu'il y a tellement moyen de faire mieux ! Faudrait aussi que je fasse une démo en ce sens, avec un design très pro et sobre, des effets spéciaux, j'ai découvert plein de choses en jouant avec les shaders, pour mélanger des effets de particules avec un affichage cellulo, et tout ça en temps réel !


Graphos : Oui j'avais d'ailleurs fait un exporteur C4D vers ThreeJS, mais vu qu'il y a de toutes façons un minimum de développement JavaScript pour faire quelque chose de personnalisé, ça ne sert pas à grand chose si ce n'est avoir un simple visualiseur web.


Aurety : Merci, à la prochaine étape je vais rajouter une version avec un effet de fourrure. :biggrin:

[Floc]

Disons que dans la com de ce secteur (et certainement dans plein d'autres) il y a plusieurs "niveaux" de com.
La pub, ou disons la communication grand public. La c'est très difficile d'y pénétrer.
La com interne, en général pour des produit en cours de creation ou pas encore sortis. (c'est la ou perso je sévis).
Et la com je sais pas comment elle s'apelle a destination des points de vente physique ou en ligne, avec entre autres les catalogues (en ligne aussi donc). C'est plutôt a ça que je pensais.

Alors c'est pas qu'ils on des oursons dans les poche, ils sont blindés de de chez blindé. Mais c'est le principe des catalogues. Autant une prise de vue pour un packshot a destination pub avoisine les 4000€ la journée, autant pour des packshot de catalogue c'est plutôt entre 40 et 70€. Bien sur ca dépend des marques, des photographes etc… mais on voit deja que si il fallait creer en 3d chaque article avec le niveau requis pour lutter avec des shoot photos, ca serait difficilement rentable.

Bon mais je réagis d'après ce que je connais, donc plutôt la parfumerie. Maintenant dans les cosmétiques par exemple il doit y avoir des utilsations possible vu qu'il y a toutes sorte de derivations d'un même produit ou des objet a manipuler genre rouges a levres, palettes, coffrets etc... La tu naviguerai plus entre le configurateur et le "mode d'emploi".

Si sansa passait par la, je suis sur qu'elle aurai de bonne idée a ce sujet !

[lenogre]

Bravo !

Pour de l'horlogerie, ça peut m'intéresser. Les modèles restent finalement assez légers, pour preuve, on peut même utiliser ProRender si on le souhaite !

D'aucuns pensent évidemment à de la visualisation archi mais vu le nombre de polys qu'on met maintenant dans les scènes (accessoires et végétation), l'upload pourrait prendre un certain et dégouter les plus patients…

[clemz]

très chouette César ! :) ( et tu ne changes pas de registre c'est bien :D ! )

ça ouvre des perspectives intéressantes , je note on ne sait jamais !

( donc techniquement tu animes les dynamiques dans c4d , elles ne sont pas vraiment "temps réel/réalistes" quand on bouge l'objet c'est ça ? un peu comme du jeu vidéo avec des bibliothèque d'anims qui s'enchainent en fonction de l'action de l'utilisateur ? )

[NiKo]

Très class!
ça marcherai avec un plan d'appart en 3D? Ou un bâtiment?

[beta125du17]

Et pourquoi pas,
si le fichier est bien optimisé, ça peut être bien ^^

[clemz]

Dis Maitre César, je suis tombé sur ça et ça ma troué le derrière ! je ne sais pas si c'est dans la lignée de ce que tu développes là, mais qu'en penses-tu ? est-ce que c'est quelque chose que tu pourrais développer aussi ? je trouve le résultat de ce mélange 2D/3D/tablette vraiment génial.

https://www.youtube.com/watch?v=8G0BMxkwHYM&feature=youtu.be

https://www.youtube.com/watch?v=afr27sHwDGU

https://www.patreon.com/plastiek

[César Vonc]

Pour le gode, y a une surprise si vous l'essayer sur votre portable, il fait vibrer le téléphone ! :biggrin: (Sauf sur iPhone, car Apple fait chier et n'autorise pas le contrôle du vibreur, du moins par défaut)



Floc : Ouais je pense également que c'est intéressant d'un point de vue tarifaire uniquement sur l'objet 3D est déjà modélisé, donc pour tout ce qui est fabriquant d'objets, comme la cosmétique, on aurait déjà une base de modèles d'usine.

À vrai dire, j'ai déjà travaillé sur le sujet avec une entreprise de cosmétique, ça a très bien marché et ils avaient intégré le configurateur sur des bornes tactiles lors de leurs salons. :biggrin: Qui était pourtant très basique. J'essaie d'étendre le produit en ajoutant le plus d'interactivité possible, et surtout un meilleur rendu visuel.



Lenogre : Merci ! Ah oui tiens, pour l'horlogerie il y a beaucoup de personnalisation possibles ? (J'ai jamais porté de montre :P)
Pour l'archi, faudra trouver des combines pour la végétation, même en terme de rendu en temps réel, ça risque d'être limite je pense (surtout si on compte le garder compatible sur téléphones !)



Clemz : On change pas une équipe qui gagne. ^^ Pour les animations, celle du dépliage de la boîte est conformée en animation PLA dans C4D, docn précalculée, oui.
Pour les animations de position et rotation, elles sont faites directement en JavaScript, donc en temps réel.
Quant à la déformation du gode quand on le bouge, là c'est un script qui utilise la puissance du calcul par GPU qui permet de l'animer en temps réel aussi, donc pas de précalcul !

Mais toutes les animations ne se prêtent pas au calcul par GPU, celui-ci est utile lorsqu'on peut paralléliser le traitement pour gagner en performances (comme les animations de fluide, de particules, ou les animations de points qui indépendants les uns des autres).

On peut aussi animer un personnage en temps réel comme dans un jeu vidéo, avec des os et une carte d'influence, c'est juste un peu long à mettre en place.

C'est amusant, ce système de BD en semi 3D, j'ai léger un doute sur sa faisabilité en Web, faudrait voir s'il est possible de récupérer dans le navigateur les informations gyroscopiques de la tablette, je pense que oui. Sinon en créant une appli y a aucun souci car elle permet tout l'accès aux capteurs du tel !
Je testerai !



Niko : Merci, oui, il y a d'ailleurs quelques boîtes qui font de la visite guidée en 3D en intégrant des scans 3D, c'est pas mal : https://www.lookin3d.fr/nos-realisations/
En revanche ça demande un boulot monstre en amont !

Pour un intérieur, faudrait trouver une solution assez économique en poids pour conformer les jeux de lumière, car les calculer en temps réel ne donnera pas, je pense, un rendu très réaliste.

[lenogre]

En horlogerie, je passe mon temps à faire des dossiers à rallonge.
Tu fais un design de base tout acier cadran blanc et ensuite tu déclines :
- acier / cadran blanc
- acier / cadran noir
- or / cad blanc
- or / cadran noir
- bicolor / cad blanc
- bicolor / cad noir
C'est la base.
Tu peux avoir des cadrans anthracite, bleu, des appliques sur cadran assorties à la couleur de la boite, une montre sertie ou non de diamants, des bracelets métal ou cuir avec des couleurs différentes.
Ce n'est pas rare de faire des dossiers avec 40 pages alors qu'à la base j'ai une montre et 3 cadrans…

[César Vonc]

Merci Lenogre, je vais faire une démo avec une montre d'ici peu, faut juste que j’invente une montre avant, qui ressemble à quelque chose, haha !



Voici quelques nouveautés, le concept a été porté un peu plus loin en incluant une dimension interactive plus poussée, avec des effets sonores, une vibration sur appareils mobiles et une sorte de mini-jeu pour au final concevoir un sorte de mode d'emploi interactif.

Je vous laisse jouer avec le sextoy Snail Vibe (https://snailvibe.com/). :icon_mrgreen:

https://4d.snailvibe.com/



La technique a été nettement améliorée, les jeux de lumière peuvent désormais être conformés, les shaders sont faits maisons ; je me suis du coup créé un site pour présenter mes travaux en WebGL :

https://4d.vonc.fr/


Je cherche à me faire une petite place dans le domaine des produits pour adultes, bien qu'il soit difficile d'avoir des contacts, si vous êtes intéressés n'hésitez pas à me contacter, je pense que le visualiseur 3D s'y prête bien car il permet une bonne visualisation du produit que les gens n'osent pas forcément aller voir en vrai en boutique.

[sansalvador]

ola todos

Un petit moment que je ne vous ai pas rendu visite , disoulée :biggrin: suis beaucoup occupée

Donc avec un petit créneau, je viens et je tombe sur ce....cet....euh comment dire :icon_mrgreen:....

Bon un gros délire en fait qui me fait bien rire et qui finalement venant de toi César ne m'étonne pas du tout , mais hormis l'ustensile , c'est vraiment génial, un super job, j'ai fait un petit tour sur ton site et j'ai vu aussi le "sac" parapente.
C'est vraiment un gros plus pour le consommateur de pouvoir utiliser et visualiser le produit sous toutes les coutures , vraiment bravo :thumbup1:

Je te souhaite le meilleur pour la suite:)

[Floc]

Ah moi j'obtient un "La connexion n’est pas sécurisée".
Je sais que le contenu est sensible, mais quand même :icon_mrgreen:

[César Vonc]

Je savais que ça te plairait, Sansal. :D

Merci, je suis assez content du résultat, j'espère qu'il portera ses fruits !


Ah tiens c'est curieux, Floc, tu as essayé avec quel lien ? Le certificat SSL de mon site est pourtant valide, as-tu le même souci sur https://code.vonc.fr ?

[Floc]

CodeVonc pas de probleme
4d.vonc pas de probleme
c'est les pages de demo auquel je n'accede pas.

Mais c'est certainement du à ma version de firefox que je ne peux plus mettre a jour, vu qu'avec apple maintenant ton OS est obsolete au bout de deux ans :icon_mrgreen:

[bricoman]

AVé César ! ... et prosternations devant les présentations :icon_clap::icon_clap:

' très intéressé aussi , par la méthode ThreeJS de la bibliothèque en racine de site : >mais infoutu de l'utiliser convenablement :icon_pleure:

[petit aparté ] je dois me contenter du vieux VR de Quicktime -lâché par apple® - :icon_pleure: ou Object2VR vraiment lourds ....
maintenant ...pour ce que j'en fait :icon_mrgreen: ... (: j'avais en tête une pinnupe '18 à retourner en tous sens .....:whistling: petit papa César , quand tu nous reviendras:biggrin: ;-) ) [/petit aparté ]

Cette technique semble très souple et pleine de possibilités !! ( entre tes doigts :icon_prie:)
et bien loin du modèle en flash avec 4 couleurs à cliquer :sleeping:

[César Vonc]

Ah oui, c'est certainement ça, Floc, je ne peux que te conseiller de passer sur Chrome. ^^


Si t'as une petite idée d'interaction en tête, on peut voir ce qu'on peut faire ensemble pour Noël, Brico. :icon_mrgreen:

[César Vonc]

Hop ! une nouvelle petite démo avec un petit configurateur de boobs :

https://i.imgur.com/UC1hf7r.png (https://4d.vonc.fr/iframe/doll/)

[Rudy]

Wouha, très fonctionnel ... m'enfin, l'image .. les fonctions .. et les yeux qui te suivent lorsque tu touches au réglage "nipples" rajoute à l'interactivité :icon_biggrin: :sweatdrop: trop marrant.

Rien à dire côté critique, c'est vraiment nikel :icon_thumbsup:

[César Vonc]

Merci Rudy, content que ça te plaise ! ^^

Je suis en pleine démarche de ce côté, je pense ajouter d'autres fonctionnalités comme un mini bodypaint pour le maquillage, un ajout de tatouages ou images personnalisée.

[bricoman]

:sweatdrop::sweatdrop::icon_clap::thumbup:
Les possibilités- et résultats- sont .... spectaculaires !:icon_bave:
et la gélatine ajoutée bien alléchante :icon_biggrin: :icon_biggrin:

(je "rame" sur une éventuelle pinup18 "simplement en 360° " ..mais ce serait trop juste pour ce Noël !! > PinUp19 elle sera!:icon_wink: )

[Philippe casu]

génial dis donc ...mais je préfère de loin le vrai ..Chacun son truc ..:afro:

[lenogre]

Je t'ai connu meilleur en tête de pin-up : je n'aime pas cette petite bouche pincée.

[yayaprod]

:icon_clap::sweatdrop: Total respect, je vais même et dès ce soir demander à ma femme son avis !
Yaya °)

[César Vonc]

Merci, content que ça vous amuse, haha ! oui elle fait un peu poupée, c'est vrai. ^^


Je change un peu de registre avec une présentation de la Talbot :


https://4d.vonc.fr/interface/talbot.jpg (https://4d.vonc.fr/iframe/talbot/)


https://4d.vonc.fr/iframe/talbot/

Le travail est en cours, des suggestions sont les bienvenues. Essayez donc les touches du clavier. ;)

[Philippe casu]

tous simplement excellent ..et on peu jouer avec via les touches ...simplement amortisseurs morts ..trop souple la suspension :icon_mrgreen:

[chapichapo1]

extraordinaire cette Talbot ! Magnifique réalisation !
comme suggestion :
- mettre une petite bosse sur le sol ou un trottoir, un obstacle
- -
Edit : j'ai voulu partir loin mais je me suis vautré dans le ravin invisible

[druide]

:icon_bouncy:

Par contre elle finit beaucoup sur le dos. :icon_mrgreen:

[Frenchy Pilou]

:icon_thumbsup:
Suggestions: Un bruit de moteur ? Des crissements de pneus...

[pxlntwrk]

Salut César,

taff impressionnant:icon_eek: ! super clean
est-ce que tu prévois d'en faire un éditeur ?
As-tu des conseils sur un bon éditeur WebGL ?

[clemz]

hey César , je suis tombé sur ça sur fessebook :
http://www.adultswim.com/etcetera/choir/?fbclid=IwAR1g1Ohy7SzU7WMh3yc9gOkQhegKdlLo4CoV6yVB AVVvkc_3_YnBlyzAFdY

c'est du webgl ? je trouve ça bien con et rigolo comme il faut :D

[Philippe casu]

je trouve ça bien con et rigolo comme il faut :D

je souhaite trouver la même chose que ce qu'ils ont fumé eux alors parce qu’elle doit être super bonne :icon_mrgreen:

[César Vonc]

Oups j'avais pas vu les réponses (aucune notif reçue : /)


Merci, oui j'ai prévu d'ajouter quelques éléments de décor, voire un petit tracé de circuit pour jouer avec. :D

Pas d'éditeur en vue, Pxl, néanmoins tu peux jeter un oeil à l'éditeur de ThreeJS qui est pas mal pour des choses basiques : https://threejs.org/editor/


C'est excellent, Clemz ! :D Le gars en question, David Li, fait des trucs énormes : http://david.li/


Petit délire sur la bannière de mon site, avec une sorte de "simulateur" de nuages interactif : https://code.vonc.fr/

[César Vonc]

Voici une petite nouveauté avec une simulation de tissu faite maison à partir du tutoriel sur la gestion de la physique expliquée ici (https://code.vonc.fr/physique).

Il s'agit d'un simulateur de lance-pierre ; cliquez sur la bande en cuir pour charger une bille. :D

https://4d.vonc.fr/interface/slingshot.jpg (https://4d.vonc.fr/slingshot)

https://4d.vonc.fr/slingshot

[clemz]

top ^^ . Mais on ne peut rien casser !!?
(tu peux rajouter des vases Autodesk ? ..des trucs comme ça :p )

[César Vonc]

:D Pas bête !

[archeo]

Comment se situe ton travail par rapport à sketchfab?

[César Vonc]

Je propose des solutions plus personnalisées et sur mesure, comme des configurateurs avec des règles métiers, partage des configurations, des interactions avec de la physique plus poussée, des mini-jeux, etc. ;)

[archeo]

Je recherche autre chose que sketchfab depuis qu'ils ont limité le nombre de modèles dans la version gratuite.
Pour l'instant j'ai pas réussi à utiliser three.js.