<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Archives des Les métiers du digital - Ilelli</title>
	<atom:link href="https://ilelli.net/category/les-metiers-du-digital/feed/" rel="self" type="application/rss+xml" />
	<link>https://ilelli.net/category/les-metiers-du-digital/</link>
	<description>Vos projets prennent leur envol</description>
	<lastBuildDate>Fri, 28 Apr 2023 09:35:44 +0000</lastBuildDate>
	<language>fr-FR</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	<generator>https://wordpress.org/?v=6.2.2</generator>

<image>
	<url>https://ilelli.net/wp-content/uploads/2022/04/cropped-Logo-Ilelli-Couleurs-Icone-RVB-PNG-32x32.png</url>
	<title>Archives des Les métiers du digital - Ilelli</title>
	<link>https://ilelli.net/category/les-metiers-du-digital/</link>
	<width>32</width>
	<height>32</height>
</image> 
	<item>
		<title>Le métier : Administrateur DevOps</title>
		<link>https://ilelli.net/le-metier-administrateur-devops/</link>
		
		<dc:creator><![CDATA[webmaster]]></dc:creator>
		<pubDate>Mon, 03 Apr 2023 13:54:51 +0000</pubDate>
				<category><![CDATA[Les métiers du digital]]></category>
		<guid isPermaLink="false">https://ilelli.net/?p=686</guid>

					<description><![CDATA[<p><span class="rt-reading-time" style="display: block;"><span class="rt-label rt-prefix">Temps de lecture : </span> <span class="rt-time">2</span> <span class="rt-label rt-postfix">min.</span></span> L'admin. DevOps est un profil à double compétences entre le développement et l'architecture système.</p>
<p>L’article <a rel="nofollow" href="https://ilelli.net/le-metier-administrateur-devops/">Le métier : Administrateur DevOps</a> est apparu en premier sur <a rel="nofollow" href="https://ilelli.net">Ilelli</a>.</p>
]]></description>
										<content:encoded><![CDATA[<span class="rt-reading-time" style="display: block;"><span class="rt-label rt-prefix">Temps de lecture : </span> <span class="rt-time">2</span> <span class="rt-label rt-postfix">min.</span></span>
<h2 class="wp-block-heading has-text-color" style="color:#067790">La définition </h2>


<div class="kb-row-layout-wrap kb-row-layout-id_737cef-b1 alignnone wp-block-kadence-rowlayout"><div class="kt-row-column-wrap kt-has-1-columns kt-row-layout-equal kt-tab-layout-inherit kt-mobile-layout-row kt-row-valign-top">

<div class="wp-block-kadence-column kadence-column_9ffcf9-58 inner-column-1"><div class="kt-inside-inner-col">
<p>Avant de vous parler d&#8217;<strong>administrateur DevOps</strong>, il nous semble nécessaire de faire un point sur la notion de <strong>DevOps </strong>pour débuter cet article.&nbsp;</p>



<p>Le <strong>DevOps </strong>est un ensemble de pratiques et de techniques qui visent à unifier le développement logiciel et l’administration des infrastructures informatiques. Tout ceci dans l’objectif de simplifier le développement, le test et la livraison de produits digitaux avec une mise en production plus rapide et qualitative.</p>



<p>Relativement récent, le métier d’<strong>administrateur système DevOps </strong>a été inscrit comme titre professionnel en 2021.&nbsp;</p>
</div></div>

</div></div>


<blockquote class="wp-block-quote">
<p>L&#8217;administrateur système DevOps automatise le déploiement des infrastructures sur un cloud privé, public ou hybride. […] L’administrateur système DevOps déploie en continu les applications.</p>
<cite>France compétences</cite></blockquote>



<div class="wp-block-kadence-spacer aligncenter kt-block-spacer-_bdfbba-fd"><div class="kt-block-spacer kt-block-spacer-halign-center"></div></div>



<h2 class="wp-block-heading has-text-color" style="color:#067790">Ses tâches et compétences</h2>



<p>Un <strong>administrateur DevOps </strong>a la charge de&nbsp;:&nbsp;</p>



<ul>
<li>Déployer les applications en continu</li>



<li>Superviser et traiter les alertes</li>



<li>Automatiser la création des serveurs</li>



<li>Sécuriser l’infrastructure</li>



<li>Définir et mettre en place des statistiques de services</li>



<li>Maintenir l’environnement de production opérationnel</li>



<li>Préparer les environnements de test et de préproduction, les serveurs de données et le stockage associé&nbsp;</li>



<li>&#8230;</li>
</ul>



<p>Un <strong>administrateur DevOps</strong> possède idéalement un double profil : développeur et administrateur système. Pour cela, il doit posséder diverses compétences :</p>



<ul>
<li>Maîtriser un environnement de développement</li>



<li>Maîtriser des outils de construction et de virtualisation</li>



<li>Maîtriser des systèmes d’exploitation</li>



<li>Connaissance du développement et du langage informatique</li>



<li>Connaissance des méthodologies de développement</li>



<li>Connaissance du domaine fonctionnel et des outils test</li>
</ul>



<p>Laissons Pôle Emploi résumer pour nous le métier d’<strong>Administrateur DevOps</strong> :</p>



<figure class="wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio"><div class="wp-block-embed__wrapper">
<iframe title="DevOps : Mêler le développement et l’administration système" width="1170" height="658" src="https://www.youtube.com/embed/cWLdUy7YLIk?feature=oembed" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
</div></figure>



<div class="wp-block-kadence-spacer aligncenter kt-block-spacer-_afbb64-16"><div class="kt-block-spacer kt-block-spacer-halign-center"></div></div>



<h2 class="wp-block-heading has-text-color" style="color:#067790">Les outils de l’administrateur DevOps</h2>


<div class="kb-row-layout-wrap kb-row-layout-id_9e606c-e5 alignnone wp-block-kadence-rowlayout"><div class="kt-row-column-wrap kt-has-1-columns kt-row-layout-equal kt-tab-layout-inherit kt-mobile-layout-row kt-row-valign-top">

<div class="wp-block-kadence-column kadence-column_a1c33f-6f inner-column-1"><div class="kt-inside-inner-col">
<p>Il existe de nombreux outils DevOps pour chaque étape du processus de création d’un produit digital.&nbsp;</p>



<p>Pour tout ce qui est déploiement d’environnement Kubernetes et Docker sont les standards les plus utilisés. GitHub, GitLab et Bitbucket permettent quant à eux de contrôler les versions et de rendre possible la programmation collaborative. Et pour le cœur du métier, la livraison continue aws ou encore Microsoft Azure DevOps tirent leurs épingles du jeu en agrégeant différents services au sein d’un même outil (Boards, Pipeline, Repository …).</p>



<p>Chez Ilelli, nos <strong>admins. DevOps</strong> (également <a href="https://ilelli.net/dev-back-end/">développeur back-end</a>) sont certifiés “Ingénieur Azure DevOps AZ-400 et AZ-204” chez Microsoft et donc sur les outils Azure DevOps et Azure.</p>
</div></div>

</div></div>


<div class="wp-block-kadence-spacer aligncenter kt-block-spacer-_21c11f-7b"><div class="kt-block-spacer kt-block-spacer-halign-center"></div></div>



<h2 class="wp-block-heading has-text-color" style="color:#067790">En savoir plus</h2>


<div class="kb-row-layout-wrap kb-row-layout-id_cacdf1-ad alignnone wp-block-kadence-rowlayout"><div class="kt-row-column-wrap kt-has-1-columns kt-row-layout-equal kt-tab-layout-inherit kt-mobile-layout-row kt-row-valign-top">

<div class="wp-block-kadence-column kadence-column_f9d864-b3 inner-column-1"><div class="kt-inside-inner-col">
<p>Nous vous avons sélectionné quelques ressources supplémentaires afin de combler votre curiosité en ce qui concerne le métier d’<strong>admin. DevOps</strong>.</p>



<div class="wp-block-kadence-spacer aligncenter kt-block-spacer-_9b43f3-cb"><div class="kt-block-spacer kt-block-spacer-halign-center"><hr class="kt-divider"/></div></div>



<p><strong>Article :&nbsp;</strong></p>



<p>La roadmap Ingénieur DevOps</p>



<p><a href="https://medium.com/javarevisited/the-2018-devops-roadmap-31588d8670cb">https://medium.com/javarevisited/the-2018-devops-roadmap-31588d8670cb</a></p>



<div class="wp-block-kadence-spacer aligncenter kt-block-spacer-_496312-c7"><div class="kt-block-spacer kt-block-spacer-halign-center"><hr class="kt-divider"/></div></div>



<p><strong>Sites :</strong></p>



<p>L’outil Azure DevOps :</p>



<p><a href="https://azure.microsoft.com/fr-fr/products/devops">https://azure.microsoft.com/fr-fr/products/devops</a></p>



<p>110 questions posées à un DevOps :&nbsp;</p>



<p><a href="https://www.simplilearn.com/tutorials/devops-tutorial/devops-interview-questions">https://www.simplilearn.com/tutorials/devops-tutorial/devops-interview-questions</a></p>



<p></p>
</div></div>

</div></div><p>L’article <a rel="nofollow" href="https://ilelli.net/le-metier-administrateur-devops/">Le métier : Administrateur DevOps</a> est apparu en premier sur <a rel="nofollow" href="https://ilelli.net">Ilelli</a>.</p>
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>Le métier : Développeur front-end</title>
		<link>https://ilelli.net/le-metier-developpeur-front-end/</link>
		
		<dc:creator><![CDATA[webmaster]]></dc:creator>
		<pubDate>Mon, 27 Feb 2023 10:50:57 +0000</pubDate>
				<category><![CDATA[Développement]]></category>
		<category><![CDATA[Les métiers du digital]]></category>
		<guid isPermaLink="false">https://ilelli.net/?p=650</guid>

					<description><![CDATA[<p><span class="rt-reading-time" style="display: block;"><span class="rt-label rt-prefix">Temps de lecture : </span> <span class="rt-time">2</span> <span class="rt-label rt-postfix">min.</span></span> Le développeur front-end programme la partie visible d'un site ou plus globalement de tout outil digital.</p>
<p>L’article <a rel="nofollow" href="https://ilelli.net/le-metier-developpeur-front-end/">Le métier : Développeur front-end</a> est apparu en premier sur <a rel="nofollow" href="https://ilelli.net">Ilelli</a>.</p>
]]></description>
										<content:encoded><![CDATA[<span class="rt-reading-time" style="display: block;"><span class="rt-label rt-prefix">Temps de lecture : </span> <span class="rt-time">2</span> <span class="rt-label rt-postfix">min.</span></span>
<p class="has-small-font-size"><em>Source : <a href="https://fr.freepik.com/vecteurs-libre/illustration-developpement-applications_10354235.htm#query=front-end&amp;position=7&amp;from_view=search&amp;track=sph">Image de pikisuperstar</a> sur Freepik</em></p>



<h2 class="has-text-color wp-block-heading" style="color:#067790">La définition </h2>


<div class="kb-row-layout-wrap kb-row-layout-id_737cef-b1 alignnone wp-block-kadence-rowlayout"><div class="kt-row-column-wrap kt-has-1-columns kt-row-layout-equal kt-tab-layout-inherit kt-mobile-layout-row kt-row-valign-top">

<div class="wp-block-kadence-column kadence-column_9ffcf9-58 inner-column-1"><div class="kt-inside-inner-col">
<p>À contrario du <a target="_blank" href="https://ilelli.net/dev-back-end/" rel="noreferrer noopener">développeur back-end</a>, le <strong>développeur front-end</strong> programme la partie visible du site internet, de l’application et plus globalement de tout outil digital.</p>



<p>Il doit donc s’assurer de fournir une interface ergonomique et une navigation fluide aux utilisateurs. Tout en connectant la partie visible à la partie non-visible, fournie par le développeur back-end, afin d’afficher les données aux utilisateurs.</p>
</div></div>

</div></div>


<div class="wp-block-kadence-spacer aligncenter kt-block-spacer-_bdfbba-fd"><div class="kt-block-spacer kt-block-spacer-halign-center"></div></div>



<h2 class="has-text-color wp-block-heading" style="color:#067790">Ses compétences et évolution</h2>



<p>Un <strong>développeur front-end </strong>doit être :&nbsp;</p>



<ul>
<li>curieux,</li>



<li>rigoureux,</li>



<li>organisé,</li>



<li>autonome,</li>



<li>et avoir un intérêt particulier pour l’univers du design.</li>
</ul>



<p>Il maîtrise les fondamentaux du <strong>développement web </strong>que sont l’HTML, le CSS et le Javascript. Il complète son profil par la connaissance de différents frameworks tels que React, Angular, Flutter … . Tel que le <a target="_blank" href="https://ilelli.net/dev-back-end/" rel="noreferrer noopener">développeur back-end</a>, il doit obligatoirement se renseigner régulièrement pour se tenir au courant des dernières nouveautés du domaine.</p>



<p>Dédié à l’intégration d’une maquette fournie par un designer, le <strong>développeur front-end</strong> doit avoir une connaissance des concepts de base du design. Il peut, ainsi, pouvoir prendre de façon autonome des décisions de retouche et d’ajustement de la maquette pour correspondre à la technicité de l’intégration.</p>



<p>Au delà de l’aspect visuel, le dév. front doit faire preuve de technicité afin d’adapter les visuels aux différents navigateurs et aux normes en vigueur : W3C. Et doit savoir partager avec plusieurs acteurs du projet, avec les développeurs back-end avec qui il doit avoir une forte collaboration. Mais aussi avec l’UX et l’UI designer, desquels il reçoit les maquettes à intégrer. Une symbiose entre ses différents acteurs est primordiale pour que l’outil soit compris de tous.</p>



<p>Après plusieurs années d’expérience et de curiosité, un <strong>développeur front-end </strong>peut devenir un <strong>développeur full-stack </strong>et donc prendre en charge la conception de la partie back-end : fonctionnelle de l’outil. Il pourra également devenir <strong>Lead-développeur</strong> et ainsi manager une équipe de développeurs front-end.</p>



<p>Pour conclure, laissons un développeur front-end vous parler de son métier :</p>



<figure class="wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio"><div class="wp-block-embed__wrapper">
<iframe loading="lazy" title="Développeur Front-End - OH MY JOB!" width="1170" height="658" src="https://www.youtube.com/embed/I6Sj2uC2TkA?feature=oembed" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
</div></figure>



<div class="wp-block-kadence-spacer aligncenter kt-block-spacer-_afbb64-16"><div class="kt-block-spacer kt-block-spacer-halign-center"></div></div>



<h2 class="has-text-color wp-block-heading" style="color:#067790">Les outils du développeur front-end</h2>


<div class="kb-row-layout-wrap kb-row-layout-id_9e606c-e5 alignnone wp-block-kadence-rowlayout"><div class="kt-row-column-wrap kt-has-1-columns kt-row-layout-equal kt-tab-layout-inherit kt-mobile-layout-row kt-row-valign-top">

<div class="wp-block-kadence-column kadence-column_a1c33f-6f inner-column-1"><div class="kt-inside-inner-col">
<p>Au delà de l’aspect logistique similaire au développeur back-end : ordinateur portable, double écrans, IDE … Les outils principaux du développeur front-end appartiennent à la catégorie des design systems.</p>



<p>Que se soit le material design de Google ou le Human Interface Guidelines d’Apple le développeur front-end doit savoir comprendre et implémenter ces recommandations. Des bibliothèques de composants, tel que MUI pour React, viennent alléger le travail du développeur front-end en proposant des composants prêt à l’emploi respectant les recommandations des plus grands design systems.</p>



<p>Un dév. front-end va également être amener à travailler avec les outils gravitant autour des design systems, tel que <a href="https://storybook.js.org/" target="_blank" rel="noreferrer noopener">Storybook </a>pour créer son design system ou encore <a href="https://zeroheight.com/" target="_blank" rel="noreferrer noopener">Zeroheight </a>: outil de documentation de design systems.</p>



<p>Des connaissances sur les logiciels de prototypes tels qu’adobe XD ou figma est un vrai plus pour faciliter la communication avec les designers.</p>
</div></div>

</div></div>


<div class="wp-block-kadence-spacer aligncenter kt-block-spacer-_21c11f-7b"><div class="kt-block-spacer kt-block-spacer-halign-center"></div></div>



<h2 class="has-text-color wp-block-heading" style="color:#067790">En savoir plus</h2>


<div class="kb-row-layout-wrap kb-row-layout-id_cacdf1-ad alignnone wp-block-kadence-rowlayout"><div class="kt-row-column-wrap kt-has-1-columns kt-row-layout-equal kt-tab-layout-inherit kt-mobile-layout-row kt-row-valign-top">

<div class="wp-block-kadence-column kadence-column_f9d864-b3 inner-column-1"><div class="kt-inside-inner-col">
<p>Vous trouverez quelques ressources complémentaires ci-dessous, afin d’approfondir le sujet plus qu’intéressant du développement front.</p>



<div class="wp-block-kadence-spacer aligncenter kt-block-spacer-_9b43f3-cb"><div class="kt-block-spacer kt-block-spacer-halign-center"><hr class="kt-divider"/></div></div>



<p><strong>Articles :&nbsp;</strong></p>



<p>45 outils de dév. front-end : </p>



<p><a href="https://medium.com/gitconnected/45-front-end-developer-tools-e496b9c3503">https://medium.com/gitconnected/45-front-end-developer-tools-e496b9c3503</a></p>



<p>Idées de projets pour s’améliorer :</p>



<p><a href="https://medium.com/gitconnected/9-projects-you-can-do-to-become-a-front-end-master-in-2023-a4389153148c">https://medium.com/gitconnected/9-projects-you-can-do-to-become-a-front-end-master-in-2023-a4389153148c</a></p>



<div class="wp-block-kadence-spacer aligncenter kt-block-spacer-_496312-c7"><div class="kt-block-spacer kt-block-spacer-halign-center"><hr class="kt-divider"/></div></div>



<p><strong>Sites :</strong></p>



<p>Fiche métier : </p>



<p><a href="https://www.clementine.jobs/fiches-metiers/metiers-techniques-du-web/developpeur-front-end/">https://www.clementine.jobs/fiches-metiers/metiers-techniques-du-web/developpeur-front-end/</a></p>



<p>Roadmap d’un dév. front-end :</p>



<p><a href="https://roadmap.sh/frontend">https://roadmap.sh/frontend</a></p>



<p>CSS tricks &#8211; Truc et astuces en CSS et pas que :</p>



<p><a href="https://css-tricks.com/">https://css-tricks.com/</a></p>



<p></p>



<div class="wp-block-kadence-spacer aligncenter kt-block-spacer-_ad9845-d8"><div class="kt-block-spacer kt-block-spacer-halign-center"><hr class="kt-divider"/></div></div>



<p><strong>Autres ressources :</strong></p>



<p>Formation udemy pour savoir si le développement front-end est fait pour vous</p>



<p><a href="https://www.udemy.com/course/full-stack-crash-course/">https://www.udemy.com/course/full-stack-crash-course/</a></p>



<p>Chaîne YouTube “Benjamin Code” &#8211; Le développement grand public :</p>



<p><a href="https://www.youtube.com/@BenjaminCode">https://www.youtube.com/@BenjaminCode</a></p>
</div></div>

</div></div><p>L’article <a rel="nofollow" href="https://ilelli.net/le-metier-developpeur-front-end/">Le métier : Développeur front-end</a> est apparu en premier sur <a rel="nofollow" href="https://ilelli.net">Ilelli</a>.</p>
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>Le métier : Développeur back-end</title>
		<link>https://ilelli.net/dev-back-end/</link>
		
		<dc:creator><![CDATA[webmaster]]></dc:creator>
		<pubDate>Mon, 06 Feb 2023 08:02:51 +0000</pubDate>
				<category><![CDATA[Développement]]></category>
		<category><![CDATA[Les métiers du digital]]></category>
		<guid isPermaLink="false">https://ilelli.net/?p=631</guid>

					<description><![CDATA[<p><span class="rt-reading-time" style="display: block;"><span class="rt-label rt-prefix">Temps de lecture : </span> <span class="rt-time">2</span> <span class="rt-label rt-postfix">min.</span></span> Le rôle d’un développeur back-end est de rendre fonctionnel un outil digital : sites web, applications, logiciels …</p>
<p>L’article <a rel="nofollow" href="https://ilelli.net/dev-back-end/">Le métier : Développeur back-end</a> est apparu en premier sur <a rel="nofollow" href="https://ilelli.net">Ilelli</a>.</p>
]]></description>
										<content:encoded><![CDATA[<span class="rt-reading-time" style="display: block;"><span class="rt-label rt-prefix">Temps de lecture : </span> <span class="rt-time">2</span> <span class="rt-label rt-postfix">min.</span></span>
<h2 class="wp-block-heading has-text-color" style="color:#067790">La définition </h2>


<div class="kb-row-layout-wrap kb-row-layout-id_737cef-b1 alignnone wp-block-kadence-rowlayout"><div class="kt-row-column-wrap kt-has-1-columns kt-row-layout-equal kt-tab-layout-inherit kt-mobile-layout-row kt-row-valign-top">

<div class="wp-block-kadence-column kadence-column_9ffcf9-58 inner-column-1"><div class="kt-inside-inner-col">
<p>Le rôle d’un <strong>développeur back-end</strong> est de rendre fonctionnel un outil digital : sites web, applications, logiciels …</p>



<p>Il va donc prendre en charge la <strong>conception des fonctionnalités</strong>, côté serveur, c’est-à-dire toute la partie “non visible” (celle dont nous vous parlerons dans le prochain article : le <a href="https://ilelli.net/le-metier-developpeur-front-end/" target="_blank" rel="noreferrer noopener">développeur front-end</a>).</p>
</div></div>

</div></div>


<div class="wp-block-kadence-spacer aligncenter kt-block-spacer-_bdfbba-fd"><div class="kt-block-spacer kt-block-spacer-halign-center"></div></div>



<h2 class="wp-block-heading has-text-color" style="color:#067790">Ses compétences et évolution</h2>



<p>Un développeur back-end doit être :</p>



<ul>
<li>technique,&nbsp;</li>



<li>analytique,&nbsp;</li>



<li>rigoureux,&nbsp;</li>



<li>autonome&nbsp;</li>



<li>et curieux.&nbsp;</li>
</ul>



<p>Il sait maîtriser un langage de programmation back-end comme C#, Java, PHP … Et idéalement plusieurs frameworks (.NET Core, Spring, Laravel …). L’évolution de ses langages étant rapide, le <strong>développeur back-end est constamment en veille</strong> pour garder ses compétences à jour.</p>



<p>Faisant souvent partie d’une équipe,<strong> le développeur back-end doit être un bon communicant</strong> et est à l’écoute des besoins de chacun. Il sait être force de proposition auprès de ses supérieurs pour guider le projet vers la réussite la plus optimale possible.</p>



<p>Il peut évoluer vers un poste de <strong>Full-stack developer</strong> : c’est-à-dire maîtriser la partie back-end et la partie front-end d’un projet digital, vers un poste de <strong>Lead-développeur</strong> ou vers un poste d’<strong>administrateur DevOps</strong>, où il aura en charge de déployer les projets sur une infrastructure existante (Azure, AWS …)</p>



<p>Pour conclure, laissons un <strong>développeur back-end</strong> vous parler de son métier :</p>



<figure class="wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio"><div class="wp-block-embed__wrapper">
<iframe loading="lazy" title="OH MY JOB! : Développeur Back-end" width="1170" height="658" src="https://www.youtube.com/embed/VV5249DptWA?feature=oembed" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
</div></figure>



<div class="wp-block-kadence-spacer aligncenter kt-block-spacer-_afbb64-16"><div class="kt-block-spacer kt-block-spacer-halign-center"></div></div>



<h2 class="wp-block-heading has-text-color" style="color:#067790">Les outils du développeur back-end</h2>


<div class="kb-row-layout-wrap kb-row-layout-id_9e606c-e5 alignnone wp-block-kadence-rowlayout"><div class="kt-row-column-wrap kt-has-1-columns kt-row-layout-equal kt-tab-layout-inherit kt-mobile-layout-row kt-row-valign-top">

<div class="wp-block-kadence-column kadence-column_a1c33f-6f inner-column-1"><div class="kt-inside-inner-col">
<p><strong>Un développeur back-end est un vrai nomade</strong>, fondamentalement, il n’aurait besoin que d’un ordinateur portable. Mais pour plus de confort, il est idéal d’avoir plusieurs écrans disponibles afin de mieux organiser son espace de travail digital.</p>



<p>L’outil principal d’un développeur est un IDE : un logiciel qui fournit un environnement de travail spécialement conçu pour faciliter les développements. Le plus connu étant <a href="https://code.visualstudio.com/" target="_blank" rel="noreferrer noopener">Visual Studio Code</a> de Microsoft.</p>



<p>Mais son outil privilégié reste Google pour débloquer de nombreuses situations. <strong>Tout bon développeur doit savoir effectuer une recherche rapide </strong>pour trouver des solutions auprès de la grande communauté des développeurs. Le forum d’entraide phare étant pour les développeurs <a href="https://stackoverflow.com/" target="_blank" rel="noreferrer noopener">StackOverflow</a>.</p>



<p>Au quotidien, et lors de projet, un développeur peut être amené à utiliser de nombreux outils. <a href="https://azure.microsoft.com/fr-fr/products/devops/" target="_blank" rel="noreferrer noopener">Azure DevOps</a> de Microsoft, notamment, pour la gestion de projet, la collaboration et le déploiement de projet digitaux. Mais aussi de plus petit outil comme <a href="https://app.diagrams.net/" target="_blank" rel="noreferrer noopener">draw.io</a> pour modéliser des architectures. N’oublions pas les outils de communication comme Teams, Slack … pour communiquer avec son équipe.</p>



<p><strong>Le dév. back-end doit s’adapter rapidement à de nombreux outils</strong> parfois différents d’un projet à un autre.</p>
</div></div>

</div></div>


<div class="wp-block-kadence-spacer aligncenter kt-block-spacer-_21c11f-7b"><div class="kt-block-spacer kt-block-spacer-halign-center"></div></div>



<h2 class="wp-block-heading has-text-color" style="color:#067790">En savoir plus</h2>


<div class="kb-row-layout-wrap kb-row-layout-id_cacdf1-ad alignnone wp-block-kadence-rowlayout"><div class="kt-row-column-wrap kt-has-1-columns kt-row-layout-equal kt-tab-layout-inherit kt-mobile-layout-row kt-row-valign-top">

<div class="wp-block-kadence-column kadence-column_f9d864-b3 inner-column-1"><div class="kt-inside-inner-col">
<p>Pour découvrir toutes les spécificités du métier de <strong>dév. back-end</strong>, nous avons sélectionné pour vous plusieurs ressources supplémentaires que vous trouverez ci-dessous.</p>



<div class="wp-block-kadence-spacer aligncenter kt-block-spacer-_9b43f3-cb"><div class="kt-block-spacer kt-block-spacer-halign-center"><hr class="kt-divider"/></div></div>



<p><strong>Articles :&nbsp;</strong></p>



<p>Une histoire de reconversion :</p>



<p>&nbsp;<a href="https://medium.com/le-wagon/de-cuisto-%C3%A0-d%C3%A9veloppeur-back-end-lhistoire-de-la-reconversion-de-rapha%C3%ABl-aae8907a7989" target="_blank" rel="noreferrer noopener">https://medium.com/le-wagon/de-cuisto-%C3%A0-d%C3%A9veloppeur-back-end-lhistoire-de-la-reconversion-de-rapha%C3%ABl-aae8907a7989</a></p>



<p>Roadmap d’un dév. back-end :&nbsp;</p>



<p><a href="https://medium.com/codex/backend-developer-roadmap-e61ce30ab10d" target="_blank" rel="noreferrer noopener">https://medium.com/codex/backend-developer-roadmap-e61ce30ab10d</a></p>



<div class="wp-block-kadence-spacer aligncenter kt-block-spacer-_496312-c7"><div class="kt-block-spacer kt-block-spacer-halign-center"><hr class="kt-divider"/></div></div>



<p><strong>Sites :</strong></p>



<p>Fiche métier développeur back-end :&nbsp;</p>



<p><a href="https://www.clementine.jobs/fiches-metiers/metiers-techniques-du-web/developpeur-back-end/" target="_blank" rel="noreferrer noopener">https://www.clementine.jobs/fiches-metiers/metiers-techniques-du-web/developpeur-back-end/</a></p>



<p>Le club des dévs. back-end sur medium :</p>



<p><a href="https://medium.com/backenders-club" target="_blank" rel="noreferrer noopener">https://medium.com/backenders-club</a></p>



<div class="wp-block-kadence-spacer aligncenter kt-block-spacer-_ad9845-d8"><div class="kt-block-spacer kt-block-spacer-halign-center"><hr class="kt-divider"/></div></div>



<p><strong>Autres ressources :</strong></p>



<p>Chaîne YouTube “Le frère Codeur” &#8211; Traite de développement de carrière et de sujet IT.</p>



<p><a href="https://www.youtube.com/@LeFrereCodeur/videos" target="_blank" rel="noreferrer noopener">https://www.youtube.com/@LeFrereCodeur/videos</a></p>



<p>Chaîne YouTube “Graven&#8221; &#8211; Développement &#8211; Orienté apprentissage :</p>



<p><a href="https://www.youtube.com/c/gravenilvectuto" target="_blank" rel="noreferrer noopener">https://www.youtube.com/c/gravenilvectuto</a></p>



<p>Sans oublier :</p>



<p><a target="_blank" href="https://www.google.fr/" rel="noreferrer noopener">google.fr</a></p>
</div></div>

</div></div><p>L’article <a rel="nofollow" href="https://ilelli.net/dev-back-end/">Le métier : Développeur back-end</a> est apparu en premier sur <a rel="nofollow" href="https://ilelli.net">Ilelli</a>.</p>
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>Le métier : Scrum master</title>
		<link>https://ilelli.net/le-metier-scrum-master/</link>
		
		<dc:creator><![CDATA[webmaster]]></dc:creator>
		<pubDate>Mon, 09 Jan 2023 08:00:00 +0000</pubDate>
				<category><![CDATA[Les métiers du digital]]></category>
		<category><![CDATA[Méthodes agiles]]></category>
		<guid isPermaLink="false">https://ilelli.net/?p=607</guid>

					<description><![CDATA[<p><span class="rt-reading-time" style="display: block;"><span class="rt-label rt-prefix">Temps de lecture : </span> <span class="rt-time">3</span> <span class="rt-label rt-postfix">min.</span></span> En une phrase : Le Scrum master est le garant de la méthode agile “Scrum”. Il guide l’équipe tout au long du processus.</p>
<p>L’article <a rel="nofollow" href="https://ilelli.net/le-metier-scrum-master/">Le métier : Scrum master</a> est apparu en premier sur <a rel="nofollow" href="https://ilelli.net">Ilelli</a>.</p>
]]></description>
										<content:encoded><![CDATA[<span class="rt-reading-time" style="display: block;"><span class="rt-label rt-prefix">Temps de lecture : </span> <span class="rt-time">3</span> <span class="rt-label rt-postfix">min.</span></span>
<h2 class="has-text-color wp-block-heading" style="color:#067790">La définition </h2>



<div class="wp-block-kadence-rowlayout alignnone"><div id="kt-layout-id_737cef-b1" class="kt-row-layout-inner kt-layout-id_737cef-b1"><div class="kt-row-column-wrap kt-has-1-columns kt-gutter-default kt-v-gutter-default kt-row-valign-top kt-row-layout-equal kt-tab-layout-inherit kt-m-colapse-left-to-right kt-mobile-layout-row">
<div class="wp-block-kadence-column inner-column-1 kadence-column_9ffcf9-58"><div class="kt-inside-inner-col">
<p>En une phrase : Le<strong> Scrum maste</strong>r est le garant de la <strong>méthode agile “Scrum”</strong>.<br>Commençons, donc, en vous expliquant rapidement le <strong>framework Scrum</strong> des méthodes agiles :</p>



<figure class="wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio"><div class="wp-block-embed__wrapper">
<iframe loading="lazy" title="SCRUM : cours de 8 minutes - introduction à Scrum - formation gratuite - version Scrum Guide 2020" width="1170" height="658" src="https://www.youtube.com/embed/Hxj47ie_Flw?feature=oembed" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div></figure>



<p></p>



<p>Le <strong>Scrum master</strong> fait donc partie intégrante d’une <strong>Scrum team</strong>, en <strong>coachant </strong>les différents intervenants aux mécanismes de la méthode. Mais aussi en les accompagnant dans l’objectif de s’auto-organiser afin de pouvoir <strong>travailler ensemble</strong> tout en alliant les compétences diverses.</p>



<p>Laissons maintenant un <strong>Scrum master</strong> décrire son poste :</p>



<figure class="wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio"><div class="wp-block-embed__wrapper">
<iframe loading="lazy" title="OH MY JOB! : Scrum Master" width="1170" height="658" src="https://www.youtube.com/embed/bRp_RZDpkQk?feature=oembed" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div></figure>
</div></div>
</div></div></div>



<div class="wp-block-kadence-spacer aligncenter kt-block-spacer-_bdfbba-fd"><div class="kt-block-spacer kt-block-spacer-halign-center"></div></div>



<h2 class="has-text-color wp-block-heading" style="color:#067790">Le rôle de Scrum master dans la méthode</h2>



<p>Il<strong> guide l’équipe</strong> tout au long du processus. Pour cela plusieurs missions lui sont confiées :</p>



<ul>
<li>Il accompagne l’équipe durant le projet pour les impliquer au maximum dans les différentes étapes de la méthodologie Scrum.</li>



<li>Il s’assure que la méthodologie est comprise et adoptée par l’équipe Scrum.</li>



<li>Il soutient le <strong>Product Owne</strong>r dans ses responsabilités.</li>



<li>Il organise les <strong>rituels Scrum</strong>, les cérémonies agiles :
<ul>
<li>Sprint planning</li>



<li>Daily Scrum</li>



<li>Sprint review</li>



<li>Sprint rétrospective</li>



<li>…</li>
</ul>
</li>



<li>Il prend en charge les problématiques pouvant enrayer le bon fonctionnement du projet.</li>
</ul>



<p><strong>C’est un facilitateur né</strong>, qui doit faire preuve d’une aisance relationnelle et d’une excellente communication.</p>



<div class="wp-block-kadence-spacer aligncenter kt-block-spacer-_afbb64-16"><div class="kt-block-spacer kt-block-spacer-halign-center"></div></div>



<h2 class="has-text-color wp-block-heading" style="color:#067790">Les outils du Scrum master</h2>



<div class="wp-block-kadence-rowlayout alignnone"><div id="kt-layout-id_9e606c-e5" class="kt-row-layout-inner kt-layout-id_9e606c-e5"><div class="kt-row-column-wrap kt-has-1-columns kt-gutter-default kt-v-gutter-default kt-row-valign-top kt-row-layout-equal kt-tab-layout-inherit kt-m-colapse-left-to-right kt-mobile-layout-row">
<div class="wp-block-kadence-column inner-column-1 kadence-column_a1c33f-6f"><div class="kt-inside-inner-col">
<p>Les Scrum master doivent avoir à leur disposition des outils permettant :&nbsp;</p>



<ul>
<li>la gestion de projet et la <strong>gestion des tâches</strong>,&nbsp;</li>



<li>la <strong>collaboration </strong>entre toutes les personnes de l’équipe scrum.</li>
</ul>



<ol start="1">
<li></li>
</ol>
</div></div>
</div></div></div>



<h4 class="wp-block-heading">Le scrum board</h4>



<p>Sous forme de kanban, le <strong>scrum board </strong>est l’outil indispensable. Il permet la gestion des tâches sous formes de colonnes reprenant le plus souvent le pattern suivant : tâches à faire, en cours, à tester et terminées.</p>



<p>Ces tâches sont le plus souvent appelées : <strong>User Stories</strong>, mais mériteraient à elles-mêmes un article dédié.</p>



<p>Ce<strong> scrum board</strong> peut être composé de simple post-it alignés sur un mur. Il existe également plusieurs outils digitaux offrant ce type de fonctionnalités comme : Azure DevOps, Jira, monday.com, Kantree …</p>



<figure class="wp-block-image"><img decoding="async" src="https://paper-attachments.dropboxusercontent.com/s_D54872EB49F0BE329D3417882AC063FCF9FCD9D3CE7A960EFF9705782BC7D108_1671188686041_parabol-the-agile-meeting-toolbox-p0xDCNg3cw8-unsplash.jpg" alt=""/><figcaption class="wp-element-caption">Photo de Parabol | The Agile Meeting Toolbox sur Unsplash</figcaption></figure>



<div class="wp-block-kadence-spacer aligncenter kt-block-spacer-_7e5fdc-bd"><div class="kt-block-spacer kt-block-spacer-halign-center"><hr class="kt-divider"/></div></div>



<h4 class="wp-block-heading">Le burnup chart &amp; le burndown chart</h4>



<p>Le <strong>burnup chart </strong>est un graphique permettant de visualiser le travail réalisé en comparaison du travail attendu. Il prend en compte le périmètre du projet.</p>



<figure class="wp-block-image"><img decoding="async" src="https://paper-attachments.dropboxusercontent.com/s_D54872EB49F0BE329D3417882AC063FCF9FCD9D3CE7A960EFF9705782BC7D108_1671188802074_1024px-SimulTrain_BurnUp_Chart.jpg" alt=""/><figcaption class="wp-element-caption">Burnup chart</figcaption></figure>



<p>Le <strong>burndown chart</strong>, quant à lui, permet de visualiser le reste à faire entre la quantité réalisée et la quantité restante idéale.</p>



<figure class="wp-block-image"><img decoding="async" src="https://paper-attachments.dropboxusercontent.com/s_D54872EB49F0BE329D3417882AC063FCF9FCD9D3CE7A960EFF9705782BC7D108_1671188864841_SampleBurndownChart.svg" alt=""/><figcaption class="wp-element-caption">Burndown chart</figcaption></figure>



<div class="wp-block-kadence-spacer aligncenter kt-block-spacer-_d01812-c4"><div class="kt-block-spacer kt-block-spacer-halign-center"><hr class="kt-divider"/></div></div>



<h4 class="wp-block-heading">Les story points &amp; l’évaluation</h4>



<p>Les <strong>story points </strong>sont des points attribués aux différentes tâches du projet pour évaluer l’effort nécessaire à sa réalisation. Plusieurs méthodes d’évaluation ont été créées.</p>



<ul>
<li>Le <strong>planning poker </strong>repend les valeurs de la suite de Fibonacci (1,2,3,5,8,13…).&nbsp;</li>



<li>L’<strong>estimation en tailles de T-shirts </strong>permet de faire une première estimation d&#8217;un backlog qui sera ensuite affiné.</li>



<li>…</li>
</ul>



<p>Chaque membres de l’équipe évalue donc d’une façon définie en amont l’effort nécessaire pour réaliser une tâche spécifique. Cette évaluation des tâches prend place pendant le sprint planning afin de pouvoir quantifier et suivre la quantité de travail nécessaire et réelle.</p>



<p>Cette petite liste d’outils n’étant pas exhaustive, nous vous recommandons chaudement de consulter les autres ressources ci-dessus afin de connaître l’ensemble des outils nécessaires à un Scrum master.</p>



<div class="wp-block-kadence-spacer aligncenter kt-block-spacer-_21c11f-7b"><div class="kt-block-spacer kt-block-spacer-halign-center"></div></div>



<h2 class="has-text-color wp-block-heading" style="color:#067790">En savoir plus</h2>



<div class="wp-block-kadence-rowlayout alignnone"><div id="kt-layout-id_cacdf1-ad" class="kt-row-layout-inner kt-layout-id_cacdf1-ad"><div class="kt-row-column-wrap kt-has-1-columns kt-gutter-default kt-v-gutter-default kt-row-valign-top kt-row-layout-equal kt-tab-layout-inherit kt-m-colapse-left-to-right kt-mobile-layout-row">
<div class="wp-block-kadence-column inner-column-1 kadence-column_f9d864-b3"><div class="kt-inside-inner-col">
<p>Pour découvrir toutes les spécificités du métier de<strong> Scrum master</strong>, nous avons sélectionné pour vous plusieurs ressources supplémentaires que vous trouverez ci-dessous.</p>



<div class="wp-block-kadence-spacer aligncenter kt-block-spacer-_9b43f3-cb"><div class="kt-block-spacer kt-block-spacer-halign-center"><hr class="kt-divider"/></div></div>



<p><strong>Articles :&nbsp;</strong></p>



<p>Vis ma vie :&nbsp;</p>



<p><a href="https://lesvoixdelaveille.medium.com/vis-ma-vie-de-scrum-master-bc1e2bc2f718" target="_blank" rel="noreferrer noopener">https://lesvoixdelaveille.medium.com/vis-ma-vie-de-scrum-master-bc1e2bc2f718</a></p>



<p>Scrum master et télétravail :&nbsp;</p>



<p><a href="https://alexandre-beauchet.medium.com/comment-le-r%C3%B4le-de-scrum-master-peut-saccommoder-au-t%C3%A9l%C3%A9travail-f07073b27f7a" target="_blank" rel="noreferrer noopener">https://alexandre-beauchet.medium.com/comment-le-r%C3%B4le-de-scrum-master-peut-saccommoder-au-t%C3%A9l%C3%A9travail-f07073b27f7a </a></p>



<div class="wp-block-kadence-spacer aligncenter kt-block-spacer-_496312-c7"><div class="kt-block-spacer kt-block-spacer-halign-center"><hr class="kt-divider"/></div></div>



<p><strong>Sites :</strong></p>



<p>Fiche métier :&nbsp;</p>



<p><a href="https://www.clementine.jobs/fiches-metiers/metiers-techniques-du-web/scrum-master/" target="_blank" rel="noreferrer noopener">https://www.clementine.jobs/fiches-metiers/metiers-techniques-du-web/scrum-master/</a></p>



<p>Le site officiel Scrum :&nbsp;</p>



<p><a href="https://www.scrum.org/" target="_blank" rel="noreferrer noopener">https://www.scrum.org/</a></p>



<div class="wp-block-kadence-spacer aligncenter kt-block-spacer-_ad9845-d8"><div class="kt-block-spacer kt-block-spacer-halign-center"><hr class="kt-divider"/></div></div>



<p><strong><strong>Livres et PDF</strong> :</strong></p>



<p>Le guide Scrum, écrit par les créateurs de la méthodologie : <a target="_blank" href="https://scrumguides.org/docs/scrumguide/v2020/2020-Scrum-Guide-French.pdf" rel="noreferrer noopener">https://scrumguides.org/docs/scrumguide/v2020/2020-Scrum-Guide-French.pdf</a></p>



<p>Scrum &#8211; The Art of Doing Twice the Work in Half the Time par le co-créateur de Scrum :</p>



<p><a href="https://www.penguin.co.uk/authors/231272/jeff-sutherland" target="_blank" rel="noreferrer noopener">https://www.penguin.co.uk/authors/231272/jeff-sutherland</a></p>
</div></div>
</div></div></div>
<p>L’article <a rel="nofollow" href="https://ilelli.net/le-metier-scrum-master/">Le métier : Scrum master</a> est apparu en premier sur <a rel="nofollow" href="https://ilelli.net">Ilelli</a>.</p>
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>Le métier : UI designer</title>
		<link>https://ilelli.net/le-metier-ui-designer/</link>
		
		<dc:creator><![CDATA[webmaster]]></dc:creator>
		<pubDate>Mon, 12 Dec 2022 09:18:00 +0000</pubDate>
				<category><![CDATA[Les métiers du digital]]></category>
		<category><![CDATA[UI Design]]></category>
		<guid isPermaLink="false">https://ilelli.net/?p=595</guid>

					<description><![CDATA[<p><span class="rt-reading-time" style="display: block;"><span class="rt-label rt-prefix">Temps de lecture : </span> <span class="rt-time">2</span> <span class="rt-label rt-postfix">min.</span></span> L’UI designer réalise le design graphique de l’interface, lien entre l’utilisateur et le produit ou service.</p>
<p>L’article <a rel="nofollow" href="https://ilelli.net/le-metier-ui-designer/">Le métier : UI designer</a> est apparu en premier sur <a rel="nofollow" href="https://ilelli.net">Ilelli</a>.</p>
]]></description>
										<content:encoded><![CDATA[<span class="rt-reading-time" style="display: block;"><span class="rt-label rt-prefix">Temps de lecture : </span> <span class="rt-time">2</span> <span class="rt-label rt-postfix">min.</span></span>
<h2 class="has-text-color wp-block-heading" style="color:#067790">La définition </h2>



<div class="wp-block-kadence-rowlayout alignnone"><div id="kt-layout-id_737cef-b1" class="kt-row-layout-inner kt-layout-id_737cef-b1"><div class="kt-row-column-wrap kt-has-1-columns kt-gutter-default kt-v-gutter-default kt-row-valign-top kt-row-layout-equal kt-tab-layout-inherit kt-m-colapse-left-to-right kt-mobile-layout-row">
<div class="wp-block-kadence-column inner-column-1 kadence-column_9ffcf9-58"><div class="kt-inside-inner-col">
<p>Notre dernier article vous présentait le <a href="https://ilelli.net/le-metier-ux-designer/" target="_blank" rel="noreferrer noopener">métier d’UX designer</a>. Aujourd’hui, nous verrons la différence avec l’<strong>UI designer</strong>.&nbsp;Commençons par une courte définition :&nbsp;</p>



<blockquote class="wp-block-quote">
<p>L’UI designer réalise le design graphique de l’interface, lien entre l’utilisateur et le produit ou service. Il se charge de toutes les étapes du design graphique, du <strong>brief </strong>à la livraison de la <strong>charte graphique</strong> en passant par les <strong>pistes graphiques</strong>, <strong>maquettes</strong> et <strong>déclinaison d’écrans</strong>. Son travail consiste à organiser les éléments visuels de manière à produire un contenu <strong>esthétique</strong> et <strong>fonctionnel</strong>.</p>
<cite>Source : usabilis.com</cite></blockquote>



<p>Il est plus que commun de voir le titre<strong> UX/UI designer</strong> sur les offres d’emploi notamment. Il y a entre ces deux métiers, pourtant, une distinction à faire. Nous vous laissons visionner, au travers de la vidéo ci-dessous, la différence entre <strong>l’UX et l’UI design</strong> :</p>



<figure class="wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio"><div class="wp-block-embed__wrapper">
<iframe loading="lazy" title="Quelles sont les différences entre l&#039;UX et l&#039;UI Design ?  Le Laptop" width="1170" height="658" src="https://www.youtube.com/embed/ztNC-c_hrV0?feature=oembed" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div></figure>



<p></p>



<p>On terminera cette définition, avec une vidéo portrait d’une <strong>UI designer</strong>, réalisée par la <a href="https://www.youtube.com/@pool5448" target="_blank" rel="noreferrer noopener">chaîne Pool</a> qui propose de nombreuses vidéos sur différents métiers, dont ceux du <strong>digital </strong>:</p>



<figure class="wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio"><div class="wp-block-embed__wrapper">
<iframe loading="lazy" title="DESIGNER UI (USER INTERFACE) : quotidien, salaire, parcours | Pool" width="1170" height="658" src="https://www.youtube.com/embed/4ga0JcMFBj4?feature=oembed" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div></figure>
</div></div>
</div></div></div>



<div class="wp-block-kadence-spacer aligncenter kt-block-spacer-_3d6e25-72"><div class="kt-block-spacer kt-block-spacer-halign-center"></div></div>



<h2 class="has-text-color wp-block-heading" style="color:#067790">Les missions d&#8217;un UI designer</h2>



<div class="wp-block-kadence-rowlayout alignnone"><div id="kt-layout-id_7892d3-0a" class="kt-row-layout-inner kt-layout-id_7892d3-0a"><div class="kt-row-column-wrap kt-has-1-columns kt-gutter-default kt-v-gutter-default kt-row-valign-top kt-row-layout-equal kt-tab-layout-inherit kt-m-colapse-left-to-right kt-mobile-layout-row">
<div class="wp-block-kadence-column inner-column-1 kadence-column_490827-fc"><div class="kt-inside-inner-col">
<p>Les <strong>missions de l’UI designer</strong> se concentre essentiellement sur <strong>l’interface </strong>et son <strong>ergonomie </strong>:&nbsp;</p>



<ul>
<li>Il crée et améliore <strong>l’interface utilisateur</strong> pour répondre à leurs besoins.</li>



<li>Il est en charge de la <strong>navigation </strong>qui doit se faire de façon logique.</li>



<li>Il doit implémenter la <strong>charte graphique</strong> de son client dans son design.&nbsp;</li>



<li>Il apporte son expertise pour ajuster l’ensemble de ses éléments dans une <strong>interface pertinente</strong> et <strong>agréable</strong>.</li>
</ul>



<p>L’<strong>UI designer</strong> travaille main dans la main avec l’<strong>UX designer</strong>, pour cela, il doit toujours prendre en compte différents éléments inhérents au projet :</p>



<ul>
<li>Le contexte et les <strong>enjeux </strong>du projet,</li>



<li>Les <strong>utilisateurs</strong>, leurs parcours et leurs besoins,</li>



<li>Les<strong> tests utilisateurs</strong> et leurs retours pour adapter son travail. &nbsp;
<ul>
<li></li>
</ul>
</li>
</ul>
</div></div>
</div></div></div>



<p>Résumons tout cela grâce à cette courte vidéo : </p>



<figure class="wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio"><div class="wp-block-embed__wrapper">
<iframe loading="lazy" title="L&#039;UI Design, c&#039;est quoi ? (définition, aide, lexique, tuto, explication)" width="1170" height="658" src="https://www.youtube.com/embed/UIIUcSu8OVo?feature=oembed" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div></figure>



<div class="wp-block-kadence-spacer aligncenter kt-block-spacer-_dc4ff9-ab"><div class="kt-block-spacer kt-block-spacer-halign-center"></div></div>



<h2 class="has-text-color wp-block-heading" style="color:#067790">Les outils</h2>



<div class="wp-block-kadence-rowlayout alignnone"><div id="kt-layout-id_9e606c-e5" class="kt-row-layout-inner kt-layout-id_9e606c-e5"><div class="kt-row-column-wrap kt-has-1-columns kt-gutter-default kt-v-gutter-default kt-row-valign-top kt-row-layout-equal kt-tab-layout-inherit kt-m-colapse-left-to-right kt-mobile-layout-row">
<div class="wp-block-kadence-column inner-column-1 kadence-column_a1c33f-6f"><div class="kt-inside-inner-col">
<p>Il existe sur le marché de nombreux outils de <strong>conception d’interfaces</strong>. Que ce soit pour du <strong>wireframes</strong>, du <strong>prototyping </strong>ou encore du <strong>collaboratif</strong>, vous trouverez ci-dessous les outils utilisés chez Ilelli par notre <strong>UI designer</strong>.</p>



<ol start="1">
<li>Un crayon papier et un carnet : La première étape, poser son idée sur du papier.</li>



<li><a target="_blank" href="https://www.figma.com/fr" rel="noreferrer noopener">Figma </a>: La seconde étape, retranscrire en wireframe et prototype interactif.</li>



<li><a target="_blank" href="https://www.figma.com/fr/figjam/" rel="noreferrer noopener">Figjam</a> : si on a besoin de travailler en collaboration pour construire un workflow par exemple.</li>



<li><a target="_blank" href="https://zeroheight.com/" rel="noreferrer noopener">Zeroheight </a>: pour documenter son design system.</li>



<li>La<a target="_blank" href="https://www.adobe.com/fr/creativecloud.html?gclid=Cj0KCQiA1sucBhDgARIsAFoytUswNumSC-6Rj4q_gcNzJnHtTqRKDSZzO7W5WUKwfGTS9HycXzLYTS8aAt1yEALw_wcB&amp;mv=search&amp;mv=search&amp;sdid=K42KVTW8&amp;ef_id=Cj0KCQiA1sucBhDgARIsAFoytUswNumSC-6Rj4q_gcNzJnHtTqRKDSZzO7W5WUKwfGTS9HycXzLYTS8aAt1yEALw_wcB:G:s&amp;s_kwcid=AL!3085!3!600183576440!e!!g!!adobe!1435912500!56537399459" rel="noreferrer noopener"> suite Adobe</a> : d’Illustrator à Photoshop en passant par Premiere, l’UI designer doit disposer des connaissances de bases en retouches d’images et montage vidéo.</li>



<li>HTML, CSS et un peu de JS ! Et oui, il doit pouvoir communiquer avec ses collègues développeurs.</li>
</ol>
</div></div>
</div></div></div>



<div class="wp-block-kadence-spacer aligncenter kt-block-spacer-_381f6c-13"><div class="kt-block-spacer kt-block-spacer-halign-center"></div></div>



<h2 class="has-text-color wp-block-heading" style="color:#067790">En savoir plus</h2>



<div class="wp-block-kadence-rowlayout alignnone"><div id="kt-layout-id_cacdf1-ad" class="kt-row-layout-inner kt-layout-id_cacdf1-ad"><div class="kt-row-column-wrap kt-has-1-columns kt-gutter-default kt-v-gutter-default kt-row-valign-top kt-row-layout-equal kt-tab-layout-inherit kt-m-colapse-left-to-right kt-mobile-layout-row">
<div class="wp-block-kadence-column inner-column-1 kadence-column_f9d864-b3"><div class="kt-inside-inner-col">
<p>On vous laisse une liste de quelques ressources ci-dessous si vous souhaitez en savoir plus. Parce que l’on sait que c’est difficile de décrire un métier aussi passionnant que l’<strong>UI design</strong> en seulement quelques lignes. Le dernier mot pour la fin, n’oubliez pas que Google est votre ami !</p>



<div class="wp-block-kadence-spacer aligncenter kt-block-spacer-_e3a125-98"><div class="kt-block-spacer kt-block-spacer-halign-center"><hr class="kt-divider"/></div></div>



<p><strong>Articles :&nbsp;</strong></p>



<p>Devenir UI designer : </p>



<p><a href="https://www.studi.com/fr/metier/ui-designer" target="_blank" rel="noreferrer noopener">https://www.studi.com/fr/metier/ui-designer</a></p>



<p>Trouver l’inspiration : </p>



<p><a href="https://medium.com/@romaindao/ui-design-o%C3%B9-trouver-linspiration-417cd81cf68e" target="_blank" rel="noreferrer noopener">https://medium.com/@romaindao/ui-design-o%C3%B9-trouver-linspiration-417cd81cf68e</a></p>



<p>9 conseils pour améliorer ses compétences en UI : </p>



<p><a href="https://medium.com/user-experience-design-1/9-simple-tips-to-improve-your-ui-designs-fast-377c5113ac82" target="_blank" rel="noreferrer noopener">https://medium.com/user-experience-design-1/9-simple-tips-to-improve-your-ui-designs-fast-377c5113ac82</a></p>



<p>Construire un design system : </p>



<p><a href="https://medium.com/@emiliegarnier/comment-construire-un-design-system-adapt%C3%A9-%C3%A0-votre-produit-638f617695db" target="_blank" rel="noreferrer noopener">https://medium.com/@emiliegarnier/comment-construire-un-design-system-adapt%C3%A9-%C3%A0-votre-produit-638f617695db</a></p>



<p></p>



<p></p>



<div class="wp-block-kadence-spacer aligncenter kt-block-spacer-_f52e85-2d"><div class="kt-block-spacer kt-block-spacer-halign-center"><hr class="kt-divider"/></div></div>



<p><strong>Sites :</strong></p>



<p>La chaîne YouTube de Basti UI : </p>



<p><a href="https://www.youtube.com/channel/UCnnIP34CpT7nIBZS5KuuhbA" target="_blank" rel="noreferrer noopener">https://www.youtube.com/channel/UCnnIP34CpT7nIBZS5KuuhbA</a></p>



<p>The cacatoès Theory le site fait pour des designers :&nbsp;</p>



<p><a href="https://www.thecacatoestheory.com/" target="_blank" rel="noreferrer noopener">https://www.thecacatoestheory.com/</a></p>



<div class="wp-block-kadence-spacer aligncenter kt-block-spacer-_5ea50d-25"><div class="kt-block-spacer kt-block-spacer-halign-center"><hr class="kt-divider"/></div></div>



<p><strong>Autres ressources :</strong></p>



<p>Un site qui recensent de nombreuses ressources UI : </p>



<p><a href="https://uigoodies.com/" target="_blank" rel="noreferrer noopener">https://uigoodies.com/</a></p>



<p>En manque d’inspiration :</p>



<p><a href="https://dribbble.com/shots" target="_blank" rel="noreferrer noopener">https://dribbble.com/</a></p>



<p>On en reprendra encore un peu :</p>



<p><a href="https://www.behance.net/" target="_blank" rel="noreferrer noopener">https://www.behance.net/</a></p>



<p>La toolbox d’une graphiste :&nbsp;</p>



<p><a href="https://www.neographefactory.com/toolbox.html" target="_blank" rel="noreferrer noopener">https://www.neographefactory.com/toolbox.html</a></p>
</div></div>
</div></div></div>
<p>L’article <a rel="nofollow" href="https://ilelli.net/le-metier-ui-designer/">Le métier : UI designer</a> est apparu en premier sur <a rel="nofollow" href="https://ilelli.net">Ilelli</a>.</p>
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>Le métier : UX designer</title>
		<link>https://ilelli.net/le-metier-ux-designer/</link>
		
		<dc:creator><![CDATA[webmaster]]></dc:creator>
		<pubDate>Wed, 09 Nov 2022 10:05:20 +0000</pubDate>
				<category><![CDATA[Les métiers du digital]]></category>
		<category><![CDATA[UX Design]]></category>
		<guid isPermaLink="false">https://ilelli.net/?p=566</guid>

					<description><![CDATA[<p><span class="rt-reading-time" style="display: block;"><span class="rt-label rt-prefix">Temps de lecture : </span> <span class="rt-time">3</span> <span class="rt-label rt-postfix">min.</span></span> Pour commencer, découvrez comment l’expert de l’UX Don Norman décrit de façon concise ce qu’est l’UX design.</p>
<p>L’article <a rel="nofollow" href="https://ilelli.net/le-metier-ux-designer/">Le métier : UX designer</a> est apparu en premier sur <a rel="nofollow" href="https://ilelli.net">Ilelli</a>.</p>
]]></description>
										<content:encoded><![CDATA[<span class="rt-reading-time" style="display: block;"><span class="rt-label rt-prefix">Temps de lecture : </span> <span class="rt-time">3</span> <span class="rt-label rt-postfix">min.</span></span>
<h2 class="has-text-color wp-block-heading" style="color:#067790">La définition du terme UX</h2>



<div class="wp-block-kadence-rowlayout alignnone"><div id="kt-layout-id_737cef-b1" class="kt-row-layout-inner kt-layout-id_737cef-b1"><div class="kt-row-column-wrap kt-has-1-columns kt-gutter-default kt-v-gutter-default kt-row-valign-top kt-row-layout-equal kt-tab-layout-inherit kt-m-colapse-left-to-right kt-mobile-layout-row">
<div class="wp-block-kadence-column inner-column-1 kadence-column_9ffcf9-58"><div class="kt-inside-inner-col">
<p>Pour commencer, découvrez comment l’expert de l’UX Don Norman décrit de façon concise ce qu’est l’UX design.</p>



<figure class="wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio"><div class="wp-block-embed__wrapper">
<iframe loading="lazy" title="Don Norman: The term &quot;UX&quot;" width="1170" height="658" src="https://www.youtube.com/embed/9BdtGjoIN4E?feature=oembed" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div></figure>



<p></p>



<p>L’<strong>UX designer</strong> est donc tout simplement le <strong>garant de l’expérience utilisateur</strong>. Il peut alors intervenir sur un produit digital mais également sur l’ensemble de son environnement incluant processus, utilisateurs, support, éléments extérieurs etc. Beaucoup de profils ont la double casquette UX et UI designer, il ne faut, cependant, pas confondre les deux métiers. Découvrez notre article sur le <a href="https://ilelli.net/le-metier-ui-designer/">métier d&#8217;UI designer ici</a>.</p>
</div></div>
</div></div></div>



<div class="wp-block-kadence-spacer aligncenter kt-block-spacer-_b6a72d-c0"><div class="kt-block-spacer kt-block-spacer-halign-center"></div></div>



<h2 class="has-text-color wp-block-heading" style="color:#067790">La méthode de travail de l&#8217;UX designer</h2>



<div class="wp-block-kadence-rowlayout alignnone"><div id="kt-layout-id_7892d3-0a" class="kt-row-layout-inner kt-layout-id_7892d3-0a"><div class="kt-row-column-wrap kt-has-1-columns kt-gutter-default kt-v-gutter-default kt-row-valign-top kt-row-layout-equal kt-tab-layout-inherit kt-m-colapse-left-to-right kt-mobile-layout-row">
<div class="wp-block-kadence-column inner-column-1 kadence-column_490827-fc"><div class="kt-inside-inner-col">
<figure class="wp-block-image size-large"><img decoding="async" loading="lazy" width="1024" height="461" src="https://ilelli.net/wp-content/uploads/2022/11/5DCvwXIA-1024x461.png" alt="" class="wp-image-567" srcset="https://ilelli.net/wp-content/uploads/2022/11/5DCvwXIA-1024x461.png 1024w, https://ilelli.net/wp-content/uploads/2022/11/5DCvwXIA-300x135.png 300w, https://ilelli.net/wp-content/uploads/2022/11/5DCvwXIA-768x345.png 768w, https://ilelli.net/wp-content/uploads/2022/11/5DCvwXIA-1000x450.png 1000w, https://ilelli.net/wp-content/uploads/2022/11/5DCvwXIA-230x103.png 230w, https://ilelli.net/wp-content/uploads/2022/11/5DCvwXIA-350x157.png 350w, https://ilelli.net/wp-content/uploads/2022/11/5DCvwXIA-480x216.png 480w, https://ilelli.net/wp-content/uploads/2022/11/5DCvwXIA.png 1512w" sizes="(max-width: 1024px) 100vw, 1024px" /><figcaption class="wp-element-caption"><em>Carine Lallemand “Méthodes de design UX”</em></figcaption></figure>



<p>Dans l’ouvrage “Méthodes de design UX”, Carine Lallemand propose une méthode découpée en plusieurs phases similaire à celle du design thinking.&nbsp;</p>



<p></p>



<ul>
<li><strong>Planification&nbsp;</strong></li>
</ul>



<p>Cette première phase consiste en la planification du projet UX et à la recherche préliminaires. Il convient avec le client de définir l’attendu et le périmètre du projet lors d’un cadrage avec les parties prenantes. Puis dans un second temps de réaliser la recherche préliminaire, dans laquelle on commence à recueillir des informations disponibles sur le sujet traités via des forums, des articles scientifiques, la presse etc.</p>



<p></p>



<ul>
<li><strong>Exploration&nbsp;</strong></li>
</ul>



<p>Une fois le client et l’<strong>UX designer</strong> aligné sur les mêmes objectifs, le cœur de l’étude commence. À cette étape, l’UX designer, idéalement accompagné de la personne en charge du projet, commence la recherche utilisateur à travers des interviews, des observations terrains et autres méthodes de découvertes. L’UX designer cartographie l’expérience utilisateur et fournit des livrables visuels à la compréhension facilité pour partager ses hypothèses.</p>



<p></p>



<ul>
<li><strong>Idéation</strong></li>
</ul>



<p>Quand l’ensemble des hypothèses sont émissent par l’<strong>UX designer</strong>, les ateliers d’idéation permettent de trouver des solutions et de prioriser les besoins.</p>



<p></p>



<ul>
<li><strong>Génération</strong></li>
</ul>



<p>Lorsque la solution est choisie, il est temps de la concrétiser, le plus souvent via un prototype testable. Dans le cas d’une solution digitale, un <strong>UI designer</strong> intervient pour réaliser une maquette de la solution en suivant les différents parcours utilisateurs priorisés.</p>



<p></p>



<ul>
<li><strong>Evaluation</strong></li>
</ul>



<p>La dernière étape est primordiale pour l’acceptation de la solution. Il est important de tester directement le prototype auprès des utilisateurs finaux afin d’aboutir après plusieurs itération à une solution répondant aux besoins des utilisateurs mais également aux objectifs business fixés au début du projet.</p>



<p>Il ne faut pas oublier qu’il n’existe pas UNE méthode en UX mais plusieurs méthodes pour plusieurs types de projet. Nous consacrerons une série dédiée aux différentes méthodes de travail dans le digital.</p>
</div></div>
</div></div></div>



<div class="wp-block-kadence-spacer aligncenter kt-block-spacer-_2b1f91-0c"><div class="kt-block-spacer kt-block-spacer-halign-center"></div></div>



<h2 class="has-text-color wp-block-heading" style="color:#067790">Les outils</h2>



<div class="wp-block-kadence-rowlayout alignnone"><div id="kt-layout-id_9e606c-e5" class="kt-row-layout-inner kt-layout-id_9e606c-e5"><div class="kt-row-column-wrap kt-has-1-columns kt-gutter-default kt-v-gutter-default kt-row-valign-top kt-row-layout-equal kt-tab-layout-inherit kt-m-colapse-left-to-right kt-mobile-layout-row">
<div class="wp-block-kadence-column inner-column-1 kadence-column_a1c33f-6f"><div class="kt-inside-inner-col">
<p>Tout comme les méthodes, les UX designers n’utilisent pas tous les mêmes outils. Dans la liste ci-dessous, nous vous proposons ce que nous utilisons nous au sein d’Ilelli.</p>



<ul start="1" style="font-size:16px">
<li><strong>Un guide d’entretien</strong> : co-construit avec le client pour ne pas oublier de questions,</li>



<li><strong>Un formulaire de consentement</strong> : pour demander l’accord des utilisateurs dans le cadre des enregistrements ou éventuelles prises de photos et vidéos, </li>



<li><strong>Un magnétophone</strong> : pour enregistrer les nombreux échanges et ne rien oublier,</li>



<li><strong>Dovetail </strong>: pour transcrire automatiquement, taguer et trier les retours utilisateurs,</li>



<li><strong>Figma et Figjam</strong> : pour co-créer et designer les parcours utilisateurs et autres livrables,</li>



<li><strong>Microsoft Powerpoint </strong>: pour faire les présentations auprès du client et réaliser les synthèses.</li>
</ul>
</div></div>
</div></div></div>



<div class="wp-block-kadence-spacer aligncenter kt-block-spacer-_59dc7a-6c"><div class="kt-block-spacer kt-block-spacer-halign-center"></div></div>



<h2 class="has-text-color wp-block-heading" style="color:#067790">En savoir plus</h2>



<div class="wp-block-kadence-rowlayout alignnone"><div id="kt-layout-id_cacdf1-ad" class="kt-row-layout-inner kt-layout-id_cacdf1-ad"><div class="kt-row-column-wrap kt-has-1-columns kt-gutter-default kt-v-gutter-default kt-row-valign-top kt-row-layout-equal kt-tab-layout-inherit kt-m-colapse-left-to-right kt-mobile-layout-row">
<div class="wp-block-kadence-column inner-column-1 kadence-column_f9d864-b3"><div class="kt-inside-inner-col">
<p>Bien entendu cet article n’est pas suffisant pour vous présenter l’étendue de ce métier passionnant, alors on vous laisse une liste de quelques ressources si vous souhaitez en savoir plus.</p>



<div class="wp-block-kadence-spacer aligncenter kt-block-spacer-_f8bb11-05"><div class="kt-block-spacer kt-block-spacer-halign-center"><hr class="kt-divider"/></div></div>



<p><strong>Articles :&nbsp;</strong></p>



<p>Les différentes spécialités dans l’UX : </p>



<p><a href="https://medium.com/@jscanzi/do-i-need-a-ux-ui-designer-ux-researcher-ux-strategist-4db032f2aac7" target="_blank" rel="noreferrer noopener">https://medium.com/@jscanzi/do-i-need-a-ux-ui-designer-ux-researcher-ux-strategist-4db032f2aac7</a></p>



<p>Une liste de quelques méthodes UX :</p>



<p><a href="https://medium.com/user-experience-design-1/a-comprehensive-list-of-ux-design-methods-deliverables-2021-2feb3e70e168" target="_blank" rel="noreferrer noopener">https://medium.com/user-experience-design-1/a-comprehensive-list-of-ux-design-methods-deliverables-2021-2feb3e70e168</a></p>



<div class="wp-block-kadence-spacer aligncenter kt-block-spacer-_8284c2-4e"><div class="kt-block-spacer kt-block-spacer-halign-center"><hr class="kt-divider"/></div></div>



<p><strong>Sites :</strong></p>



<p>Le site de Nielsen Norman Group &#8211; précurseur dans le domaine de l’UX : </p>



<p><a href="https://www.nngroup.com/" target="_blank" rel="noreferrer noopener">https://www.nngroup.com/</a></p>



<p>Le site de Carine Lallemand &#8211; chercheuse en psychologie et UX design :</p>



<p> <a href="https://uxmind.eu/" target="_blank" rel="noreferrer noopener">https://uxmind.eu/</a></p>



<p>Flupa &#8211; l’association qui rassemble les UX designer : </p>



<p><a href="https://flupa.eu/" target="_blank" rel="noreferrer noopener">https://flupa.eu/</a></p>



<p>UX collective &#8211; une source de contenu UX : </p>



<p><a href="https://uxdesign.cc/" target="_blank" rel="noreferrer noopener">https://uxdesign.cc/</a></p>



<p></p>



<div class="wp-block-kadence-spacer aligncenter kt-block-spacer-_f5abca-e0"><div class="kt-block-spacer kt-block-spacer-halign-center"><hr class="kt-divider"/></div></div>



<p><strong>Livres :</strong></p>



<p><a href="https://www.eyrolles.com/Informatique/Livre/methodes-de-design-ux-9782212673982/" target="_blank" rel="noreferrer noopener">https://www.eyrolles.com/Informatique/Livre/methodes-de-design-ux-9782212673982/</a><br><a href="https://www.eyrolles.com/Informatique/Livre/l-ux-design-en-pratique--9782212678840/" target="_blank" rel="noreferrer noopener">https://www.eyrolles.com/Informatique/Livre/l-ux-design-en-pratique&#8211;9782212678840/</a><br><a href="https://www.eyrolles.com/Informatique/Livre/ux-writing-9782212679809/" target="_blank" rel="noreferrer noopener">https://www.eyrolles.com/Informatique/Livre/ux-writing-9782212679809/</a></p>
</div></div>
</div></div></div>
<p>L’article <a rel="nofollow" href="https://ilelli.net/le-metier-ux-designer/">Le métier : UX designer</a> est apparu en premier sur <a rel="nofollow" href="https://ilelli.net">Ilelli</a>.</p>
]]></content:encoded>
					
		
		
			</item>
	</channel>
</rss>
