?>

PATRICK JOUBERT

Conception, développement d'application métiers et sites internet depuis 2004.

Châtellerault, Paris ou ailleurs.

 
"Les Passés dans le Présent"
replier |x|
Technos

Drupal, php, less, css, html, javascript, jquery,

2017

"Les Passés dans le Présent"

Conception et réalisation du site du Labex "Les Passés dans le Présent" pour l'Université de Paris X Nanterre

 • Drupal, php, less, css, html, javascript, jquery,

En savoir +

Conception et réalisation du site du Labex "Les Passés dans le Présent" pour l'Université de Paris X Nanterre :

  • Développements de modules Drupal;
  • Création de thème;
  • Site Bilingue

Projet mené à bien avec les collègues du Collectif Sur le toit

Identité visuelle créée par l'Endroit

 

La présentation du Labex :

Le Labex Les passés dans le présent : histoire, patrimoine, mémoire / Pasts in Present porte sur la présence du passé dans la société contemporaine. Il s’attache plus spécifiquement à comprendre les médiations de l’histoire à l’ère du numérique, les politiques mémorielles, les appropriations sociales du passé en amont et en aval des politiques patrimoniales.


Porté par l’Université Paris Ouest Nanterre La Défense, en association avec le CNRS, il fédère sur le campus de Nanterre la Maison Archéologie et Ethnologie, René-Ginouvès (MAE), les laboratoires Archéologies et sciences de l’antiquité (ArScAn), Préhistoire et technologie, Laboratoire d’ethnologie et de sociologie comparative (LESC), Institut des sciences sociales du politique (ISP), Modèles, Dynamiques, Corpus (Modyco), l’équipe de recherche Histoire des Arts et Représentations (HAR), ainsi que la Bibliothèque de documentation internationale contemporaine (BDIC).

Trois institutions patrimoniales majeures sont également partenaires : la Bibliothèque nationale de France (BnF), le Musée d’Archéologie nationale (MAN), à Saint-Germain-en-Laye, le Musée du Quai Branly (MQB).

replier |x|
 
Festival Onze 2015
replier |x|
Technos

Drupal, less, css, html, javascript

2015

Festival Onze 2015

Réalisation avec Drupal de la nouvelle édition du Festival Onze.

En savoir +

