Catégories
Actualités

Principes de conception et comment les utiliser

Comment appliquer les principes de conception à l'apprentissage en ligne

L'une des premières choses que vous apprenez dans l'art traditionnel et la théorie du design est les éléments et les principes de l'art et du design. Les éléments sont simplement les outils dont vous disposez pour créer quelque chose, comme la ligne, la forme, l'espace, la couleur et la texture. En revanche, les principes sont un ensemble de 7 lignes directrices sur la façon d'utiliser ces outils pour créer une bonne composition. Ces directives sont intemporelles et ont beaucoup de valeur chez divers disciples du design. Vous constaterez que tous les bons designers les utilisent, qu’ils en soient conscients ou non.

Donc, si ces directives sont si universelles, comment peuvent-elles nous aider à créer des expériences d'apprentissage mieux conçues?

La réponse est étonnamment simple: nous devons nous assurer que nous prenons en compte chaque principe lors de la création et de la conception de contenu d'apprentissage numérique, non seulement du point de vue de la conception mais aussi du point de vue de l'apprentissage. Cela nous fournira un plan directeur pour créer des expériences d'apprentissage plus engageantes et mieux conçues.

Commençons par ce que sont ces 7 principes de conception:

  1. Équilibre
  2. Mouvement
  3. Contraste
  4. Proportion / échelle
  5. Alignement
  6. Répétition / motif
  7. Unité

Alors, comment appliquons-nous chaque principe?

1. Équilibre

L'équilibre est la distribution des éléments visuels d'une manière esthétiquement agréable.

Si nous pensons à l'équilibre dans une perspective d'apprentissage, il est très important d'équilibrer les types de contenu que nous utilisons dans une expérience. Nous devons répondre à une variété d'apprenants, en utilisant différentes modalités. Donc, dans ce sens, l'équilibre serait de réfléchir à la façon d'utiliser différents médiums pour atteindre une variété d'apprenants et garder une expérience intéressante. Cela pourrait signifier utiliser un équilibre audio, visuel, gamification, vidéo, animation et texte pour créer une expérience d'apprentissage plus puissante.

D'un point de vue plus visuel, l'équilibre fait référence à l'organisation d'éléments pour créer une impression de poids uniformément réparti. Cela ne signifie pas que les conceptions doivent toujours être symétriques pour être équilibrées. Quelques façons simples de créer un équilibre dans votre apprentissage sont de vous assurer que les éléments qui sont dans la même catégorie conceptuelle ou fonctionnelle sont présentés de la même manière. Par exemple, vous avez trois icônes pour afficher trois points de repère différents sur une page, ces icônes doivent toutes avoir la même taille et la même palette de couleurs et être uniformément réparties pour créer un sentiment d'équilibre.

De même, si vous avez un bouton suivant et précédent, ainsi qu'un bouton d'accueil et de sortie, ceux-ci doivent tous être de taille égale et dans un style similaire. Cela aidera à créer l'équilibre (et l'unité), sauf si vous essayez d'attirer l'attention sur un en particulier.

Appliquer les 7 principes du design à l'apprentissage numérique

2. Mouvement

Le mouvement est un moyen d'attirer l'œil de l'apprenant sur des éléments spécifiques de la page ou de créer une sensation de mouvement.

Le mouvement a quelques fonctions d'apprentissage et de conception. Le mouvement peut aider à créer un intérêt visuel, ce qui aide à rendre votre expérience moins statique en ayant certains éléments animés dans ou hors de la page pour créer un intérêt visuel.

Appliquer les 7 principes du design à l'apprentissage numérique

Le mouvement peut également imiter le monde réel, plus comme une animation. Par exemple, avoir un compte à rebours qui imite le mouvement des aiguilles de l'horloge. Le mouvement peut également montrer les liens entre les idées ou attirer l'attention sur certains éléments, comme l'animation d'un graphique ou d'icônes clés.

Cependant, s'il est surexploité, le mouvement peut également être une source de frustration ou de distraction. Imaginez que vous atterrissiez sur une page et que vous deviez vous asseoir et attendre que chaque ligne de texte apparaisse lentement avant de pouvoir la lire, ou que plusieurs éléments différents s'affaiblissent, tournent et grandissent pendant que vous essayez de comprendre sur quoi vous concentrer. .

Ce n'est pas parce que vous pouvez utiliser le mouvement que vous devez toujours le faire.

Nous devons penser comme des concepteurs de sites Web. Nous concevons l'apprentissage à une époque très numérique, où la plupart des apprenants passent la majorité de leur journée en ligne. Notre apprentissage numérique est en concurrence pour attirer leur attention sur les sites Web les mieux conçus au monde. Consultez les sites Web ou la conception Web populaires et voyez comment ils utilisent le mouvement et l'animation. Prenons cet exemple de conception Web de Zak Steele-Ekund. Le mouvement doit être lisse, subtil et professionnel et, surtout, ne pas dominer.

