1. Projet « PPCM »
Plateforme de Partage
de Contenus Multimédia
Développement d’une plateforme
de diffusion et de partage de
contenus multimédia

2. Rappel
• Les activités du projet sont à réaliser
▫EN GROUPE
de 2 ou 3

3. 1er exemple
• La photothèque de l’UniGe
▫ http://phototheque.unige.ch/
▫ Déjà étudié lors de la première activité
 Méta-données
 Mots-clés

4. 2ème exemple
• Wikimedia Commons
▫ http://commons.wikimedia.org/wiki/Accueil
▫ A visionner
 http://youtu.be/7SI2IpNtv5U

5. 3éme exemple
• Flickr
▫ http://www.flickr.com/
▫ A visionner
 http://youtu.be/ySJfBcfQpt4

6. 4éme exemple
• 500px
▫ http://500px.com
▫ A visionner
 http://youtu.be/x728Sc3B5uE

7. 5ème exemple
• Visualrecipes
▫ http://visualrecipes.com/
▫ A visionner
 http://youtu.be/4I4aFkDVNLU

8. CMS / SGC
• A visionner
▫ http://youtu.be/p5KzwWKE5iQ

9. Drupal
• http://drupal.org

10. Drupal
• Drupal propose un mécanisme flexible
▫ Un « cœur » qui propose des fonctions de base:
 Par exemple la gestion des utilisateurs
▫ Un eco-système de modules:
 Qui permettent d’étendre et de spécialiser Drupal
dans de nombreuses directions
 Par exemple modules de e-commerce.

11. Drupal
• Drupal est une solution utilisée sur le marché
par de nombreuses entreprises et organisations:
▫ Vous pouvez voir un certain nombre d’exemples
de sites réalisés avec Drupal à
 http://drupal.org/case-studies
▫ La gamme de sites possibles est très large:
 E-commerce
 Arts
 Education
 Administration
 …

12. Drupal
• Whitehouse.gov
using Drupal

13. Drupal Gardens
• http://www.drupalgardens.com/

14. Drupal Gardens
• Drupal Gardens est un site professionnel
▫ Il propose des solutions hébergées de Drupal.
 Moins souple que si vous installez Drupal vous-même,
mais beaucoup plus simple à réaliser (pas de
configuration du serveur, pas d’installation de Drupal…)
 Drupal est pré-installé
 Avec une liste de modules limitées qui peuvent être activés
ou non.
 Il n’est pas possible d’ajouter de nouveaux modules.
 Avec la possibilité de choisir plusieurs « modèles » de
sites prédéfinis
 Ou de créer sa propre version en choisissant soi-même la
liste des modules à activer.

15. Drupal Gardens
• Drupal Gardens
▫ Chaque module peut être adapté et configuré
depuis l’interface d’administration en ligne.
▫ Par exemple, vous pouvez définir vous-même quel
sera le profil type des utilisateurs de votre
plateforme en choisissant et en définissant quelles
informations chaque utilisateur aura à remplir
lorsqu’il s’inscrira: ses nom et prénom, son hobby,
son style de musique préféré… de façon à adapter
le profil utilisateur aux objectifs de votre
plateforme.

16. Drupal Gardens
• Plusieurs formules
▫ Drupal Gardens propose plusieurs formules
d’abonnement
 La version gratuite/free est la plus limitée
 Elle permet de prototyper son site complètement dans
une configuration du serveur limitée.
 Puis de passer à une formule payante adaptée une
fois le site complètement finalisé.

17. Drupal Gardens
• Plusieurs formules

18. Drupal Gardens
• Pour ouvrir un compte et un site Drupal
▫ Sélectionner l’offre free/starter (par défaut)
▫ 1ère étape: signup
 Adresse du site, identifiant/mot de passe Drupal
Gardens
▫ 2ème étape: template
 Choix du template
▫ 3ème étape
 Création du site
▫ 4ème étape
 Invitation du reste de l’équipe

19. Drupal Gardens
• Ouvrir un compte Drupal Gardens
▫ Signup

