SS — Étude de cas 01 / VlineEdTechIAApplication mobile

Rendre évidente une app d'apprentissage qui mêle vidéo, IA et répétition espacée.

Vline transforme des vidéos en contenus d'apprentissage : moments clés, rappels au bon moment, extraction par l'IA. Le défi : faire comprendre cette promesse en quelques secondes, à des étudiants comme à des professionnels.

Client
Vline — France
Année
2026
Rôle
UX/UI Designer, direction créative
Périmètre
Stratégie UX, UI, copywriting, motion, intégration
Outils
Figma, Midjourney, Veo, Kling
Landing page Vline : « Vline, votre co-pilot pour étudier »FIG. 01 — LANDING PAGE FINALE
01 — Le contexte

L'utilisateur importe ses vidéos, isole les passages à retenir en moments clés, puis est sollicité au bon moment pour les réviser. À terme, l'IA extrait automatiquement l'essentiel et génère des contenus d'apprentissage.

02 — Le défi

Vidéo, mémorisation, IA et sciences cognitives : la promesse devait être claire sans ressembler à une landing SaaS générique, ni devenir si spectaculaire que le visuel passe avant la compréhension.

03 — Le résultat

Une proposition de valeur comprise dès les premières secondes, une démonstration produit qui remplace la documentation, et un parcours tourné vers un seul objectif : le téléchargement.

SS — Objectifs

Ce que la page devait accomplir.

  1. 001Clarifier la proposition de valeurFaire comprendre dès les premières secondes ce que fait Vline : transformer des vidéos en contenus d'apprentissage structurés et faciles à retrouver.
  2. 002Créer une expérience mémorableUne direction plus immersive qu'une landing SaaS, avec des animations directement liées à l'apprentissage vidéo.
  3. 003Transformer l'intérêt en téléchargementUn parcours progressif : le problème, la solution, la preuve scientifique, la démonstration, les cas concrets, puis l'action.
SS — Processus

De l'analyse du produit à la page en ligne.

01 — COMPRENDRE

Transformer un produit complexe en promesse simple

Avant de dessiner l'interface, il fallait rendre Vline évident. L'analyse du fonctionnement, de la cible et du modèle d'apprentissage a recentré toute la page sur une promesse : apprendre plus efficacement à partir de ses vidéos, pas « mettre des vidéos en favoris ».

Les fonctionnalités de Vline autour de l'application : notifications, import YouTube, flashcards, IA
Section « Comment fonctionne Vline ? », étape 1
02 — STRUCTURER

Chaque section répond à une question avant qu'on la pose

Une démonstration progressive : comprendre Vline, reconnaître ses frustrations, découvrir les bénéfices, comprendre pourquoi ça marche, voir l'usage, se projeter. L'effort cognitif baisse à chaque étape.

03 — CONCEVOIR

L'animation n'est pas décorative : elle explique

Interfaces en perspective, transitions entre écrans et micro-interactions montrent le fonctionnement réel de l'app. Le rythme alterne séquences immersives et zones calmes pour préserver la lisibilité.

Arc de vidéos animées autour de la promesse de Vline
SS — Décisions UX

Trois décisions qui ont changé la page.

Pour chacune : le problème observé, puis ce qui a été décidé et pourquoi.

DÉCISION 01

Expliquer avant de convaincre

LE PROBLÈME

Vidéos, moments clés, répétition espacée, notifications, IA : trop de notions à la fois rendaient le discours abstrait et technique.

LA DÉCISION

Une hiérarchie progressive : la promesse d'abord, puis chaque fonctionnalité au moment où elle devient utile dans le parcours.

DÉCISION 02

Transformer les fonctionnalités en démonstration

LE PROBLÈME

Une liste de fonctionnalités ne montrait pas la différence entre regarder une vidéo et apprendre réellement avec Vline.

LA DÉCISION

« Comment ça marche » devient un parcours continu : import, bibliothèque, moments clés, rappels. On comprend le produit sans lire de documentation.

DÉCISION 03

Créer de la crédibilité sans témoignages

LE PROBLÈME

Solution récente : pas encore assez d'avis pour une section de preuve sociale classique.

LA DÉCISION

Remplacer la preuve sociale par une preuve rationnelle : les principes scientifiques sur lesquels Vline s'appuie, expliqués simplement.

SS — Direction visuelle

L'apprentissage rencontre la technologie.

Un bleu nuit pour la base sérieuse, des accents lumineux pour l'énergie. Interfaces flottantes et perspective donnent l'impression d'entrer dans l'écosystème, sans futurisme gratuit.

BLEU NUIT#003959
BLEU LUMINEUX#00AEBE
JAUNE ACCENT#FCC931
TYPOGRAPHIESAaManrope — titres
Inter — textes
Section bénéfices : le timing parfait, extraction des passages clés
Section flashcards : « Combattre la passivité : jouez et apprenez »
Moments clés de vidéos organisés autour de l'écran
SS — Impact

Ce que la refonte a changé.

Un seul objectifLe téléchargementChaque section mène à la même action : comprendre, se projeter, puis télécharger l'application.
Promesse comprise d'embléeProposition de valeurLe visiteur comprend ce que fait Vline avant d'entrer dans le détail des fonctionnalités.
100 %ResponsiveInteractions et identité immersive conservées sur desktop comme sur mobile.
ÉTUDE DE CAS SUIVANTE — 02MONAMEDIA · ADTECH · 2025Expliquer un écosystème publicitaire à trois publics sans en perdre aucun→
SS — 10 / Appel découverte · 30 min

Parlons de votre produit, de vos utilisateurs et de ce qui bloque aujourd'hui. Vous repartez avec 2 ou 3 pistes concrètes, que l'on travaille ensemble ou non.

Réserver un appelChoisir un créneauPrendre contact