Linux vacca.o2switch.net 4.18.0-553.123.2.lve.el8.x86_64 #1 SMP Thu May 7 23:17:13 UTC 2026 x86_64
/
home
/
tosa8115
/
studio-brik.com
/
/home/tosa8115/studio-brik.com/formasup.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Studio Brik</title> <link rel="shortcut icon" type="image/x-icon" href="assets/images/favicon.ico"> <link rel="stylesheet" type="text/css" href="assets/css/bundle.css"> <!-- Global site tag (gtag.js) - Google Analytics --> <script async src="https://www.googletagmanager.com/gtag/js?id=UA-148188386-1"></script> <script> window.dataLayer = window.dataLayer || []; function gtag() { dataLayer.push(arguments); } gtag('js', new Date()); gtag('config', 'UA-148188386-1'); </script> </head> <body> <div class="wrapper"> <div class="wrapper-inner wrapper-inner-project wrapper-inner--left"> <div class="container-inner"> <ul class="lines lines--grey"> <li></li> <li></li> <li></li> <li></li> </ul><!-- /.lines --> <header class="header"> <div class="overlay visible-mobile"></div><!-- /.overlay --> <div class="shell"> <a href="index.html" class="logo logo--white" data-target="#projects" data-class-in="fadeIn" data-class-out="fadeOut"></a> <a href="#" class="btn-burger"> <span></span> <span></span> <span></span> </a> <nav class="nav"> <ul> <li> <a href="index.html" class="js-attract-hover js-link" data-target="#projects" data-class-in="fadeIn" data-class-out="fadeOut">Projets</a> </li> <li> <a href="index.html" class="js-attract-hover js-link" data-target="#productions" data-class-in="fadeIn" data-class-out="fadeOut">Productions</a> </li> <li> <a href="index.html" class="js-attract-hover js-link" data-target="#savoirs" data-class-in="fadeIn" data-class-out="fadeOut">Savoirs faire</a> </li> <li> <a href="index.html" class="js-attract-hover js-link" data-target="#studio" data-class-in="fadeIn" data-class-out="fadeOut">Le studio</a> </li> <li> <a href="index.html" class="js-attract-hover js-link" data-target="#contact" data-class-in="fadeIn" data-class-out="fadeOut">Contact</a> </li> </ul> </nav><!-- /.nav --> </div><!-- /.shell --> </header><!-- /.header --> <section class="section section--first-alt section--first-secondary section-animate"> <div class="section__bg section__bg--size1" style="background-image: linear-gradient(135deg, #2290ac 0%, #6ee4d7 100%);"></div> <!-- /.section__bg --> <div class="shell"> <header class="section__head section__head--white"> <h2>Formasup Paris</h2> <h1> Création d'un ensemble<br> d'outils numériques </h1> <span class="label-alt"> <i class="ico-dot"></i> Stratégie I Création & Design <br> Développement I Contenus </span> </header><!-- /.section__head --> </div><!-- /.shell --> </section><!-- /.section --> <section class="section section--size6 section-animate"> <div class="shell"> <div class="articles-alt"> <div class="article-secondary scrollme"> <div class="article__image"> <img src="assets/images/temp/phones.png" alt="" width="1187" height="1176" class="hidden-xs hidden-sm hidden-md"> <img src="assets/images/temp/phones-tablet.png" alt="" width="898" height="923" class="hidden-xs hidden-lg"> <img src="assets/images/temp/phones-mobile@2x.png" alt="" width="571" height="905" class="hidden-sm hidden-md hidden-lg"> </div><!-- /.article__image --> <div class="article__content animateme" data-when="enter" data-from="0.8" data-to="0" data-translatey="100"> <h3>Nous avons accompagner Formasup dans sa démarche et sa stratégie numérique</h3> <a href="#text-1" class="btn-square btn-square--border jsToggleTarget hidden-sm hidden-md hidden-lg"> <i class="ico-plus"></i> </a> <p class="article-text" id="text-1"> <strong>Formasup</strong> nous a confié une mission globale d'accompagnement pour concevoir et déployer sa <strong>stratégie numérique</strong>. Création du site web, mais aussi d'une plateforme apprentis, outil de facturation... </p> </div><!-- /.article__content --> </div><!-- /.article-secondary --> <div class="article-tertiary"> <div class="article__image"> <img src="assets/images/temp/grads-mobile@2x.png" alt="" width="414" height="276" class="hidden-sm hidden-md hidden-lg"> <img src="assets/images/temp/laptop.png" alt="" width="1338" height="861" class="hidden-xs"> <img src="assets/images/temp/laptop-mobile@2x.png" alt="" width="701" height="432" class="hidden-sm hidden-md hidden-lg"> </div><!-- /.article__image --> <div class="article__content"> <h3>Accompagnement au plan stratégique digital</h3> <a href="#text-2" class="btn-square btn-square--border jsToggleTarget hidden-sm hidden-md hidden-lg"> <i class="ico-plus"></i> </a> <p class="article-text" id="text-2"> Notre client a identifié les enjeux et a défini ses objectifs. Nous traduisons sa stratégie globale d’entreprise en stratégie digitale. Il s’agit concevoir des <strong>services et des outils</strong> différenciants, de dynamiser l’<strong>image de marque</strong>, de travailler référencement et visibilité, de renforcer les liens avec les apprenants, partenaires pédagogique et entreprises, etc. Cela se traduit par un <strong>plan de campagne</strong>, planifié dans le temps. </p> </div><!-- /.article__content --> </div><!-- /.article-tertiary --> <div class="article-quaternary"> <div class="article__image"> <img src="assets/images/temp/evangeline-shaw-mobile@2x.jpg" alt="" width="414" height="276" class="hidden-sm hidden-mg hidden-lg"> <img src="assets/images/temp/beautiful-beauty-blur.jpg" alt="" width="646" height="419"> </div><!-- /.article__image --> <div class="article__content"> <h3>Image de marque</h3> <a href="#text-3" class="btn-square btn-square--border jsToggleTarget hidden-sm hidden-md hidden-lg"> <i class="ico-plus"></i> </a> <p class="article-text" id="text-3"> Nous avons revisité l’identité, le design et l’iconographie des outils de communication numériques, mis en place un système de pictogrammes originaux, accompagné à la rédaction… </p> </div><!-- /.article__content --> <div class="article__image-after"> <img src="assets/images/temp/grads.jpg" alt="" width="748" height="498" class="hidden-xs"> <img src="assets/images/temp/phone.png" alt="" width="1125" height="715" class="hidden-xs hidden-sm hidden-md"> <img src="assets/images/temp/phone-tablet.png" alt="" width="1011" height="618" class="hidden-xs hidden-lg"> <img src="assets/images/temp/element5-digital-mobile@2x.png" alt="" width="334" height="220" class="hidden-sm hidden-md hidden-lg"> <h5 class="hidden-sm hidden-md hidden-lg">FORMASUP <span>PARIS IDF</span></h5> </div><!-- /.article__image-after --> </div><!-- /.article-quaternary --> <div class="article-tertiary article-tertiary--swap"> <div class="article__image"> <img src="assets/images/temp/webpage.png" alt="" width="1443" height="1417" class="hidden-xs"> <img src="assets/images/temp/students-mobile@2x.jpg" alt="" width="417" height="281" class="hidden-sm hidden-md hidden-lg"> <img src="assets/images/temp/webpage-mobile@2x.png" alt="" width="547" height="875" class="hidden-sm hidden-md hidden-lg"> </div><!-- /.article__image --> <div class="article__content"> <h3>Un site d’information complet</h3> <a href="#text-4" class="btn-square btn-square--border jsToggleTarget hidden-sm hidden-md hidden-lg"> <i class="ico-plus"></i> </a> <p class="article-text" id="text-4"> Le site web a vocation à accueillir des contenus ayant trait à la formation professionnelle. Cette approche va concourir à affirmer l’image de Formasup en tant que spécialiste. Elle renforce son positionnement. Elle doit aussi contribuer à l’amélioration de la visibilité de Formasup avec comme enjeu un accroissement de sa notoriété. </p> </div><!-- /.article__content --> </div><!-- /.article-tertiary article--tertiary-swap --> <div class="article-quinary"> <div class="article__content"> <h3>Les formations placées au cœur du dispositif</h3> <a href="#text-5" class="btn-square btn-square--border jsToggleTarget hidden-sm hidden-md hidden-lg"> <i class="ico-plus"></i> </a> <p class="article-text" id="text-5"> Un important travail a été fait sur les formations proposées par Formasup Paris. Identification par un système d’icônes pour chaque domaine, moteur de recherche avec des filtres adaptés, fiches formations épurées et claires, génération des fiches en pdf… le tout s’appuie sur un back-office parfaitement aux mesures des spécificités du client, capable derécupérer automatiquement des données à partir de services tiers… </p> </div><!-- /.article__content --> <div class="article__image-after"> <img src="assets/images/temp/webpage2.png" alt="" width="1443" height="1319" class="hidden-xs"> <img src="assets/images/temp/phone2.png" alt="" width="741" height="885" class="hidden-xs"> <img src="assets/images/temp/infotable.png" alt="" width="922" height="552" class="hidden-xs"> <img src="assets/images/temp/webpage2-mobile@2x.png" alt="" width="991" height="906" class="hidden-sm hidden-md hidden-lg"> <img src="assets/images/temp/phone2-mobile@2x.png" alt="" width="640" height="732" class="hidden-sm hidden-md hidden-lg"> </div><!-- /.article__image-after --> </div><!-- /.article-quinary --> <div class="article-senary"> <div class="article__image"> <img src="assets/images/temp/phones2.png" alt="" width="935" height="1190" class="hidden-xs hidden-sm hidden-md"> <img src="assets/images/temp/phones2-tablet.png" alt="" width="725" height="1190" class="hidden-xs hidden-lg"> <img src="assets/images/temp/graphic-mobile@2x.png" alt="" width="539" height="703" class="hidden-sm hidden-md hidden-lg"> </div><!-- /.article__image --> <div class="article__content"> <h3>Un site conçu comme un portail de services</h3> <a href="#text-6" class="btn-square btn-square--border jsToggleTarget hidden-sm hidden-md hidden-lg"> <i class="ico-plus"></i> </a> <p class="article-text" id="text-6"> Le site a vocation a évoluer pour devenir le portail d’accès aux services existant ou en cours de développement proposés par Formasup : catalogue des formations, détail des programmes, réservation d’espaces, formation en ligne… Une première étape est la mise en place d’une <strong>plateforme d’offre d’emploi</strong> </p> </div><!-- /.article__content --> </div><!-- /.article-senary --> <div class="article-septenary"> <div class="article__content"> <h3>Une plateforme ouverte aux alternants, aux RH et aux établissements pédagogiques.</h3> <a href="#text-7" class="btn-square btn-square--border jsToggleTarget hidden-sm hidden-md hidden-lg"> <i class="ico-plus"></i> </a> <p class="article-text" id="text-7">Annonces ciblées, chat interne, comptes spécifiques et profilés (RH, appentis, anciens, parteanires…), annonces réservées à certains cursus, gestion et modération en back-office, alertes… </p> <!-- /.article-text --> </div><!-- /.article__content --> <div class="article__image-after"> <img src="assets/images/temp/webpage3.png" alt="" width="1443" height="1697" class="hidden-xs"> <img src="assets/images/temp/phone3.png" alt="" width="479" height="765" class="hidden-xs"> <img src="assets/images/temp/phones2-mobile@2x.png" alt="" width="654" height="1592" class="hidden-sm hidden-md hidden-lg"> </div><!-- /.article__image-after --> </div><!-- /.article-septenary --> <div class="article-octonary"> <div class="article__image"> <img src="assets/images/temp/evangeline-shaw.jpg" alt="" width="885" height="590"> </div><!-- /.article__image --> <div class="article__content"> <blockquote class="blockquote blockquote--secondary"> <i class="ico-quote-top">“</i>Nous souhaitons nous positionner à l'avenir comme un écosystème global de formation. Il paraissait naturel de commencer par poser notre stratégie numérique globale. <i class="ico-quote-bottom">”</i> </blockquote><!-- /.blockquote --> </div><!-- /.article__content --> <div class="article__image-after"> <img src="assets/images/temp/element5-digital.jpg" alt="" width="943" height="625"> </div><!-- /.article__image-after --> </div><!-- /.article-octonary --> <div class="article-alt article-alt--septenary-alt"> <div class="article__content"> <h3>Compétences mises en œuvre sur ce projet :</h3> </div><!-- /.article__content --> <div class="features"> <div class="feature feature--primary"> <h6> Stratégie <a href="#" class="btn-square btn-square--border visible-mobile"> <i class="ico-plus"></i> </a> </h6> <ul class="dropdown-menu"> <li> <span>Stratégie digitale</span> <i class="ico-dot ico-dot--gray"></i> </li> <li> <span>Stratégie de contenus</span> <i class="ico-dot ico-dot--gray"></i> </li> <li> <span>Brand Experience</span> <i class="ico-dot ico-dot--gray"></i> </li> <li> <span>Architecture de l’information</span> <i class="ico-dot ico-dot--gray"></i> </li> <li class="feature-disabled"> <span>Campagnes médias digitaux</span> <i class="ico-dot ico-dot--gray"></i> </li> </ul> </div><!-- /.feature --> <div class="feature feature--primary"> <h6> Création & Design <a href="#" class="btn-square btn-square--border visible-mobile"> <i class="ico-plus"></i> </a> </h6> <ul class="dropdown-menu"> <li> <span>Concepts & idées</span> <i class="ico-dot ico-dot--gray"></i> </li> <li class="feature-disabled"> <span>Concepts produits </span> <i class="ico-dot ico-dot--gray"></i> </li> <li> <span>Direction artistique </span> <i class="ico-dot ico-dot--gray"></i> </li> <li> <span>Branding & Identité </span> <i class="ico-dot ico-dot--gray"></i> </li> <li> <span>Web & Mobile UI </span> <i class="ico-dot ico-dot--gray"></i> </li> <li class="feature-disabled"> <span>Design d’applications </span> <i class="ico-dot ico-dot--gray"></i> </li> <li class="feature-disabled"> <span>Design d’interactions</span> <i class="ico-dot ico-dot--gray"></i> </li> </ul> </div><!-- /.feature --> <div class="feature feature--primary"> <h6> Développement <a href="#" class="btn-square btn-square--border visible-mobile"> <i class="ico-plus"></i> </a> </h6> <ul class="dropdown-menu"> <li> <span>Front & Back End </span> <i class="ico-dot ico-dot--gray"></i> </li> <li class="feature-disabled"> <span>Applications mobiles natives</span> <i class="ico-dot ico-dot--gray"></i> </li> <li class="feature-disabled"> <span>Applications Web Progressive</span> <i class="ico-dot ico-dot--gray"></i> </li> <li class="feature-disabled"> <span>Gamification </span> <i class="ico-dot ico-dot--gray"></i> </li> <li > <span>CMS / CRM</span> <i class="ico-dot ico-dot--gray"></i> </li> <li> <span>Recueil & analyse de données</span> <i class="ico-dot ico-dot--gray"></i> </li> </ul> </div><!-- /.feature --> <div class="feature feature--primary"> <h6> Contenus <a href="#" class="btn-square btn-square--border visible-mobile"> <i class="ico-plus"></i> </a> </h6> <ul class="dropdown-menu"> <li class="feature-disabled"> <span>Production photo & video </span> <i class="ico-dot ico-dot--gray"></i> </li> <li> <span>Rédaction</span> <i class="ico-dot ico-dot--gray"></i> </li> <li class="feature-disabled"> <span>Animation</span> <i class="ico-dot ico-dot--gray"></i> </li> <li class="feature-disabled"> <span>Illustration</span> <i class="ico-dot ico-dot--gray"></i> </li> </ul> </div><!-- /.feature --> <div class="feature feature--primary"> <h6> Tests <a href="#" class="btn-square btn-square--border visible-mobile"> <i class="ico-plus"></i> </a> </h6> <ul class="dropdown-menu"> <li> <span>Tests d’utilisabilité</span> <i class="ico-dot ico-dot--gray"></i> </li> <li> <span>Tests de performances</span> <i class="ico-dot ico-dot--gray"></i> </li> <li> <span>Tests des fonctionnalités</span> <i class="ico-dot ico-dot--gray"></i> </li> <li> <span>Tests de sécurité</span> <i class="ico-dot ico-dot--gray"></i> </li> </ul> </div><!-- /.feature --> </div><!-- /.features --> </div><!-- /.article --> </div><!-- /.articles --> </div><!-- /.shell --> </section><!-- /.section --> <footer class="footer footer--alt"> <div class="shell"> <div class="footer__inner"> <div class="footer__content"> <a href="index.html" class="logo logo--small"></a> <ul> <li> <a href="tel:330184204456">+33 (0) 1 84 20 44 56</a> </li> <li> <a href="mailto:contact@studio-brik.com">contact@studio-brik.com</a> </li> </ul> <div class="socials"> <ul> <li> <!-- <a href="#" class="js-popup" data-target="#popup1"> --> <a href="https://goo.gl/maps/6SjEKhnkwKWh5Ltb7" target="_blank"> <i class="ico-location"></i> </a> </li> <li> <a href="https://www.linkedin.com/company/studio-brik" target="_blank"> <i class="ico-linkedin"></i> </a> </li> <li> <a href="https://www.instagram.com/studiobrik/" target="_blank"> <i class="ico-insta"></i> </a> </li> </ul> </div><!-- /.socials --> </div><!-- /.footer__content --> </div><!-- /.footer__inner --> </div><!-- /.shell --> </footer><!-- /.footer --> <div class="popup" id="popup1"> <div class="popup__inner"> <a href="#" class="popup__btn js-popup" data-target="#popup1"> <i class="ico-x"></i> </a> <p> Nous vous remercions pour cette prise de contact. Le temps pour nous de traiter votre demande. </p> </div><!-- /.popup__inner --> </div><!-- /.popup --> <div class="widget-load"> <i class="logo-white widget__logo"></i> </div><!-- /.widget-load --> </div><!-- /.container-inner --> </div><!-- /.wrapper-inner --> </div><!-- /.wrapper --> <script src="assets/vendor/jquery-1.11.3.min.js"></script> <script src="assets/vendor/jquery-scrollLock.min.js"></script> <!-- <script src="assets/vendor/jquery.scrollme.min.js"></script> --> <script src="assets/vendor/attractHover.js"></script> <script src="assets/js/bundle.js"></script> </body> </html>