Direction Artistique

  • SAEMES

    Ce projet a impliqué la conception UX et UI, le développement, l’intégration, l’optimisation SEO et laisse place actuellement à la Tierce Maintenance Applicative.  L’objectif de cette refonte était l’optimisation de l’expérience utilisateur par un effort UX et par l’amélioration des fonctionnalités proposées. Une attention toute particulière a été apportée à la performance du site sur notre plateforme optimisée pour Drupal 8.

     

    Enjeux du projet 

    • Création et développement de la plateforme avec Drupal 8 ;
    • Conception UX et UI ;
    • Déclinaison en Responsive Design ;
    • Script d’import de données ;
    • Migration des contenus ;
    • Bilinguisme : français et anglais.

    Particularités UX

    • Un moteur de recherche au centre de la page d’accueil pour proposer la fonctionnalité de recherche dès l’arrivée de l’utilisateur sur le site ;
    • Un menu burger latéral droit pour ne pas surcharger l’utilisateur avec un menu complexe ;
    • Une bulle "Contact" fixée sur la navigation pour accompagner et rassurer l’utilisateur en cas de questions ou de besoin de contact ;
    • Un formulaire d’abonnement en plusieurs étapes pour ne pas surcharger l’utilisateur en information avec un long questionnaire.

     

    Développements particuliers

    • Les scripts d’import de données vers Drupal pour alimenter le site par import de données (fichiers CSV) sans saisie manuelle notamment pour les parkings, les tarifs, les services.
    • Le moteur de recherche avec un champ libre de saisie par auto-complétion pour la recherche de parkings.
    • Le système de tri avec des filtres à facette et une carte interactive pour la recherche de parking à proximité.
    • Le formulaire d’abonnement à des offres de stationnement en plusieurs étapes, avec le module Webform.
    • La médiathèque pour le sockage et le partage de fichiers multimédias avec les modules Media et Entity Browser.
    • La newsletter pour partager des informations sur les services et les offres en cours de la SAEMES, avec la solution Mailjet.
    • La migration des  contenus du site Drupal 7 vers Drupal 8 avec les modules Migrate API , Migrate Drupal UI et des scripts d’imports complémentaires.

    Front-end -
    Le front-end repose sur notre blank theme Foundation 6.

     

    Membres de l’équipe projet :
    Nicolas Moinet, Rida Maksour, Aman Barakat, Walid Ibrahim, Ryad Karar, Marion Le Roux, Rouaida Roumieh, Laurent Lemoing et Myriam Achnad.

     

    Date de mise en production : septembre 2018

    Accéder au site : www.saemes.fr

  • Confédération Générale du Travail

    Périmètre de notre mission : un travail d’analyse SEO et des personas, la conception UX et UI, le développement avec Drupal 8, la migration des contenus depuis le CMS Spip, l’intégration front-end. Aujourd’hui, nous accompagnons la CGT dans le cadre de la Tierce maintenance Applicative préventive, corrective et évolutive ainsi que de l’hébergement.

     

    Enjeux du projet 

    • Optimisation de l’expérience utilisateur et modernisation du design par l’analyse des personas et la conception UX et UI ;
    • Création et développement d’une plateforme avec Drupal 8 ;
    • Déclinaison en Responsive Design ;
    • Migration des données de SPIP vers Drupal ;
    • Mise en place de l’espace militant ;
    • Sauvegarde du référencement SEO.

    Particularités UIX

    • Conception d'un site "magazine" ;
    • Mega-menu plein écran permettant une recherche selon plusieurs axes ; 
    • Formulaire de syndicalisation en trois étapes, rapide et intuitif, accompagné du paiement en ligne des cotisations.

    Développements particuliers

    • Un espace militant proposant aux utilisateurs la création, la gestion, la publication et le téléchargement de contenus (articles, dossiers, fichiers). Les utilisateurs peuvent gérer leur profil et accéder à des forums de discussions.
    • Un moteur de recherche Apache Solr qui indexe les contenus du site ainsi que les ressources documentaires.
    • Un mega menu plein écran qui propose des parcours par thèmes (secteurs d’activité, géographie et thématiques) et par types de contenus (Actualités, dossiers, WebTV, agenda et communiqués de presse). 
    • Un carte interactive permettant de rechercher un établissement CGT à proximité. 
    • Une WebTV pour diffuser des contenus vidéos de la confédération.
    • La migration des contenus de Spip vers Drupal 8.

    Front-end

    Le front-end a été réalisé avec Foundation 6.

     

    Membres de l’équipe projet :
    Ryad Karar, Marion Leroux, Ludovic Coullet, Rida Maksour, Elie Choufani, Elie Nassar, Rouaida Roumieh, Laurent Lemoing et Christophe Dugué.

     

    Date de mise en production : novembre 2018.

    Accéder au site : www.cgt.fr

  • Acensi

    Outils utilisés :
    Drupal 8 - GIT- modules contribués Drupal

    Enjeux du projet :
    - Refonte du site avec Drupal 8 ;
    - Réalisation graphique et ergonomique du site - UX et UI design ;
    - Webdesign avancé pour chaque page du site ;
    - Structure de contenu ; 
    - Theming responsive.

    Développements particuliers :
    - Structuration éditoriale du contenu grâce à la mise en place d’une dizaine de types de paragraphes - module Paragaphs ;
    - Mise en place d’un layout Full Responsive Design fluide pour adapter l’affichage ;
    - Mise en place d’un carrousel responsive flexible et swip event supported pour les animations notamment en page d’accueil grâce au module Slick Carousel - Ce carrousel s’adapte aussi bien sur desktop, tablettes et Smartphone et permet de faire défiler les slides au toucher ;

    Front-end :
    Thème responsive de Foundation 6 et CSS3, dont les librairies JavaScript suivantes :
    - Accordion ;
    - Drop Down ;
    Et le module Slick Carousel cité plus haut. 

    Membres de l’équipe projet :
    Ludovic Coullet, Joseph Agnastios, Lara Zaki, Rouaida Roumieh, Aman Barakat, Ahmad Rizk, Ryad Karar, Christophe Dugué

    Date de mise en production : Avril 2017

    Accéder au site : acensi.fr

  • Takoma

    test utilisation body

  • Groupe SAMSE

    Enjeux du projet :

    - Refonte du site avec Drupal 8 ;
    - Réalisation graphique et ergonomique du site ;
    - Architecture de l’information ;
    - Theming responsive.


    Développements particuliers :
    - Structuration éditoriale du contenu grâce au module Paragaphs ;
    - Mise en place d’un layout Full Responsive Design fluide pour adapter l’affichage en utilisant toute la largeur de l’écran quelle que soit sa taille. Le contenu est adapté à 100% de la largeur avec une marge horizontale ;
    - Moteur de recherche Drupal.


    Frontend :
    Thème responsif de Foundation 6 et le CSS3, dont les librairies JavaScript suivantes :
    - Sticky
    - Accordion
    - Reveal


    Membres de l’équipe projet :
    Christophe Dugué, Lara Zaki, Rouaida Roumieh, Ryad Karar.
    Et merci à Joël ! :)


    Date de mise en production : Septembre 2016.

  • Stars of Science

    Enjeux du projet

    - Création et développement du site Drupal 7 ;
    - Conception graphique et ergonomique du site ;
    - Architecture de l’information ;
    - Responsive Design ;
    - Bilinguisme : traduction anglais et arabe.


    Développements particuliers :
    - Intégration d’une vidéo full height en page d’accueil ; 
    - Affichage de la galerie photo en pop-up full height ;
    - Galerie vidéos et affichage des vidéos en full width ;
    - Création de liste ordonnée de nœuds pour la mise en évidence de certains éléments d’une section avec le module NodeQueue ;
    - Personnalisation du fil d’Ariane selon les termes spécifiques choisis grâce au module Custom Breadcrumbs ;
    - Gestion des champs conditionnels dépendants avec le module Conditonal fields.


    Front-end :
    Le front-end a été réalisé avec un thème responsif de Foundation 6, dont les librairies Dropdown, Reveal, Off-canvas, Accordion Menu, Sticky.
    ... Ainsi que les librairies Javascript suivantes :
    Jquery.youtube Background.js, Lightgallery.js.


    Membres de l’équipe projet :
    Joseph, Rouaida, Ryad, Laurent, Walid, Aman et Fouad.


    Date de mise en production : août 2016


    Accéder au site : starsofscience.com

  • APHM Excellence

    Enjeux du projet :
    - Conception contrainte à partir de l'instance initiale du site de l'APHM ;
    - Réalisation graphique et ergonomique du site - UX et UI design ;
    - Structure de contenu ; 
    - Accompagnement au déploiement, à la mise en production et à la prise en main du projet ;
    - Theming responsive.

    Développements particuliers :
    - La page liste des actualités de la page d’accueil ne présente pas le même nombre par défaut, grâce au module Infinite Scroll avec un form_alter (custom) ;
    - Optimisations SEO malgré la structure du site en one-page.


    Front-end :
    Thème responsive de Foundation 6 et CSS3.

    Membres de l’équipe projet :
    Rida Maksour, Rouaida Roumieh, Aman Barakat, Ryad Karar.

    Date de mise en production : Mars 2017

    Accéder au site : http://excellence.ap-hm.fr

  • Ciotabus

    Enjeux du projet : 
    -     Refonte graphique, ergonomique du site ;
    - Développement du site avec Drupal 7 ;
    - Theming responsive de la nouvelle version du site ;
    - Accostage à l'API le pilote - Informations itinéraires.

    Développements particuliers : 
    - Utilisation de la distribution Panopoly (et panelizer) - Utilisation de plusieurs layouts, déplacement des blocs par "drag and drop", ajout des blocs directement sur la page.
    - Le module Panelizer est configuré pour administrer les noeuds de contenu.
    - Le module Fieldable Panel Pane est utilisé pour la création de blocs dynamiques. Il permet de les afficher dans les différentes pages du site.
    - Le plugin SwiperJS est utilisé pour le slideshow responsif. Les modules Views Slideshow et Views Slideshow Swiper JS sont configurés. 
    - L'accostage à l'API du pilote a été effectué par l'intermédiaire d'un module sur-mesure documenté. Ce module gère la connexion à l'API et permet l'affichage des horaries des lignes et des itinéraires entre un point de départ et d'arrivée. 

    Front-end : 
    Le thème du site est un sous-thème basé sur Omega 4.
    Il utilise SASS comme syntaxe compilée par Compass pour la génération de fichiers CSS.
    Thème responsif, html5.

    Membres de l'équipe projet :
    Lara, Rouaida, Ryad, Ludovic, Aman, Laurent, Christophe. 

    Date de mise en production : Janvier 2016.

    Accéder au site : ciotabus.fr

  • Cisbio

    Modules clés / Thèmes / Distribution : 
    Multilinguisme - Performance - Omega4 - Modules sur-mesure

    Membres de l'équipe projet :
    Joseph Aghnatios, Rouaida Roumieh, Christophe Dugué

  • APHM

    Enjeux du projet : 
    -     TMA du site, migré vers Drupal7, depuis 2012;
    - Refonte graphique et ergonomique du site ;
    - Theming responsive de la nouvelle version du site ;
    - Intégration avancée SolR.

    Développements particuliers : 
    - Intégration des modules Panels et Panelizer ;
    - Impression pdf avancée ;
    - Développement d'un module sur-mesure permettant la recherche des services ;
    - Scripts de nettoyage des contenus migrés ;

    Date de mise en production : Décembre 2015.

Pages