Study Programmes 2025-2026
WARNING : 2025-2026 version of the course specifications
TPIG0001-1  
Travaux pratiques de techniques infographiques
  • Design grilles
  • Hierarchie visuelle 2
  • Direction artistique pour le Web
  • Design orienté utilisateur
  • Principe d'animations d'interfaces
  • UX design
  • Outil de design technique
  • Design frontend 2
Volume horaire :
Design grilles : 12h Th
Hierarchie visuelle 2 : 30h Th
Direction artistique pour le Web : 15h Th
Design orienté utilisateur : 30h Th
Principe d'animations d'interfaces : 18h Th
UX design : 25h Th
Outil de design technique :
Design frontend 2 :
Number of credits :
Bachelor's degree : Computer graphics (Bachelor in Computer graphics)12
Lecturer :
Design grilles : François BOURGAUX
Hierarchie visuelle 2 : François BOURGAUX
Direction artistique pour le Web : Gaëlle GABAN, Maude WERA
Design orienté utilisateur : Simon MARCHAL, Melih SELAMET
Principe d'animations d'interfaces : Robin DEVOUGE, Alexandre TOURNAY
UX design : Simon MARCHAL, Melih SELAMET
Outil de design technique : Philippe THRONTE
Design frontend 2 : Philippe THRONTE
Référent UE :
François BOURGAUX, Gaëlle GABAN, Clément SCHMOUKER, Alexandre TOURNAY
Language(s) of instruction :
French language
Organisation and examination :
Teaching in the first semester, review in January
Units courses prerequisite and corequisite :
Prerequisite or corequisite units are presented within each program
Learning unit contents :
Not available
Design grilles
Les thèmes abordés sont?:  
- Organisation d'espaces finis 
- Organisation d'espaces infinis 
- Les 4 types de grilles?:

  • grille manuscrite
  • grille en colonne
  • grille modulaire
  • grille hiérarchique 
- La division de l'écran 
- Capital Grid 
Hierarchie visuelle 2
Les thèmes abordés sont?:  

- Macrotypo?: 

- L'interlignage 

- Titre, sous-titre et paragraphe 

- Marge et espace vertical 

- Microtypo?: 

- Caractères accentués 

- liste 

- ligature 

- etc.... 

- Les Variable Font 
Direction artistique pour le Web
Les thèmes abordés sont?:  

- Qu'est-ce que la direction artistique 

- Les fondamentaux du design

- Outils et méthodes d'émergence de concepts

- Définir une direction artistique dans le cadre d'un projet 
Design orienté utilisateur
Le contenu adopte d'abord une approche globale, explorant ses applications à travers différents secteurs afin d'en saisir les concepts fondamentaux. L'objectif est de fournir une compréhension approfondie du design centré sur l'humain avant de se spécialiser dans la conception de sites web. La première phase se concentre sur l'analyse des besoins des utilisateurs et sur la manière d'organiser le contenu en conséquence.

Par la suite, l'accent est mis sur la phase de production, où les étudiants apprennent à développer des interfaces web accessibles et inclusives, en s'appuyant sur un Design System répondant aux normes professionnelles.
Principe d'animations d'interfaces
  • Théorie de l'animation web
  • Analyse et reproduction d'animations en css / javascript
UX design
Ce cours propose une approche initiale étendue, permettant d'appréhender les fondamentaux de l'expérience utilisateur dans divers contextes avant de se concentrer sur le domaine spécifique du web. La première phase est dédiée à l'étude des principes théoriques de l'UX, avec un accent sur la structuration et l'organisation des contenus selon les attentes des utilisateurs.

Progressivement, le contenu s'oriente vers des compétences plus techniques, avec l'apprentissage de la mise en place d'un Design System appliqué à la création d'interfaces web, respectant les exigences professionnelles en termes d'accessibilité et d'usabilité.
Outil de design technique
Prise en main de figma

- outils de base

- mise en place d'une grille

- preview d'un prototype et partage

- concevoir des prototypes
Design frontend 2
  • Introduction à l'HTML et au CSS 
  • Sémantique d'une page web 
  • Norme du W3C.  
  • Méthode BEM 
Learning outcomes of the learning unit :
Not available
Design grilles
   
Hierarchie visuelle 2
   
Direction artistique pour le Web
/  
Design orienté utilisateur
v. fiche UE
UX design
v. fiche UE
Prerequisite knowledge and skills :
Design orienté utilisateur
v. fiche UE
UX design
v. fiche UE
Planned learning activities and teaching methods :
Not available
Design grilles
Cours en présentiel et/ou distanciel 

Observation de pratiques 

Travaux de groupe en autonomie 

Travaux individuels pratiques  

Travaux individuels en autonomie 

L'utilisation d'IA est autorisé dans le cadre de ce cours.
Hierarchie visuelle 2
?Cours en présentiel et/ou distanciel 

Observation de pratiques 

Travaux individuels pratiques  

Travaux individuels en autonomie 

L'utilisation d'IA est autorisé sous certaines conditions dans le cadre de ce cours.
Direction artistique pour le Web
Cours pratiques
Travaux individuels
Travaux de groupes

Remarque : L'étudiant devra être capable d'expliquer et justifier tout le code qu'il utilise, qu'il soit produit personnellement, copié d'une ressource externe ou généré par une AI. /
Design orienté utilisateur
Les méthodes d'enseignement sont variées :
exposés magistraux
interaction entre élèves / débats
travaux de groupe
exercices pratiques

