{"id":644,"date":"2025-11-13T13:29:41","date_gmt":"2025-11-13T13:29:41","guid":{"rendered":"https:\/\/www.coden.ma\/?page_id=644"},"modified":"2026-06-09T17:11:52","modified_gmt":"2026-06-09T17:11:52","slug":"processus","status":"publish","type":"page","link":"https:\/\/www.mogacode.ma\/en\/processus\/","title":{"rendered":"Process"},"content":{"rendered":"<div data-elementor-type=\"wp-page\" data-elementor-id=\"644\" class=\"elementor elementor-644 elementor-bc-flex-widget\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-b6bcbfd e-flex e-con-boxed e-con e-parent\" data-id=\"b6bcbfd\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-93d15b1 elementor-icon-list--layout-traditional elementor-list-item-link-full_width elementor-widget elementor-widget-icon-list\" data-id=\"93d15b1\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"icon-list.default\">\n\t\t\t\t\t\t\t<ul class=\"elementor-icon-list-items\">\n\t\t\t\t\t\t\t<li class=\"elementor-icon-list-item\">\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-icon\">\n\t\t\t\t\t\t\t<i aria-hidden=\"true\" class=\"phl phlight-star-four\"><\/i>\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-icon-list-text\">The Mogacode Method<\/span>\n\t\t\t\t\t\t\t\t\t<\/li>\n\t\t\t\t\t\t<\/ul>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-0be9274 elementor-widget elementor-widget-heading\" data-id=\"0be9274\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">A proven process<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-04f7637 elementor-widget__width-initial elementor-widget elementor-widget-text-editor\" data-id=\"04f7637\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<div class=\"text-center mb-16\"><p class=\"text-lg md:text-xl text-foreground\/70 max-w-3xl mx-auto text-pretty\">A methodical and proven approach to guarantee exceptional results for every project.<\/p><\/div>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-61a96c0 elementor-widget elementor-widget-html\" data-id=\"61a96c0\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\n\/* ---------- RESET LOCAL ---------- *\/\n.lpm-process *,\n.lpm-process *::before,\n.lpm-process *::after {\n  box-sizing: border-box;\n}\n\n\/* ---------- SECTION ---------- *\/\n.lpm-process {\n  background:#fff3e8; \/* couleur de fond *\/\n  padding:60px 0;\n  font-family: \"Open Sans\", system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", sans-serif;\n  color:#3a2a21;\n}\n\n.lpm-process-inner {\n  max-width:1100px;\n  margin:0 auto;\n  position:relative;\n  padding:10px 40px;\n}\n\n\/* ---------- LIGNE CENTRALE ---------- *\/\n.lpm-process-inner::before {\n  content:\"\";\n  position:absolute;\n  top:0;\n  bottom:0;\n  left:50%;\n  width:2px;\n  transform:translateX(-50%);\n  background:linear-gradient(to bottom,#8c6e64 0%, #d0906d 55%, #0873ad 100%);\n}\n\n\/* ---------- STEP ---------- *\/\n.lpm-step {\n  position:relative;\n  min-height:220px;\n  display:flex;\n  align-items:center;\n}\n\n.lpm-step + .lpm-step {\n  margin-top:20px;\n}\n\n\/* gauche \/ droite *\/\n.lpm-step-left  .lpm-step-content { margin-right:auto; text-align:left; }\n.lpm-step-right .lpm-step-content { margin-left:auto;  text-align:left; }\n\n.lpm-step-content {\n  position:relative;\n  width:40%;\n  line-height:1.7;\n  z-index:1;\n}\n\n\/* gros num\u00e9ros 01 \/ 02 \/ 03 \/ 04 *\/\n.lpm-step-number {\n  position:absolute;\n  left:-70px;\n  top:-40px;\n  font-size:54px;\n  font-weight:700;\n  font-family: \"Playfair Display\", \"Times New Roman\", serif;\n  color:rgba(228,191,160,0.7);\n}\n\n.lpm-step-right .lpm-step-number {\n  left:auto;\n  right:-70px;\n}\n\n\/* titre + texte *\/\n.lpm-step-title {\n  font-family: \"Playfair Display\",\"Times New Roman\",serif;\n  font-size:22px;\n  font-weight:700;\n  margin:0 0 8px;\n}\n\n.lpm-step-text {\n  margin:0;\n  font-size:14px;\n}\n\n\/* ---------- IC\u00d4NES SUR LA LIGNE ---------- *\/\n.lpm-step-icon {\n  position:absolute;\n  left:50%;\n  top:50%;\n  transform:translate(-50%, -50%);\n  width:72px;\n  height:72px;\n  border-radius:22px;\n  background:linear-gradient(135deg,#d78a5f,#c76c4f);\n  display:flex;\n  align-items:center;\n  justify-content:center;\n  box-shadow:0 8px 18px rgba(0,0,0,0.12);\n}\n\n.lpm-step-icon svg {\n  width:28px;\n  height:28px;\n  fill:none;\n  stroke:#ffffff;\n  stroke-width:2.4;\n  stroke-linecap:round;\n  stroke-linejoin:round;\n}\n\n\/* ---------- TABLETTES \/ MOBILES ---------- *\/\n@media (max-width: 900px) {\n  .lpm-process {\n    padding:40px 0;\n  }\n\n  .lpm-process-inner {\n    padding:10px 25px;\n  }\n\n  .lpm-process-inner::before {\n    left:32px;            \/* ligne \u00e0 gauche *\/\n    transform:none;\n  }\n\n  .lpm-step {\n    min-height:180px;\n  }\n\n  .lpm-step-content {\n    width:100%;\n    margin-left:80px !important; \/* tout le contenu passe \u00e0 droite de la ligne *\/\n    margin-right:0 !important;\n  }\n\n  .lpm-step-number {\n    left:-5px;\n    right:auto;\n    top:-26px;\n    font-size:40px;\n  }\n\n  .lpm-step-title {\n    font-size:20px;\n  }\n\n  .lpm-step-text {\n    font-size:13px;\n  }\n\n  .lpm-step-icon {\n    left:32px;\n    transform:translate(-50%, -50%);\n    width:60px;\n    height:60px;\n    border-radius:20px;\n  }\n\n  .lpm-step-icon svg {\n    width:24px;\n    height:24px;\n  }\n}\n\n\/* ---------- TR\u00c8S PETITS \u00c9CRANS ---------- *\/\n@media (max-width: 480px) {\n  .lpm-process-inner {\n    padding:10px 18px;\n  }\n\n  .lpm-step {\n    min-height:160px;\n  }\n\n  .lpm-step-content {\n    margin-left:75px !important;\n  }\n\n  .lpm-step-number {\n    top:-20px;\n    font-size:34px;\n  }\n\n  .lpm-step-title {\n    font-size:18px;\n  }\n\n  .lpm-step-text {\n    font-size:12px;\n  }\n}\n<\/style>\n\n<div class=\"lpm-process\">\n  <div class=\"lpm-process-inner\">\n\n    <!-- 01 -->\n    <div class=\"lpm-step lpm-step-left\">\n      <div class=\"lpm-step-content\">\n        <div class=\"lpm-step-number\">01<\/div>\n        <h3 class=\"lpm-step-title\">Strategic Analysis<\/h3>\n        <p class=\"lpm-step-text\">\n          We begin with an in-depth analysis of your needs, business objectives and target audience to define a tailor-made digital strategy.\n        <\/p>\n      <\/div>\n      <div class=\"lpm-step-icon\">\n        <!-- loupe -->\n        <svg viewbox=\"0 0 24 24\">\n          <circle cx=\"11\" cy=\"11\" r=\"5.5\"><\/circle>\n          <line x1=\"15\" y1=\"15\" x2=\"20\" y2=\"20\"><\/line>\n        <\/svg>\n      <\/div>\n    <\/div>\n\n    <!-- 02 -->\n    <div class=\"lpm-step lpm-step-right\">\n      <div class=\"lpm-step-content\">\n        <div class=\"lpm-step-number\">02<\/div>\n        <h3 class=\"lpm-step-title\">Design &amp; Prototyping<\/h3>\n        <p class=\"lpm-step-text\">\n          Creation of visual mockups and an optimal information architecture for an intuitive and engaging user experience.\n        <\/p>\n      <\/div>\n      <div class=\"lpm-step-icon\">\n        <!-- palette -->\n        <svg viewbox=\"0 0 24 24\">\n          <path d=\"M12 3a8.5 8.5 0 0 0-8.5 8.5A8.5 8.5 0 0 0 9 19.9c.8.3 1.3.1 1.7-.5.4-.6.4-1.2.4-1.7 0-.9.7-1.5 1.5-1.5h1.1A4.3 4.3 0 0 0 19 11.8C19 6.9 15.3 3 12 3z\"><\/path>\n          <circle cx=\"9\" cy=\"8\" r=\"0.8\"><\/circle>\n          <circle cx=\"7\" cy=\"11\" r=\"0.8\"><\/circle>\n          <circle cx=\"11\" cy=\"6.5\" r=\"0.8\"><\/circle>\n          <circle cx=\"14\" cy=\"8\" r=\"0.8\"><\/circle>\n        <\/svg>\n      <\/div>\n    <\/div>\n\n    <!-- 03 -->\n    <div class=\"lpm-step lpm-step-left\">\n      <div class=\"lpm-step-content\">\n        <div class=\"lpm-step-number\">03<\/div>\n        <h3 class=\"lpm-step-title\">Development<\/h3>\n        <p class=\"lpm-step-text\">\n          Coding and integration of functionalities with the latest technologies for a high-performance, secure and scalable product.\n        <\/p>\n      <\/div>\n      <div class=\"lpm-step-icon\">\n        <!-- chevrons code -->\n        <svg viewbox=\"0 0 24 24\">\n          <polyline points=\"9 6 4 12 9 18\"><\/polyline>\n          <polyline points=\"15 6 20 12 15 18\"><\/polyline>\n        <\/svg>\n      <\/div>\n    <\/div>\n\n    <!-- 04 -->\n    <div class=\"lpm-step lpm-step-right\">\n      <div class=\"lpm-step-content\">\n        <div class=\"lpm-step-number\">04<\/div>\n        <h3 class=\"lpm-step-title\">Deployment &amp; Optimization<\/h3>\n        <p class=\"lpm-step-text\">\n          Thorough verification, performance testing, deployment and continuous optimization to guarantee exceptional results.\n        <\/p>\n      <\/div>\n      <div class=\"lpm-step-icon\">\n        <!-- fus\u00e9e -->\n        <svg viewbox=\"0 0 24 24\">\n          <path d=\"M5 19c1.5-3.5 3.5-5.5 6-7l3-3c1.4-1.4 3.5-3 5-4-1-.1-3 .1-4 .3-1.2.3-2.3.8-3.2 1.7L10.7 8.1C8.5 9.3 6.5 11 5 13.5\"><\/path>\n          <path d=\"M6 18c.2 1 .8 1.8 1.8 2\"><\/path>\n          <circle cx=\"15\" cy=\"9\" r=\"1\"><\/circle>\n        <\/svg>\n      <\/div>\n    <\/div>\n\n  <\/div>\n<\/div>\n\n<div style=\"background:#0a1628;padding:48px 24px;text-align:center;border-top:1px solid rgba(255,255,255,.06)\">\n  <p style=\"color:rgba(255,255,255,.7);font-size:16px;margin:0 0 24px\">Ready to start your project?<\/p>\n  <a href=\"\/en\/contact\/\" style=\"display:inline-block;background:linear-gradient(135deg,#B8860B,#a07830);color:#fff;padding:14px 32px;border-radius:50px;font-weight:600;text-decoration:none;font-family:Inter,sans-serif\">Contact us \u2192<\/a>\n<\/div>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-9344717 elementor-align-center elementor-widget elementor-widget-button\" data-id=\"9344717\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"button.default\">\n\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-sm\" href=\"https:\/\/www.mogacode.ma\/en\/contact\/\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t<span class=\"elementor-button-icon\">\n\t\t\t\t<i aria-hidden=\"true\" class=\"uic fi-rr-arrow-small-right\"><\/i>\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-text\">Contact us<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>La M\u00e9thode Mogacode Un processus \u00e9prouv\u00e9 Une approche m\u00e9thodique et \u00e9prouv\u00e9e pour garantir des r\u00e9sultats exceptionnels \u00e0 chaque projet. \/* &#8212;&#8212;&#8212;- RESET LOCAL &#8212;&#8212;&#8212;- *\/ .lpm-process *, .lpm-process *::before, .lpm-process *::after { box-sizing: border-box; } \/* &#8212;&#8212;&#8212;- SECTION &#8212;&#8212;&#8212;- *\/ .lpm-process { background:#fff3e8; \/* couleur de fond *\/ padding:60px 0; font-family: \u00ab\u00a0Open Sans\u00a0\u00bb, system-ui, -apple-system, [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-644","page","type-page","status-publish","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v26.5 (Yoast SEO v28.0) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>Notre processus \u2014 De la brief \u00e0 la livraison en 4 \u00e9tapes | MogaCode<\/title>\n<meta name=\"description\" content=\"D\u00e9couvrez comment MogaCode livre votre site en 4 \u00e9tapes : brief, maquette, d\u00e9veloppement, mise en ligne. D\u00e9lai : 2 \u00e0 6 semaines.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.mogacode.ma\/en\/processus\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Processus\" \/>\n<meta property=\"og:description\" content=\"D\u00e9couvrez comment MogaCode livre votre site en 4 \u00e9tapes : brief, maquette, d\u00e9veloppement, mise en ligne. D\u00e9lai : 2 \u00e0 6 semaines.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.mogacode.ma\/en\/processus\/\" \/>\n<meta property=\"og:site_name\" content=\"Mogacode\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/mogacode\" \/>\n<meta property=\"article:modified_time\" content=\"2026-06-09T17:11:52+00:00\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:site\" content=\"@mogacode\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"2 minutes\" \/>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Notre processus \u2014 De la brief \u00e0 la livraison en 4 \u00e9tapes | MogaCode","description":"D\u00e9couvrez comment MogaCode livre votre site en 4 \u00e9tapes : brief, maquette, d\u00e9veloppement, mise en ligne. D\u00e9lai : 2 \u00e0 6 semaines.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.mogacode.ma\/en\/processus\/","og_locale":"en_US","og_type":"article","og_title":"Processus","og_description":"D\u00e9couvrez comment MogaCode livre votre site en 4 \u00e9tapes : brief, maquette, d\u00e9veloppement, mise en ligne. D\u00e9lai : 2 \u00e0 6 semaines.","og_url":"https:\/\/www.mogacode.ma\/en\/processus\/","og_site_name":"Mogacode","article_publisher":"https:\/\/www.facebook.com\/mogacode","article_modified_time":"2026-06-09T17:11:52+00:00","twitter_card":"summary_large_image","twitter_site":"@mogacode","twitter_misc":{"Est. reading time":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[]}},"_links":{"self":[{"href":"https:\/\/www.mogacode.ma\/en\/wp-json\/wp\/v2\/pages\/644","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.mogacode.ma\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.mogacode.ma\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.mogacode.ma\/en\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.mogacode.ma\/en\/wp-json\/wp\/v2\/comments?post=644"}],"version-history":[{"count":1,"href":"https:\/\/www.mogacode.ma\/en\/wp-json\/wp\/v2\/pages\/644\/revisions"}],"predecessor-version":[{"id":1839,"href":"https:\/\/www.mogacode.ma\/en\/wp-json\/wp\/v2\/pages\/644\/revisions\/1839"}],"wp:attachment":[{"href":"https:\/\/www.mogacode.ma\/en\/wp-json\/wp\/v2\/media?parent=644"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}