Studio de développement créatif pour sites web interactifs

Le développement créatif est le travail frontend qui fait du mouvement, des interactions de défilement et de pointeur, et du WebGL une part de la façon dont un site explique votre marque ou votre produit. Dardo conçoit ces expériences pour des lancements, des récits produit et des sites de marque, et dessine les versions mobile, clavier et mouvement réduit en même temps que l'effet. Le résultat est singulier, tout en permettant de lire, de naviguer et de vous contacter.

Écrivez-nous sur WhatsApp
Dardo / Illustration éditoriale
Sur cette page

Qu'est-ce que le développement créatif ?

Le développement créatif se situe entre le design et l'ingénierie frontend. Un développement standard se demande si une page fonctionne et se charge vite. Le développement créatif se demande aussi si l'interaction elle-même communique : une transition qui montre le lien entre deux états, une séquence de défilement qui dévoile un produit dans le bon ordre, un shader qui donne à une marque sa propre texture.

Tout est écrit en code, sans partir de modèles prédéfinis : timelines d'animation, logique de défilement et de pointeur, scènes Three.js ou WebGL sur mesure, et solutions de repli qui les gardent fiables sur de simples téléphones. Si vous voulez un site de style Awwwards, c'est le bon service, même si nous concevons pour vos visiteurs plutôt que pour un jury et ne promettons jamais de récompenses.

Ce que comprend un projet de développement créatif

La proposition précise lesquels de ces livrables sont inclus, qui fournit chaque élément et comment chacun est validé. Apportez un design validé par votre propre designer ou un autre studio, ou demandez à Dardo de le concevoir et de le développer ensemble.

  • Concept interactif et prototype qui répondent aux questions risquées avant le développement complet
  • Interactions de défilement et de pointeur avec équivalents tactiles et clavier
  • Un système de mouvement : durées, courbes d'accélération et transitions réutilisées sur tout le site plutôt que des effets ponctuels
  • Budgets de performance et solutions de repli pour le mouvement réduit, les connexions lentes et les appareils sans WebGL
  • Intégration responsive testée sur les téléphones et navigateurs que votre audience utilise réellement

Quand le mouvement aide, et quand un autre service convient mieux

Le développement créatif fonctionne quand une interaction clarifie le produit, démontre un système ou donne à une marque un rythme mémorable. Nous définissons d'abord cette mission et dessinons la séquence en images fixes. Si l'histoire ne tient pas sans mouvement, l'animation ne la sauvera pas.

Si vos visiteurs doivent faire pivoter un objet ou se déplacer dans un espace, notre service de sites web 3D interactifs est plus adapté. Si vous avez besoin d'un site clair et bien construit avec un mouvement sobre, commencez par le design web sur mesure. Une offre de campagne unique relève généralement d'une landing page.

Le déroulement d'un projet : d'abord une tranche fonctionnelle

Avant de chiffrer toute l'expérience, nous construisons une tranche représentative : une vraie scène avec du vrai contenu, son repli statique et l'action principale, aux tailles d'écran visées. Elle répond tôt aux questions coûteuses. L'idée est-elle claire sans mode d'emploi ? Fonctionne-t-elle sur un téléphone ? Que se passe-t-il quand les ressources se chargent lentement ? Peut-on atteindre l'action principale sans aller au bout de l'effet ?

La tranche est accompagnée d'un procès-verbal de validation écrit : appareils convenus, poids des ressources, états clavier et tactile, comportement en mouvement réduit et risques ouverts. La proposition complète chiffre ensuite la production des ressources, l'intégration, les connexions, les tests de compatibilité et le support sur des lignes distinctes que vous pouvez comparer.

Performance, accessibilité et mouvement réduit

Nous budgétons les ressources initiales, le travail de rendu et la latence d'interaction, et visons les seuils des Core Web Vitals de Google (largest contentful paint sous 2,5 secondes, interaction to next paint sous 200 millisecondes, décalage de mise en page de 0,1 ou moins) sur des appareils représentatifs plutôt que sur une démo de bureau. Titres, textes et liens sont livrés d'abord en HTML, de sorte que le contenu ne dépend jamais de l'exécution de l'effet.

Avec le mouvement réduit activé, les visiteurs obtiennent une version cohérente de la même histoire : le parallaxe et les mouvements de caméra deviennent des coupes ou des étapes qu'ils contrôlent. Les effets au survol ont des équivalents tactiles et clavier, et le focus reste visible. Les statistiques peuvent montrer si les gens atteignent l'action ; elles ne peuvent pas prouver qu'une animation a provoqué une vente.

Des réalisations à examiner : Hyper et Janus Observatory

Hyper est un récit produit conçu par Dardo pour un concept d'intelligence client par IA. Le mouvement relie les signaux clients à un profil unifié, puis ce profil à une offre suggérée, de sorte que chaque transition explique un changement de sens. C'est un concept : son prototype interactif, une interface Next.js adossée à un prototype Python FastAPI, fonctionne sur des exemples synthétiques, et nous n'revendiquons aucun résultat de conversion ou client.