20. Drupal Gardens
• Choix du template
▫ Choisir « Create your own template »
▫ N’activez aucune « features »

21. Drupal Gardens
• Création du site

22. Drupal Gardens
• Finalisation de la création du site

23. Drupal Gardens
• Un seul membre du groupe de projet crée un
site:
▫ exemple.drupalgardens.com
• Il invite le ou les autres membres de son groupe
▫ Depuis le menu « People »

24. Drupal Gardens
• Il invite le ou les autres membres de son groupe
▫ Depuis le menu « People »

25. Drupal Gardens
• Une fois que l’invité a confirmé son invitation
▫ L’invité reçoit un email à son adresse pour lui
fournir la marche à suivre.
• Le nouvel utilisateur apparaît dans la liste des
utilisateurs du panneau « People »
▫ Par défaut il est seulement « Authenticated user ».
▫ Editez le compte et attribuez lui les rôles
« Administrator » et « Site Maintainer ».

26. Drupal Gardens
• Chaque membre du groupe dispose d’un compte
qui lui permet d’administrer le site
▫ Attention à vous coordonner et vous répartir les
tâches par la suite.

27. Drupal Gardens
• De l’aide en ligne (et en Anglais)

28. Drupal Gardens
• Des vidéos (toujours en Anglais)

29. Drupal Gardens
• Se connecter en passant par Drupal Gardens

30. Drupal Gardens
• Se connecter en passant par Drupal Gardens

31. Drupal Gardens
• Se connecter en passant par Drupal Gardens

32. Drupal Gardens
• Se connecter en passant par Drupal Gardens

33. Drupal Gardens
• Se connecter en passant directement par le site

34. Drupal Gardens
• Se connecter en passant directement par le site

35. Drupal Gardens
• Se connecter en passant directement par le site

36. Drupal Gardens/Drupal
• Administrateur
▫ Login,
▫ Accès total au site + administration du site.
• Utilisateur authentifié
▫ Login
▫ Accès au site en « lecture » et accès contrôlé au site selon fonctions
autorisées par les administrateurs (par exemple déposer des photos).
▫ Pas d’accès à l’administration du site.
• Visiteur
▫ Pas de login
▫ Accès au site en « lecture » + fonctions autorisées par les
administrateurs (en général plus limitées qu’utilisateur authentifié, par
exemple pas de dépose de photo, mais noter ou commenter les photos).
▫ Pas d’accès à l’administration du site.

37. Votre mission
• Choisir le thème/sujet de votre plateforme
▫ En vous inspirant de VisualRecipes
 Il s’agit de s’en inspirer comme exemple, pas de le
copier: soyez créatifs
 Vous êtes libres du choix du thème, mais vous devez
en définir un précis.

38. Votre mission
• Dans VisualRecipes (1/2)
▫ Chaque contributeur peut
 Ajouter des recettes
 Chaque recette correspond à une galerie d’images.
▫ Chaque recette est représentée par une série de
photos
 Qui illustre par exemple la recette à différentes
étapes.

39. Votre mission
• Dans VisualRecipes (2/2)
▫ Chaque recette est complétée par une série de
métadonnées/descriptions/tags… qui permettent
ensuite de fournir aux visiteurs des point d’entrée
sur l’ensemble des galeries d’images:
 Recherche par ingrédients, par type de plat…
▫ La plateforme est complétée par un ensemble
d’outils communautaires qui permettent aux
utilisateurs d’échanger autour sur le thème des
recettes:
 Forums…

40. Votre mission
• Dans votre plateforme
▫ Reprenez le même principe, mais adapté au thème que
vous aurez choisi (1/2):
 Par exemple les monuments
 Un contributeur X crée une galerie de photos pour la tour
Eiffel
▫ Il dépose l’ensemble des photos
▫ Ajoute toutes les informations de description du monument:
date, lieu, hauteur …
 Un contributeur Y crée une galerie de photos à son tour pour
la tour Eiffel
▫ Il dépose l’ensemble des photos
▫ Ajoute toutes les informations de description du monument

