Unlimited Wordpress themes, plugins, graphics & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Web Design
  2. Problem Solving
Webdesign

Les fondamentaux du Computational Thinking

by
Length:MediumLanguages:

French (Français) translation by Henri Lotin (you can also view the original English article)

Les web designers sont tenus de réfléchir à des problèmes d’une manière que peuvent comprendre des ordinateurs, le « computational thinking » est donc un atout indispensable pour eux à avoir. Il offre des outils systématiques nécessaires pour résoudre les tâches complexes des clients.

Le computational thinking permet aux designers web de décomposer un problème, de repérer les tendances dans les données, d’identifier et de se concentrer sur les aspects absolument nécessaires d’un problème, tout en laissant de côté les informations inutiles qui vont se faire enliser le processus.

Comme un outil pour une planification minutieuse, il évite les erreurs coûteuses qui viennent à la suite de se précipiter pour réaliser un projet sans avoir au préalable examiné les différentes facettes du problème sous la main.

Qu'est-ce que le computational thinking ?

Le computational thinking en tant que concept peut sembler intimidant. Mais chaque jour, dans tous les aspects de nos vies, nous effectuons le computational thinking. Pensez à ces actions et décisions qui vont dans ce sens :

  • Vous voulez vous faire une tasse de thé ou de café.
  • Vous voulez acheter une voiture.
  • Vous souhaitez changer de carrière.
  • Vous souhaitez déménager vers une autre ville.
  • Vous voulez acheter une maison.
  • Vous voulez écrire un livre.
  • Vous souhaitez créer une application.

Le processus de planification et de réalisation de ces objectifs implique un quelconque computational thinking.

La planification consiste à décomposer ces problèmes en parties gérables et venir avec des ensembles de solutions qui nous permettent d’atteindre l’objectif que nous avons à l’esprit.

breaking problems down into manageable parts
Décomposer les problèmes

Pour nos buts, puisque qu'en tant que designers web, nous voulons utiliser des ordinateurs pour nous aider à résoudre les problèmes à traiter, le computational thinking est vraiment au sujet de bien comprendre le problème complexe à portée de main, puis de le décomposer en une série de petits problèmes gérables. Nous développons ensuite des idées sur la façon de résoudre ces problèmes individuels plus petits et enfin communiquer les idées qui en résultent dans une série d’étapes qui peuvent être comprises et traitées par un ordinateur.

Cette démarche fait suite à ce que nous appelons « les principes du computational thinking ».

Les principes du computational thinking

Il y a quatre de ces principes :

  1. Décomposition
  2. Abstraction
  3. Reconnaissance de schéma
  4. Rédaction de l'algorithme

Voici les principales techniques qui vous aideront à penser algorithmiquement à un problème (défi ou tâche) complexe avant d’écrire une seule ligne de code. Nous allons les examiner.

1. Décomposition

Il s’agit décomposer un système ou un problème complexe en parties plus petites et plus facilement solvables. Ces petits problèmes sont résolus l’un après l’autre jusqu'à ce que le plus gros problème complexe soit résolu.

« Si un problème n’est pas décomposé, il est beaucoup plus difficile à résoudre. Gérer de nombreux stades différents en même temps est beaucoup plus difficile que décomposer un problème en un nombre de plus petits problèmes et les résoudre, un à la fois. » – BBC Bitesize

2. Reconnaissance de schéma

Une fois que vous avez décomposé le problème complexe en problèmes plus petits la prochaine étape est de regarder les similitudes qu’ils partagent.

Les schémas sont des caractéristiques communes qui se produisent dans chaque problème individuel. Quelles similitudes observez-vous ? Trouver ces similitudes aux petits problèmes décomposés peut nous aider à résoudre des problèmes complexes de façon plus efficace.

3. Abstraction

« Abstraction » se réfère à la focalisation sur les informations importantes seulement, tout ignorant les détails non pertinents. Pour parvenir à une solution, il faut ignorer les caractéristiques inutiles dans le but de se concentrer sur celles sur lesquelles nous travaillons.

Alors, quelle est l'informations importante sur laquelle nous devons nous concentrer ? Dans l’abstraction le focus porte principalement sur des caractéristiques générales communes à chaque élément, au lieu de détails spécifiques.

Une fois que vous avez les caractéristiques générales, vous pouvez créer un « modèle » du problème ; un modèle étant l’idée générale du problème que nous essayons de résoudre.

« Si nous n'abstrayons pas, nous pouvons finir avec la mauvaise solution au problème que nous essayons de résoudre. » – BBC Bitesize

Dès que nous aurons un modèle, nous pouvons concevoir un algorithme

4. Rédaction de l'algorithme

Vous avez éclaté le gros problème en problèmes plus petits, facile à gérer. Vous avez identifié des similitudes entre ces problèmes. Vous vous êtes focalisé sur les détails pertinents et laissé derrière tout ce qui ne l'est pas.

Maintenant il est temps d’élaborer des instructions étape par étape pour résoudre les petits problèmes, ou les règles à suivre pour résoudre le problème. Ces étapes ou règles simples sont utilisées pour programmer un ordinateur afin d'aider à résoudre un problème complexe de la meilleure façon. Elles sont aussi appelées « algorithmes ».

