{"id":236,"date":"2025-12-21T16:26:07","date_gmt":"2025-12-21T15:26:07","guid":{"rendered":"https:\/\/wp11.infocom.work\/?page_id=236"},"modified":"2025-12-21T16:46:03","modified_gmt":"2025-12-21T15:46:03","slug":"outils-logiciels","status":"publish","type":"page","link":"https:\/\/wp11.infocom.work\/index.php\/ressources\/outils-logiciels\/","title":{"rendered":"Outils &amp; logiciels"},"content":{"rendered":"\n<!-- PAGE RESSOURCES \u2014 Outils & logiciels -->\n<article>\n\n  <!-- HERO -->\n  <header style=\"padding:22px;border-radius:22px;overflow:hidden;border:1px solid #e8e8e8;background:\n    radial-gradient(circle at 18% 22%, rgba(0,209,255,.18) 0%, rgba(0,209,255,0) 60%),\n    radial-gradient(circle at 85% 75%, rgba(31,79,255,.18) 0%, rgba(31,79,255,0) 62%),\n    linear-gradient(135deg,#0b0b0f 0%, #101035 48%, #0b0b0f 100%);\n    color:#ffffff;\">\n    \n    <p style=\"margin:0 0 6px 0;font:800 12px\/1 system-ui;letter-spacing:.14em;text-transform:uppercase;opacity:.9;\">\n      Ressources \u2022 Outils &#038; logiciels\n    <\/p>\n\n    <h1 style=\"margin:0;font:900 40px\/1.05 system-ui;letter-spacing:-.04em;color:#ffffff;\">\n      Les outils essentiels pour concevoir, prototyper et livrer du design.\n    <\/h1>\n\n    <p style=\"margin:14px 0 0 0;font:400 16px\/1.95 system-ui;opacity:.92;max-width:92ch;\">\n      Du branding au webdesign, de la mise en page \u00e0 l\u2019export final : voici les logiciels et plateformes\n      utilis\u00e9s aujourd\u2019hui par les designers pour travailler vite, proprement et efficacement.\n    <\/p>\n\n    <div style=\"margin-top:16px;display:flex;gap:10px;flex-wrap:wrap;\">\n      <span style=\"padding:9px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.06);\n        font:700 12px\/1 system-ui;letter-spacing:.12em;text-transform:uppercase;\">UI \/ UX<\/span>\n      <span style=\"padding:9px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.06);\n        font:700 12px\/1 system-ui;letter-spacing:.12em;text-transform:uppercase;\">Branding<\/span>\n      <span style=\"padding:9px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.06);\n        font:700 12px\/1 system-ui;letter-spacing:.12em;text-transform:uppercase;\">Webdesign<\/span>\n      <span style=\"padding:9px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.06);\n        font:700 12px\/1 system-ui;letter-spacing:.12em;text-transform:uppercase;\">Collaboration<\/span>\n    <\/div>\n  <\/header>\n\n  <!-- SUITE ADOBE -->\n  <section style=\"max-width:96ch;margin:22px auto 0 auto;\">\n    <h2 style=\"margin:0 0 12px 0;font:900 22px\/1.15 system-ui;letter-spacing:-.03em;\">\n      La suite Adobe (industrie standard)\n    <\/h2>\n\n    <div style=\"display:grid;grid-template-columns:1fr 1fr;gap:14px;\">\n\n      <div style=\"border:1px solid #e8e8e8;border-radius:20px;background:#fff;padding:16px;\">\n        <h3 style=\"margin:0;font:900 18px\/1.2 system-ui;\">Photoshop<\/h3>\n        <p style=\"margin:8px 0 0 0;font:400 15px\/1.9 system-ui;\">\n          Retouche, photomontage, textures, mockups. Toujours incontournable pour le travail d\u2019image.\n        <\/p>\n        <a href=\"https:\/\/www.adobe.com\/products\/photoshop.html\" target=\"_blank\"\n           style=\"display:inline-block;margin-top:10px;padding:10px 12px;border-radius:12px;border:1px solid #e8e8e8;\n           font:800 12px\/1 system-ui;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;color:#0b0b0f;\">\n          Photoshop \u2197\n        <\/a>\n      <\/div>\n\n      <div style=\"border:1px solid #e8e8e8;border-radius:20px;background:#fafafa;padding:16px;\">\n        <h3 style=\"margin:0;font:900 18px\/1.2 system-ui;\">Illustrator<\/h3>\n        <p style=\"margin:8px 0 0 0;font:400 15px\/1.9 system-ui;\">\n          Logos, pictogrammes, illustrations vectorielles et syst\u00e8mes graphiques.\n        <\/p>\n        <a href=\"https:\/\/www.adobe.com\/products\/illustrator.html\" target=\"_blank\"\n           style=\"display:inline-block;margin-top:10px;padding:10px 12px;border-radius:12px;border:1px solid #e8e8e8;\n           font:800 12px\/1 system-ui;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;color:#0b0b0f;\">\n          Illustrator \u2197\n        <\/a>\n      <\/div>\n\n      <div style=\"border:2px solid #0b0b0f;border-radius:20px;background:#fff;padding:16px;\">\n        <h3 style=\"margin:0;font:900 18px\/1.2 system-ui;text-transform:uppercase;\">\n          InDesign\n        <\/h3>\n        <p style=\"margin:8px 0 0 0;font:400 15px\/1.9 system-ui;\">\n          Mise en page avanc\u00e9e : magazines, livres, dossiers, grilles typographiques complexes.\n        <\/p>\n        <a href=\"https:\/\/www.adobe.com\/products\/indesign.html\" target=\"_blank\"\n           style=\"display:inline-block;margin-top:10px;padding:10px 12px;border-radius:12px;\n           background:#0b0b0f;color:#fff;font:900 12px\/1 system-ui;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;\">\n          InDesign \u2197\n        <\/a>\n      <\/div>\n\n      <div style=\"border:1px solid #e8e8e8;border-radius:20px;background:#fff;padding:16px;\">\n        <h3 style=\"margin:0;font:900 18px\/1.2 system-ui;\">Adobe Firefly<\/h3>\n        <p style=\"margin:8px 0 0 0;font:400 15px\/1.9 system-ui;\">\n          G\u00e9n\u00e9ration IA d\u2019images, textures et variations graphiques directement int\u00e9grables au workflow Adobe.\n        <\/p>\n        <a href=\"https:\/\/firefly.adobe.com\/\" target=\"_blank\"\n           style=\"display:inline-block;margin-top:10px;padding:10px 12px;border-radius:12px;border:1px solid #e8e8e8;\n           font:800 12px\/1 system-ui;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;color:#0b0b0f;\">\n          Firefly \u2197\n        <\/a>\n      <\/div>\n\n    <\/div>\n  <\/section>\n\n  <!-- UI \/ WEB DESIGN -->\n  <section style=\"max-width:96ch;margin:22px auto 0 auto;\">\n    <h2 style=\"margin:0 0 12px 0;font:900 22px\/1.15 system-ui;letter-spacing:-.03em;\">\n      UI \/ UX &#038; Webdesign\n    <\/h2>\n\n    <div style=\"display:grid;grid-template-columns:1fr 1fr;gap:14px;\">\n\n      <div style=\"border:1px solid #e8e8e8;border-radius:22px;background:linear-gradient(180deg,#fff 0%,#fafafa 100%);padding:16px;\">\n        <h3 style=\"margin:0;font:900 18px\/1.2 system-ui;\">Figma<\/h3>\n        <p style=\"margin:8px 0 0 0;font:400 15px\/1.9 system-ui;\">\n          Design d\u2019interface, prototypage interactif, design system et travail collaboratif en temps r\u00e9el.\n        <\/p>\n        <a href=\"https:\/\/www.figma.com\/\" target=\"_blank\"\n           style=\"display:inline-block;margin-top:10px;padding:10px 12px;border-radius:12px;\n           background:#1f4fff;color:#fff;font:900 12px\/1 system-ui;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;\">\n          Figma \u2197\n        <\/a>\n      <\/div>\n\n      <div style=\"border:1px solid #e8e8e8;border-radius:22px;background:#fff;padding:16px;\">\n        <h3 style=\"margin:0;font:900 18px\/1.2 system-ui;\">Webflow<\/h3>\n        <p style=\"margin:8px 0 0 0;font:400 15px\/1.9 system-ui;\">\n          Construire des sites web visuellement tout en gardant une structure HTML\/CSS propre.\n        <\/p>\n        <a href=\"https:\/\/webflow.com\/\" target=\"_blank\"\n           style=\"display:inline-block;margin-top:10px;padding:10px 12px;border-radius:12px;border:1px solid #e8e8e8;\n           font:800 12px\/1 system-ui;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;color:#0b0b0f;\">\n          Webflow \u2197\n        <\/a>\n      <\/div>\n\n      <div style=\"border:2px dashed #0b0b0f;border-radius:22px;background:#fafafa;padding:16px;\">\n        <h3 style=\"margin:0;font:900 18px\/1.2 system-ui;\">WordPress + Gutenberg<\/h3>\n        <p style=\"margin:8px 0 0 0;font:400 15px\/1.9 system-ui;\">\n          CMS flexible pour cr\u00e9er des sites \u00e9ditoriaux, portfolios et blogs avec un contr\u00f4le fin des blocs.\n        <\/p>\n        <a href=\"https:\/\/wordpress.org\/\" target=\"_blank\"\n           style=\"display:inline-block;margin-top:10px;padding:10px 12px;border-radius:12px;\n           font:900 12px\/1 system-ui;letter-spacing:.14em;text-transform:uppercase;\n           background:#0b0b0f;color:#fff;text-decoration:none;\">\n          WordPress \u2197\n        <\/a>\n      <\/div>\n\n      <div style=\"border:1px solid #e8e8e8;border-radius:22px;background:#fff;padding:16px;\">\n        <h3 style=\"margin:0;font:900 18px\/1.2 system-ui;\">Notion<\/h3>\n        <p style=\"margin:8px 0 0 0;font:400 15px\/1.9 system-ui;\">\n          Organisation de projets, moodboards, briefs, design systems document\u00e9s.\n        <\/p>\n        <a href=\"https:\/\/www.notion.so\/\" target=\"_blank\"\n           style=\"display:inline-block;margin-top:10px;padding:10px 12px;border-radius:12px;border:1px solid #e8e8e8;\n           font:800 12px\/1 system-ui;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;color:#0b0b0f;\">\n          Notion \u2197\n        <\/a>\n      <\/div>\n\n    <\/div>\n  <\/section>\n\n  <!-- MINI CHECKLIST -->\n  <section style=\"max-width:96ch;margin:22px auto 0 auto;\">\n    <div style=\"border:1px solid #e8e8e8;border-radius:22px;background:#fafafa;padding:16px;\">\n      <h2 style=\"margin:0;font:900 22px\/1.15 system-ui;letter-spacing:-.03em;\">\n        Checklist : bien choisir ses outils\n      <\/h2>\n      <ul style=\"margin:12px 0 0 18px;font:400 16px\/1.9 system-ui;\">\n        <li>Un outil pour cr\u00e9er (design)<\/li>\n        <li>Un outil pour organiser (projet \/ id\u00e9es)<\/li>\n        <li>Un outil pour livrer (export \/ web)<\/li>\n        <li>Ne pas multiplier inutilement les logiciels<\/li>\n      <\/ul>\n    <\/div>\n  <\/section>\n\n<\/article>\n","protected":false},"excerpt":{"rendered":"<p>Ressources \u2022 Outils &#038; logiciels Les outils essentiels pour concevoir, prototyper et livrer du design. Du branding au webdesign, de la mise en page \u00e0 l\u2019export final : voici les logiciels et plateformes utilis\u00e9s aujourd\u2019hui par les designers pour travailler vite, proprement et efficacement. UI \/ UX Branding Webdesign Collaboration La suite Adobe (industrie standard)&#8230;<\/p>\n<p class=\"more-link\"><a href=\"https:\/\/wp11.infocom.work\/index.php\/ressources\/outils-logiciels\/\" class=\"themebutton3\">Read More<\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"parent":101,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-236","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/wp11.infocom.work\/index.php\/wp-json\/wp\/v2\/pages\/236","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wp11.infocom.work\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/wp11.infocom.work\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/wp11.infocom.work\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wp11.infocom.work\/index.php\/wp-json\/wp\/v2\/comments?post=236"}],"version-history":[{"count":3,"href":"https:\/\/wp11.infocom.work\/index.php\/wp-json\/wp\/v2\/pages\/236\/revisions"}],"predecessor-version":[{"id":253,"href":"https:\/\/wp11.infocom.work\/index.php\/wp-json\/wp\/v2\/pages\/236\/revisions\/253"}],"up":[{"embeddable":true,"href":"https:\/\/wp11.infocom.work\/index.php\/wp-json\/wp\/v2\/pages\/101"}],"wp:attachment":[{"href":"https:\/\/wp11.infocom.work\/index.php\/wp-json\/wp\/v2\/media?parent=236"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}