{"id":1520,"date":"2021-06-15T10:18:36","date_gmt":"2021-06-15T09:18:36","guid":{"rendered":"https:\/\/blog.univ-angers.fr\/istiaprojetsei2\/?p=1520"},"modified":"2021-06-17T21:30:02","modified_gmt":"2021-06-17T20:30:02","slug":"cryptographie-visuelle","status":"publish","type":"post","link":"https:\/\/blog.univ-angers.fr\/polytech_2A\/2021\/06\/15\/cryptographie-visuelle\/","title":{"rendered":"Cryptographie Visuelle"},"content":{"rendered":"<p>Nous sommes deux \u00e9tudiants en peip2A \u00e0 Polytech Angers, Baptiste Marchand et Cl\u00e9ment Veyer. Cet article vous pr\u00e9sente notre projet de cryptographie visuelle. Ce projet s&#8217;est effectu\u00e9 dans le cadre des projets de fin de cycle pr\u00e9paratoire aux \u00e9coles Polytech. Nous avons choisi ce projet car, tous deux, nous voulons poursuivre nos \u00e9tudes d&#8217;ing\u00e9nieur dans le domaine informatique, et ce projet s&#8217;inscrit parfaitement dans notre d\u00e9marche.<\/p>\n<p><strong>La cryptographie visuelle, qu&#8217;est-ce que c&#8217;est?<\/strong><br \/>\nLa cryptographie visuelle est l\u2019art de prot\u00e9ger des messages sous formes d\u2019images. On obtient alors des \u201cmasques\u201d qui sont en fait des images en noir et blanc g\u00e9n\u00e9r\u00e9es al\u00e9atoirement. La m\u00e9thode a \u00e9t\u00e9 cr\u00e9\u00e9e par Moni Naor et Adi Shamir en 1994, deux chercheurs en math\u00e9matiques et informatique. Ce qu\u2019il y a de tout \u00e0 fait particulier avec ce concept, c\u2019est qu\u2019il est \u00e0 la fois accessible \u00e0 tout le monde car tr\u00e8s visuel, mais paradoxalement quasi impossible \u00e0 cracker sans disposer de tous les masques n\u00e9cessaires.<\/p>\n<div id=\"attachment_1611\" style=\"width: 1034px\" class=\"wp-caption alignnone\"><a href=\"https:\/\/blog.univ-angers.fr\/istiaprojetsei2\/files\/2021\/06\/animiertes-gif-von-online-umwandeln-de.gif\"><img loading=\"lazy\" decoding=\"async\" aria-describedby=\"caption-attachment-1611\" class=\"size-full wp-image-1611\" alt=\"Image 1 : exemple de cryptographie visuelle avec deux masques jetables\" src=\"https:\/\/blog.univ-angers.fr\/istiaprojetsei2\/files\/2021\/06\/animiertes-gif-von-online-umwandeln-de.gif\" width=\"1024\" height=\"1196\" \/><\/a><p id=\"caption-attachment-1611\" class=\"wp-caption-text\">Image 1 : exemple de cryptographie visuelle avec deux masques jetables<\/p><\/div>\n<p><strong>Pr\u00e9sentation du projet<\/strong><br \/>\nLe but de ce projet \u00e9tait \u00e0 la base tr\u00e8s simple : cr\u00e9er un programme python permettant d\u2019effectuer une cryptographie visuelle \u00e0 partir d\u2019une image que l\u2019on veut cacher. Dans notre groupe, nous nous sommes fix\u00e9s plusieurs objectifs qui d\u00e9coulent du premier. Dans un premier temps, la cr\u00e9ation d\u2019une GUI (Graphic User Interface) qui regrouperait l\u2019ensemble des m\u00e9thodes que nous avons pu mettre au point. Mais \u00e9galement, sur l\u2019id\u00e9e de S\u00e9bastien Lagrange, nous nous sommes fix\u00e9s l\u2019objectif de cr\u00e9er un jeu de cartes classique (32 cartes) qui permettrait de r\u00e9v\u00e9ler un symbole diff\u00e9rent pour chaque combinaison de carte, soit (31*32)\/2 = 496 combinaisons diff\u00e9rentes.<\/p>\n<p><strong>M\u00e9thode basique des masques jetables<\/strong><br \/>\nCette m\u00e9thode est l\u2019essence m\u00eame de toutes les autres. Elle prend une image en noir et blanc, constitu\u00e9 donc de 0 et de 1 et la divise en 2 images distinctes. La premi\u00e8re des deux images est g\u00e9n\u00e9r\u00e9e compl\u00e8tement al\u00e9atoirement. La seconde, est g\u00e9n\u00e9r\u00e9e en fonction du masque et de l\u2019image d\u2019origine. Pour faire le choix de couleur de de cette image, on utilise un XOR. Si on applique de nouveau un XOR aux images chiffr\u00e9es, on retrouve l\u2019image secr\u00e8te \u00e0 la perfection. Et si l\u2019on superpose physiquement les 2 images (OU), on retrouve l\u2019image secr\u00e8te, mais imparfaite car cette fois-ci elle poss\u00e8de du bruit, comme illustr\u00e9 sur l&#8217;Image 1.<\/p>\n<p>Pour faire notre premier programme qui appliquait donc cette m\u00e9thode, voici les \u00e9tapes que nous avons suivi sur python, \u00e0 l&#8217;aide du module Pillow :<br \/>\n\u2022 on demande \u00e0 l&#8217;utilisateur l&#8217;image \u00e0 crypter (qui doit \u00eatre purement en noir et blanc)<br \/>\n\u2022 on ouvre le fichier (png ou jpg) et on en fait une matrice de pixels de valeurs 0 ou 255<br \/>\n\u2022 on cr\u00e9e un premier masque al\u00e9atoirement (donc 50% noir et 50% blanc)<br \/>\n\u2022 on cr\u00e9e le second masque, en faisant pour chaque pixel, un xor entre le pixel original, et celui du premier masque<br \/>\n\u2022 on enregistre les deux masques, et le tour est jou\u00e9!<\/p>\n<p><strong>Am\u00e9liorations<\/strong><br \/>\nCette premi\u00e8re m\u00e9thode fonctionne tr\u00e8s bien, mais apr\u00e8s l&#8217;avoir termin\u00e9e, nous avons vite compris le potentiel de cryptographie visuelle. On pourrait par exemple r\u00e9duire le bruit, augmenter le nombre de masques, ou encore avoir des masques imag\u00e9s.<br \/>\nMais pour faire tout cela, il faut quadrupler la taille des masques cr\u00e9\u00e9s. On a ainsi, pour chaque pixel original, une matrice de 2*2 pixels.<br \/>\nNous pouvons donc nous permettre de repr\u00e9senter les pixels par des niveau de gris. Tel que: noir 0% = 0 pixels noir sur les 4, 25% = 1 pixel noir sur les 4, 50% = 2\/4 , 75% = 3\/4, 100% = 4\/4.<br \/>\nSi on reprend la premi\u00e8re m\u00e9thode avec la taille quadrupl\u00e9e, on obtient les cas suivants :<\/p>\n<div id=\"attachment_1782\" style=\"width: 336px\" class=\"wp-caption alignnone\"><a href=\"https:\/\/blog.univ-angers.fr\/istiaprojetsei2\/files\/2021\/06\/Image1.png\"><img loading=\"lazy\" decoding=\"async\" aria-describedby=\"caption-attachment-1782\" class=\"size-full wp-image-1782\" alt=\"Image 2 : diff\u00e9rentes combinaisons pour chaque pixel original en ayant quadrupl\u00e9 la taille des masques\" src=\"https:\/\/blog.univ-angers.fr\/istiaprojetsei2\/files\/2021\/06\/Image1.png\" width=\"326\" height=\"476\" srcset=\"https:\/\/blog.univ-angers.fr\/polytech_2A\/files\/2021\/06\/Image1.png 326w, https:\/\/blog.univ-angers.fr\/polytech_2A\/files\/2021\/06\/Image1-205x300.png 205w\" sizes=\"auto, (max-width: 326px) 100vw, 326px\" \/><\/a><p id=\"caption-attachment-1782\" class=\"wp-caption-text\">Image 2 : diff\u00e9rentes combinaisons pour chaque pixel original en ayant quadrupl\u00e9 la taille des masques<\/p><\/div>\n<p>Les combinaisons en haut de l&#8217;image d\u00e9crivent un pixel original blanc, et celles d&#8217;en bas d\u00e9crivent un pixel original noir. On aura, en superposant les masques, un blanc qui est en fait un gris 50%, et un noir 100%.<\/p>\n<p>Une fois qu&#8217;on a fait cela, on imagine ais\u00e9ment que, si on veut maintenant trois masques, on aura un r\u00e9sultat avec un blanc 75%. En effet, on superpose trois matrices de 2*2 pixels qui laissent passer un seul pixel blanc.<\/p>\n<p>Avec cette nouvelle m\u00e9thode, la taille quadrupl\u00e9e r\u00e9duit le bruit observ\u00e9 par l&#8217;oeil humain, et les trois masques permettent une s\u00e9curit\u00e9 de plus : si on superpose 2 des 3 masques, on n&#8217;observe rien du tout \u00e0 part du gris. Voici le r\u00e9sultat qu&#8217;on obtient :<\/p>\n<div id=\"attachment_1642\" style=\"width: 1034px\" class=\"wp-caption alignnone\"><a href=\"https:\/\/blog.univ-angers.fr\/istiaprojetsei2\/files\/2021\/06\/gif3.gif\"><img loading=\"lazy\" decoding=\"async\" aria-describedby=\"caption-attachment-1642\" class=\"size-full wp-image-1642\" alt=\"Image 3 : Exemple de cryptographie visuelle \u00e0 trois masques\" src=\"https:\/\/blog.univ-angers.fr\/istiaprojetsei2\/files\/2021\/06\/gif3.gif\" width=\"1024\" height=\"683\" \/><\/a><p id=\"caption-attachment-1642\" class=\"wp-caption-text\">Image 3 : Exemple de cryptographie visuelle \u00e0 trois masques<\/p><\/div>\n<p><strong>M\u00e9thode des masques imag\u00e9s<\/strong><br \/>\nCette m\u00e9thode est la plus convaincante de toutes, car les masques ont maintenant un sens. Il faut donc 3 images pour cette m\u00e9thode, 2 images seront visibles et la 3\u00e8me secr\u00e8te, cach\u00e9e dans les deux autres. Pour ce faire, on utilise bien s\u00fbr les masques \u00e0 taille quadrupl\u00e9e.<\/p>\n<p>Les masques ont des pixels blancs repr\u00e9sent\u00e9s en 50% et des pixels noirs en 75%.<br \/>\nL\u2019image obtenue par la superposition (OU) des deux masques imag\u00e9s, elle poss\u00e8de des pixels blancs en 75% et des pixels noirs en 100%.<\/p>\n<p>A partir d\u2019ici, on distingue 8 possibilit\u00e9s distinctes:<br \/>\n4 possibilit\u00e9s ou le pixel secret est blanc, donc un pixel 75% obtenu une fois superpos\u00e9<br \/>\nLe premier masque est blanc, le second aussi<br \/>\nLe premier masque est noir, le second aussi<br \/>\nLe premier masque est blanc, le second noir<br \/>\nLe premier masque est noir, le second est blanc (\u00e9quivalent au pr\u00e9c\u00e9dent)<\/p>\n<p>Et 4 autres ou le pixel secret est noir, donc un pixel 100%, obtenu une fois superpos\u00e9:<br \/>\nLe premier masque est blanc, le second aussi<br \/>\nLe premier masque est noir, le second aussi<br \/>\nLe premier masque est blanc, le second noir<br \/>\nLe premier masque est noir, le second est blanc (\u00e9quivalent au pr\u00e9c\u00e9dent)<\/p>\n<p>Nous avons d\u00e9compos\u00e9 les diff\u00e9rentes configurations de pixel que nous avons choisi dans le tableau blanc ci-contre (en haut):<br \/>\n<a title=\"Microsoft whiteboard\" href=\"https:\/\/wbd.ms\/share\/v2\/aHR0cHM6Ly93aGl0ZWJvYXJkLm1pY3Jvc29mdC5jb20vYXBpL3YxLjAvd2hpdGVib2FyZHMvcmVkZWVtL2EzN2E0Mzc5MTc0NzRlNjI5ODMwYmRiYTdiNjc0MWY5X2NjYmQ0ZWU2LWM4NDctNDI5ZC1iOTQ3LWE1Y2ZkZDA0Yzk2Mw==\">Microsoft whiteboard<\/a><br \/>\nMais le plus important est de comprendre la logique:<br \/>\nLorsqu\u2019un pixel \u00e0 coder est noir, on fait en sorte de ne pas superposer les pixel noirs des masques pour qu\u2019une fois les masques superpos\u00e9, il ne reste pas de pixel blanc (noir 100%).<br \/>\nAu contraire, si le pixel a coder est blanc, on fait en sorte de superposer les pixels noirs des masques pour que lorsque l\u2019on superpose les masques, un des 4 pixels reste blanc (noir 75%).<br \/>\nL\u2019\u0153il humain est ais\u00e9ment capable de faire la distinction entre du noir 75% et du noir 100%. Ce qui lui permet donc de percevoir cette image obtenue, comme vous pouvez en faire l&#8217;exp\u00e9rience ci-dessous.<\/p>\n<div id=\"attachment_1624\" style=\"width: 1034px\" class=\"wp-caption alignnone\"><a href=\"https:\/\/blog.univ-angers.fr\/istiaprojetsei2\/files\/2021\/06\/gif2.gif\"><img loading=\"lazy\" decoding=\"async\" aria-describedby=\"caption-attachment-1624\" class=\"size-full wp-image-1624\" alt=\"Image 4 : exemple de cryptographie visuelle avec deux masques imag\u00e9s\" src=\"https:\/\/blog.univ-angers.fr\/istiaprojetsei2\/files\/2021\/06\/gif2.gif\" width=\"1024\" height=\"639\" \/><\/a><p id=\"caption-attachment-1624\" class=\"wp-caption-text\">Image 4 : exemple de cryptographie visuelle avec deux masques imag\u00e9s<\/p><\/div>\n<p><strong>Pour terminer<\/strong><br \/>\nPour finir, nous avons d&#8217;une part cr\u00e9\u00e9 une interface graphique qui regroupe toutes les m\u00e9thodes d\u00e9velopp\u00e9es. T\u00e9lechargez le dossier contenant un ex\u00e9cutable ci-dessous : \n<div class=\"gde-error\">GDE Erreur: Erreur lors de la r\u00e9cup\u00e9ration du fichier - si n\u00e9cessaire, arr\u00eatez la v\u00e9rification d'erreurs (404:Not Found)<\/div>\n<br \/>\nEt dont voici un tuto d&#8217;utilisation : <a href=\"https:\/\/youtu.be\/8tiozFkfo8A\" title=\"tuto d'utilisation\" target=\"_blank\">https:\/\/youtu.be\/8tiozFkfo8A<\/a><\/p>\n<p>Et d&#8217;autre part, nous avons \u00e9labor\u00e9 un jeu de 32 cartes sur la base des masques imag\u00e9s, mais o\u00f9 chaque combinaison de cartes fait apparaitre une symbole diff\u00e9rent (voir notre <a href=\"\/\/gitlab.u-angers.fr\/projetsetudiants\/peip2_2021_visualcrypto2\/-\/tree\/master\/Cartes_officielles\/masques\" title=\"gitlab\" target=\"_blank\">gitlab<\/a>) .<\/p>\n<p>Nous avons voulu terminer en beaut\u00e9 en d\u00e9veloppant un algorithme de VSS (Visual Secret Sharing) qui permet de g\u00e9n\u00e9rer n masques, puis en superposant superposant au moins k parmi ces n masques, nous pourrions observer l&#8217;image secr\u00e8te. Malheureusement, nous avons \u00e0 peine eu le temps de finir notre travail de recherche \u00e0 ce sujet.<br \/>\nPour avoir plus de pr\u00e9cisions sur ces trois projets, nous vous conseillons \u00e9galement de t\u00e9l\u00e9charger notre rapport complet, disponible \u00e0 la fin de cet article.<\/p>\n<p><strong>Conclusion<\/strong><br \/>\nPour conclure, ce projet nous a permis d&#8217;abord de mettre en application nos connaissances en terme d&#8217;algorithmique et d&#8217;adaptation \u00e0 un langage de programmation. Effectivement, nous n&#8217;avions encore jamais vraiment programm\u00e9 en python, et nous avons r\u00e9ussi assez rapidement \u00e0 nous accommoder au langage qui a l&#8217;avantage d&#8217;\u00eatre facile \u00e0 appr\u00e9hender.<br \/>\nNous avons \u00e9galement eu l&#8217;occasion de faire un travail de documentation important pour essayer de bien comprendre tous les concepts, m\u00eame si nous n&#8217;avons pas eu l&#8217;occasion de tout mettre en application. Pour cela, nous avons exploit\u00e9 de nombreux articles de recherche, notamment ceux de Moni Naor et Adi Shamir, mais \u00e9galement des articles fran\u00e7ais. Cela nous a permis d&#8217;effectuer un &#8220;semblant&#8221; de travail de recherche assez int\u00e9ressant.<br \/>\nFinalement, nous sommes fier du travail que nous avons produit et avons accompli nos 2 objectifs principaux. Avec plus de temps, nous aurions pu essayer de d\u00e9velopper la m\u00e9thode ultime de VSS.<\/p>\n<p>T\u00e9l\u00e9charger le rapport de notre projet :<\/p>\n\n<div class=\"gde-error\">GDE Erreur: Erreur lors de la r\u00e9cup\u00e9ration du fichier - si n\u00e9cessaire, arr\u00eatez la v\u00e9rification d'erreurs (404:Not Found)<\/div>\n\n","protected":false},"excerpt":{"rendered":"<p>Nous sommes deux \u00e9tudiants en peip2A \u00e0 Polytech Angers, Baptiste Marchand et Cl\u00e9ment Veyer. Cet article vous pr\u00e9sente notre projet de cryptographie visuelle. Ce projet s&#8217;est effectu\u00e9 dans le cadre des projets de fin de cycle pr\u00e9paratoire aux \u00e9coles Polytech. &hellip; <a href=\"https:\/\/blog.univ-angers.fr\/polytech_2A\/2021\/06\/15\/cryptographie-visuelle\/\">Continuer la lecture <span class=\"meta-nav\">&rarr;<\/span><\/a><\/p>\n","protected":false},"author":75725,"featured_media":2005,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[344],"tags":[405,400,404,249,402,195,243,215,153,401,403],"class_list":["post-1520","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-344","tag-cartes","tag-cryptographie","tag-enigme","tag-image","tag-oeil","tag-peip2","tag-polytech-angers","tag-programmation","tag-python","tag-secret","tag-visuel"],"_links":{"self":[{"href":"https:\/\/blog.univ-angers.fr\/polytech_2A\/wp-json\/wp\/v2\/posts\/1520","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\/75725"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.univ-angers.fr\/polytech_2A\/wp-json\/wp\/v2\/comments?post=1520"}],"version-history":[{"count":1,"href":"https:\/\/blog.univ-angers.fr\/polytech_2A\/wp-json\/wp\/v2\/posts\/1520\/revisions"}],"predecessor-version":[{"id":2076,"href":"https:\/\/blog.univ-angers.fr\/polytech_2A\/wp-json\/wp\/v2\/posts\/1520\/revisions\/2076"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/blog.univ-angers.fr\/polytech_2A\/wp-json\/wp\/v2\/media\/2005"}],"wp:attachment":[{"href":"https:\/\/blog.univ-angers.fr\/polytech_2A\/wp-json\/wp\/v2\/media?parent=1520"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.univ-angers.fr\/polytech_2A\/wp-json\/wp\/v2\/categories?post=1520"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.univ-angers.fr\/polytech_2A\/wp-json\/wp\/v2\/tags?post=1520"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}