Définition : Un algorithme est un plan, un ensemble d’instructions détaillées (pas à pas) permettant de résoudre un problème.

« Les algorithmes n’impliquent pas toujours des exploits complexes de programmation ; dans l’âme, ce sont des séquences d’étapes vers un but. » – John Villasenor

Écrire un algorithme nécessite une planification approfondie pour qu’il fonctionne correctement. La solution que votre ordinateur vous propose est aussi bonne que l’algorithme que vous écrivez. Si l’algorithme n’est pas bon, alors votre solution ne sera pas bonne non plus.

Utilisez des diagrammes de flux

Les flowcharts offrent un moyen idéal de représenter les algorithmes.

« Un diagramme de flux est un type de diagramme qui représente un algorithme, le workflow ou le processus, montrant les étapes comme boîtes de toutes sortes et leur commande en les connectant avec des flèches. Cette représentation schématique illustre un modèle de solution à un problème donné. » – Wikipedia

Les diagrammes de flux sont un moyen facile de tracer des algorithmes, surtout s’ils ont besoin de produire des résultats différents le long du chemin. Ils utilisent des conventions de style standard. Les diagrammes de flux découlent de haut en bas et de gauche à droite.

example of ui elements from ux kits
Exemples d’élément de diagramme de flux de UX Kits

Utilisez du pseudo-code

Lorsque l'on décompose le problème sous la main en plus petites pièces gérables, vous communiquez vos résultats, idées et solutions possibles en Anglais bon (ou la langue que vous utilisez pour communiquer).

Les ordinateurs ne comprennent pas des instructions en anglais. Ils comprennent le code. Le code ou les algorithmes qui forment un ensemble d’instructions avec une syntaxe très spécifique.

Mais avant d'utiliser vos trouvailles pour écrire du code que comprendra l’ordinateur, il est généralement conseillé de les écrire en pseudo-code.

Le pseudo-code vous aide à planifier les solutions à votre problème afin d’éviter toute erreur lors de l’écriture de code. C’est une façon d’écrire des instructions de façon simplifiée qui se lit comme code. Le pseudo-code n’est pas du code, quoi qu'il en soit – il n’a pas de syntaxe spécifique utilisée par le code.

Le pseudo-code est mieux écrit à l’aide de mots-clés et variables. Les variables dans la programmation sont pour une valeur, un mot ou un morceau de code. Dans la programmation, la valeur des variables change selon l’endroit où vous êtes dans le code.

Ce pseudo-code (tiré de The University of Tennessee) pourrait par exemple calculer la paie :

Et ceci, exemple légèrement plus complexe pourrait calculer la paie avec les heures supplémentaires :

Le pseudo-code utilise des termes semblables à ceux du code qui sont utiles lorsqu'on le traduit en code.

  • STOP/END Les ordinateurs sont littéraux. Vous devez leur dire quand une instruction ou une déclaration est faite. Faites cela en écrivant STOP ou END.
  • IF/ELSE/THEN Les ordinateurs comprennent des conditions : si A se arrive alors exécuter B, sinon alors exécuter C.
  • INPUT/OUT Un certain type de code nécessite un intrant afin d’exécuter et de créer un extrant. Intrant est utilisé pour les données qu’un utilisateur ou une autre source donnera à l’ordinateur. Extrant est utilisé pour indiquer le résultat final d’une série de commandes.
  • Le terme de pseudo-code STORE/SAVE indique à un ordinateur d’enregistrer ou de stocker une valeur chaque fois que nécessaire.

Évaluer les solutions

Il y a effectivement une cinquième partie à tout ce processus. Vous avez utilisé le computational thinking pour parvenir à une solution. La solution est un algorithme qui permet de programmer l’ordinateur.

Vous êtes impatient de commencer la programmation, mais avant que vous alliez de l’avant, vous devez évaluer la solution. Pourquoi ?

« Sans évaluation des défauts dans l’algorithme ne seront pas repérés, et le programme ne peut pas résoudre correctement le problème, ou ne peut pas le résoudre de la meilleure des manières. » – BBC Bitesize

Pensez à l'évaluation de votre algorithme comme à du « déboggage ».

Conclusion

Le computational thinking traverse tous les aspects et fonctions de l’entreprise du 21e siècle. C’est une compétence indispensable en résolution de problèmes pour les designers web qui par la suite doivent représenter des solutions dans un langage que les ordinateurs peuvent comprendre et traiter.

N’oubliez pas, le computational thinking implique les étapes suivantes :

  1. Décomposition : décomposer un problème en ses éléments constitutifs.
  2. Reconnaissance de schéma : identifier les similitudes dans les composants d’un problème.
  3. Abstraction : se concentrer sur des informations générales importantes et laisser de côté les informations qui ne sont pas pertinentes à la solution.
  4. Écriture de l’algorithme : écrire le code qui crée la solution envisagée. Écrire des instructions étape par étape qui peuvent être lues et traitées par l’ordinateur. Les instructions sont écrites en utilisant les informations pertinentes provenant de la décomposition, de la reconnaissance des schémas et de l’abstraction.
  5. Évaluation : rechercher des bogues dans l’algorithme et y remédier afin de s’assurer qu’il fonctionne sans aucun problème.

Ressources utiles

Advertisement
Advertisement
Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.