Étude de cas · HiperX

HiperX : identité de marque et web pour une agence créative innovante

Une refonte audacieuse et riche en animations de la marque et du site Next.js d’une agence créative spécialisée en design produit, contenu et identité de marque.

  • SecteurCréation
  • Année2024
  • PaysÉtats-Unis
  • Durée2 mois
HiperX: Brand & Web Identity for an Innovative Creative Agency hero screenshot

Résultats en un coup d'œil

  • 3xTemps passé sur la page par rapport à l'ancien site
  • 2.1sLargest Contentful Paint
  • +38%Hausse des leads entrants après le lancement

Le défi

L’ancien site WordPress de HiperX était lent, difficile à mettre à jour et ne reflétait pas l’orientation visuelle audacieuse que l’équipe avait adoptée. Les présentations s’enlisaient parce que les prospects arrivaient sur un site qui contredisait le travail créatif du dossier.

Notre solution

Nous avons reconstruit la marque à partir de la typographie et livré un site Next.js avec des séquences héros animées, un format d’étude de cas axé sur le contenu et un CMS Sanity pour que l’équipe puisse publier de nouveaux travaux sans ingénierie. Chaque page respecte les Core Web Vitals.

  • Identité de marque renouvelée avec typographie sur mesure
  • Héros animé avec GSAP et Framer Motion
  • CMS Sanity pour l’édition de contenu en libre-service
  • Modèles d’études de cas avec médias enrichis
  • Lighthouse 95+ sur chaque page clé
  • Entièrement responsive sur tous les points de rupture

Comment nous l'avons construit

  1. 01

    Découverte et planification

    Nous avons commencé par des ateliers avec les parties prenantes pour cartographier les objectifs métier, les rôles utilisateurs et les contraintes de conformité, puis les avons traduits en une feuille de route produit sprint par sprint avec des critères d'acceptation clairs.

  2. 02

    Architecture et conception

    Notre équipe a conçu ensemble le modèle de données, les contrats d'API et le système d'interface, afin que le produit soit cohérent en apparence et en comportement dès le premier jour. Les parcours UX ont été prototypés dans Figma et validés auprès d'utilisateurs finaux avant d'écrire la moindre ligne de code.

  3. 03

    Développement et QA

    Les ingénieurs ont travaillé en sprints de deux semaines avec un déploiement continu vers un environnement de recette. Chaque fonctionnalité a été livrée avec des tests automatisés, une assurance qualité manuelle et une revue de sécurité avant la mise en production.

  4. 04

    Lancement et support

    Nous avons pris en charge le déploiement en production sur l'infrastructure cloud, la mise en place de l'observabilité et une session de formation de passation. UnlockLive reste sous contrat de suivi pour les évolutions mensuelles, la supervision et l'astreinte.

Stack technique

  • Next.js
  • GSAP
  • Framer Motion
  • Sanity CMS
  • Identité de marque
  • Web design
  • Développement front-end

Questions fréquentes

Avez-vous aussi réalisé l'identité de marque ?

Oui – la mission comprenait un rafraîchissement de la marque (typographie, palette, principes de mouvement) avant d'écrire la moindre ligne de code.

Quel CMS alimente HiperX ?

Sanity. L'équipe publie de nouvelles études de cas et de nouveaux membres sans impliquer l'ingénierie.

Quelle est la vitesse de chargement du site ?

Le LCP est en moyenne de 2,1 secondes et le site obtient plus de 95 sur Lighthouse en SEO, accessibilité et performance.

Envie d'un résultat comme celui-ci ?

Parlez à l'équipe qui a construit HiperX : identité de marque et web pour une agence créative innovante. Nous définirons le périmètre de votre projet, vous remettrons une proposition à prix fixe et vous présenterons l'exemple le plus proche de notre portfolio.

Réserver un appel stratégique