Tous les Skills vidéo Premium dans un seul abonnement. Résiliable à tout moment.Voir les offres
Solenne · 16:9

Rendu par ce Skill

Écran d'accueil sur téléphone 3D v1.0.0

Un téléphone 3D pivote dans un studio doux, avec un écran d'accueil en verre liquide, des notifications animées et votre appli web à l'écran.

Pas encore de note 0 téléchargements
Format
Vidéo · 16:9
Durée
0:15

Gratuit Gratuit avec un compte

Se connecter pour télécharger

Collez ceci dans votre agent. Il connecte la CLI si besoin, puis installe le Skill.

Un bloc HyperFrames gratuit pour 15 secondes de plans d'illustration d'appareil en 3D. Un modèle 3D de téléphone pivote sur un bureau sous un fond d'écran animé par shader ; son écran d'accueil en verre liquide affiche des icônes d'applis, des widgets et des notifications qui glissent à l'écran, puis il ouvre une page web avec une phrase d'accroche et des cartes. Tout le contenu de l'écran (icônes, libellés, notifications, la page) est du HTML modifiable ; le téléphone et l'ordinateur portable sont des modèles 3D.

Mis à jour le 4 nov. 2026

Ce que vous obtenez

  • Un MP4 1920×1080 de 15 secondes avec un téléphone 3D
  • Un écran d'accueil en verre liquide, des notifications et votre page à l'écran
  • Du HTML modifiable pour chaque pixel de l'écran

Idéal pour

  • Films de lancement d'appli et plans d'illustration
  • Vidéos d'en-tête de landing page
  • Démos pour investisseurs et keynotes

Pas pour

  • Montrer un vrai enregistrement de votre appli
  • Les formats uniquement verticaux

À propos de ce Skill

Vous dites

/ios26-liquid-glass Fais un écran d'accueil sur téléphone 3D pour Solenne : des notifications sur la scène du soir et le rapport énergétique, et la page Solenne "Your home, on cue".

Des plans d'appareil donnent à n'importe quelle appli un air de produit fini. Écran d'accueil sur téléphone 3D affiche un vrai téléphone 3D avec un écran d'accueil en verre liquide actuel : vos notifications apparaissent et votre appli web s'y ouvre, sous une lumière de studio, sans tournage ni artiste 3D.

Comment ça marche

  1. Demandez : donnez à votre agent les notifications, les noms d'applis et le contenu de la page que votre téléphone doit afficher.
  2. Remplissage : il inscrit vos textes et vos couleurs dans les variables du bloc, en gardant des textes proches de la longueur prévue par la mise en page.
  3. Rendu : il rend un brouillon avec npx hyperframes render, vérifie quelques images et rend le MP4 final.
  4. Réutilisation : les variables tiennent dans un petit fichier JSON ; la version suivante, c'est un rendu de plus.

Conseils

  • Remplacez les icônes et noms d'applis par défaut par les vôtres ou par des neutres ; c'est ce que fait notre exemple.
  • Limitez chaque notification à une ligne courte.
  • Utilisez les vraies couleurs de votre produit pour la page.
  • Il n'a pas de variables : votre agent modifie les textes directement dans le HTML, en suivant le SKILL.md.

Open source

C'est un bloc du registre HyperFrames, réalisé par HeyGen et les contributeurs de HyperFrames (heygen-com/hyperframes) et partagé sous Apache License 2.0. Le téléchargement contient le bloc, ses ressources et un SKILL.md rédigé par Reelity, pour que votre agent sache le remplir et le rendre ; HyperFrames lui-même s'exécute depuis npm.

Ce qu'il vous faut avant de commencer

Vous fournissez
Les notifications, les noms d'applis et le texte de page à afficher, ainsi que vos couleurs.
Dépendances
Node.js 22 ou version ultérieure — requis · FFmpeg — requis
Coûts externes
Aucun. HyperFrames est gratuit et open source, et le rendu se fait sur votre propre machine.
Dernier test
v1.0.0 —

Avis des utilisateurs

Pas encore d'avis. Installez le Skill et soyez le premier à le noter.

FAQ

Est-il livré avec de vraies icônes d'applis ?

L'original contient des icônes d'applis connues comme espaces réservés. Remplacez-les par les vôtres ou par des neutres ; notre exemple utilise des icônes neutres générées.

Puis-je mettre une capture d'écran sur l'écran ?

Oui. L'écran est en HTML : une image de votre appli peut remplacer la page.

Pourquoi est-ce gratuit ?

C'est un bloc HyperFrames open source de HeyGen et des contributeurs de HyperFrames. Nous le proposons tel quel, avec un SKILL.md pour que votre agent puisse l'utiliser et un exemple réalisé avec l'une de nos marques maison, Solenne.

Guides

How to make an app install video that shows the installThe fastest way to sell an app is to show someone getting it. How to animate an app store search, a tap on GET and the install, free, with the App Store Search Spot block.How to make a 3D phone mockup video for your appDevice b-roll makes any app look shipped. How to render a 3D phone with a liquid-glass home screen and your app on it, free, with the 3D Phone Home Screen block.How to make a 3D laptop mockup video for your productSoftware looks real on real hardware. How to put your product on a 3D laptop with a liquid-glass desktop, free, with the 3D Laptop Desktop block.

Skills similaires

Tout voir