{"id":5165,"date":"2025-05-09T12:11:51","date_gmt":"2025-05-09T10:11:51","guid":{"rendered":"https:\/\/tech.kouzay.com\/?p=5165"},"modified":"2025-05-09T12:20:24","modified_gmt":"2025-05-09T10:20:24","slug":"une-fuite-devoile-la-prochaine-interface-dandroid","status":"publish","type":"post","link":"https:\/\/tech.kouzay.com\/index.php\/2025\/05\/09\/une-fuite-devoile-la-prochaine-interface-dandroid\/","title":{"rendered":"une fuite d\u00e9voile la prochaine interface d\u2019Android !"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"5165\" class=\"elementor elementor-5165\" data-elementor-post-type=\"post\">\n\t\t\t\t<div class=\"elementor-element elementor-element-bf7840a e-flex e-con-boxed e-con e-parent\" data-id=\"bf7840a\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-d06ea71 etheme-elementor-widget-loaded elementor-widget elementor-widget-image\" data-id=\"d06ea71\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"512\" src=\"https:\/\/tech.kouzay.com\/wp-content\/uploads\/2025\/05\/Google-Expressive-copie-1024x512.webp\" class=\"attachment-large size-large wp-image-5172\" alt=\"\" srcset=\"https:\/\/tech.kouzay.com\/wp-content\/uploads\/2025\/05\/Google-Expressive-copie-1024x512.webp 1024w, https:\/\/tech.kouzay.com\/wp-content\/uploads\/2025\/05\/Google-Expressive-copie-300x150.webp 300w, https:\/\/tech.kouzay.com\/wp-content\/uploads\/2025\/05\/Google-Expressive-copie-768x384.webp 768w, https:\/\/tech.kouzay.com\/wp-content\/uploads\/2025\/05\/Google-Expressive-copie-1536x768.webp 1536w, https:\/\/tech.kouzay.com\/wp-content\/uploads\/2025\/05\/Google-Expressive-copie-1x1.webp 1w, https:\/\/tech.kouzay.com\/wp-content\/uploads\/2025\/05\/Google-Expressive-copie-10x5.webp 10w, https:\/\/tech.kouzay.com\/wp-content\/uploads\/2025\/05\/Google-Expressive-copie.webp 1600w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-eea5b63 e-flex e-con-boxed e-con e-parent\" data-id=\"eea5b63\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-6c94544 elementor-widget elementor-widget-html\" data-id=\"6c94544\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"fr\">\r\n<head>\r\n    <meta charset=\"UTF-8\">\r\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n    <title>Material 3 Expressive : La future refonte de l'interface Android<\/title>\r\n    <style>\r\n        \/* Styles g\u00e9n\u00e9raux *\/\r\n        .material-article {\r\n            font-family: 'Segoe UI', Roboto, -apple-system, sans-serif;\r\n            line-height: 1.6;\r\n            color: #202124;\r\n            max-width: 800px;\r\n            margin: 0 auto;\r\n            padding: 20px;\r\n        }\r\n        \r\n        \/* Titre *\/\r\n        .article-title {\r\n            font-size: 2.2rem;\r\n            font-weight: 700;\r\n            color: #1a73e8;\r\n            margin-bottom: 1.5rem;\r\n            line-height: 1.2;\r\n        }\r\n        \r\n        \/* Chapeau *\/\r\n        .article-lead {\r\n            font-size: 1.2rem;\r\n            font-weight: 500;\r\n            color: #5f6368;\r\n            margin-bottom: 2rem;\r\n            padding-bottom: 1rem;\r\n            border-bottom: 1px solid #dadce0;\r\n        }\r\n        \r\n        \/* Paragraphes *\/\r\n        .article-content p {\r\n            margin-bottom: 1.5rem;\r\n            font-size: 1.05rem;\r\n        }\r\n        \r\n        \/* Images *\/\r\n        .article-image {\r\n            max-width: 100%;\r\n            height: auto;\r\n            border-radius: 8px;\r\n            margin: 2rem 0;\r\n            box-shadow: 0 1px 2px 0 rgba(60,64,67,0.3), 0 2px 6px 2px rgba(60,64,67,0.15);\r\n        }\r\n        \r\n        \/* Citations *\/\r\n        .article-quote {\r\n            border-left: 4px solid #1a73e8;\r\n            padding-left: 1.5rem;\r\n            margin: 2rem 0;\r\n            font-style: italic;\r\n            color: #5f6368;\r\n        }\r\n        \r\n        \/* Listes *\/\r\n        .article-list {\r\n            margin: 1.5rem 0;\r\n            padding-left: 1.5rem;\r\n        }\r\n        \r\n        .article-list li {\r\n            margin-bottom: 0.8rem;\r\n        }\r\n        \r\n        \/* Boutons *\/\r\n        .read-more-btn {\r\n            background-color: #1a73e8;\r\n            color: white;\r\n            border: none;\r\n            padding: 12px 24px;\r\n            border-radius: 24px;\r\n            font-size: 1rem;\r\n            font-weight: 500;\r\n            cursor: pointer;\r\n            margin: 2rem 0;\r\n            transition: all 0.3s ease;\r\n            display: inline-block;\r\n        }\r\n        \r\n        .read-more-btn:hover {\r\n            background-color: #1765cc;\r\n            transform: translateY(-2px);\r\n            box-shadow: 0 2px 5px rgba(0,0,0,0.2);\r\n        }\r\n        \r\n        \/* Animation *\/\r\n        @keyframes fadeIn {\r\n            from { opacity: 0; transform: translateY(20px); }\r\n            to { opacity: 1; transform: translateY(0); }\r\n        }\r\n        \r\n        .animated-entry {\r\n            animation: fadeIn 0.6s ease-out forwards;\r\n        }\r\n        \r\n        \/* Responsive *\/\r\n        @media (max-width: 768px) {\r\n            .article-title {\r\n                font-size: 1.8rem;\r\n            }\r\n            \r\n            .article-lead {\r\n                font-size: 1.1rem;\r\n            }\r\n        }\r\n    <\/style>\r\n<\/head>\r\n<body>\r\n    <article class=\"material-article\">\r\n        <header class=\"animated-entry\" style=\"animation-delay: 0.1s;\">\r\n            <h1 class=\"article-title\">Material 3 Expressive : La future refonte de l'interface Android<\/h1>\r\n            <p class=\"article-lead\">Google pr\u00e9pare une importante mise \u00e0 jour visuelle pour Android, visant \u00e0 rompre avec les designs \"ennuyeux\" et cr\u00e9er un lien \u00e9motionnel avec les utilisateurs.<\/p>\r\n        <\/header>\r\n        \r\n        <div class=\"article-content\">\r\n            <div class=\"animated-entry\" style=\"animation-delay: 0.2s;\">\r\n                <p>La sortie du syst\u00e8me d'exploitation mobile Android 16 approche \u00e0 grands pas, Google ayant r\u00e9cemment publi\u00e9 la version b\u00eata 4. Cependant, de nombreuses personnes ont \u00e9t\u00e9 d\u00e9\u00e7ues du manque d'innovation au niveau de l'interface utilisateur. Il est peu probable que cela change au moment de la sortie d'Android 16, mais Google travaille actuellement sur une grosse refonte de l'interface qui pourrait arriver dans une mise \u00e0 jour ult\u00e9rieure.<\/p>\r\n            <\/div>\r\n            \r\n            <div class=\"animated-entry\" style=\"animation-delay: 0.3s;\">\r\n                <p>Cette refonte s'appelle Material 3 Expressive, et Google a accidentellement publi\u00e9 en avance une page de pr\u00e9sentation, rep\u00e9r\u00e9e par le site 9to5Google avant qu'elle ne soit retir\u00e9e. Selon la publication, toujours visible (sans les images) sur le Web Archive, Google veut \u00ab aller au-del\u00e0 des designs \"\u00e9pur\u00e9s\" et \"ennuyeux\" pour cr\u00e9er des interfaces qui \u00e9tablissent un lien avec les gens \u00e0 un niveau \u00e9motionnel \u00bb.<\/p>\r\n            <\/div>\r\n            \r\n            <div class=\"animated-entry\" style=\"animation-delay: 0.4s;\">\r\n                <blockquote class=\"article-quote\">\u00ab Aller au-del\u00e0 des designs \"\u00e9pur\u00e9s\" et \"ennuyeux\" pour cr\u00e9er des interfaces qui \u00e9tablissent un lien avec les gens \u00e0 un niveau \u00e9motionnel \u00bb<\/blockquote>\r\n            <\/div>\r\n            \r\n            <div class=\"animated-entry\" style=\"animation-delay: 0.5s;\">\r\n                <p>Partant d'un constat que toutes les applications se ressemblaient et \u00e9taient ennuyeuses, les \u00e9quipes chez Google ont men\u00e9 46 \u00e9tudes avec plus de 18\u202f000 participants, faisant appel \u00e0 diff\u00e9rentes techniques allant des sondages jusqu'au suivi des yeux.<\/p>\r\n            <\/div>\r\n            \r\n            <div class=\"animated-entry\" style=\"animation-delay: 0.6s;\">\r\n                <h2>Une annonce officielle \u00e0 la conf\u00e9rence Google I\/O 2025<\/h2>\r\n                <p>Material 3 Expressive utilise la couleur, la forme, la taille et le mouvement pour rendre un produit plus facile \u00e0 utiliser en attirant l'attention sur les parties les plus importantes de l'interface et en regroupant les \u00e9l\u00e9ments similaires. Sur les visuels donn\u00e9s en exemple, on remarque quelques d\u00e9tails qui illustrent ce concept :<\/p>\r\n                <ul class=\"article-list\">\r\n                    <li>Une barre d'outils l\u00e9g\u00e8rement d\u00e9tach\u00e9e du bas de l'\u00e9cran pour devenir flottante<\/li>\r\n                    <li>Un bouton \u00ab Envoyer \u00bb plus gros, color\u00e9, et plac\u00e9 dans une barre situ\u00e9e au-dessus du clavier<\/li>\r\n                    <li>Une meilleure organisation des \u00e9l\u00e9ments d'interface<\/li>\r\n                <\/ul>\r\n            <\/div>\r\n            \r\n            <div class=\"animated-entry\" style=\"animation-delay: 0.7s;\">\r\n                <p>Ces changements ne sont pas radicaux, mais simplifient l'usage selon Google. Dans le cas du bouton \u00ab Envoyer \u00bb, les participants ont pu le trouver quatre fois plus rapidement. Dans une comparaison avec l'iPhone, les participants ont largement pr\u00e9f\u00e9r\u00e9 Material 3 Expressive aux Human Interface Guidelines d'iOS, cette pr\u00e9f\u00e9rence atteignant m\u00eame 87\u202f% chez les 18-24 ans.<\/p>\r\n            <\/div>\r\n            \r\n            <div class=\"animated-entry\" style=\"animation-delay: 0.8s;\">\r\n                <p>Material 3 Expressive devrait \u00eatre pr\u00e9sent\u00e9 lors de la conf\u00e9rence Google I\/O 2025, destin\u00e9e aux d\u00e9veloppeurs, qui d\u00e9bute le 20 mai. Nous devrions savoir \u00e0 cette date quand cette mise \u00e0 jour pourrait d\u00e9barquer sur nos smartphones.<\/p>\r\n            <\/div>\r\n            \r\n            <div class=\"animated-entry\" style=\"animation-delay: 0.9s;\">\r\n                <button class=\"read-more-btn\" id=\"moreInfoBtn\">En savoir plus sur Android 16<\/button>\r\n            <\/div>\r\n        <\/div>\r\n    <\/article>\r\n\r\n    <script>\r\n        \/\/ Animation au d\u00e9filement\r\n        document.addEventListener('DOMContentLoaded', function() {\r\n            const animatedElements = document.querySelectorAll('.animated-entry');\r\n            \r\n            const observer = new IntersectionObserver((entries) => {\r\n                entries.forEach(entry => {\r\n                    if (entry.isIntersecting) {\r\n                        entry.target.style.opacity = 1;\r\n                        entry.target.style.transform = 'translateY(0)';\r\n                    }\r\n                });\r\n            }, { threshold: 0.1 });\r\n            \r\n            animatedElements.forEach(el => {\r\n                el.style.opacity = 0;\r\n                el.style.transform = 'translateY(20px)';\r\n                el.style.transition = 'opacity 0.6s ease, transform 0.6s ease';\r\n                observer.observe(el);\r\n            });\r\n            \r\n            \/\/ Bouton interactif\r\n            const moreInfoBtn = document.getElementById('moreInfoBtn');\r\n            if (moreInfoBtn) {\r\n                moreInfoBtn.addEventListener('click', function() {\r\n                    alert('Merci pour votre int\u00e9r\u00eat ! Plus d\\'informations seront disponibles apr\u00e8s le Google I\/O 2025.');\r\n                });\r\n            }\r\n        });\r\n    <\/script>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Google a accidentellement r\u00e9v\u00e9l\u00e9 des d\u00e9tails sur une refonte graphique majeure qui se pr\u00e9pare pour Android. Apr\u00e8s trois ann\u00e9es de recherche, Material 3 Expressive pourrait officiellement \u00eatre pr\u00e9sent\u00e9 dans quelques semaines.<\/p>\n","protected":false},"author":2,"featured_media":5167,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"content-type":"","_wp_convertkit_post_meta":{"form":"-1","landing_page":"","tag":"0","restrict_content":"0"},"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[190,189,194,211,221,228,229],"tags":[],"class_list":["post-5165","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-actualites","category-accueil","category-blog-guides","category-education","category-high-tech-saas","category-logiciels","category-logiciels-saas-b2b-b2c"],"jetpack_featured_media_url":"https:\/\/tech.kouzay.com\/wp-content\/uploads\/2025\/05\/Google-Expressive-envoyer.webp","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/tech.kouzay.com\/index.php\/wp-json\/wp\/v2\/posts\/5165","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tech.kouzay.com\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/tech.kouzay.com\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/tech.kouzay.com\/index.php\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/tech.kouzay.com\/index.php\/wp-json\/wp\/v2\/comments?post=5165"}],"version-history":[{"count":7,"href":"https:\/\/tech.kouzay.com\/index.php\/wp-json\/wp\/v2\/posts\/5165\/revisions"}],"predecessor-version":[{"id":5175,"href":"https:\/\/tech.kouzay.com\/index.php\/wp-json\/wp\/v2\/posts\/5165\/revisions\/5175"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/tech.kouzay.com\/index.php\/wp-json\/wp\/v2\/media\/5167"}],"wp:attachment":[{"href":"https:\/\/tech.kouzay.com\/index.php\/wp-json\/wp\/v2\/media?parent=5165"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/tech.kouzay.com\/index.php\/wp-json\/wp\/v2\/categories?post=5165"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/tech.kouzay.com\/index.php\/wp-json\/wp\/v2\/tags?post=5165"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}