Le recours à certaines IA ne sera autorisé que si dûment et préalablement justifié auprès de l'enseignant

 
Principe d'animations d'interfaces
  • Cours théoriques
  • Cours pratiques
  • Travaux individuels
Remarque : Le recours à certaines IA ne sera autorisé que si dûment et préalablement justifié auprès de l'enseignant.
UX design
Les méthodes d'enseignement sont variées :
exposés magistraux
interaction entre élèves / débats
travaux de groupe
exercices pratiques

Le recours à certaines IA ne sera autorisé que si dûment et préalablement justifié auprès de l'enseignant

 
Outil de design technique
  • Cours théoriques
  • Cours pratiques
  • Travaux de groupes
  • Travaux individuels
Design frontend 2
  • Cours théoriques
  • Cours pratiques
  • Travaux de groupes
  • Travaux individuels
Mode of delivery (face to face, distance learning, hybrid learning) :
Not available
Design grilles
Enseignement hybride
Hierarchie visuelle 2
   
Direction artistique pour le Web
Enseignement en présentiel

Présence de l'enseignant totale
Design orienté utilisateur
hybride
Principe d'animations d'interfaces
?Enseignement hybride 
UX design
hybride
Outil de design technique
  • Enseignement en présentiel
  • Enseignement hybride
Design frontend 2
  • Enseignement en présentiel
  • Enseignement hybride
Recommended or required readings :
Not available
Design grilles
Lectures recommandées:

Emil Ruder - Typography: A Manual of Design

Josef Mu¨ller-Brockmann - Grid systems


Support de cours:

espace institutionnel du cours
Hierarchie visuelle 2
Lectures recommandées?: 

- Stop Stealing Sheep & Find Out How Type Works - Erik Spiekermann 

- Shaping Text: Type, Typography and the Reader - Jan Middendorp 

- Better Web Typography for a Better Web - Matej Latin 

- Web Typography - Richard Rutter 

Support de cours:

espace institutionnel du cours
Direction artistique pour le Web
Support de cours : espace institutionnel du cours /
Design orienté utilisateur
Cette liste est présente dans les slides disponibles sur teams.
Principe d'animations d'interfaces
- Support de cours?:  

Espace institutionnel du cours

- Lectures obligatoires : /

- Lectures recommandées : /
UX design
Cette liste est présente dans les slides disponibles sur teams.
Outil de design technique
  • Support de cours : espace institutionnel du cours
  • Lectures obligatoires : /
  • Lectures recommandées : /
Design frontend 2
  • Support de cours : espace institutionnel du cours
  • Lectures obligatoires : /
  • Lectures recommandées : /
Assessment methods and criteria :
Not available
Design grilles
   
Hierarchie visuelle 2
   
Direction artistique pour le Web
Cette AA participe à l'évaluation du TJ de l'épreuve intégrée.
Design orienté utilisateur
Cette AA participe à l'évaluation du TJ de l'épreuve intégrée.
Principe d'animations d'interfaces
Mode d'évaluation : Présentiel ET distanciel

Organisation de l'évaluation : Remise de travaux

Type d'évaluation : Épreuve pour l'AA avec travail journalier

Modalités de cotation : Épreuve pour l'AA 10% ; TJ 90%
UX design
Cette AA participe à l'évaluation du TJ de l'épreuve intégrée.
Work placement(s) :
Design orienté utilisateur
non
UX design
non
Organizational remarks :
Not available
Design grilles
Implantation:

Namur

Organisation horaire de la formation:

enseignement en horaire de jour 

Organisation horaire de l'UE:

voir hyperplanning : https ://heaj-planning.hyperplanning.fr/hp/etudiant
Hierarchie visuelle 2
Implantation:

Namur

Organisation horaire de la formation:

enseignement en horaire de jour 

Organisation horaire de l'UE:

voir hyperplanning : https ://heaj-planning.hyperplanning.fr/hp/etudiant
Design orienté utilisateur
non
Principe d'animations d'interfaces
- Implantation :

Namur

- Organisation horaire de la formation :

Enseignement en horaire de jour

- Organisation horaire de l'AA :

Voir hyperplanning : https://heaj-planning.hyperplanning.fr/hp/etudiant
UX design
non
Outil de design technique
  • Implantation : Namur
  • Organisation horaire de l'AA : https://heaj-planning.hyperplanning.fr/hp/etudiant
Design frontend 2
  • Implantation : Namur
  • Organisation horaire de l'AA : https://heaj-planning.hyperplanning.fr/hp/etudiant
Contacts :
Not available
Design grilles
Privilégiez la conversation Teams
Si nécessaire mais moins rapide, un email: francois.bourgaux@heaj.be
Hierarchie visuelle 2
Privilégiez la conversation Teams
Si nécessaire mais moins rapide, un email: francois.bourgaux@heaj.be
Direction artistique pour le Web
Privilégiez la conversation Teams
Lorsque cela s'avère impossible je suis joignable via l'adresse mail maude.wera@heaj.be
Design orienté utilisateur
melih.selamet@heaj.be
Principe d'animations d'interfaces
robin.devouge@heaj.be
UX design
melih.selamet@heaj.be
Outil de design technique
philippe.thronte@heaj.be
Design frontend 2
philippe.thronte@heaj.be