3. Proportion / échelle

La proportion ou l'échelle fait simplement référence à la relation entre les objets par rapport à la taille.

C'est simple si vous essayez de dessiner le corps humain, mais cela peut sembler un peu étrange en termes d'apprentissage ou de conception. Ne vous laissez pas tromper, ce principe simple est l'un des plus importants, et aussi celui qui est si souvent négligé.

Changer votre taille de police d'un pixel ici ou là, ou rogner quelques centimètres de votre bouton suivant pour qu'il tienne sur une page délicate peut vous sembler sans conséquence, mais lorsque vous suivez un cours en tant qu'apprenant, et vos polices sont des tailles qui sautent et les boutons changent constamment, ce n'est rien sinon distrayant. Nous ne voulons pas que nos apprenants soient distraits de l'apprentissage par notre conception. Non, si quoi que ce soit, la conception devrait faciliter l'apprentissage.

Un moyen simple de garantir la cohérence de l'échelle consiste à définir des règles pour la taille de votre texte, certaines tailles d'image et tailles de bouton, et surtout, respectez-les.

Appliquer les 7 principes du design à l'apprentissage numérique

4. Alignement

L'alignement dans la conception fait référence à la façon dont les éléments sont placés sur la page. L'alignement est l'endroit où les grilles deviennent votre meilleur ami (et parfois votre pire ennemi).

Du point de vue de la conception, l'alignement signifie simplement que tout sur la page doit être aligné avec des éléments à proximité, horizontalement ou verticalement.

Les éléments doivent non seulement être alignés les uns sur les autres, mais également sur les marges. Les marges sont simplement des espaces blancs invisibles tout autour d'une page qui doivent toujours être dégagés. Ceux-ci doivent être cohérents sur toutes les pages.

Du point de vue du contenu, nous devons déterminer si le contenu et la méthode de diffusion que nous utilisons correspondent aux résultats d'apprentissage que nous essayons d'atteindre. Avec l'apprentissage numérique et ses possibilités infinies, il est facile de se familiariser avec la conception et la livraison de contenu, ce qui risque de nous faire perdre de vue les objectifs d'apprentissage.

5. Contraste

Le contraste utilise deux éléments opposés pour attirer l'attention.

Du point de vue de la conception, cela consisterait à utiliser du texte blanc sur un fond noir pour le faire ressortir, ou à utiliser du rose et du vert ensemble car ce sont des couleurs contrastées sur la roue chromatique. Le contraste est un outil puissant pour attirer l’attention sur des éléments importants à l’écran et pour guider l’attention de l’apprenant. C'est également très important pour l'accessibilité, car le contenu est lisible pour tous les apprenants.

Du point de vue du contenu, l'utilisation du contraste est vraiment utile. Donner aux apprenants des exemples et des métaphores clairement contrastés peut être très mémorable et attirer leur attention. Il y a souvent beaucoup de zone grise dans le contenu d'apprentissage, donc là où il est clair, il peut être rafraîchissant de fournir des exemples clairs et contrastés pour illustrer un point.

6. Souligné

L'accent est d'attirer l'attention sur un élément spécifique, le faisant paraître plus important. Cela peut être fait en utilisant le contraste, l'échelle, la couleur, le mouvement et le placement.

Dans la conception, vous souhaitez mettre l'accent sur les parties les plus importantes de la page. Cependant, si vous abusez de l'accent, attirant les yeux de votre apprenant sur tout sur la page, votre expérience d'apprentissage ressemblera à un manuel surligné où tout et par conséquent rien ne semble important.

Tout comme mettre l'accent sur tout, mettre l'accent sur rien peut être très déroutant et accablant pour un apprenant. Sans savoir où se concentrer, un apprenant peut ouvrir votre cours et ne pas savoir où chercher ou commencer, et se sentir dépassé par la quantité de contenu devant lui. Mais, si vous créez une hiérarchie visuelle, guidant l'apprenant à travers le contenu en mettant l'accent sur ce qu'il faut consommer quand, le contenu apparaît beaucoup plus gérable et intéressant.

Considérez cette page de couverture:

Appliquer les 7 principes du design à l'apprentissage numérique

La hiérarchie et l'accent sont établis avec l'utilisation de la taille, de la couleur, du poids de la police, de la capitalisation, du contraste et même des détails. Le virus COVID est ce qui attire d'abord votre attention, étant l'élément le plus grand et le plus détaillé de la page, en couleur. Ensuite, votre œil est attiré par le titre "COVID-19" en raison de sa couleur, de son poids, de sa taille et de l'utilisation de majuscules. Un peu moins proéminent que cela est le texte au-dessus de lui, "Une introduction à." Cela est rendu moins visible que le titre principal car il est plus petit, plus fin et dans le cas de la phrase.