Pour cette édition, qui acte 10 ans de collaboration, le site est toujours propulsé par Drupal (http://drupal.org).

 

replier |x|
 
ASCEA
replier |x|
Technos

Drupal, css & less, jquery & co

2015

ASCEA

Conception et réalisation technique du site internet de l'association avec gestion des membres, importation d'albums photos, actualités, etc...

En savoir +

Réalisation du site de "L'association Sportive du CEA Grand Rué".

Au menu des fonctionnalités développées :

• Une page d'accueil personnalisable;

• Des actualités;

• Intégration d'albums photos en provenance de Flickr

• Création d'un espace pour chaque section sportive

• Gestion des membres et mise en place de tableaux de bord pour le suivi des cotisations et de  statistiques de répartition

 

Le design du site a été réalisé par Jean François Long-Delourme aka http://www.peterpank.com/

replier |x|
 
CELLF
replier |x|
Technos

Drupal, jquery, less, css, html

Vagrant, git,

2014

CELLF

Commanditaire :Sorbonne

Conception fonctionnelle et réalisation technique du site du CELLF de l'Université Paris Sorbonne et du CNRS

• Drupal, jquery, javascript, less, css, html, Vagrant, git

En savoir +

Objectifs du projet

Ce projet de refonte refonte du site du CELLF, que j'avais déjà réalisé en 2007, comportait plusieurs objectifs :

  • Reprise et migration des données existantes pour les intégrer dans la nouvelle architecture Drupal
  • Ajout d'un laboratoire supplémentaire, le CELLF 19-21
  • Ajout de nouvelles fonctionnalités pour chacun des laboratoires et pour le Centre
    • agenda,calendriers
    • actualités
    • Pages d'accueil des laboratoires modulaires
    • Mise en valeur des contenus des programmes de recherche
  • Design complètement repensé et plus actuel

 Séquencement

Ce projet de 6 mois a été découpé en 4 phases principales (et classiques d'un projet)

  1. Conception d'une "maquette fonctionnelle" dont la vocation est de lister toutes les fonctionnalités présentes sur l'intégralité des futures pages et d'élaborer un story board de la navigation
  2. Conception de la maquette graphique : recherche des pistes graphiques puis application de ces recherches au cas concret des pages déterminées par la maquette fonctionnelle
  3. Développement des fonctionnalités :
    • Création de modules drupal adhoc
    • Templates sur mesure
  4. Intégration html du design

Suivi

 Pour assurer le suivi des remarques, améliorations et anomalies, un outil de suivi dédié a été développé. En centralisant toutes les remarques, il permet :

  • d'avoir une vision globale des différents chantiers ouverts, en cours et résolus (tant du point de vue du développement que de celui du client);
  • d'éviter de nombreux mails et donc facilite le suivi du projet pour le client;
  • Un nombre conséquents de remarques concernant l'utilisation du logiciel, cet outil constitue une base de connaissance à laquelle le client peut se référer.

La formation à l'utiilisation du back office s'est faite par la réalisation de tutoriels vidéos qui abordent progressivement les différents aspects de la gestion éditoriale de ce site.

 

Liste des technos utilisées :

Drupal : http://www.drupal.org

Jquery : http://jquery.com/

Less : http://lesscss.org/

Vagrant : http://www.vagrantup.com/ (intégration VMware)

Git : http://git-scm.com/

 

Crédits

Veronica Holguin (Miloeil) a concu et réalisé le design

Projet effectué dans le cadre du collectif Surletoit

replier |x|
 
Obvil
replier |x|
Technos

Drupal, less & css, jquery & co

2014

Obvil

Laboratoire d’excellence (label Labex) de "La Sorbonne Paris 4"

Réalisation technique du site et petite couche d'intégration html pour les différents corpus

En savoir +

Réalisation du site qui comporte :

- Un espace de présentation des différents projets du Labex;

- Une gestion des actualités générales du Labex et de chaque projet

- Un partie "Carnets de recherche" ;

- Et d'autres choses (bibliothque, partenaires et institutionnels, etc....)

 

En plus de ce travail, une couche d'intégration html a été appliquée sur les gabarits de présentation des différents corpus.

Un exemple est visible ici  http://obvil.paris-sorbonne.fr/corpus/moliere/moliere_amants-magnifiques-livret/

 

La conception et le design ont été réalisés par Mikaël Cixous (http://www.mikaelcixous.net)

replier |x|
 
Endosense
replier |x|
Technos

Cms Made simple, css, jquery

2013

Endosense

Reprise du développement et de l'intégration du site Endosense

En savoir +

Reprise du développement et de l'intégration du site Endosense pour ajouter de nouveaux gabarits fonctionnels.

replier |x|
 
Revue scientifique du Conservatoire National de Musique de Paris
replier |x|
Technos

lodel, php, jquery, html, css,

2013

Revue scientifique du Conservatoire National de Musique de Paris

Commanditaire :Smart Agence

Conception et réalisation du site de la Revue scientifique du Conservatoire National de Musique de Paris.

• Lodel, php, jquery, html, css

En savoir +

Conception et réalisation du site de la Revue scientifique du Conservatoire National de Musique de Paris.

 

Au delà du développement des fonctionnalités et de l'intégration l'une des problèmatiques a été de résoudre l'inclusion des images (souvent des extraits de partition) au sein des blocs de texte. Lodel, cms dédié à la publication sociologique, n'est pas nativement "équipé" avec cette possibilité.

J'ai donc créé le code ad hoc --> un  exemple ici

 

Site réalisé pour le compte de Smart Agence

replier |x|
 
ICI - Itinéraire Culture Industrielle
replier |x|
Technos

Spip, php, javascript, jquery, html, css,

2012

ICI - Itinéraire Culture Industrielle

Commanditaire :Orbe

Site dédié à la culture industrielle franco-belge.

• Conception fonctionnelle

• développemente et intégration du site

 

En savoir +

Site dédié à la culture industrielle franco-belge.

Conception fonctionnelle, développement et intégration du site.

Projet mené à bien dans le cadre du collectif Surletoit

replier |x|
 
Festival Onze - 2012
replier |x|
Technos

Spip, xhtml, css, jquery, javascript,

2012

Festival Onze - 2012

Commanditaire :Festival Onze

Depuis 2003, l'équipe du Festival Onze, me fait confiance pour la réalisation du site internet du Festival "Onze Bouge"

En savoir +

Depuis 2003, l'équipe du Festival Onze, me fait confiance pour la réalisation du site internet du Festival "Onze Bouge".

replier |x|
 
Centre de Recherches Historiques
replier |x|
Technos

Lodel, xhtml, jquery

2011

Centre de Recherches Historiques

Commanditaire :EHESS

Réalisation et intégration avec Lodel du site du Centre de Recherches Historiques de l'EHESS.

En savoir +

Réalisation et intégration avec Lodel du site du Centre de Recherches Historiques de l'EHESS.

replier |x|
 
Elephant And Castles
replier |x|
Technos

Spip, xhtml,css, javascript

2010

Elephant And Castles

Le site du label innovant Elephant And Castles

Vous pourrez y écouter des albums et plonger dans les univers atypiques des artistes de ce label.

• Développement et intégration html, css, javascript.

En savoir +

Le site du label innovant Elephant And Castles

Vous pourrez y écouter des albums et plonger dans les univers atypiques des artistes de ce label

replier |x|
 
La Compagnie "Un Soir Ailleurs"
replier |x|
Technos

Spip, xhtml, css

2010

La Compagnie "Un Soir Ailleurs"

Développement sous spip et intégration du site pour la compagnie de danse "Un Soir Ailleurs" 

Design réalisé par Jean-Marc Dumont (L'endroit )

Projet concrétisé dans le cadre du collectif Surletoit

En savoir +

Développement sous spip et intégration du site pour la compagnie de danse "Un Soir Ailleurs" 

Design réalisé par Jean-Marc Dumont (L'endroit )

Projet concrétisé dans le cadre du collectif Surletoit

replier |x|
 
Société Française de Musicologie
replier |x|
Technos

lodel, cakephp, xhtml, jquery, css

2008

Société Française de Musicologie

Commanditaire :Société Francaise de Musicologie

A partir d'un site statique, créer un site dynamique utilisant le CMS Lodel

• Développement php, Lodel - Intégration html, css, jquery,javascript

En savoir +

Objectif de ce projet :

A partir d'un site statique, développer un site dynamique qui utilisera le cms lodel

La première phase du travail a consisté à analyser le contenu des pages html (10 Mo de texte) et à les injecter dans une base de données. Après vérification par la SFM, ces données ont été ensuite intégrées dans la base de Lodel

Pour réaliser cette étape j'ai développé un outil avec cakephp. Ce qui a donné naissance à un mini site de validation (via des formulaires, etc..) dont le but était de permettre aux utilisateurs de la SFM de vérifier l'exactitude des donnée importées et de profiter de cette phase pour faire une première mise à jour.

La deuxième phase, le transfert des données vers Lodel, a été réalisée en créant, encore une fois avec cakephp, un outil de correspondance entre les deux bases de données. Cet outil permettait l'importation et la synchronisation des deux modèles de données.

Ensuite le travail de développement des gabarits selon la logique de Lodel a pu commencer. Pour faciliter l'accès aux détails des différentes publications, revues, etc..., nous avons avec Jean-Marc Dumont imaginé un petit système de consultation. Côté technique c'est combinaison de la bibliothèque jquery avec un développement de code Ajax spécifique pour communiquer avec Lodel.

Il ne restait plus ensuite qu'à intégrer les maquettes graphiques

Ce projet a duré 6 mois.... le temps nécessaire pour imaginer, concevoir, discuter et trouver un système qui convienne aux utilisateurs

Ce projet est réalisé dans le cadre du collectif Surletoit dans lequel j'ai des billes.... enfin quelques unes.

replier |x|
 
La Maison de l'Europe à Paris
replier |x|
Technos

Spip, xhtml, css, php

2006

La Maison de l'Europe à Paris

Commanditaire :Maison de l'Europe de Paris

Développement du site de la Maison de L'Europe de Paris.

En savoir +

En partenariat avec doodesign nous avons réalisé le site de la Maison de l'Europe à Paris : www.paris-europe.eu

Cette association à pour but de promouvoir l'Europe (débats, rencontres, manifestations...)

J'ai assuré la conception et le développement de la partie SPIP et PHP de ce site sur la base des gabarits xhtml de doodesign.

replier |x|
 
Catalogue de films pour CinéArchives
replier |x|
Technos

Spip, xhtml, css

2006

Catalogue de films pour CinéArchives

Réalisation, avortée, du catalogue de films de Cinéarchives

En savoir +

CinéArchives souhaitait mettre en ligne son catalogue de films pour en faire un éventuel portail de référence sur le film militant.

Après plusieurs réunions et quelques semaines une maquette fonctionnelle est validée. L'un des souhaits du client est d'offrir une navigation au sein de listes parfois longues. Un système de défilement de fiches au sein d'une liste, ainsi qu' un mécanisme de "panier" de fiches a été implémenté.
Le "panier" de fiches permet à l'internaute de constituer, au fur et à mesure de sa visite, sa sélection de fiches. Sélection qu'il peut consulter quand il le désire.

Alors que le site pouvait être mis en ligne, le client a décidé de faire appel à une SSII. Cette société propose une solution qui couple un logiciel spécialisé dans la gestion de fiches documentaires avec un site internet . Il désirait faire de son site un outil dédié aux documentalistes. Ce qui sortait du cadre de ce projet.

La conclusion est qu'il est toujours difficile et crucial de bien comprendre les attentes des clients. En effet, les envies et les besoins évoluent durant la phase de conception. Ce qui semble évident, ou plus exactement, la perception par le client des fonctionnalités d'un site reste abstraite jusqu'à la réalisation des premières pages du site. De même de notre côté, il faut être très attentif aux mots utilisés par le client. Certains peuvent mettre en évidence un décalage entre le projet (cahier des charges, maquette fonctionnelle, etc... ) et l'idée de site qu'en a le client. C'est ce qui s'est passé ici.

Ce site était conforme à la norme xhtml transitional et css2.

replier |x|
 
replier |x|
Technos

xhtml, css.

2003

Festival Onze

Commanditaire :Festival Onze

Intégration et développement de l'édition 2003 du Festival Onze

En savoir +
replier |x|