41. Votre mission
• Dans votre plateforme
▫ Reprenez le même principe, mais adapté au thème
que vous aurez choisi (2/2):
 Un visiteur Z cherche des photos de monuments de
Paris
▫ Grâce à un des outils de recherche/exploration de la
plateforme, il indique le lieu qui l’intéresse: Paris
▫ Il retrouve les deux galeries de photos de X et Y et peut
choisir celles qui l’intéresse.

42. Votre mission
• Le prototypage de la plateforme va consister à
▫ Définir toutes les métadonnées à associer
 aux galeries de photos
 aux utilisateurs (qui peuvent être à la fois contributeur
et/ou visiteur)
▫ Définir des points d’entrée pour les visiteurs: outils de
recherche, navigation, exploration, découverte… pour
qu’ils accèdent aux photos et/ou aux contributeurs.
▫ Définir des fonctionnalités
« sociales/communautaires » pour faciliter la sélection
et le partage des contenus photos de la plateforme.

43. Votre mission
• Pour le projet
▫ Vous devez configurer la plateforme depuis
l’interface administrateur.
▫ Tester la plateforme comme utilisateur
contributeur (et déposer quelques exemples de
galeries de photos).
▫ Tester la plateforme comme utilisateur visiteur
(rechercher des galeries à partir des outils de
recherche et d’exploration).

44. Votre mission
• Votre plateforme
▫ Devra permettre à un utilisateur contributeur de
déposer une galerie de photos
▫ Devra permettre à un utilisateur visiteur de
rechercher des galeries de photos à partir de
plusieurs moyens de recherche et d’exploration.

45. Activité 2.1
• Quelles métadonnées seraient utiles et nécessaires
pour décrire les contenus ?
▫ Quelles significations/sens (par rapport au but de la
plateforme)
▫ Quels types de valeurs: nombre, texte, date…
▫ Quelles valeurs possibles:
 Liste fixe (par exemple les 5 continents)
 Liste ouverte
 Valeurs multiples/Valeur Unique
 Valeur obligatoire/Valeur facultative

46. Activité 2.1
• Quelles métadonnées seraient utiles et nécessaires
pour décrire les utilisateurs ?
▫ Quels rôles (avec quelles fonctions: visiteur,
contributeur…)
▫ Quelles significations/sens (par rapport au but de la
plateforme)
▫ Quels types de valeurs: nombre, texte, date…
▫ Quelles valeurs possibles:
 Liste fixe/Liste ouverte
 Valeurs multiples/Valeur Unique
 Valeur obligatoire/Valeur facultative

47. Activité 2.1
• Editez une page dans le groupe d’activité de
votre projet sur hec-onnect
▫ Pour décrire et documenter:
 Le thème choisi pour votre plateforme
 Les métadonnées que vous envisagez d’attribuer aux
contenus médias et aux utilisateurs

48. Activité 2.2
• Créez votre site Drupal Gardens et commencez à
définir et travailler la ligne graphique de votre
plateforme
▫ A partir des outils disponible depuis le menu
« Appearance » de la barre de menu d’administration.
 Sélectionnez un thème graphique, un layout, un logo et
un favicon (vous pouvez en créer un à
http://www.favicon.cc/), une palette de couleur…
 Personnalisez ensuite l’ensemble en éditant les éléments
du thème individuellement
 A visionner: http://youtu.be/tZ0DIGfIJEU

49. Activité 2.2
• Commencez à définir et travailler la ligne
graphique de votre plateforme (suite)
▫ A visionner
 http://youtu.be/Tmn0LxQj_M4
 http://youtu.be/CJuoZWHnaCk

50. Ressources
• Vous retrouverez l’ensemble des vidéos à
visionner dans la playlist:
▫ http://www.youtube.com/playlist?list=PL96E3BBFC7B2EEDF3
• Vous trouverez une collection de tutoriels en français (un peu)
en anglais (beaucoup) qui présente Drupal Gardens et son
fonctionnement:
▫ http://www.youtube.com/playlist?list=PLE4A6615EBE3C2EF4