{"id":3971,"date":"2026-07-22T15:51:09","date_gmt":"2026-07-22T15:51:09","guid":{"rendered":"https:\/\/nobrainnogain.org\/graphiste\/?post_type=projets&#038;p=3971"},"modified":"2026-07-23T00:43:03","modified_gmt":"2026-07-23T00:43:03","slug":"75h-de-la-serigraphie","status":"publish","type":"projets","link":"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/75h-de-la-serigraphie\/","title":{"rendered":"75h de la S\u00e9rigraphie"},"content":{"rendered":"\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\">\n<div class=\"elementor-element elementor-element-8b4cb2d elementor-widget elementor-widget-heading\" data-id=\"8b4cb2d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n<div class=\"elementor-widget-container\">\n<h2 class=\"elementor-heading-title elementor-size-default\">75h de la S\u00e9rigraphie<\/h2>\n<\/div>\n<\/div>\n<div class=\"elementor-element elementor-element-b27ae09 elementor-widget elementor-widget-text-editor\" data-id=\"b27ae09\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n<div class=\"elementor-widget-container\">\n<p>En 2022, le festival Kraft rejoignait le festival <a href=\"https:\/\/www.lemonstre.ch\/agenda.html\" target=\"_blank\" rel=\"noopener\">Monstre<\/a> dans l\u2019atelier de <a href=\"https:\/\/www.usine.ch\/espaces\/crache-papier\" target=\"_blank\" rel=\"noopener\">Crache papier<\/a> \u00e0 Gen\u00e8ve ! et les deux ateliers organisaient les 75 heures de la s\u00e9rigraphie. Trois jours de cr\u00e9ation effr\u00e9n\u00e9e dans le milieu underground genevois !<\/p>\n<\/div>\n<\/div>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"684\" height=\"1012\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/septantes-cinq-heure-de-la-serigraphie.webp\" alt=\"\" class=\"wp-image-3703\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/septantes-cinq-heure-de-la-serigraphie.webp 684w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/septantes-cinq-heure-de-la-serigraphie-203x300.webp 203w\" sizes=\"auto, (max-width: 684px) 100vw, 684px\" \/><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\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:50%\">\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"662\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/08\/Perfectionement-serigraphie.webp\" alt=\"\" class=\"wp-image-3845\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/08\/Perfectionement-serigraphie.webp 1024w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/08\/Perfectionement-serigraphie-300x194.webp 300w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/08\/Perfectionement-serigraphie-768x497.webp 768w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<link rel=\"stylesheet\" href=\"https:\/\/cdn.jsdelivr.net\/npm\/swiper@11\/swiper-bundle.min.css\">\n\n<div class=\"custom-carousel-container\">\n    <div class=\"swiper customSwiper\">\n        <div class=\"swiper-wrapper\">\n\n            <div class=\"swiper-slide\">\n                <img decoding=\"async\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/nudiste-1.webp\">\n                <div class=\"slide-content\">\n                    \n                <\/div>\n            <\/div>\n\n            <div class=\"swiper-slide\">\n                <img decoding=\"async\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/nudistes-2.webp\">\n                <div class=\"slide-content\">\n                    \n                <\/div>\n            <\/div>\n\n            <div class=\"swiper-slide\">\n                <img decoding=\"async\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/nudiste-3.webp\">\n                <div class=\"slide-content\">\n                    \n                <\/div>\n            <\/div>\n\n            <div class=\"swiper-slide\">\n                <img decoding=\"async\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/nudiste-4.webp\">\n                <div class=\"slide-content\">\n                    \n                <\/div>\n            <\/div>\n\n            <div class=\"swiper-slide\">\n                <img decoding=\"async\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/nudiste-5.webp\">\n                <div class=\"slide-content\">\n                    \n                <\/div>\n            <\/div>\n\n            <div class=\"swiper-slide\">\n                <img decoding=\"async\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/nudiste-6.webp\">\n                <div class=\"slide-content\">\n                    \n                <\/div>\n            <\/div>\n\n            <div class=\"swiper-slide\">\n                <img decoding=\"async\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/nudiste-7.webp\">\n                <div class=\"slide-content\">\n                    \n                <\/div>\n            <\/div>\n\n            <div class=\"swiper-slide\">\n                <img decoding=\"async\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/nudiste-8.webp\">\n                <div class=\"slide-content\">\n                    \n                <\/div>\n            <\/div>\n\n        <\/div>\n\n        <div class=\"swiper-button-prev\"><\/div>\n        <div class=\"swiper-button-next\"><\/div>\n        <div class=\"swiper-pagination\"><\/div>\n    <\/div>\n<\/div>\n\n<style>\n.custom-carousel-container{\n    width:100vw;\n    margin-left:calc(50% - 50vw);\n    position:relative;\n}\n\n.customSwiper{\n    width:100%;\n    height:70vh;\n    min-height:800px;\n    max-height:450px;\n}\n\n.customSwiper .swiper-slide{\n    position:relative;\n    overflow:hidden;\n}\n\n.customSwiper .swiper-slide img{\n    width:100%;\n    height:100%;\n    object-fit:cover;\n    display:block;\n}\n\n.slide-content{\n    position:absolute;\n    top:50%;\n    left:10%;\n    transform:translateY(-50%);\n    color:#fff;\n    max-width:600px;\n    z-index:2;\n}\n\n.slide-content h2{\n    font-size:clamp(2rem,4vw,4rem);\n    margin-bottom:15px;\n    line-height:1.1;\n}\n\n.slide-content p{\n    font-size:clamp(1rem,1.5vw,1.3rem);\n    margin:0;\n}\n\n.customSwiper .swiper-slide::after{\n    content:\"\";\n    position:absolute;\n    inset:0;\n    background:rgba(0,0,0,.35);\n    z-index:1;\n}\n\n.slide-content{\n    z-index:3;\n}\n\n.swiper-button-prev,\n.swiper-button-next{\n    color:#fff;\n}\n\n.swiper-pagination-bullet{\n    background:#fff;\n    opacity:.7;\n}\n\n.swiper-pagination-bullet-active{\n    opacity:1;\n}\n\n@media (max-width:768px){\n\n    .customSwiper{\n        height:55vh;\n        min-height:350px;\n    }\n\n    .slide-content{\n        left:20px;\n        right:20px;\n        max-width:none;\n    }\n}\n<\/style>\n\n<script src=\"https:\/\/cdn.jsdelivr.net\/npm\/swiper@11\/swiper-bundle.min.js\"><\/script>\n\n<script>\ndocument.addEventListener(\"DOMContentLoaded\", function() {\n\n    new Swiper(\".customSwiper\", {\n        loop: true,\n\n        autoplay: {\n            delay: 5000,\n            disableOnInteraction: true\n        },\n\n        speed: 900,\n\n        pagination: {\n            el: \".swiper-pagination\",\n            clickable: true\n        },\n\n        navigation: {\n            nextEl: \".swiper-button-next\",\n            prevEl: \".swiper-button-prev\"\n        },\n\n        effect: \"slide\"\n    });\n\n});\n<\/script>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<p>Premi\u00e8re cr\u00e9ation<\/p>\n<p>S\u00e9rigraphie Tentez le voyage<br \/>Th\u00e8me :Le voyage Contrainte : Fond de pot<br \/>Un travail autour du d\u00e9grad\u00e9 et du contraste avec la profondeur du noir. Une illustration vectoriel avec un design inspir\u00e9 des cartoons des ann\u00e9es 80. Une s\u00e9rigraphie militante qui c\u00e9l\u00e8bre les fiert\u00e9s r\u00e9alis\u00e9es en 2022 en format carte postale (toute \u00e9coul\u00e9e).<\/p>\n\n\n\n<p>Deuxi\u00e8me cr\u00e9ation<\/p>\n<p>Th\u00e8me : Naturisme Contrainte : Sans calage<br \/>le concept graphique s\u2019articule autour du point d\u2019attention de l\u2019image. Les photo en noir et blanc en trame de demi-teintes viennent contraster avec le fluo de la feuille de vigne d\u00e9pos\u00e9 au hasard par la contrainte sans calage. Le regard est automatiquement attir\u00e9 par la vibrance du fluo. Mais ces derni\u00e8res ne cachent rien, un joli pied de nez \u00e0 la pudibonderie ! <br \/>Un tirage durant l\u2019\u00e9v\u00e9nement en carte postale (toute \u00e9coul\u00e9e) et un retirage en carte postale avec une d\u00e9fonce pour faire ressortir le fluo.<\/p>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\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\"><\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\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\"><\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\"><\/div>\n<\/div>\n<\/div>\n<\/div>\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\">\n<h3 class=\"wp-block-heading has-text-align-center\">En savoir plus sur la s\u00e9rigraphie<\/h3>\n\n\n\n<div class=\"wp-block-buttons is-content-justification-center is-layout-flex wp-container-core-buttons-is-layout-fe48e5de wp-block-buttons-is-layout-flex\">\n<div class=\"wp-block-button\"><a class=\"wp-block-button__link wp-element-button\" href=\"\/serigraphie\">En savoir plus<\/a><\/div>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-vertically-aligned-center is-layout-flow wp-block-column-is-layout-flow\">\n<h3 class=\"wp-block-heading has-text-align-center\">Avoir plus d&rsquo;informations<\/h3>\n\n\n\n<div class=\"wp-block-buttons is-content-justification-center is-layout-flex wp-container-core-buttons-is-layout-af6bdb36 wp-block-buttons-is-layout-flex\">\n<div class=\"wp-block-button\"><a class=\"wp-block-button__link wp-element-button\" href=\"https:\/\/nobrainnogain.org\/graphiste\/contact-graphiste-nantes\/\">Prendre contact<\/a><\/div>\n\n\n\n<div class=\"wp-block-button\"><a class=\"wp-block-button__link wp-element-button\" href=\"https:\/\/nobrainnogain.org\/graphiste\/devis\/\">Demander un devis<\/a><\/div>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n<h3 class=\"wp-block-heading has-text-align-center has-x-large-font-size\">Voir d&rsquo;autres projets<\/h3>\n\n\n\n    <!-- data-uid identifie cette instance pr\u00e9cise du shortcode, utilis\u00e9 par le CSS et le JS plus bas -->\n    <div class=\"portfolio-select-wrapper\" data-uid=\"psf-1-XlpMaJ\">\n\n        <!-- ========================= -->\n        <!-- SELECT DE FILTRE -->\n        <!-- ========================= -->\n        <div class=\"portfolio-select-filter\">\n            <select class=\"portfolio-filter-select\" id=\"psf-1-XlpMaJ-filter\">\n\n                <!-- Option par d\u00e9faut : affiche tous les projets -->\n                <option value=\"*\">Toutes les cat\u00e9gories<\/option>\n\n                                    <!-- value = slug de la cat\u00e9gorie, utilis\u00e9 comme classe CSS sur chaque item -->\n                    <option value=\"affiche\">\n                        Affiche                    <\/option>\n                                    <!-- value = slug de la cat\u00e9gorie, utilis\u00e9 comme classe CSS sur chaque item -->\n                    <option value=\"fanzine\">\n                        Fanzine                    <\/option>\n                                    <!-- value = slug de la cat\u00e9gorie, utilis\u00e9 comme classe CSS sur chaque item -->\n                    <option value=\"illustration\">\n                        Illustration                    <\/option>\n                                    <!-- value = slug de la cat\u00e9gorie, utilis\u00e9 comme classe CSS sur chaque item -->\n                    <option value=\"mise-en-page\">\n                        Mise en page                    <\/option>\n                                    <!-- value = slug de la cat\u00e9gorie, utilis\u00e9 comme classe CSS sur chaque item -->\n                    <option value=\"motion-design\">\n                        motion design                    <\/option>\n                                    <!-- value = slug de la cat\u00e9gorie, utilis\u00e9 comme classe CSS sur chaque item -->\n                    <option value=\"packaging\">\n                        Packaging                    <\/option>\n                                    <!-- value = slug de la cat\u00e9gorie, utilis\u00e9 comme classe CSS sur chaque item -->\n                    <option value=\"residences\">\n                        R\u00e9sidences                    <\/option>\n                                    <!-- value = slug de la cat\u00e9gorie, utilis\u00e9 comme classe CSS sur chaque item -->\n                    <option value=\"serigraphie\">\n                        S\u00e9rigraphie                    <\/option>\n                                    <!-- value = slug de la cat\u00e9gorie, utilis\u00e9 comme classe CSS sur chaque item -->\n                    <option value=\"web-design\">\n                        web design                    <\/option>\n                \n            <\/select>\n        <\/div>\n\n        <!-- ========================= -->\n        <!-- GRILLE DE PROJETS -->\n        <!-- ========================= -->\n        <div class=\"portfolio-grid\">\n                                <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/boite-a-pizza-serigraphie\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item packaging serigraphie\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"768\" height=\"462\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2026\/06\/stella-suzie-768x462.webp\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"Bo\u00eete \u00e0 pizza s\u00e9rigraphi\u00e9e\" loading=\"lazy\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2026\/06\/stella-suzie-768x462.webp 768w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2026\/06\/stella-suzie-300x180.webp 300w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2026\/06\/stella-suzie.webp 1024w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/>                                <\/div>\n                            \n                            <h3>Bo\u00eete \u00e0 pizza s\u00e9rigraphi\u00e9<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/pepites-de-louest\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item web-design\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"768\" height=\"538\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/10\/Les-pepites-de-louest-768x538.webp\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"\" loading=\"lazy\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/10\/Les-pepites-de-louest-768x538.webp 768w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/10\/Les-pepites-de-louest-300x210.webp 300w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/10\/Les-pepites-de-louest-1024x717.webp 1024w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/10\/Les-pepites-de-louest-1536x1075.webp 1536w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/10\/Les-pepites-de-louest-2048x1434.webp 2048w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/>                                <\/div>\n                            \n                            <h3>P\u00e9pites de l\u2019Ouest<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/cirque-la-compagnie\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item affiche illustration mise-en-page\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"768\" height=\"576\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/10\/couv-simones-768x576.webp\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"Cirque la compagnie\" loading=\"lazy\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/10\/couv-simones-768x576.webp 768w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/10\/couv-simones-300x225.webp 300w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/10\/couv-simones.webp 1024w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/>                                <\/div>\n                            \n                            <h3>Cirque la compagnie<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/coco-pasta\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item packaging\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"768\" height=\"512\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/Packaging-768x512.webp\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"coco pasta\" loading=\"lazy\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/Packaging-768x512.webp 768w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/Packaging-300x200.webp 300w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/Packaging.webp 1024w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/>                                <\/div>\n                            \n                            <h3>Coco pasta<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/flyer-poln\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item mise-en-page\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"768\" height=\"866\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/07\/Flyer-poln-2--768x866.webp\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"\" loading=\"lazy\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/07\/Flyer-poln-2--768x866.webp 768w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/07\/Flyer-poln-2--266x300.webp 266w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/07\/Flyer-poln-2--908x1024.webp 908w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/07\/Flyer-poln-2--1362x1536.webp 1362w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/07\/Flyer-poln-2--1816x2048.webp 1816w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/>                                <\/div>\n                            \n                            <h3>Flyer Poln<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/75h-de-la-serigraphie\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item residences serigraphie\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"684\" height=\"1012\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/septantes-cinq-heure-de-la-serigraphie.webp\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"\" loading=\"lazy\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/septantes-cinq-heure-de-la-serigraphie.webp 684w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/septantes-cinq-heure-de-la-serigraphie-203x300.webp 203w\" sizes=\"auto, (max-width: 684px) 100vw, 684px\" \/>                                <\/div>\n                            \n                            <h3>75h de la S\u00e9rigraphie<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/heroine-de-la-modernites\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item motion-design\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"510\" height=\"895\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/vignette-heroines.webp\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"\" loading=\"lazy\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/vignette-heroines.webp 510w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/vignette-heroines-171x300.webp 171w\" sizes=\"auto, (max-width: 510px) 100vw, 510px\" \/>                                <\/div>\n                            \n                            <h3>H\u00e9ro\u00efne de la modernit\u00e9s<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/74-heures-de-la-serigraphie\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item residences serigraphie\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"768\" height=\"756\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/Kraft-74--768x756.webp\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"\" loading=\"lazy\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/Kraft-74--768x756.webp 768w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/Kraft-74--300x295.webp 300w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/Kraft-74--1024x1008.webp 1024w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/Kraft-74-.webp 1512w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/>                                <\/div>\n                            \n                            <h3>74 heures de la s\u00e9rigraphie<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/fanzine-la-mouche\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item fanzine illustration hidden\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"724\" height=\"1024\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/07\/la-mouche-n23-moche.webp\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"la-mouche-n23-moche\" loading=\"lazy\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/07\/la-mouche-n23-moche.webp 724w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/07\/la-mouche-n23-moche-212x300.webp 212w\" sizes=\"auto, (max-width: 724px) 100vw, 724px\" \/>                                <\/div>\n                            \n                            <h3>Fanzine la mouche<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/batgirl\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item motion-design hidden\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"768\" height=\"1\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2026\/07\/batgirl-logo-1.svg\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"Batgirl\" loading=\"lazy\" \/>                                <\/div>\n                            \n                            <h3>Batgirl<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/fata-morgana\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item serigraphie hidden\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"768\" height=\"563\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/Fatamorgana-768x563.webp\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"Fatamorgana\" loading=\"lazy\" srcset=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/Fatamorgana-768x563.webp 768w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/Fatamorgana-300x220.webp 300w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/Fatamorgana-1024x751.webp 1024w, https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2025\/06\/Fatamorgana.webp 1396w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/>                                <\/div>\n                            \n                            <h3>Fata morgana<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                                        <a href=\"https:\/\/nobrainnogain.org\/graphiste\/blog\/projets\/animation-de-logo\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"portfolio-link\">\n\n                        <div class=\"portfolio-item motion-design hidden\">\n\n                                                            <div class=\"portfolio-thumb\">\n                                    <img decoding=\"async\" width=\"768\" height=\"1\" src=\"https:\/\/nobrainnogain.org\/graphiste\/wp-content\/uploads\/2026\/07\/logo-sellerie.svg\" class=\"attachment-medium_large size-medium_large wp-post-image\" alt=\"\" loading=\"lazy\" \/>                                <\/div>\n                            \n                            <h3>Animation de logo<\/h3>\n\n                        <\/div>\n\n                    <\/a>\n                            <\/div>\n\n        <!-- ========================= -->\n        <!-- BOUTON VOIR PLUS -->\n        <!-- ========================= -->\n        <div class=\"portfolio-load-more-wrap\">\n            <button class=\"portfolio-load-more\" id=\"psf-1-XlpMaJ-loadmore\">\n                Voir plus            <\/button>\n        <\/div>\n\n    <\/div>\n\n    <!-- ================================================= -->\n    <!-- CSS -->\n    <!-- Chaque r\u00e8gle est pr\u00e9fix\u00e9e par [data-uid=\"...\"] pour isoler -->\n    <!-- le style de cette instance et \u00e9viter tout conflit si le -->\n    <!-- shortcode est utilis\u00e9 plusieurs fois sur la m\u00eame page. -->\n    <!-- ================================================= -->\n    <style>\n        \/* --- Conteneur du select --- *\/\n        [data-uid=\"psf-1-XlpMaJ\"] .portfolio-select-filter {\n            position: relative;\n            margin-bottom: 40px;\n            font-family: Helvetica, sans-serif;\n            font-weight: 900;\n        }\n\n        \/* Petite fl\u00e8che custom (remplace la fl\u00e8che native du <select>) *\/\n        [data-uid=\"psf-1-XlpMaJ\"] .portfolio-select-filter::after {\n            content: '\u2304';\n            color: #ffffff;              \/* corrig\u00e9 : \u00e9tait color:\"ffffff\" (invalide) *\/\n            position: absolute;\n            right: 20px;\n            top: 50%;\n            transform: translateY(-50%);\n            pointer-events: none;        \/* laisse les clics passer \u00e0 travers vers le select *\/\n            font-size: 18px;\n        }\n\n        \/* Style du <select> lui-m\u00eame, enti\u00e8rement pilot\u00e9 par les attributs du shortcode *\/\n        [data-uid=\"psf-1-XlpMaJ\"] .portfolio-filter-select {\n            width: 100%;\n            padding: 16px 22px;\n            background: #0000;\n            color: #fff;\n            border: 5px solid #ffffff;\n            border-radius: 8px;\n            font-family: Helvetica, sans-serif;\n            font-weight: 900;\n            font-size: 20px;\n            line-height: 1.4;\n            cursor: pointer;\n            outline: none;\n            \/* supprime le style natif du select selon les navigateurs *\/\n            appearance: none;\n            -webkit-appearance: none;\n            -moz-appearance: none;\n            transition: .3s;\n        }\n\n        \/* --- Grille responsive : 4 colonnes desktop \/ 2 tablette \/ 1 mobile --- *\/\n        [data-uid=\"psf-1-XlpMaJ\"] .portfolio-grid {\n            display: grid;\n            grid-template-columns: repeat(4, minmax(0, 1fr));\n            gap: 30px;\n        }\n\n        @media (max-width: 1024px) {\n            [data-uid=\"psf-1-XlpMaJ\"] .portfolio-grid {\n                grid-template-columns: repeat(2, 1fr);\n            }\n        }\n\n        @media (max-width: 767px) {\n            [data-uid=\"psf-1-XlpMaJ\"] .portfolio-grid {\n                grid-template-columns: 1fr;\n            }\n        }\n\n        \/* --- Item de la grille --- *\/\n        [data-uid=\"psf-1-XlpMaJ\"] .portfolio-item {\n            transition: .3s;\n            overflow: hidden; \/* n\u00e9cessaire pour que le zoom au hover ne d\u00e9borde pas de la carte *\/\n        }\n\n        \/* Classe ajout\u00e9e en PHP pour cacher les projets au-del\u00e0 du 8e (voir plus haut) *\/\n        [data-uid=\"psf-1-XlpMaJ\"] .portfolio-item.hidden {\n            display: none;\n        }\n\n        \/* --- Vignette (ratio fixe 4:3, quelle que soit la taille de l'image d'origine) --- *\/\n        [data-uid=\"psf-1-XlpMaJ\"] .portfolio-thumb {\n            position: relative;\n            width: 100%;\n            aspect-ratio: 4 \/ 3;\n            overflow: hidden;\n            border-radius: 16px;\n        }\n\n        [data-uid=\"psf-1-XlpMaJ\"] .portfolio-thumb img {\n            width: 100%;\n            height: 100%;\n            object-fit: cover;   \/* recadre l'image pour remplir le cadre sans la d\u00e9former *\/\n            display: block;\n            transition: transform .5s ease;\n        }\n\n        \/* Effet de zoom l\u00e9ger sur l'image au survol de la carte *\/\n        [data-uid=\"psf-1-XlpMaJ\"] .portfolio-item:hover img {\n            transform: scale(1.08);\n        }\n\n        \/* --- Bouton \"Voir plus\" --- *\/\n        [data-uid=\"psf-1-XlpMaJ\"] .portfolio-load-more-wrap {\n            margin-top: 30px;\n            text-align: center;\n        }\n\n        [data-uid=\"psf-1-XlpMaJ\"] .portfolio-load-more {\n            padding: 10px 20px;\n            border: none;\n            background: #111;\n            color: #ffffff;              \/* corrig\u00e9 : remplace la propri\u00e9t\u00e9 invalide font-color *\/\n            border-radius: 5px;\n            font-family: Helvetica, sans-serif;\n            font-weight: 900;\n            font-size: 20px;             \/* corrig\u00e9 : \"font-size:25px; bold\" n'\u00e9tait pas du CSS valide *\/\n            cursor: pointer;\n            transition: opacity .3s;\n        }\n\n        [data-uid=\"psf-1-XlpMaJ\"] .portfolio-load-more:hover {\n            opacity: .85;\n        }\n\n        \/* --- Neutralise le style de lien par d\u00e9faut du navigateur sur les cartes --- *\/\n        [data-uid=\"psf-1-XlpMaJ\"] .portfolio-link,\n        [data-uid=\"psf-1-XlpMaJ\"] .portfolio-link:visited,\n        [data-uid=\"psf-1-XlpMaJ\"] .portfolio-link:hover,\n        [data-uid=\"psf-1-XlpMaJ\"] .portfolio-link:focus,\n        [data-uid=\"psf-1-XlpMaJ\"] .portfolio-link:active {\n            text-decoration: none !important;\n            color: inherit;\n            display: block;\n        }\n    <\/style>\n\n    <!-- ================================================= -->\n    <!-- JAVASCRIPT -->\n    <!-- Encapsul\u00e9 dans une IIFE (fonction auto-ex\u00e9cut\u00e9e) : -->\n    <!-- aucune variable ne fuit dans l'espace global window, -->\n    <!-- donc aucun risque de conflit entre plusieurs instances -->\n    <!-- du shortcode ou avec d'autres scripts du th\u00e8me\/plugins. -->\n    <!-- ================================================= -->\n    <script>\n    (function() {\n        \/\/ On cible uniquement le wrapper de CETTE instance gr\u00e2ce \u00e0 data-uid\n        var wrapper = document.querySelector('[data-uid=\"psf-1-XlpMaJ\"]');\n        if (!wrapper) return; \/\/ s\u00e9curit\u00e9 : si le wrapper n'existe pas, on arr\u00eate le script ici\n\n        var filter      = wrapper.querySelector('.portfolio-filter-select');\n        var items       = wrapper.querySelectorAll('.portfolio-item');\n        var loadMoreBtn = wrapper.querySelector('.portfolio-load-more');\n\n        \/**\n         * Applique le filtre choisi : affiche les 8 premiers items correspondant\n         * \u00e0 la cat\u00e9gorie s\u00e9lectionn\u00e9e, cache le reste.\n         *\/\n        function applyFilter(value) {\n            var visibleCount = 0;\n\n            items.forEach(function(item) {\n                item.classList.add('hidden'); \/\/ on cache tout par d\u00e9faut...\n\n                \/\/ \"*\" = toutes cat\u00e9gories, sinon on v\u00e9rifie la classe CSS correspondant au slug\n                var matches = (value === '*') || item.classList.contains(value);\n\n                if (matches) {\n                    if (visibleCount < 8) {\n                        item.classList.remove('hidden'); \/\/ ...puis on r\u00e9-affiche les 8 premiers correspondants\n                    }\n                    visibleCount++;\n                }\n            });\n\n            \/\/ Le bouton \"Voir plus\" ne s'affiche que s'il reste des \u00e9l\u00e9ments \u00e0 charger\n            loadMoreBtn.style.display = (visibleCount <= 8) ? 'none' : 'inline-block';\n        }\n\n        \/\/ D\u00e9clenche le filtrage \u00e0 chaque changement dans le <select>\n        if (filter) {\n            filter.addEventListener('change', function() {\n                applyFilter(this.value);\n            });\n        }\n\n        \/\/ Gestion du clic sur \"Voir plus\" : r\u00e9v\u00e8le 4 \u00e9l\u00e9ments cach\u00e9s suppl\u00e9mentaires\n        if (loadMoreBtn) {\n            loadMoreBtn.addEventListener('click', function() {\n                var value = filter ? filter.value : '*';\n                var hiddenItems = [];\n\n                \/\/ R\u00e9cup\u00e8re la liste des items actuellement cach\u00e9s ET correspondant au filtre actif\n                items.forEach(function(item) {\n                    if (item.classList.contains('hidden')) {\n                        if (value === '*' || item.classList.contains(value)) {\n                            hiddenItems.push(item);\n                        }\n                    }\n                });\n\n                \/\/ R\u00e9v\u00e8le les 4 premiers de cette liste\n                hiddenItems.slice(0, 4).forEach(function(item) {\n                    item.classList.remove('hidden');\n                });\n\n                \/\/ Recalcule combien il en reste de cach\u00e9s, pour savoir si on doit\n                \/\/ masquer le bouton \"Voir plus\" (plus rien \u00e0 charger)\n                var remaining = 0;\n                items.forEach(function(item) {\n                    if (item.classList.contains('hidden') && (value === '*' || item.classList.contains(value))) {\n                        remaining++;\n                    }\n                });\n\n                if (remaining === 0) {\n                    loadMoreBtn.style.display = 'none';\n                }\n            });\n        }\n    })();\n    <\/script>\n\n    \n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"featured_media":3703,"parent":0,"menu_order":0,"template":"","categorie-travaux":[13,14],"class_list":["post-3971","projets","type-projets","status-publish","has-post-thumbnail","hentry","categorie-travaux-residences","categorie-travaux-serigraphie"],"acf":[],"_links":{"self":[{"href":"https:\/\/nobrainnogain.org\/graphiste\/wp-json\/wp\/v2\/projets\/3971","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/nobrainnogain.org\/graphiste\/wp-json\/wp\/v2\/projets"}],"about":[{"href":"https:\/\/nobrainnogain.org\/graphiste\/wp-json\/wp\/v2\/types\/projets"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/nobrainnogain.org\/graphiste\/wp-json\/wp\/v2\/media\/3703"}],"wp:attachment":[{"href":"https:\/\/nobrainnogain.org\/graphiste\/wp-json\/wp\/v2\/media?parent=3971"}],"wp:term":[{"taxonomy":"categorie-travaux","embeddable":true,"href":"https:\/\/nobrainnogain.org\/graphiste\/wp-json\/wp\/v2\/categorie-travaux?post=3971"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}