Le stockage essentiel permet la connexion et le fonctionnement des outils d’apprentissage. Google Analytics mesure les visites ; Microsoft Clarity enregistre les interactions pour améliorer l’ergonomie. Ces deux services sont facultatifs et restent désactivés tant que vous n’avez pas fait votre choix. Lire notre politique de confidentialité.
FORMA — Modèle de site pour studio d’architecture et de décoration | SovranCode
Vous consultezFORMA — Studio d’architecture et de décorationNext.jsÀ partir de 79 $US
Architecture et décorationNext.jsModèle frontend
FORMA — Studio d’architecture et de décoration
Un modèle de site pour les studios d’architecture et de décoration, avec une page d’accueil immersive, un portfolio filtrable, des projets détaillés et une présentation soignée du studio. Les interactions sont pensées pour être accessibles.
Cette fiche est en français. La démo, le code fourni, la documentation et le paiement sont actuellement en anglais.
SCPar l’équipe SovranCodeMis à jour le 24 sept. 2026
Voir la démo Démo publiqueS’ouvre dans l’espace de prévisualisation SovranCode.
L’accueil du studioUne page d’accueil immersive qui met en scène les projets, les expertises et l’identité du studio, avec des animations mesurées.
PRÉSENTATION DU MODÈLE
Un site complet pour mettre en valeur votre studio et vos projets.
FORMA réunit une page d’accueil immersive, un portfolio, des projets détaillés, la présentation du studio et la prise de contact dans un site d’architecture cohérent et soigné.
7 familles de pagesStudio, portfolio, projets détaillés, articles et contact.6 captures réellesAccueil, portfolio, projet détaillé, studio, contact et mobile.
Une interface adaptée à chaque écranLes versions ordinateur et mobile sont incluses.
6 mois d’assistancePour vos questions sur les fonctionnalités incluses et l’installation documentée.
POUR QUI ?
Pour les studios qui veulent donner à leurs projets toute leur place.
Partez d’un site soigné pour présenter votre travail, puis raccordez les outils de contenu et de gestion que votre studio utilise déjà.
01
Studios d’architecture et de décoration
Affirmez l’identité de votre studio avec un portfolio qui raconte vos projets, des pages détaillées et un accès clair à la prise de contact.
Parfaitement adapté02
Agences de design et bureaux de création
Donnez à votre équipe pluridisciplinaire un site structuré qui accompagne son développement, avec des projets, des expertises et du contenu à enrichir.
Bien adapté03
Entreprises dont les projets sont la vitrine
Rendez votre savoir-faire concret grâce aux projets, aux matériaux et aux détails, dans une présentation soignée sur tous les écrans.
Bien adapté04
Agences créant des sites éditoriaux pour leurs clients
Partez d’un ensemble adaptable de pages projets, équipe, articles et contact, en gardant la maîtrise du code, des contenus et des styles.
Bien adapté
Choisissez FORMA si
Vous recherchez une interface cohérente sur tous les écrans, la maîtrise du code et la liberté de choisir vos services.
Prévoyez du temps d’intégration si
Votre projet exige un véritable CMS, l’envoi des formulaires, la gestion des consentements et des droits sur les ressources, la validation des contenus et des statistiques en production.
Ouvrez une rubrique pour consulter les routes documentées. Vous retrouverez cette arborescence dans le README fourni.
Le studio et le portfolio3 routes
/Accueil immersif avec projets sélectionnés, principes, expertises et accès à la prise de contact
/projects/ et /projects/[slug]Portfolio, recherche, catégories, tri, onze projets détaillés, galeries et visionneuse de dessins
/studio/ et /expertise/Histoire du studio, méthodes, matériaux, disciplines et présentation des prestations
Articles et contact4 routes
/team/ et /team/[slug]Présentation de l’équipe et profils détaillés
/journal/ et /journal/[slug]Six articles et leurs pages de lecture
/careers/ et /contact/Offres d’emploi et formulaire de contact avec validation native et récapitulatif de démonstration
/privacy/, /credits/, /robots.txt, et /sitemap.xmlPages légales, crédits des ressources et fichiers de référencement à adapter avant la mise en ligne
LE CONTENU DU PACK
Le code, la documentation et les bases de votre futur site.
Une page d’accueil immersive pour présenter votre architecture
Une composition rythmée par les projets sélectionnés, la présentation du studio et des interactions discrètes qui accompagnent la découverte.
Un portfolio avec recherche, filtres, tri et deux modes d’affichage
Explorez les projets par catégorie, par mot-clé ou selon le tri choisi, en grille ou dans un index éditorial.
Onze présentations détaillées de projets d’architecture et d’intérieur
Chaque projet dispose de sa propre page, avec une succession d’images, des légendes, les matériaux et les détails qui font sa singularité.
Des pages pour le studio, les expertises, l’équipe et les actualités
Le modèle couvre la présentation du studio, les expertises, l’équipe, les articles, le recrutement et la prise de contact pour construire une présence complète.
Des galeries et des fenêtres accessibles au clavier
Les galeries, fenêtres et dessins se parcourent au clavier. La gestion du focus et la préférence de réduction des animations sont prises en compte.
Polices et images locales, affichage adaptatif et référencement
Le modèle fournit les ressources visuelles locales, les métadonnées des pages, les fichiers sitemap et robots, ainsi qu’une interface adaptée à chaque écran.
Fichiers fournis
Code complet de l’interface en TypeScript
Modules de pages éditoriales, portfolio, galeries, dessins et contact
Polices hébergées localement, images, dessins et indications de provenance
Comptes rendus des vérifications de contenu et des contrôles visuels
Captures réelles présentées sur la marketplace
README.md, LICENSE.md, CHANGELOG.md, ASSETS.md, RELEASE-QA.md et guides de prise en main
Du code à la mise en ligne, avec le choix de votre hébergeur.
Le pack contient une application Next.js déployable sur Vercel ou un environnement Next.js compatible avec Node.js. Remplacez les intégrations de démonstration et vérifiez chaque route avant la mise en ligne.
POUR DÉMARRER
Déployer sur Vercel
Un chemin direct entre le dépôt fourni et une prévisualisation accessible en ligne.
01
ImporterReliez le dépôt à un nouveau projet Vercel.
02
ConfigurerDéfinissez NEXT_PUBLIC_SITE_URL avec l’URL finale du site.
03
CompilerExécutez npm run build puis vérifiez chaque route.
02
Hébergeur compatible Node.js
Exécutez npm ci et npm run build, puis utilisez un environnement Node.js compatible pour npm run start ou la commande équivalente de votre hébergeur.
Une autre option d’hébergement
03
Vos services backend
Raccordez votre CMS, l’envoi des demandes, les statistiques, les consentements, la gestion des ressources et votre processus de publication.
Adapté à vos outils existants
04
Toutes les possibilités de Next.js
Pour publier vos contenus et recevoir vos demandes de façon fiable, utilisez un CMS adapté et un traitement des formulaires côté serveur.
Pour vos fonctions côté serveur
VOS QUESTIONS
Tout savoir avant de choisir.
Des réponses sur le code fourni, la documentation et les conditions de licence.
01FORMA inclut-il un CMS ou un logiciel de gestion pour le studio ?
Non. FORMA fournit le code de l’interface du site. Les projets, l’équipe, les articles et le parcours de contact utilisent des contenus fictifs de départ. Pour le site réel de votre studio, raccordez un CMS, l’envoi des demandes, les statistiques, les consentements et les autorisations de publication.
02Les formulaires de contact et de newsletter envoient-ils de vrais messages ?
Non. Le formulaire de contact illustre la validation native et affiche un récapitulatif dans le navigateur. La newsletter reste elle aussi une démonstration. Avant de recueillir de vraies demandes, ajoutez la validation côté serveur, la protection antispam, les consentements, l’envoi, les règles de conservation et la gestion des incidents.
03Que propose le portfolio ?
Le portfolio propose une recherche, des filtres par catégorie, le tri et deux affichages : grille ou index éditorial. Il comprend onze projets détaillés, des galeries et des visionneuses de dessins illustratifs. Les fenêtres et galeries gèrent la fermeture avec Échap et le retour du focus.
04Où héberger FORMA ?
FORMA est une application Next.js. Exécutez npm ci puis npm run build, renseignez l’URL HTTPS finale dans NEXT_PUBLIC_SITE_URL et déployez sur Vercel ou un environnement Next.js compatible Node.js. Après avoir remplacé les contenus de départ, vérifiez la version déployée.
05Puis-je utiliser les photos et les dessins d’architecture fournis ?
La provenance des ressources figure dans ASSETS.md, CREDITS.md, IMAGE_PROMPTS.md et les relevés de sources des images. Remplacez les photos de référence et les dessins fictifs, ou obtenez les droits et validations nécessaires à l’usage prévu.
06Quelle licence choisir ?
La licence Personnelle, à partir de 79 $ US, couvre un projet en production qui vous appartient. La licence Entreprise, à partir de 119 $ US, couvre plusieurs projets pour une même entreprise. La licence Agence, à partir de 159 $ US, autorise un nombre illimité de projets internes et clients. Le code fourni est identique pour les trois licences.
NOTES DE VERSION
Le pack et ses contrôles de publication.
16 contrôles documentésLa liste complète figure dans la documentation de version.Archive ZIP testée depuis une installation viergeInstallation, validation et compilation de l’application à partir du code contenu dans l’archive.Code de l’interface uniquementRaccordez votre CMS, l’envoi des demandes, la gestion des ressources, les statistiques, les consentements et les autorisations de publication.
v1.0.0Dernière version24 sept. 2026
Première version de l’interface
Première version de l’interface proposée sur SovranCode
Licence Personnelle à partir de 79 $ US
Onze projets détaillés, quatre profils d’équipe, six articles et sept domaines d’expertise
Interactions adaptées à chaque écran, utilisables au clavier et compatibles avec la réduction des animations
Le pack précise la provenance des images et les consignes de remplacement pour un usage commercial
L’ASSISTANCE SOVRANCODE
Besoin d’aide avec votre modèle ?
L’assistance couvre les fonctionnalités incluses, l’installation documentée et les bugs confirmés du modèle. Le développement sur mesure, la configuration de l’hébergement et l’intégration de services tiers sont des prestations distinctes.