Résumé
- Travail en équipe avec portions individuelles
- Réalisation de la semaine 1 à 14
- 25% de la note finale du cours
Choix de projets
En équipe de 4 étudiant.es, vous êtes amenés à créer le site web d’une entreprise fictive en démarrage (Startup). Vous devez choisir parmi 2 choix de types d’entreprise:
- Une entreprise (startup) qui offre des services multimédia. (ex. : agence 360, agence de création, studio de design, agence web, studio de son, agence de production vidéo, studio de service de création de jeux (B2B)1, agence interactive, etc.) à un ou plusieurs publics cibles.
- Une entreprise (startup) qui présente son produit multimédia (ex. : expérience interactive, application mobile, jeu vidéo AR ou VR, installation multimédia grand public, etc.) destiné à un ou plusieurs publics cibles.
1 Votre studio n’est pas un studio traditionnel (éditeur de jeux) mais plutôt un studio de service de création de jeux pour entreprises (B2B = Business to business)
Choix de disciplines multimédia pour votre projet
- Design graphique et illustration
- Animation 2D et motion design
- 3D et réalité virtuelle
- Audio et vidéo
- Intégration et programmation web
- Jeux vidéo
- Installations multimédia
La startup de services vend surtout une expertise. Son modèle repose sur des mandats, des contrats ou des forfaits réalisés pour des clients. L’article donne comme exemples une agence 360, une agence de création, un studio de design, une agence web, un studio de son, une agence de production vidéo, un studio de création de jeux pour entreprises (B2B) et une agence interactive. Dans ce cas, la valeur de l’entreprise dépend de la compétence de l’équipe, de la qualité des livrables, de la compréhension du client et de la capacité à suivre un bon flux de production.
Voici quelques exemples concrets de startup de services :
- une agence web qui crée des sites vitrines et transactionnels pour des PME;
- un studio de design graphique qui développe des identités visuelles, affiches et contenus de marque;
- une agence de production vidéo qui réalise des publicités, capsules promotionnelles et montages événementiels;
- un studio de motion design qui produit des animations explicatives pour des organismes ou entreprises;
- un studio de jeux B2B qui conçoit des jeux promotionnels ou éducatifs pour des clients corporatifs.
La startup de produit, elle, ne vend pas d’abord des heures de travail, mais une solution multimédia. Selon le TP, cette solution peut prendre la forme d’une expérience interactive, d’une application mobile, d’un jeu vidéo en réalité augmentée ou virtuelle, ou encore d’une installation multimédia grand public. Ici, l’objectif est de proposer un produit innovant, avec une identité claire, des fonctionnalités principales et une valeur ajoutée pour un public bien défini.
Exemples de startup de produit :
- une application mobile qui aide les étudiant·es à organiser leurs projets d’équipe;
- un jeu vidéo éducatif en réalité virtuelle pour apprendre un métier ou une procédure;
- une expérience interactive présentée dans un musée ou un événement culturel;
- une installation multimédia immersive pour un espace public ou une exposition;
- un produit AR permettant d’explorer un objet, un lieu ou une information de façon interactive.
En résumé, la startup de services vend principalement une expertise personnalisée, tandis que la startup de produit vend surtout une solution reproductible et évolutive. La première mise sur la relation client et l’exécution sur mesure; la seconde mise davantage sur l’innovation, les fonctionnalités et le potentiel de diffusion.
Contexte de réalisation
- Réalisé avec un système d’archivage de fichiers (Google Drive)
- Réalisé avec un logiciel de gestion de projet (Trello)
- Réalisé dans le logiciel WordPress avec un thème imposé (Astra)
- Procédure d’installation de wordpress: S1d_installationwp.pptx
- Réalisé dans un document Figma selon un gabarit fourni
Droits d’auteur et médiagraphie
- Tous les visuels (images, graphiques, icônes) devront être libre de droits (Creative Commons ou autre)
- Sources citées en bas de chaque page web du site web, selon ma méthode MLA (dans un accordéon)
Utilisation de l’IA générative
- Pour les textes, vous devez respecter le niveau 1 d’utilisation de l’IA générative tel que lu dans la politique d’utilisation de l’IA générative pour ce cours
- Pour les images et les vidéos, vous devez respecter le niveau 4 d’utilisation de l’IA générative tel que lu dans la politique d’utilisation de l’IA générative pour ce cours
- Vous devez faire une déclaration d’utilisation de l’IA en bas de chaque page de votre projet avec accès aux conversations avec l’IA générative (dans un accordéon) avec ce texte:
- Pour la production de cette page web, nous avons utilisé l’IA générative de manière responsable, conformément aux principes présentés dans la politique d’utilisation de l’IA générative.
- Au niveau des textes, l’outil nous a aidé à corriger l’orthographe et la syntaxe, à clarifier certaines phrases et à structurer certaines idées, mais le contenu final a été entièrement formulé et développé par notre équipe. Toutes les informations générées ont été croisées avec des sources fiables et l’usage de des outils d’IA générative respecte les consignes et limites définies par le cours. La conversation complète est consultable ici : [insérer le lien ici].
- Au niveau des images et vidéos, l’IA générative nous a servi à produire et/ou bonifier certains médias (ex. visuels d’ambiance, textures, illustrations, variations, courtes séquences), ainsi qu’à générer des itérations pour explorer rapidement des pistes de direction artistique. Les médias finaux ont ensuite été sélectionnés, retouchés, intégrés et optimisés par notre équipe (compression, recadrage, formats web, cohérence visuelle et accessibilité). Tous les contenus générés ont été utilisés de façon éthique et responsable : aucune personne réelle identifiable n’a été imitée, aucun deepfake n’a été produit, et aucune utilisation non déclarée n’a été effectuée. La conversation complète (prompts, itérations et résultats) est consultable ici : [insérer le lien ici].
| Section du site | Entreprise fictive de services multimédia | Produit fictif multimédia |
|---|---|---|
| Page Accueil (1 page) | Présentation générale de l’entreprise en multimédia avec un visuel impactant et un résumé des services offerts. Autres éléments au choix. | Présentation générale du produit multimédia avec un visuel impactant et un résumé des fonctionnalités principales. Autres éléments au choix. |
| Page À propos (1 page) | Explication de l’entreprise: Mission, public cible, valeurs et historique fictive de l’entreprise. Autres éléments au choix. | Justification du produit : Mission, public cible, valeurs et historique fictive de l’entreprise. Autres éléments au choix. |
| Section Équipe (9 pages) Équipe de 3: 6 membres de l’équipe (plutôt que 8) | Page de présentation générale de l’équipe (sous forme de grille) • Introduction : Brève présentation de l’équipe et de son rôle au sein de l’entreprise ou du projet. • Galerie interactive : 8 tuiles des membre de l’équipe avec : – Nom et photo de chaque employé. – Titre du métier. – Navigation : Chaque carte contient un bouton/lien vers la fiche détaillée du métier correspondant. Pour chacun des 8 membres de l’équipe, une fiche métier individuelle est présente et comprend : • Nom de l’employé et photo. • Titre du métier et sa place dans l’équipe. • Description du métier. • Tâches principales effectuées au quotidien. • Compétences clés requises. • Environnement de travail (outils, logiciels, collaboration). • Formation requise et parcours académique recommandé. • Salaire moyen dans l’industrie. • Perspectives d’emploi et évolutions possibles. • Visuels ou témoignages fictifs pour enrichir la fiche. | Page de présentation générale de l’équipe (sous forme de grille) • Introduction : Brève présentation de l’équipe et de son rôle au sein de la création du produit. • Galerie interactive : 8 tuiles des membre de l’équipe avec : – Nom et photo de chaque employé. – Titre du métier. – Navigation : Chaque carte contient un bouton/lien vers la fiche détaillée du métier correspondant. Pour chacun des 8 membres de l’équipe, une fiche métier individuelle est présente et comprend :• Nom de l’employé et photo. • Titre du métier et sa place dans l’équipe. • Description du métier. • Tâches principales effectuées au quotidien. • Compétences clés requises. • Environnement de travail (outils, logiciels, collaboration). • Formation requise et parcours académique recommandé. • Salaire moyen dans l’industrie. • Perspectives d’emploi et évolutions possibles. • Visuels ou témoignages fictifs pour enrichir la fiche. |
| Section Services ou Produit (4 pages) Équipe de 3 = 2 services ou fonctionnalités | Page de présentation générale des services: • Brève introduction de l’entreprise et de sa mission. • Aperçu des 3 services avec une courte description chacun. • Valeur ajoutée des services pour les clients. • Témoignages fictifs, mise en situation et visuels attractifs. • CTA : Lien vers les pages détaillées de chaque service Pour chaque service, une page service individuelle est présente et comprend: • Titre et description du service. • Public cible et besoins auxquels il répond. • Flux de production en 10 étapes. • Tendances actuelles du domaine. • Types de produits générés (ex. : site web, animation, vidéo). • Exemples de projets illustrant le service. • Visuels et/ou animations pour illustrer le service. • FAQ. • CTA : Contact ou demande de soumission | Page de présentation générale du produit: • Nom, logo, slogan et identité visuelle du produit. • Problème que le produit résout et pourquoi il est innovant. • Aperçu rapide des 3 fonctionnalités principales. • Témoignages fictifs ou mise en situation. • Vidéo ou animation de démonstration. • CTA : Voir les fonctionnalités ou essayer le produit. Pour chaque service, une page fonctionnalité individuelle est présente et comprend: • Nom et description détaillée de la fonctionnalité. • Contexte d’utilisation et comment le public cible est comblé. • Exemples d’applications de la fonctionnalité. • Technologiques associées à la fonctionnalité. • Comparaison avant/après l’implantation de la fonctionnalité. • Infographie ou démonstration visuelle de la fonctionnalité. • FAQ. • CTA : Essayer la fonctionnalité, voir une démo, acheter. |
| Portfolio (5 pages) Équipe de 4 = 4 fiches projet Équipe de 3 = 3 fiches projet | Présentation générale du portfolio • Introduction : Aperçu des 4 projets présentés, réalisés par 4 membres de l’équipe. • Aperçu visuel de chaque projet. • Titre du projet et auteur. • Lien vers la fiche détaillée de chaque projet. Pour chaque projet, une fiche détaillée de projet est présente et comprend : • Titre du projet et nom du membre de l’équipe responsable. • Présentation visuelle : Image principale ou vidéo du projet. • Contexte du projet : Objectif et raison de sa création. • Rôle et contributions du membre de l’équipe. • Processus de création : Étapes clés du développement. • Outils et logiciels utilisés. • Défis rencontrés et solutions apportées. • Résultat final et impact du projet. • Visuels de qualité (captures d’écran, maquettes, vidéos, animations). | Présentation générale du portfolio • Introduction : Aperçu des 3 ou 4 projets présentés, réalisés par 4 membres de l’équipe dans le TP1.2. • Aperçu visuel de chaque projet. • Titre du projet et auteur. • Lien vers la fiche détaillée de chaque projet. Pour chaque projet, une fiche détaillée de projet est présente et comprend : • Titre du projet et nom du membre de l’équipe responsable. • Présentation visuelle : Image principale ou vidéo du projet. • Contexte du projet : Objectif et raison de sa création. • Rôle et contributions du membre de l’équipe. • Processus de création : Étapes clés du développement. • Outils et logiciels utilisés. • Défis rencontrés et solutions apportées. • Résultat final et impact du projet. • Visuels de qualité (captures d’écran, maquettes, vidéos, animations). |
| Page contact (1 page) | Coordonnées fictives, formulaire de contact personnalisé et carte géographique intégrée. | Coordonnées fictives, formulaire de contact personnalisé et carte géographique intégrée. |
- Le document Figma est riche en contenus (recherche de comparables, moodboard, wireframes)
- Le site est prêt pour pour un PITCH (présentation rapide du projet par l’équipe)
- Les pages principales du site web sont créées dans WordPress
- La navigation est entièrement fonctionnelle dans l’ensemble du site
- Les couleurs et typographies ont été personnalisés selon la DA
- Le footer est en place avec la mention suivante :
- Avis — projet étudiant : Ce site a été réalisé dans le cadre d’un projet pédagogique. L’entreprise, le produit, les services, les prix et les scénarios présentés dans ce site sont fictifs. Les contenus originaux (textes, design, maquettes, interface) demeurent la propriété intellectuelle de leurs créateur·rice·s. Les images, icônes et médias non originaux utilisés sur ce site proviennent de sources sous licences Creative Commons (ou du domaine public) et sont crédités lorsque requis.
- Le design (première version, selon les wireframes) et les contenus des pages suivants sont complétés:
- La page Accueil
- La page À propos
- La section équipe avec les 8 métiers sous forme de cartes dans une grille
- Un gabarit de fiche métier
- La page de présentation générale des Services ou du Produit
- Les autres pages du site contiennent du lorem ipsum
- ⚠️ Remise avant le début du cours 5
- Appliquer les conseils de la semaine 7 (qui sont les mêmes que le message Teams)
- Le site présente une allure très professionnelle, en termes de design et de contenus
- Le site s’adresse clairement à un public cible qui a été compris
- Les couleurs et la typographie ont été personnalisés selon le moodboard et les commentaires du professeur dans Figma
- Le thème Astra est hautement personnalisé en fonction de la direction artistique
- La navigation est entièrement fonctionnelle dans l’ensemble du site
- Plusieurs contenus sont complétés et archivés dans le Drive du projet (textes et images)
- Les pages suivantes sont créés, améliorées et révisées:
- Accueil
- À propos
- Section Équipe
- Grille de présentation de l’équipe
- Fiche métier – Gabarit amélioré
- Section Services/Produit
- Page de présentation générale des 3 services ou du produit
- Page service/fonctionnalité – Gabarit amélioré
- Section Portfolio
- Grille des fiches-projets
- Fiche projet – Gabarit amélioré
- Contact
- ⚠️ Remise avant le début du cours 8
- Toutes les pages, articles et contenus attendus sont présents
- Le design et les contenus du site sont de qualité professionnelle
- Le site présente l’entreprise ou le produit de façon claire, efficace et esthétique
- L’assurance qualité a été soigneusement effectuée
- Le site est testé et entièrement fonctionnel
- Le site est prêt à être lancé
- ⚠️ Remise avant le début du cours 12
Version optimisée de votre site
- Version optimisée suite aux correctifs provenant de la grille d’assurance qualité
- Grille d’assurance qualité remplie par l’équipe
- Contenu et fonctionnalités régulièrement testés et corrigés pour garantir leur fiabilité et leur performance.
- Corrections apportées grâce aux commentaires du professeur, des résultats du BETA-TESTING et de l’assurance qualité
- Standards de qualité respectés pour assurer une expérience utilisateur sans faille.
- Révision linguistique de tous les textes
Présentation orale de votre projet et votre démarche
- Introduction (1-2 minute) :
- Présenter les membres de l’équipe et leur responsabilités
- Présenter votre site web
- Démonstration du site web (tout au long):
- Tout au long de la présentation, vous alternez entre votre présentation et une démonstration d’éléments de votre site
- Pour vous aider, vous pouvez programmer des liens vers certaines pages de votre site à l’intérieur de votre présentation
- Démarche et développement (10-12 minutes) :
- Démontrer les grandes étapes de conception du site.
- Démontrer la direction artistique du projet.
- Démontrer la démarche de recherche et synthèse d’informations pour créer les contenus.
- Démontrer les fonctionnalités clés et les éléments interactifs.
- Démontrer les méthodes d’optimisation et d’archivage utilisées pendant le projet
- Démontrer les méthodes de communication pendant le projet
- Démontrer les méthodes de gestion de projet utilisées pendant le projet
- Démontrer le processus d’assurance qualité
- Défis et solutions (3-5 minutes) :
- Identifiez les problèmes rencontrés lors de la création du site.
- Présentez les solutions que vous avez mises en place pour surmonter ces défis.
- Apprentissages et pistes d’amélioration (3-5 minute) :
- Résumez ce que vous avez appris durant le projet.
- Évoquez les possibles améliorations de votre site pour l’avenir.
- Période de question (5 minutes):
- Préparez-vous à répondre aux questions du professeur et du groupe
- ⚠️ Prestation pendant le cours 14