La description du cours est l'élément le moins souligné de la page, étant en noir, ayant un poids et une taille de police fins et étant placé sous le texte le plus important. Enfin, l'appel à l'action, le bouton de démarrage, est souligné par l'utilisation de couleurs unies, de taille, d'épaisseur de police, de majuscule et de contraste.

De cette façon, une hiérarchie des informations est créée et l'accent est mis sur différents éléments de la page, aidant l'apprenant à savoir sur quoi se concentrer et quand. Cela devrait être fait tout au long de l'expérience d'apprentissage pour aider à guider l'apprenant et mettre l'accent sur le contenu d'apprentissage important aux étapes correctes du parcours d'apprentissage.

6. Répétition / modèle

La répétition ou le motif fait référence à l'utilisation d'éléments visuels similaires ou connectés. C'est un moyen puissant de renforcer un message, à la fois dans le contenu d'apprentissage et dans la conception.

En termes de conception et d'interface utilisateur, le fait d'avoir des éléments répétitifs contribue à créer une expérience utilisateur cohérente. Cela signifie garder les boutons de navigation, les éléments de menu et les logos à la même position sur chaque page. La répétition d'éléments comme celui-ci permet de garder l'expérience utilisateur cohérente et garantit que les apprenants n'utilisent pas leur charge cognitive en essayant de comprendre comment naviguer dans une page, mais peuvent l'utiliser pour absorber le contenu d'apprentissage.

En termes de visuels, la répétition de graphiques ou d'icônes qui ont été utilisés pour créer des associations visuelles avec des concepts peut être un puissant outil d'apprentissage. Les répéter tout au long du contenu d'apprentissage vous permet d'utiliser des visuels pour transmettre du sens sans toujours avoir à utiliser des mots. Par exemple, vous pouvez associer des succès à une icône de trophée. Cela signifie que vous répéteriez cette icône chaque fois que le contenu fait référence à des réalisations pour aider à renforcer le message. Changer cette icône en un autre visuel tel qu'un badge rompra l'association visuelle.

Tout comme dans l'utilisation des visuels, la répétition dans le contenu d'apprentissage est également très importante pour le renforcement. En répétant et en récapitulant les sections du contenu d'apprentissage tout au long de l'expérience d'apprentissage, vous contribuez à renforcer les messages clés sur lesquels les apprenants doivent se concentrer. Cela peut signifier présenter ou expliquer le même contenu de diverses manières, poser plusieurs questions différentes sur le contenu tout au long de l'expérience ou ajouter des sections récapitulatives pour attirer l'attention sur les principaux points à retenir de l'apprentissage.

7. Unité

Enfin, l'unité relie tout ensemble, créant un sentiment d'harmonie et de cohérence dans votre conception.

Du point de vue de l'apprentissage, l'unité signifierait un fil conducteur et une cohésion dans votre expérience d'apprentissage. Cela signifie que toute métaphore, thème ou association visuelle doit être appliquée à toutes vos conceptions. Si vous avez décidé de comparer la réalisation de vos objectifs à la course à pied d'un marathon, vous ne pouvez pas soudainement qualifier le processus de sprint ou de slam dunk. Gardez-le cohérent.

Il en va de même pour votre conception. Les couleurs, les polices et les interactions doivent être utilisées de manière cohérente. Si vous avez décidé de présenter les étapes sous forme de nombres cliquables qui révèlent du texte, vous ne pouvez pas soudainement présenter les étapes sous forme de cartes à feuilles mobiles. Cela rompt l'unité dans votre conception, tout comme la modification de la taille de la police, des valeurs de couleur ou du style visuel entre les pages.

À un niveau supérieur, pensez à l'unité de votre expérience dans son ensemble, à la façon dont l'information est structurée, segmentée et présentée. L'unité doit être dans tout, du temps, du ton, de la langue et tout au long de la conception visuelle.

Le moyen le plus simple de s'assurer que cela est fait, en particulier lorsque plusieurs personnes créent des cours en même temps, est de créer un système de conception d'apprentissage. Il s'agit essentiellement d'un guide qui détaille la façon dont la conception et le langage sont utilisés dans votre contenu d'apprentissage. Il décrit tous les éléments de conception tels que les polices, les couleurs, les icônes, les illustrations et explique comment les utiliser. Il comprend également des directives sur les interactions, la langue et le ton. Un excellent système de conception pour l'inspiration est le vaste système de conception d'Uber.

Les 7 principes de conception

Ces 7 principes peuvent être incroyablement utiles s'ils sont pris en compte au début du processus de conception et de développement, garantissant une base de conception solide qui non seulement augmente la satisfaction et l'engagement, mais facilite l'apprentissage.

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *