{"id":5230,"date":"2023-06-01T10:29:43","date_gmt":"2023-06-01T09:29:43","guid":{"rendered":"https:\/\/blog.univ-angers.fr\/istiaprojetsei2\/?p=5230"},"modified":"2023-06-01T10:29:43","modified_gmt":"2023-06-01T09:29:43","slug":"optimisation-jeux","status":"publish","type":"post","link":"https:\/\/blog.univ-angers.fr\/polytech_2A\/2023\/06\/01\/optimisation-jeux\/","title":{"rendered":"Optimisation Jeux"},"content":{"rendered":"\n<h1 class=\"wp-block-heading\">Et si l\u2019on facilitait la vie des gens en un clic ?<\/h1>\n\n\n\n<p class=\"wp-block-paragraph\">C\u2019est l\u2019objectif de notre projet : Proposer un site internet \u00e0 une ludo-cr\u00e8che qui leur permettrait de g\u00e9rer toutes leurs demandes d\u2019emprunt de jeux, en un clic. Il nous faut pour cela :&nbsp;<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Apprendre \u00e0 coder en PHP.<\/li>\n\n\n\n<li>Trouver un moyen d&#8217;attribuer un ensemble de jeu \u00e0 un ensemble de personnes de mani\u00e8re automatique.<\/li>\n\n\n\n<li>G\u00e9rer tout ce qui est relatif \u00e0 un site internet : mise en ligne, h\u00e9bergement\u2026<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image size-large is-resized\"><a href=\"https:\/\/blog.univ-angers.fr\/istiaprojetsei2\/files\/2023\/05\/ludo1.png\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/blog.univ-angers.fr\/istiaprojetsei2\/files\/2023\/05\/ludo1-1024x543.png\" alt=\"\" class=\"wp-image-5238\" width=\"614\" height=\"325\" srcset=\"https:\/\/blog.univ-angers.fr\/polytech_2A\/files\/2023\/05\/ludo1-1024x543.png 1024w, https:\/\/blog.univ-angers.fr\/polytech_2A\/files\/2023\/05\/ludo1-300x159.png 300w, https:\/\/blog.univ-angers.fr\/polytech_2A\/files\/2023\/05\/ludo1-768x407.png 768w, https:\/\/blog.univ-angers.fr\/polytech_2A\/files\/2023\/05\/ludo1-1536x814.png 1536w, https:\/\/blog.univ-angers.fr\/polytech_2A\/files\/2023\/05\/ludo1-500x265.png 500w, https:\/\/blog.univ-angers.fr\/polytech_2A\/files\/2023\/05\/ludo1.png 1920w\" sizes=\"auto, (max-width: 614px) 100vw, 614px\" \/><\/a><\/figure>\n\n\n\n<p class=\"has-text-align-center has-small-font-size wp-block-paragraph\"><em>Objectif : Un site web qui satisfait les utilisateurs comme les responsables et qui fait gagner du temps a tout le monde<\/em><\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\" \/>\n\n\n\n<h2 class=\"wp-block-heading\">Premi\u00e8re \u00e9tape : Apprendre \u00e0 coder<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">C\u2019est parti pour apprendre \u00e0 coder. Entre les bases de HTML et CSS n\u00e9cessaires pour comprendre PHP, la syntaxe de PHP, la structure du code\u2026 On y a pass\u00e9 plus d\u2019une vingtaine d\u2019heures.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">En plus d\u2019apprendre \u00e0 coder en PHP pour r\u00e9aliser l\u2019affichage et le fonctionnement du site, on devait aussi utiliser MySQL qui est une base de donn\u00e9es avec son propre langage ainsi qu\u2019un solveur : un langage de programmation visant \u00e0 r\u00e9soudre des probl\u00e8mes math\u00e9matiques.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><a href=\"https:\/\/blog.univ-angers.fr\/istiaprojetsei2\/files\/2023\/05\/ludo2.png\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"172\" src=\"https:\/\/blog.univ-angers.fr\/istiaprojetsei2\/files\/2023\/05\/ludo2-1024x172.png\" alt=\"\" class=\"wp-image-5246\" srcset=\"https:\/\/blog.univ-angers.fr\/polytech_2A\/files\/2023\/05\/ludo2-1024x172.png 1024w, https:\/\/blog.univ-angers.fr\/polytech_2A\/files\/2023\/05\/ludo2-300x50.png 300w, https:\/\/blog.univ-angers.fr\/polytech_2A\/files\/2023\/05\/ludo2-768x129.png 768w, https:\/\/blog.univ-angers.fr\/polytech_2A\/files\/2023\/05\/ludo2-1536x258.png 1536w, https:\/\/blog.univ-angers.fr\/polytech_2A\/files\/2023\/05\/ludo2-500x84.png 500w, https:\/\/blog.univ-angers.fr\/polytech_2A\/files\/2023\/05\/ludo2.png 1656w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/a><\/figure>\n\n\n\n<p class=\"has-text-align-center has-small-font-size wp-block-paragraph\"><em>L&#8217;apparence d&#8217;une table d&#8217;une base de donn\u00e9e MySQL<\/em><\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\" \/>\n\n\n\n<h2 class=\"wp-block-heading\">Commen\u00e7ons la programmation du site<\/h2>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-8f761849 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:33.33%\"><div class=\"wp-block-image is-style-default\">\n<figure class=\"aligncenter size-full is-resized\"><a href=\"https:\/\/blog.univ-angers.fr\/istiaprojetsei2\/files\/2023\/05\/ludo3-1.png\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/blog.univ-angers.fr\/istiaprojetsei2\/files\/2023\/05\/ludo3-1.png\" alt=\"\" class=\"wp-image-5268\" width=\"190\" height=\"951\" \/><\/a><figcaption class=\"wp-element-caption\">Chacun de ces fichiers compte entre 10 et 500 lignes de code, de quoi vite s&#8217;y perdre&#8230;<\/figcaption><\/figure>\n<\/div><\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:66.66%\">\n<p class=\"wp-block-paragraph\">La phase d\u2019apprentissage \u00e9tant termin\u00e9e, nous avons pu commencer \u00e0 r\u00e9aliser une premi\u00e8re version du site, un peu vide puisque nous avions tr\u00e8s peu d\u2019informations sur le contenu et l\u2019aspect qu\u2019il devait avoir. C\u2019est l\u00e0 qu\u2019on se heurte \u00e0 nos premiers probl\u00e8mes :<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Le travail en coop\u00e9ration : \u00e9tant donn\u00e9 le temps que l\u2019on avait pour cr\u00e9er ce site, il y allait avoir beaucoup de code r\u00e9parti sur beaucoup de pages. Au bout d\u2019un moment, on s\u2019est rendu compte que l\u2019on n&#8217;avait pas tous la m\u00eame mani\u00e8re de coder et la structure du code s\u2019est vite d\u00e9grad\u00e9e. Il a fallu imposer des r\u00e8gles strictes pour s\u2019assurer qu\u2019on puisse garder l\u2019ensemble des pages de codes claires tout au long du projet.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">La fonction d\u2019attribution : sans rentrer dans les d\u00e9tails, pour attribuer les jeux aux emprunteurs, il faut repr\u00e9senter cette t\u00e2che par un probl\u00e8me math\u00e9matique que l\u2019on va ensuite r\u00e9soudre gr\u00e2ce \u00e0 un solveur. Ce solveur nomm\u00e9 GLPK sert \u00e0 r\u00e9soudre des programmes lin\u00e9aires, cependant, il faut apprendre \u00e0 coder dans ce langage. Le probl\u00e8me \u00e9tant que quasiment personne n\u2019utilise GLPK, et cela se ressent dans l\u2019absence de documentation sur ce langage. Notre seule mani\u00e8re d\u2019apprendre \u00e9tait d\u2019utiliser un simple PDF de quelques pages sur GLPK et de faire des essais et des erreurs.<\/p>\n<\/div>\n<\/div>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\" \/>\n\n\n\n<h2 class=\"wp-block-heading\">Une quantit\u00e9 de travail inattendue<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Ce site devait simplement permettre \u00e0 des utilisateurs de faire des demandes de pr\u00eat de certains jeux et permettre aux responsables du site d\u2019attribuer ces jeux automatiquement, mais il y avait bien plus de travail derri\u00e8re que ce que l\u2019on imaginait.&nbsp;<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Voici une liste non exhaustive de ce qu\u2019il faut faire pour qu\u2019un site comme celui-l\u00e0 fonctionne :&nbsp;<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Faire un syst\u00e8me de connexion\/inscription.<\/li>\n\n\n\n<li>Cr\u00e9er diff\u00e9rentes interfaces en fonction de qui est connect\u00e9 (Simple utilisateur ou responsable).<\/li>\n\n\n\n<li>Stocker les donn\u00e9es des utilisateurs et des responsables \u00e0 l\u2019aide d\u2019une base de donn\u00e9es.<\/li>\n\n\n\n<li>G\u00e9rer les flux d\u2019information entre les pages.<\/li>\n\n\n\n<li>Lier plusieurs langages, PHP pour l\u2019affichage et la gestion du site, GLPK pour le syst\u00e8me d\u2019attribution des jeux et MySQL pour le stockage de donn\u00e9es.<\/li>\n\n\n\n<li>Cr\u00e9er un ensemble de fonctionnalit\u00e9s qui font le contenu du site (Faire et supprimer des v\u0153ux, voir les jeux disponibles et demand\u00e9s, voir les informations de son compte\u2026)<\/li>\n<\/ul>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\" \/>\n\n\n\n<h2 class=\"wp-block-heading\">Le r\u00e9sultat final<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Malgr\u00e9 les quelques probl\u00e8mes mentionn\u00e9s plus t\u00f4t et les nombreuses heures pass\u00e9es \u00e0 d\u00e9bugger le site, nous sommes finalement parvenus \u00e0 la version d\u00e9finitive qui r\u00e9pondait aux attentes du client. Ce site permet aux adh\u00e9rents de la ludo-cr\u00e8che de demander d\u2019emprunter des jeux, de consulter toutes les informations dont ils ont besoin (infos personnelles, infos sur les jeux, consulter leurs v\u0153ux et leurs jeux attribu\u00e9s\u2026). Ce site est surtout utile aux responsables de la ludo-cr\u00e8che, car ils peuvent d\u00e9sormais obtenir directement une liste \u00e0 jour des demandes d\u2019emprunt, attribuer les jeux d\u2019une mani\u00e8re presque optimale, bien meilleure que ce qu\u2019ils auraient fait \u00e0 la main et surtout bien plus rapidement. En plus du projet initial, nos clients nous ont demand\u00e9 des fonctionnalit\u00e9s suppl\u00e9mentaires afin que ce site seul permette la gestion totale des pr\u00eats de jeu. Ainsi il leur permet aussi de g\u00e9rer leurs stocks et de savoir o\u00f9 sont les jeux plus simplement. Notre site leur offre une archive de toutes les attributions pr\u00e9c\u00e9dentes, une liste de leurs membres et la possibilit\u00e9 d\u2019avoir diff\u00e9rents modes d\u2019emprunts.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><a href=\"https:\/\/blog.univ-angers.fr\/istiaprojetsei2\/files\/2023\/05\/ludo-5.png\"><img loading=\"lazy\" decoding=\"async\" width=\"1626\" height=\"628\" src=\"https:\/\/blog.univ-angers.fr\/istiaprojetsei2\/files\/2023\/05\/ludo-5.png\" alt=\"\" class=\"wp-image-5276\" \/><\/a><figcaption class=\"wp-element-caption\">L&#8217;ensemble des jeux demand\u00e9s par chacun, ainsi qu&#8217;un bouton qui s&#8217;occupe automatiquement de l&#8217;attribution qui aurait pris plusieurs heures \u00e0 la main.<\/figcaption><\/figure>\n\n\n\n<figure class=\"wp-block-image size-full is-resized\"><a href=\"https:\/\/blog.univ-angers.fr\/istiaprojetsei2\/files\/2023\/05\/ludo6.png\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/blog.univ-angers.fr\/istiaprojetsei2\/files\/2023\/05\/ludo6.png\" alt=\"\" class=\"wp-image-5278\" width=\"482\" height=\"401\" srcset=\"https:\/\/blog.univ-angers.fr\/polytech_2A\/files\/2023\/05\/ludo6.png 850w, https:\/\/blog.univ-angers.fr\/polytech_2A\/files\/2023\/05\/ludo6-300x250.png 300w, https:\/\/blog.univ-angers.fr\/polytech_2A\/files\/2023\/05\/ludo6-768x639.png 768w, https:\/\/blog.univ-angers.fr\/polytech_2A\/files\/2023\/05\/ludo6-361x300.png 361w\" sizes=\"auto, (max-width: 482px) 100vw, 482px\" \/><\/a><figcaption class=\"wp-element-caption\">Un formulaire permettant l&#8217;ajout rapide d&#8217;un jeu<\/figcaption><\/figure>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\" \/>\n\n\n\n<h2 class=\"wp-block-heading\">Conclusion<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Ce projet \u00e9tait une exp\u00e9rience vraiment diff\u00e9rente du genre de travaux que l\u2019on a fait jusqu\u2019\u00e0 maintenant dans nos \u00e9tudes. Ce qui nous a motiv\u00e9 \u00e0 nous investir autant, c\u2019est le fait de savoir qu\u2019il serait vraiment utile et qu\u2019il aiderait des personnes au quotidien. Ce projet a \u00e9t\u00e9 l\u2019occasion de se mettre dans la peau d\u2019un professionnel et de concevoir un produit pour un client, d\u2019autant plus que m\u00eame apr\u00e8s la date limite de r\u00e9alisation du projet, nous accompagnerons nos clients pour s&#8217;assurer que tout fonctionne correctement. C\u2019\u00e9tait aussi un bon entra\u00eenement \u00e0 la programmation pour deux d\u2019entre nous qui allons poursuivre nos \u00e9tudes dans le domaine de l\u2019informatique.<\/p>\n\n\n<h1 class=\"wp-block-site-title\"><a href=\"https:\/\/blog.univ-angers.fr\/polytech_2A\" target=\"_self\" rel=\"home\">Polytech Angers &#8211; Projets PEIP2<\/a><\/h1>\n\n\n<p class=\"has-text-align-right has-small-font-size wp-block-paragraph\"><mark class=\"has-inline-color has-black-color\"><em>Projet<\/em> <em>r\u00e9alis\u00e9 par<\/em><\/mark><em><mark class=\"has-inline-color has-blue-color\"> Florian Louveau<\/mark><\/em><mark class=\"has-inline-color has-black-color\"><em>, <\/em><\/mark><em><mark class=\"has-inline-color has-blue-color\">Maxence Martin<\/mark><\/em><mark class=\"has-inline-color has-black-color\"><em>, <\/em><\/mark><em><mark class=\"has-inline-color has-blue-color\">No\u00e9 Cabaud-Bloquel<\/mark><\/em>.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Et si l\u2019on facilitait la vie des gens en un clic ? C\u2019est l\u2019objectif de notre projet : Proposer un site internet \u00e0 une ludo-cr\u00e8che qui leur permettrait de g\u00e9rer toutes leurs demandes d\u2019emprunt de jeux, en un clic. Il &hellip; <a href=\"https:\/\/blog.univ-angers.fr\/polytech_2A\/2023\/06\/01\/optimisation-jeux\/\">Continuer la lecture <span class=\"meta-nav\">&rarr;<\/span><\/a><\/p>\n","protected":false},"author":99821,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[567],"tags":[608,20,609,612,352,284,243,607,215,27,606],"class_list":["post-5230","post","type-post","status-publish","format-standard","hentry","category-2022-2023","tag-glpk","tag-istia","tag-mysql","tag-optigame","tag-optimisation","tag-php","tag-polytech-angers","tag-probleme-lineaire","tag-programmation","tag-projet","tag-web-design"],"_links":{"self":[{"href":"https:\/\/blog.univ-angers.fr\/polytech_2A\/wp-json\/wp\/v2\/posts\/5230","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blog.univ-angers.fr\/polytech_2A\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blog.univ-angers.fr\/polytech_2A\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blog.univ-angers.fr\/polytech_2A\/wp-json\/wp\/v2\/users\/99821"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.univ-angers.fr\/polytech_2A\/wp-json\/wp\/v2\/comments?post=5230"}],"version-history":[{"count":5,"href":"https:\/\/blog.univ-angers.fr\/polytech_2A\/wp-json\/wp\/v2\/posts\/5230\/revisions"}],"predecessor-version":[{"id":5475,"href":"https:\/\/blog.univ-angers.fr\/polytech_2A\/wp-json\/wp\/v2\/posts\/5230\/revisions\/5475"}],"wp:attachment":[{"href":"https:\/\/blog.univ-angers.fr\/polytech_2A\/wp-json\/wp\/v2\/media?parent=5230"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.univ-angers.fr\/polytech_2A\/wp-json\/wp\/v2\/categories?post=5230"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.univ-angers.fr\/polytech_2A\/wp-json\/wp\/v2\/tags?post=5230"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}