RESSOURCES PYTHON WEBAPP LYCEE – Conception

Conception et suivi de projet

Conception générale

La première partie de conception en groupe permet de dresser les grandes orientations du projet.

En cas de besoin, n’hésite pas à t’inspirer d’autres applications.

Lien vers le template de la fiche de conception

Pour créer un nouveau projet, clique sur le bouton New from this template puis sur le bouton Share pour partager avec les autres membres de ton groupe.

Petite vidéo de présentation de whimsical

Exemple de conception

Recherche d'outils

Dans cette partie de la conception, l’objectif est de trouver les outils utile au projet et de se rendre compte des difficultés. Il est important de se demander si ce que l’on veut faire est possible et comment :

- De quoi à t’on besoin ? Faut-il chercher des librairies spécifiques? Lesquelles? Sont-elles accessibles/compréhensibles? Correspondent elles au besoin que l’on a?
- Quelles sont les API que l’on veut utiliser? Sont elles conformes aux attentes? La documentation
  permet-elle de bien les prendre en main?
- Si le projet inclue de l’IA : à t’on les données nécessaires au projet? Peut-on trouver facilement plus de données si besoin?

Pour trouver les outils utiles au projet, il ne suffit pas se demander est-ce que la librairie existe, mais est-ce que je serais capable de la prendre en main? Y a t’il de la documentation? N’y en a t’il pas d’autres qui existent et qui seraient plus adaptées?

Pour cette partie de conception avancée, tu peux utiliser la partie Outils à gauche de la fiche de conception.

Petits tips :

pense à lire la documentation (ou au moins la survoler),
pense à faire des recherches en anglais
pense à préciser ce que tu cherches une API, une librairie python?
N’hésite pas à prendre des notes dans outils à tester et à les déplacer ensuite une fois testés

Identité visuelle et wireframes

Dans cette partie de la conception la question principale est :

A quoi va ressembler notre site internet et comment est-il organisé ?

Etape 1 : analyse et source d’inspiration

Recherche sur internet des sites qui ressemblent un peu à ce que vous voudriez créer.

- Comment sont-ils organisés?
- Où sont situés les boutons de connexion, de création de contenus, as-t’on un menu?
- Y a t’il des images? Où?
- Est-ce qu’il y a des éléments complexes que l’on retrouve plusieurs fois ? (par exemple les miniatures des vidéos Youtube)

Toutes ces questions doivent permettre d’identifier des pratiques communes ou spécifiques et de pouvoir par là suite choisir ce qui plait et ce qui ne plait pas.

Etape 2 : création des wireframes

Les wireframes sont les vues des différentes pages de notre app.

Voici une petite vidéo sur comment créer de wireframes sur whimsical

Prends bien le temps de penser aux différentes pages et à tout ce qui sera nécessaire sur ces pages.

Etape 3 : Palettes de couleurs, logo et polices

Voici quelques idées pour pimper son application :

Trouver une palette des couleurs qui s’harmonisent bien ensembles : http://thestocks.im/
Trouver une police de caractère qui donne de la personnalité au site : https://fonts.google.com/
Créer un logo avec des polices ultra stylées : https://fr.cooltext.com/ ou https://textcraft.net/

Structuration des bases de données

L’objectif de cette partie et de se demander :

- qu’est ce qu’on mémorise comme données? dans quelles tables de données?
- comment on fait le lien entre ces différentes données et comment on organise tout ça?

Pour bien penser tout ça on va fonctionner par étapes!

Etape 1: Lister tous les éléments présents sur le site

Notes tous les éléments et informations que tu dois trouver et stocker sur ton site qui seront gérées dynamiquement. Pour chacun de ces éléments prends le temps de bien détailler ce que tu veux mémoriser comme données.

Par exemple : Je créé un site de mise en relation de personnes du voisinage autour d’intérêts communs. Voici la liste des éléments que je vais avoir besoin d’afficher et de gérer :

Etape 2 : Faire les liens entre les différentes tables

Il y a des éléments entre les différentes tables qui se recoupent et des infos qui doivent permettre de faire le lien entre les ces différentes tables.

L’objectif de cette étape est de déterminer quelles sont les informations qui seront dans plusieurs tables et serviront de lien.

Voici un aperçu des liens pour notre exemple:

Les liens avec les utilisateurs se font via le pseudo. C’est valide car il est unique
Les liens entre messages, discussions, commentaires et annonces se font via l’ID qui est unique

Étape 3 : Simplifier et supprimer les doublons inutiles

Il arrive souvent que l’on soit confronté à des doublons dans nos liens. Or il ne sert à rien de stocker deux fois la même information. Il va falloir choisir ce que l’on garde et ce que l’on enlève.

Étape 3 a : identifier les doublons

Dans l’exemple ci-dessus on a trois doublons et trois problèmes qu’il va falloir trancher :

Le doublon message/ discussion : est-ce que le message contient l’ID de la discussion ou est-ce que la discussion contient la liste des messages?
Le doublon commentaires/annonces : est-ce que le commentaire contient l’ID d’une annonce ou est-ce que l’annonce contient une liste de commentaire?
Le doublon amitié/liste d’amis : est-ce que chaque utilisateur a une liste d’amis ou est-ce qu’on a une base qui contient toutes les paires d’amis?

–> Identifie dans ta construction à toi les différents problèmes qui peuvent faire doublons

Étape 3 b : supprimer les doublons, éviter les listes

Afin de faciliter les recherches d’informations, on va éviter au maximum d’imbriquer des données : on ne veut avoir une liste de liste de dictionnaires ou des dictionnaires avec des listes et des dictionnaires…

Pour cela on se fixe une règle simple : avoir les structures les plus simples possibles et donc éviter les listes.

Dans l’exemple ci-dessus cela se résume par les choix suivants:

Pour le cas des messages et des discussion, on va stocker l’ID de la discussion dans les messages et non une liste de messages dans la discussion. Pour afficher une discussion on cherchera donc tous les messages avec l’ID de la discussion pour les afficher et créer un message consistera juste à l’ajouter dans la base de donnée.

EXPERIMENTER