Janus Observatory est une expérience de recherche développée avec Blue Marble Space : une ouverture cinématographique, un atlas de dix futurs possibles et un observatoire pour les comparer. Les libellés et les explications vivent en dehors de la couche 3D, et le développement est soumis à des budgets de bundle, à de la QA navigateur et à des contrôles de release pour les régressions visuelles. Il démontre une réalisation interactive, pas un résultat commercial pour un client.

Qu'est-ce qui influe sur le coût d'un site créatif ?

Un projet créatif est chiffré selon le nombre de scènes et de séquences distinctes, la nécessité de produire des illustrations, de la 3D ou de la vidéo, le fait que le design soit déjà validé, les appareils à prendre en charge, le travail de CMS et d'intégration, et le support après lancement. Le formulaire de demande propose une fourchette de budget, de moins de 5 000 USD à 60 000 USD et plus, afin que la proposition adapte le périmètre à ce budget.

Un studio senior à Bogotá, sur les horaires de travail américains

Dardo est une équipe de trois personnes à Bogotá, en Colombie, dirigée par son fondateur Nicolás Cerón et travaillant en anglais ou en espagnol. Bogotá est à UTC−5, soit les mêmes heures de travail que l'heure de l'Est et du Centre des États-Unis : les équipes américaines ont ainsi un partenaire nearshore qui relit en direct, pas pendant la nuit. Nous collaborons aussi bien avec des studios de design qu'avec des équipes de lancement internes, et la proposition nomme le responsable des relectures, les plages de réunion communes, la langue de passation et le propriétaire du dépôt.

Vos questions avant de choisir

Que fait un creative developer ?

Un creative developer est un développeur frontend spécialisé dans la couche d'expérience d'un site : animation, interactions au scroll et au pointeur, WebGL et shaders. Son rôle est de faire en sorte que ces effets servent le message, tout en gardant une page rapide à charger, fonctionnelle sur mobile et respectueuse des réglages d'accessibilité. Chez Dardo, la même petite équipe conçoit et développe : l'idée et sa mise en œuvre sont donc examinées ensemble.

Combien coûte un site web animé ou interactif ?

Cela dépend du travail à réaliser : le nombre de scènes distinctes, l'illustration, les assets 3D ou vidéo à produire, la fourniture ou non du design et les appareils à prendre en charge. Nous établissons un devis après avoir cadré une tranche représentative, de sorte que le prix reflète votre brief plutôt qu'un forfait figé.

Les animations nuisent-elles au SEO ou à la vitesse des pages ?

Pas en elles-mêmes ; ce sont celles mal chargées qui posent problème. Les moteurs de recherche lisent le HTML : le titre, le texte et les liens doivent donc exister avant l'exécution de tout script de canvas ou d'animation. Le code lourd doit se charger après l'apparition du premier contenu, les mises en page doivent réserver l'espace pour que rien ne saute, et l'animation ne doit pas bloquer les interactions. Nous vérifions les Core Web Vitals sur des téléphones représentatifs avant le lancement, et nous ne garantissons pas de positionnement.

Un site animé peut-il respecter les normes d'accessibilité ?

Oui, si l'accessibilité est pensée avec le mouvement et non rajoutée après coup. Les WCAG exigent un moyen de mettre en pause, d'arrêter ou de masquer tout contenu qui bouge de lui-même pendant plus de cinq secondes, et recommandent de permettre de désactiver les mouvements déclenchés par une interaction. Nous respectons le réglage de réduction des animations, gardons le focus visible et veillons à ce qu'aucun contenu ne dépende de la fin d'une animation.

Combien de temps dure un projet de creative development ?

Il n'y a pas de durée type ; tout dépend du nombre de scènes, de la production des assets et des cycles de validation. Nous fixons les délais dans la proposition, après avoir cadré la première tranche fonctionnelle, ce qui met aussi au jour les risques qui tendent à décaler un calendrier, comme des assets trop lourds ou des interactions à repenser pour le tactile. Indiquez-nous dès le départ toute date de lancement imposée.

Faut-il choisir le creative development ou un site 3D interactif ?

Choisissez le creative development lorsque l'animation, le scroll et les transitions portent le récit sur une page par ailleurs classique. Choisissez un site 3D interactif lorsque les visiteurs doivent explorer un objet, un lieu ou un système en trois dimensions. Beaucoup de projets combinent les deux. La question décisive : l'action du visiteur change-t-elle ce qu'il apprend, ou une séquence bien rythmée l'explique-t-elle mieux ?

Réalisations et études associées

Janus Observatory : interface du projet publiéExpérience de recherche réalisée / Graphisme interactifJanus ObservatoryExplorez l'entrée, l'atlas et l'observatoire de ce projet développé avec Blue Marble Space, puis consultez les preuves de mise en œuvre et les limites de la recherche. Il illustre une réalisation interactive ; il ne prétend à aucun résultat de conversion pour un client.Voir le projet

Mettre l'interaction au service du récit

Choisissez une interaction représentative, un plan d'assets et une solution de repli avant d'estimer l'expérience complète. Comparez le rendu graphique en temps réel avec des formats de production plus simples.