École multidisciplinaire de l’image

ARI1073
Conception et scénarisation de projets multimédias


Chargé de cours :
Jean-Philippe Fauteux

POUR LE COURS XII

Ouvrir son propre site :

nom de domaine et hébergement
un autre hébergeur

Les entêtes META

exemple Meta


POUR LE COURS XI:

neufCadresPourFlash

fonctionAléatoireFlash

ouvrirUneNouvelleFenêtreJavascript

icôneFaviconPhotoshop

icôneFavicon_infos

icôneFavicon_créateur

les Notes au 3 juin


LEÇONS POUR LE COURS VIII:

Yazo.net : Introduction à Flash

Découvrir ActionScript 2.0

Démarrer en ActionScript 3.0

Livre d'instructions :
Bien démarrer avec Flash (8)


LEÇONS POUR LE COURS VII:


LEÇONS POUR LE COURS VI:


 

LEÇONS POUR LE COURS V :

Tableaux Word

CSS : Positionner le texte
CSS : Créer trois colonnes

Livre d'intructions Dreamweaver :
pdf
liveDocs

À lire :
Création de pages avec CSS
Mise en forme des pages avec HTML


LEÇONS POUR LE COURS IV :

CSS (feuille de style)
et Tableaux


NOTE IMPORTANTE

Vous devez pour réussir les exercices
ÉCRIRE UNE PAGE WEB
régler les préférences suivantes dans TextEdit


 
 

OBJECTIFS

Au terme de cette activité, l'étudiant sera en mesure de comprendre ce qui compose un scénario et sa pertinence dans tout projet multimédia. Il aura saisi l'importance d'établir une trame narrative sur laquelle aligner son devis d'intervention. Il sera sensibilisé aux notions d'espace-temps et aura développé des façons de travailler avec ces concepts, notamment par la hiérarchisation des contenus et la logique événementielle dans la ligne de temps du projet. Ayant acquis une connaissance des divers médias visuels, graphiques, sonores, vidéo et interactifs qui s'offrent à lui, l'étudiant sera en mesure de faire des choix pertinents quant à l'emploi de ceux-ci dans la création de ses projets numériques.

 
 

CONTENU

L'accent est mis sur le développement de compétences conceptuelles. Analyse des différents médias et supports numériques : caractéristiques, possibilités et contraintes. Anatomie et méthode de conceptualisation d'un scénario multimédia : trame narrative, parcours et environnement virtuels, facture visuelle. Introduction à l'établissement de l'arborescence et de la navigation d'un projet à contenu actif. Éléments, relations et règles temporelles. Travail sur la dimension sonore et construction du mouvement.

 
 

OBJECTIFS SPÉCIFIQUES

Prendre conscience des aspects fondamentaux de la création Web : la définition de projet, la conception de site, la création de contenu, l’organisation de contenu (arborescence), la présentation de contenu (design d’interface) et la publication de contenu.

Ce cours expose les principes du langage HTML et CSS pour créer des pages web. En s'appuyant sur des exemples, il traite de la mise en forme des caractères ou paragraphes, des images, des liens, des formulaires... pour permettre la création et la publication de pages HTML.

Graphisme pour le Web, cette partie traite des connaissances de base importantes pour la conception de graphiques pour des pages Web.

Il ne s'agit toutefois pas d'un cours d’apprentissage de logiciels bien que les étudiants pourront pour réaliser leurs travaux et leurs exercices profiter de leurs connaissances et de leur esprit d’aventure pour s’initier à la manipulation de certains outils de création numérique (Dreamweaver, Flash, Final Cut, ToonBoom, etc.)

 
 

ORGANISATION DU CONTENU

Définir un projet de site Web
Types de sites;
Utilisateur cible;
« Personnalité » du site;
Planning de production.

Concevoir le site
Architecture et structure du site;
Outils de navigation;
Parcours et scénario d’utilisation.

Organiser le contenu
Plan du site et arborescence;
Hiérarchisation du contenu.

Présenter le contenu
Design des interfaces graphiques;
Gabarits, images, couleurs, typographie;
Fonctionnalité.

Réalisation et production du site
Création, collecte et mise en forme du contenu;
Publication du contenu sur le Web;
Diffusion et « référençage » du site.

 
 

ORGANISATION DES COURS

La session est découpée en trois thèmes : Conception et scénarisation pour la premier;  les principes du langage HTML et CSS pour le second et, la production du site pour le troisième.

 
 

Organisation de la session (12 cours)

Par groupe de trois cours consécutifs, le premier cours comporte une période de discussions critiques sur les projets de sites Web, une période d’exposés théoriques, et, finalement, les explications et les directives nécessaires à la réalisation de la suite du projet.

Le deuxième cours est entièrement consacré à des discussions par petits groupes de 4 ou 5 étudiants où ceux-ci doivent présenter les propositions scénaristiques et les esquisses du projet en cours pour approbation.

Le troisième cours, est consacré à l’étude et à l’examen des techniques appliquées, du langage HTML et CSS, et est accompagné d’exercices pratiques.

 
 

CALENDRIER / RÉSUMÉ

29 avril : Définir un projet de site Web
1 mai : Définir un projet de site Web
6 mai : Atelier technique : HTML.

8 mai : Concevoir le site
13 mai : Concevoir le site
15 mai : Atelier technique CSS

20 mai : Organiser le contenu
22 mai : Organiser le contenu
27 mai : Atelier technique : Dreamweaver

29 mai : Présenter le contenu
3 juin : Présenter le contenu
5 juin : Atelier technique : intégration d’autres applications ( Photoshop, Flash, ToonBoom, etc)

10 juin : Réalisation et production du site
12 juin : Réalisation et production du site

17 juin : Remise du projet final

 
 

LES PROJETS

Les exercices :

HTML (30 points)
Création et mise en forme d'une page web
Mise en page d'une liste
Mise en page d'un glossaire au moyen d'une liste de définition
Mise en page d'un tableau


CSS (20 points)
Mise en page en forme d'un texte à l'aide d'une feuille de style
Création d'un formulaire et mise en forme à l'aide d'une feuille de style

Dreamweaver (10 points)
Création et mise en forme d'une page web avec Dreamweaver

 
 

Le projet de site

I. Définir un projet de site Web (10 points)
II. Concevoir le site (10 points)
III. Organiser le contenu (10 points)
IV. Présenter le contenu (10 points)
V. Réalisation et production du site (10 points)

 
 

BIBLIOGRAPHIE

(À compléter)

SELFHTML 8.0 (réaliser soi-même des fichiers HTML)
http://fr.selfhtml.org/

HTML.NET
Tutorials HTML et CSS
http://fr.html.net/tutorials/html/

Écrire le HTML
http://zircon.mcli.dist.maricopa.edu/tut_fr/

pour permettre l'autoformation à la création de pages HTML
http://www.ext.upmc.fr/urfist/html/html.htl

HTML 4.x Spécifications (en anglais)
http://www.w3.org/TR/REC-html40/

L'ensemble des références HTML 4 (en français)
http://www.netalya.com/fr/Reference.asp

 
 

• Règlement sur le plagiat et sur la fraude disponible à l’adresse suivante :
www.uqo.ca/direction-services/secretariat-general/politiques-reglements/documents/vrer01plag.pdf
• Politique relative à la qualité de l’expression française écrite chez les étudiants et les étudiantes de premier cycle à l’UQO (adoptée par le Conseil d’administration du 28 mars 2000 (225-CA-3230)) disponible à l’adresse suivante :
www.uqo.ca/direction-services/vrer/bvrer/documents/politique-francais.pdf