<?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>Conception UX/UI produit &#8211; Pierre Lannes</title>
	<atom:link href="https://www.pierre-lannes.fr/category/portfolio/conception-ux-ui/feed/" rel="self" type="application/rss+xml" />
	<link>https://www.pierre-lannes.fr</link>
	<description></description>
	<lastBuildDate>Mon, 10 Nov 2025 07:11:57 +0000</lastBuildDate>
	<language>fr-FR</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	<generator>https://wordpress.org/?v=6.9</generator>

<image>
	<url>https://www.pierre-lannes.fr/wp-content/uploads/2025/06/cropped-Pierre-Lannes_LOGO_transparent-32x32.png</url>
	<title>Conception UX/UI produit &#8211; Pierre Lannes</title>
	<link>https://www.pierre-lannes.fr</link>
	<width>32</width>
	<height>32</height>
</image> 
	<item>
		<title>Design application de gestion des catastrophes</title>
		<link>https://www.pierre-lannes.fr/design-application-de-gestion-des-catastrophes/</link>
					<comments>https://www.pierre-lannes.fr/design-application-de-gestion-des-catastrophes/#respond</comments>
		
		<dc:creator><![CDATA[Pierre]]></dc:creator>
		<pubDate>Fri, 17 Jan 2025 08:15:05 +0000</pubDate>
				<category><![CDATA[Conception UX/UI produit]]></category>
		<category><![CDATA[Ergonomie]]></category>
		<category><![CDATA[Missions réalisées]]></category>
		<category><![CDATA[application métier]]></category>
		<category><![CDATA[prévention des risques]]></category>
		<category><![CDATA[prévention et gestion des risques]]></category>
		<category><![CDATA[sécurité civile]]></category>
		<category><![CDATA[SIG]]></category>
		<category><![CDATA[Système d'Information géographique]]></category>
		<guid isPermaLink="false">https://www.pierre-lannes.fr/?post_type=portfolio_page&#038;p=56293</guid>

					<description><![CDATA[Accompagnement en ergonomie pour le design d'une application de gestion des catastrophes, sur la première brique fonctionnelle concernant la prévention et la gestion des risques d'inondations.]]></description>
										<content:encoded><![CDATA[
<p>Source image&nbsp;: <a href="https://www.linkedin.com/feed/update/urn:li:activity:7257052430964600832/" target="_blank" rel="noopener" title="">post LinkedIN de l&rsquo;<strong>Entente Valabre</strong></a>, centre de prévention et de lutte face aux risques naturels</p>



<p><strong>2025 2024</strong> avec mon partenaire <a href="https://www.ergogenese.fr/" target="_blank" rel="noopener" title="">Ergogenèse</a> pour le <a href="https://tds-group.fr/" target="_blank" rel="noopener" title="">Groupe TDS</a> expert conseil en développement et la gestion des risques en zones réputées difficiles d’accès</p>



<h4 class="wp-block-heading">Accompagnement en ergonomie</h4>



<p>Design d&rsquo;une application de gestion des catastrophes, sur la première brique fonctionnelle concernant la prévention et la gestion des risques d&rsquo;inondations</p>



<h4 class="wp-block-heading">Les fonctionnalités générales attendues</h4>



<p>Cette application est à destination de centres de commandement, postes de commandement mobiles et véhicules d&rsquo;interventions de la sécurité civile dans plusieurs pays afin de planifier les actions avant (préventions, simulation, formation), pendant (coordination) et après (RETEX) les phases d&rsquo;alertes catastrophes. C&rsquo;est un Système d&rsquo;Information Géographique (SIG) intégrant des fonctions d&rsquo;agrégation et de collectes de données (météorologiques, terrains, infrastructures, moyens&#8230;), de simulations, de planification, d&rsquo;aide à la décision et de coordination des équipes de commandement stratégique, tactique et opérationnel, et les équipes d&rsquo;intervention.</p>



<h2 class="wp-block-heading">Contexte</h2>



<p>Ce projet fait partie du programme européen <a href="https://www.pprdmed.eu/" target="_blank" rel="noopener" title="">PPRD Med</a> &#8211; Prévention, Préparation et Réponse aux catastrophes (Disasters) naturelles et d’origine humaine dans les pays partenaires dans le sud et l’est Méditerranée. Il vise à fournir des solutions et accompagner les pays afin d&rsquo;améliorer la prévention et la gestion des catastrophes.</p>



<h3 class="wp-block-heading">Utilisateurs finaux</h3>



<p>Opérationnels de la sécurité civile, opérateurs humains des centres de commandements, jusqu&rsquo;aux pompiers, dans les pays de l&rsquo;Union Européenne, de la Méditerranée et du Moyen-Orient</p>



<h2 class="wp-block-heading">Réalisation</h2>



<ul class="wp-block-list">
<li>Accompagnement d&rsquo;experts métiers dans l&rsquo;<strong>identification des besoins</strong> des utilisateurs</li>



<li><strong>Design Sprint</strong> de 3 jours en atelier</li>



<li><strong>Personas</strong> des différentes typologie d&rsquo;utilisateurs</li>



<li>Design de scénarios d&rsquo;utilisation sous forme de <strong>storymap</strong>, afin d&rsquo;identifier les fonctionnalités et les interactions entre les utilisateurs et l&rsquo;application</li>



<li>Constitution d&rsquo;une <strong>matrice de fonctionnalités</strong>  </li>



<li><strong>Roadmap</strong>&nbsp;: priorisation et groupement des fonctionnalités en fonction des exigences fonctionnelles, de développement, sur le contenu des futures montées de version</li>



<li><strong>État de l&rsquo;art</strong> des applications existantes</li>



<li>Proposition de <strong>principes de design</strong> et <strong>maquettage</strong> (<strong>Figma</strong>) d&rsquo;écrans types </li>
</ul>



<h2 class="wp-block-heading">Inspiration</h2>



<p><a href="https://fuselabcreative.com/our-projects/flood-damage">https://fuselabcreative.com/our-projects/flood-damage</a></p>



<figure class="wp-block-image size-full"><img fetchpriority="high" decoding="async" width="1920" height="1007" src="https://www.pierre-lannes.fr/wp-content/uploads/2025/01/flood-hub.jpg" alt="Dashboard Flood Damage" class="wp-image-56353" srcset="https://www.pierre-lannes.fr/wp-content/uploads/2025/01/flood-hub.jpg 1920w, https://www.pierre-lannes.fr/wp-content/uploads/2025/01/flood-hub-300x157.jpg 300w, https://www.pierre-lannes.fr/wp-content/uploads/2025/01/flood-hub-1024x537.jpg 1024w, https://www.pierre-lannes.fr/wp-content/uploads/2025/01/flood-hub-768x403.jpg 768w, https://www.pierre-lannes.fr/wp-content/uploads/2025/01/flood-hub-1536x806.jpg 1536w" sizes="(max-width: 1920px) 100vw, 1920px" /></figure>



<p></p>
]]></content:encoded>
					
					<wfw:commentRss>https://www.pierre-lannes.fr/design-application-de-gestion-des-catastrophes/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
		<item>
		<title>Design application de supervision du traitement de l&#8217;eau</title>
		<link>https://www.pierre-lannes.fr/design-application-supervision-traitement-de-eau/</link>
					<comments>https://www.pierre-lannes.fr/design-application-supervision-traitement-de-eau/#respond</comments>
		
		<dc:creator><![CDATA[Pierre]]></dc:creator>
		<pubDate>Wed, 07 Sep 2022 12:01:17 +0000</pubDate>
				<category><![CDATA[Conception UX/UI produit]]></category>
		<category><![CDATA[Ergonomie]]></category>
		<category><![CDATA[Facteurs Humains]]></category>
		<category><![CDATA[Missions réalisées]]></category>
		<category><![CDATA[application métier]]></category>
		<category><![CDATA[industrie]]></category>
		<category><![CDATA[maintenance]]></category>
		<category><![CDATA[SSCT]]></category>
		<category><![CDATA[supervision de process]]></category>
		<category><![CDATA[travail posté]]></category>
		<guid isPermaLink="false">https://www.pierre-lannes.fr/?post_type=portfolio_page&#038;p=45612</guid>

					<description><![CDATA[Projet réalisé en 2022]]></description>
										<content:encoded><![CDATA[
<p><strong>2022 projet confidentiel</strong>&nbsp;pour une société en charge du captage, du traitement et de la distribution de l&rsquo;eau d&rsquo;une grande métropole française.</p>



<h2 class="wp-block-heading">Contexte</h2>



<p>Dans le cadre d&rsquo;un projet de refonte système de supervision/hypervision des usines de traitement de l’eau, il s’agissait de fournir des principes de design de la nouvelle application, en conformité avec les besoins des différents métiers (opérateurs, ingénieurs&#8230;) et avec la <strong>norme ISA101</strong> pour les <strong>Interfaces homme-machine des applications industrielles</strong>.</p>



<figure class="wp-block-image aligncenter"><img decoding="async" width="150" height="150" src="https://www.pierre-lannes.fr/wp-content/uploads/2022/09/isa_2-150x150.png" alt="International Society of Automation" class="wp-image-45616" srcset="https://www.pierre-lannes.fr/wp-content/uploads/2022/09/isa_2-150x150.png 150w, https://www.pierre-lannes.fr/wp-content/uploads/2022/09/isa_2-300x297.png 300w, https://www.pierre-lannes.fr/wp-content/uploads/2022/09/isa_2.png 308w" sizes="(max-width: 150px) 100vw, 150px" /></figure>



<p class="has-text-align-center">International Society of Automation</p>



<h2 class="wp-block-heading">Réalisation</h2>



<ul class="wp-block-list">
<li>Analyse de l’activité des opérateurs (travail posté en salle de supervision)</li>



<li>Itérations avec l’équipe projet</li>



<li>Réalisation d’une charte graphique et maquettes de futurs écrans</li>
</ul>



<h2 class="wp-block-heading">Outil de maquettage utilisé&nbsp;: Figma</h2>



<ul class="wp-block-list">
<li>Réalisation de la charte graphique et de l&rsquo;iconographie reprenant les principes de la <strong>norme ISA101</strong></li>



<li>Maquettage graphique de visualisation des processus applicables aux synoptiques et écrans des postes de travail  </li>
</ul>



<h2 class="wp-block-heading"><img alt="" decoding="async" width="226" height="113" class="alignnone wp-image-45603 " src="https://www.pierre-lannes.fr/wp-content/uploads/2022/09/figma_logo_icon-300x150.png" alt="" srcset="https://www.pierre-lannes.fr/wp-content/uploads/2022/09/figma_logo_icon-300x150.png 300w, https://www.pierre-lannes.fr/wp-content/uploads/2022/09/figma_logo_icon.png 512w" sizes="(max-width: 226px) 100vw, 226px" /></h2>



<h2 class="wp-block-heading">Résultat</h2>



<p>Rupture avec l’ancienne génération d’applications de supervision fortement chargées visuellement (couleurs, réalisme et complexité des appareils) pour une représentations extrêmement simplifiée des composants du process, un enrichissement de la représentation des mesures, tendances et seuils.</p>



<p>Un mode graphique sombre plus reposant visuellement, diminuant la charge visuelle en permettant de se concentrer sur les informations utiles pour la supervision, dés le 1er niveau de visualisation.</p>



<p>Conformément à la norme <strong>ISA101</strong>, le premier niveau de visualisation est une représentation globale de la situation <strong>Situational Awareness</strong> grâce à laquelle un opérateur peut voir l&rsquo;ensemble du processus à un niveau macroscopique, et peut focaliser par étage jusqu&rsquo;aux composants et données d&rsquo;un équipement (cuves, pompes, capteurs, etc.).</p>
]]></content:encoded>
					
					<wfw:commentRss>https://www.pierre-lannes.fr/design-application-supervision-traitement-de-eau/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
		<item>
		<title>Conception UX/UI service connecté et app embarquée (CarPlay) et débarquée (iOS) pour automobile</title>
		<link>https://www.pierre-lannes.fr/conception-ux-ui-service-connecte-et-app-embarquee-carplay-et-debarquee-ios-pour-automobile/</link>
					<comments>https://www.pierre-lannes.fr/conception-ux-ui-service-connecte-et-app-embarquee-carplay-et-debarquee-ios-pour-automobile/#respond</comments>
		
		<dc:creator><![CDATA[Pierre]]></dc:creator>
		<pubDate>Sat, 07 Jul 2018 14:13:47 +0000</pubDate>
				<category><![CDATA[Conception UX/UI produit]]></category>
		<category><![CDATA[Conseil stratégie et innovation]]></category>
		<category><![CDATA[Ergonomie]]></category>
		<category><![CDATA[Facteurs Humains]]></category>
		<category><![CDATA[Missions réalisées]]></category>
		<category><![CDATA[Prospective]]></category>
		<category><![CDATA[automobile]]></category>
		<category><![CDATA[cross-canal]]></category>
		<category><![CDATA[iOS]]></category>
		<category><![CDATA[iPhone]]></category>
		<category><![CDATA[mobilité]]></category>
		<category><![CDATA[multi-canal]]></category>
		<category><![CDATA[multitouch]]></category>
		<guid isPermaLink="false">https://www.pierre-lannes.fr/?post_type=portfolio_page&#038;p=27619</guid>

					<description><![CDATA[Projet confidentiel en 2018 pour DS Automobiles. ]]></description>
										<content:encoded><![CDATA[
<p><strong>2018 pour DS Automobiles</strong></p>



<ul class="wp-block-list">
<li>Design d&rsquo;un service connecté à usage automobile</li>



<li>Méthodologie Agile / Scrum itérative et incrémentale.</li>



<li>Prise en compte des personas existants et des Brand Experience Attributes</li>



<li>Benchmark d’applications cibles</li>
</ul>



<h3 class="wp-block-heading">Phase d&rsquo;émergence</h3>



<p>Atelier d&rsquo;émergence pour identifier les insights usager via des cartes d&#8217;empathie, idéation et ébauche de 3 scénarios d&rsquo;usage</p>



<h3 class="wp-block-heading">Phase de convergence</h3>



<p>Atelier de convergence&nbsp;: détailler les scénarios ébauchés en phase d&rsquo;émergence, préciser les idées sur les contenus et fonctions du service, scorer les idées en fonction de leur valeur perçue, de leur complexité de mise en oeuvre, faisabilité technique, maturité technologique</p>



<p>Utilisation de supports de <strong>storymapping</strong> enrichis&nbsp;: contexte, déroulé chronologique du scénario, tâches, sous-tâches, interactions utilisateur et interface service, push système&#8230;</p>



<h3 class="wp-block-heading">UI Design, conception itérative maquette application<strong><br></strong></h3>



<p>Production dans <strong>Sketch</strong> d&rsquo;une maquette graphique illustrant le scénario d&rsquo;usage le plus riche, en détaillant les enchaînements des affichages en alternance entre la version débarquée sur <strong>iPhone</strong> (système <strong>iOS</strong>) et la version embarquée sur l&rsquo;affichage du véhicule (iOS <strong>Carplay</strong>)</p>



<p>Le maquettage graphique était statique et le plus réaliste possible en se référant aux Guidelines iOS et <strong>Carplay</strong> et la charte graphique de la marque</p>



<p>Atelier de conception itérative avec les équipes métier, les UX Designers et les Directeurs de création</p>
]]></content:encoded>
					
					<wfw:commentRss>https://www.pierre-lannes.fr/conception-ux-ui-service-connecte-et-app-embarquee-carplay-et-debarquee-ios-pour-automobile/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
		<item>
		<title>Etude prospective des usages du véhicule autonome</title>
		<link>https://www.pierre-lannes.fr/etude-futurs-usages-vehicules-autonomes/</link>
					<comments>https://www.pierre-lannes.fr/etude-futurs-usages-vehicules-autonomes/#respond</comments>
		
		<dc:creator><![CDATA[Pierre]]></dc:creator>
		<pubDate>Sat, 11 Nov 2017 16:38:27 +0000</pubDate>
				<category><![CDATA[Conception UX/UI produit]]></category>
		<category><![CDATA[Conseil stratégie et innovation]]></category>
		<category><![CDATA[Design de service]]></category>
		<category><![CDATA[Facteurs Humains]]></category>
		<category><![CDATA[Missions réalisées]]></category>
		<category><![CDATA[Prospective]]></category>
		<category><![CDATA[Recherche Utilisateur]]></category>
		<category><![CDATA[automobile]]></category>
		<category><![CDATA[intelligence artificielle]]></category>
		<category><![CDATA[mobilité]]></category>
		<category><![CDATA[prospective]]></category>
		<guid isPermaLink="false">https://www.pierre-lannes.fr/?post_type=portfolio_page&#038;p=21458</guid>

					<description><![CDATA[Projet confidentiel depuis 2017 pour 3 ans. Dans le cadre d’un programme d’investissements d’avenir (PIA) sur les futurs véhicules à délégation partielle ou totale de la conduite (véhicule autonome), j’assure la direction sur les activités de l’équipe en charge de l'état de l'art, les études ethnographiques, la prospective des usages, le prototypage et tests utilisateurs des concepts]]></description>
										<content:encoded><![CDATA[
<p>Projet confidentiel depuis 2017 pour 3 ans. Dans le cadre d’un programme d’investissements d’avenir (PIA) sur les futurs véhicules à délégation partielle ou totale de la conduite (véhicule autonome), j&rsquo;ai assuré la direction technique sur les activités de l’équipe en charge de&nbsp;:</p>



<ul class="wp-block-list">
<li>L&rsquo;état de l&rsquo;art</li>



<li>Études ethnographiques</li>



<li>Prospective des usages</li>



<li>Prototypage et tests utilisateurs des concepts</li>
</ul>



<p>Le projet vise à&nbsp;:</p>



<ul class="wp-block-list">
<li>Anticiper et étudier les problématiques et les solutions liées aux niveaux de délégation intermédiaires&nbsp;: passage des modes de conduites manuelles aux modes semi autonomes</li>



<li>Anticiper de futurs usages et solutions en terme de services et d’interactions hommes-machines dans les futurs habitacles des véhicules autonomes</li>
</ul>



<p>Voir également mon billet&nbsp;:&nbsp;<a href="/fin-de-la-relation-fusionnelle-entre-conducteur-et-automobile/">La fin de la relation fusionnelle du conducteur avec l&rsquo;automobile&nbsp;?</a></p>



<h2 class="wp-block-heading">Les 5 niveaux de délégation de conduite</h2>



<p><strong>0 (eyes on),</strong> aucune aide ou fonctions automatisées et l’ensemble de la conduite du véhicule est déléguée au seul conducteur.</p>



<h4 class="wp-block-heading">1 à 3&nbsp;: délégation partielle de la conduite, ou&nbsp;conduite semi-assistée</h4>



<h4 class="wp-block-heading">Niveau 1</h4>



<p>Les yeux sur la route &#8211; <strong>Eyes On</strong>&nbsp;&#8211;&nbsp;il s&rsquo;agit du premier niveau d&rsquo;aide à la conduite automobile (en anglais Advanced driver-assistance systems ou ADAS), typiquement le&nbsp;<strong>régulateur de vitesse</strong>.</p>



<h4 class="wp-block-heading">Niveau 2</h4>



<p>Les yeux sur la route &#8211;<strong>&nbsp;Eyes On</strong> &#8211; ajout de dispositifs contrôlant la dynamique longitudinale et latérale du véhicule. Par rapport au niveau 1, le véhicule bénéficie d’un <strong>régulateur de vitesse adaptatif</strong>&nbsp;(exemple&nbsp;: &nbsp;<a href="https://fr.e-guide.renault.com/fra/Megane-4/REGULATEUR-DE-VITESSE-ADAPTATIF">Renault Megane GT avec régulateur adaptatif</a>) maintenant le véhicule à une vitesse programmée et à une distance constante du véhicule qui le précède.&nbsp;Dans le même temps, le véhicule reste sur sa voie sans que le conducteur ait à corriger la trajectoire du véhicule en reprenant le volant en main. Cette fonction de maintien du véhicule dans sa file notamment sur autoroute est bien entendu déjà proposée mais, conformément à la réglementation actuelle, le système impose que le conducteur reprenne le volant au bout de quelques secondes.</p>



<h4 class="wp-block-heading">&nbsp;Niveau 3</h4>



<p>Pas d&rsquo;obligation d&rsquo;avoir les yeux sur la route &#8211;&nbsp;<strong>Eyes Off&nbsp;</strong>&#8211; autorise une conduite automatisée dans des situations définies sans contrôle du conducteur, avec reprise en main par le conducteur si nécessaire. Avec ce niveau d’automatisation, on autorise le conducteur à faire autre chose à bord de son véhicule, c’est-à-dire visionner un film, consulter ses mails, etc. Le véhicule décide de lui-même de dépasser un autre véhicule et demande au conducteur de reprendre le volant lorsque l’état de l’infrastructure routière par exemple n’autorise plus le bon fonctionnement de la conduite automatisée.</p>



<h2 class="wp-block-heading"><strong>4 et 5&nbsp;: délégation totale de la conduite, ou véhicule autonome</strong></h2>



<h4 class="wp-block-heading">Niveau 4</h4>



<p>Pas de contrôle, sous conditions &#8211;<strong>&nbsp;Mind Off</strong>&nbsp;&#8211; autorise une conduite automatisée sans contrôle et sans reprise en main par le conducteur, dans des situations définies, c&rsquo;est à dire sur un parcours précis, circonscrit dans une zone restreinte soumise à des conditions particulières. A partir de ce niveau la conduite est donc automatisée et totalement déléguée. Les passagers et le conducteur peuvent s’assoupir, celui-ci lâche les mains et son attention n’est pas requise (mind off). Lorsque le véhicule ne contrôle plus la situation, celui-ci va de lui-même se mettre en sécurité, notamment en s’arrêtant, warnings allumés, sur la bande de voie d’urgence. A ce stade volant et pédales peuvent donc être éliminés, mais dans ce cas les passagers seront potentiellement immobilisés en cas d&rsquo;arrêt d&rsquo;urgence.</p>



<h4 class="wp-block-heading">Niveau 5</h4>



<p>Pas de contrôle &#8211;&nbsp;<strong>Mind Off</strong> &#8211; le degré ultime de l’automatisation du véhicule puisque non seulement la conduite est automatisée, mais en plus du niveau 4, l&rsquo;autonomie est permanente, sur tous types de trajets. Elle se substitue donc complètement au conducteur en étant capable de faire face à tout type de situation.</p>


<div class=" content_cards_card content_cards_domain_www-pierre-lannes-fr">
			<div class="content_cards_image">
				<a class="content_cards_image_link" href="https://www.pierre-lannes.fr/fin-de-la-relation-fusionnelle-entre-conducteur-et-automobile/">
					<img decoding="async" src="https://www.pierre-lannes.fr/wp-content/uploads/2018/04/peugeot-instinct-concept.jpg" alt="Fin de relation fusionnelle conducteur-auto | Pierre Lannes">				</a>
		</div>
	
	<div class="content_cards_title">
		<a class="content_cards_title_link" href="https://www.pierre-lannes.fr/fin-de-la-relation-fusionnelle-entre-conducteur-et-automobile/">
			Fin de relation fusionnelle conducteur-auto | Pierre Lannes		</a>
	</div>
	<div class="content_cards_description">
		<a class="content_cards_description_link" href="https://www.pierre-lannes.fr/fin-de-la-relation-fusionnelle-entre-conducteur-et-automobile/">
			<p>Innovation du véhicule autonome, nature fusionnelle du rapport entre homme et automobile, risques de la conduite semi-automatique, ADAS</p>
		</a>
	</div>
	<div class="content_cards_site_name">
		<img decoding="async" src="https://www.pierre-lannes.fr/wp-content/uploads/2025/06/cropped-Pierre-Lannes_LOGO_transparent-32x32.png" alt="Pierre Lannes" class="content_cards_favicon"/>		Pierre Lannes	</div>
</div>
]]></content:encoded>
					
					<wfw:commentRss>https://www.pierre-lannes.fr/etude-futurs-usages-vehicules-autonomes/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
		<item>
		<title>Parcours et interactions ChatBOT de géolocalisation</title>
		<link>https://www.pierre-lannes.fr/parcours-et-interactions-chatbot-de-geolocalisation/</link>
					<comments>https://www.pierre-lannes.fr/parcours-et-interactions-chatbot-de-geolocalisation/#respond</comments>
		
		<dc:creator><![CDATA[Pierre]]></dc:creator>
		<pubDate>Thu, 22 Dec 2016 17:35:59 +0000</pubDate>
				<category><![CDATA[Conception UX/UI produit]]></category>
		<category><![CDATA[Design de service]]></category>
		<category><![CDATA[Ergonomie]]></category>
		<category><![CDATA[Missions réalisées]]></category>
		<category><![CDATA[Banque Finance Assurance]]></category>
		<category><![CDATA[smartphone]]></category>
		<guid isPermaLink="false">https://www.pierre-lannes.fr/?post_type=portfolio_page&#038;p=21311</guid>

					<description><![CDATA[2016 Projet confidentiel Conception d&#8217;un prototype robot conversationnel Facebook Messenger pour l&#8217;aide à la géolocalisation de services bancaires à l&#8217;étranger Définition des logiques d&#8217;interactions conversationnelles, parcours et définition des contenus&#160;: message, cartographie et iconographie Le projet a été mené en mode agile sur un sprint de 3 semaines L&#8217;équipe est composé d&#8217;un product owner, de [&#8230;]]]></description>
										<content:encoded><![CDATA[
<p>2016 Projet confidentiel</p>



<p>Conception d&rsquo;un prototype robot conversationnel <strong>Facebook Messenger</strong> pour l&rsquo;aide à la géolocalisation de services bancaires à l&rsquo;étranger</p>



<p>Définition des logiques d&rsquo;interactions conversationnelles, parcours et définition des contenus&nbsp;: message, cartographie et iconographie</p>



<p>Le projet a été mené en mode agile sur un sprint de 3 semaines</p>



<p>L&rsquo;équipe est composé d&rsquo;un product owner, de 2 développeurs (front et back) et moi en tant qu&rsquo;UX Designer</p>



<p>Ce projet s&rsquo;inscrit dans le cadre d&rsquo;une cellule innovation en mesure de tester rapidement des concepts sous forme de preuve de concept POC (de l&rsquo;anglais&nbsp;: proof of concept)</p>



<p>Pour ma partie j&rsquo;ai réalisé&nbsp;:</p>



<ul class="wp-block-list">
<li>L&rsquo;architecture de l&rsquo;information avec <strong>XMind</strong></li>



<li>Le design et maquettage UI avec le logiciel <strong>Sketch</strong></li>
</ul>
]]></content:encoded>
					
					<wfw:commentRss>https://www.pierre-lannes.fr/parcours-et-interactions-chatbot-de-geolocalisation/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
		<item>
		<title>Design UI Mobile et webapps responsive Assurance Banque</title>
		<link>https://www.pierre-lannes.fr/design-ui-mobile-et-webapps-responsive-assurance-banque/</link>
					<comments>https://www.pierre-lannes.fr/design-ui-mobile-et-webapps-responsive-assurance-banque/#respond</comments>
		
		<dc:creator><![CDATA[Pierre]]></dc:creator>
		<pubDate>Thu, 09 Jun 2016 10:13:16 +0000</pubDate>
				<category><![CDATA[Conception UX/UI produit]]></category>
		<category><![CDATA[Missions réalisées]]></category>
		<category><![CDATA[Recherche Utilisateur]]></category>
		<category><![CDATA[Android]]></category>
		<category><![CDATA[application grand public]]></category>
		<category><![CDATA[application métier]]></category>
		<category><![CDATA[Banque Finance Assurance]]></category>
		<category><![CDATA[iOS]]></category>
		<category><![CDATA[iPhone]]></category>
		<category><![CDATA[smartphone]]></category>
		<category><![CDATA[Windows]]></category>
		<guid isPermaLink="false">https://www.pierre-lannes.fr/?post_type=portfolio_page&#038;p=21309</guid>

					<description><![CDATA[2016 &#8211; Plusieurs projets confidentiels de refonte et de design d&#8217;applications mobiles (tablettes et smartphone) et webapp responsive pour des usages métiers et grand public en secteur Banque Finance Assurance &#160;: Dans le cadre des études et refonte d&#8217;applications métier j&#8217;ai eu recours à la méthode de l&#8217;analyse du travail (observations et et entretiens ethnographiques) [&#8230;]]]></description>
										<content:encoded><![CDATA[
<p>2016 &#8211; Plusieurs projets confidentiels de <strong>refonte</strong> et de <strong>design</strong> d&rsquo;<strong>applications mobiles</strong> (tablettes et smartphone) et <strong>webapp</strong> <strong>responsive</strong> pour des <strong>usages métiers</strong> et <strong>grand public</strong> en secteur Banque Finance Assurance &nbsp;:</p>



<ul class="wp-block-list">
<li>Refonte de l&rsquo;application CRM portable (sur tablette Windows)&nbsp;des conseillers commerciaux (France)</li>



<li>Conception d&rsquo;une application&nbsp;(mobile native iOS/Android et desktop web responsive) de déclaration rapide de sinistre pour les assurés et les télé-experts (France)</li>



<li>Refonte d&rsquo;applications boursières (mobile native iOS/Android et desktop web responsive) pour usagers grand public (marché Europe)</li>
</ul>



<p>Dans le cadre des études et refonte d&rsquo;applications métier j&rsquo;ai eu recours à la méthode de l&rsquo;analyse du travail (observations et et entretiens ethnographiques) en m&rsquo;immergeant en situation réelle d&rsquo;usage. Par exemple en accompagnant des experts en assurances durant leur journée travail, en déplacement dans son véhicule, en expertise de sinistre chez les assurés, au bureau. </p>



<p>Pour les services et applications grand public, je réalise la phase de design le plus souvent via une conception itérative (ateliers de conceptions, échanges sur les fonctionnalités et maquettes) avec des experts métiers, en lançant des questionnaires et des tests utilisateurs individuels auprès du grand public.</p>



<h2 class="wp-block-heading">Outil de prototypage: Sketch app</h2>



<p>Sur ces anciens projets, pour le design d&rsquo;interfaces utilisateur (maquettage, prototypage) j&rsquo;utilisais le plus souvent l&rsquo;<a href="https://www.sketchapp.com">application <strong>Sketch</strong></a>. Grâce au <a href="https://www.invisionapp.com/craft">plugin <strong>Craft</strong></a>, les éléments d&rsquo;interfaces pouvaient être dynamisés et mis en ligne sous forme de prototype web.</p>



<p>L&rsquo;application <strong>Sketch</strong> à beaucoup évolué depuis, et d&rsquo;autres outils ont émergé, comme <strong>Figma</strong>.</p>
]]></content:encoded>
					
					<wfw:commentRss>https://www.pierre-lannes.fr/design-ui-mobile-et-webapps-responsive-assurance-banque/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
		<item>
		<title>Conception UX/UI iDTGV Max iPhone iOS et Android apps</title>
		<link>https://www.pierre-lannes.fr/conception-ux-ui-idtgv-max-iphone-ios-android-apps/</link>
					<comments>https://www.pierre-lannes.fr/conception-ux-ui-idtgv-max-iphone-ios-android-apps/#respond</comments>
		
		<dc:creator><![CDATA[Pierre]]></dc:creator>
		<pubDate>Wed, 28 Jan 2015 07:41:18 +0000</pubDate>
				<category><![CDATA[Conception UX/UI produit]]></category>
		<category><![CDATA[Ergonomie]]></category>
		<category><![CDATA[Missions réalisées]]></category>
		<category><![CDATA[Android]]></category>
		<category><![CDATA[cross-canal]]></category>
		<category><![CDATA[e-commerce]]></category>
		<category><![CDATA[iOS]]></category>
		<category><![CDATA[iPhone]]></category>
		<category><![CDATA[mobilité]]></category>
		<category><![CDATA[multitouch]]></category>
		<category><![CDATA[parcours client]]></category>
		<category><![CDATA[parcours usager]]></category>
		<category><![CDATA[smartphone]]></category>
		<category><![CDATA[transport]]></category>
		<guid isPermaLink="false">http://www.pierre-lannes.fr/?post_type=portfolio_page&#038;p=18954</guid>

					<description><![CDATA[Sortie en janvier&#160;2015 Conception de l&#8217;expérience du&#160;nouveau service de voyage en train illimité iDTGV Max&#160;: conception des applications iPhone iOS et Android, et du site web desktop et mobile (responsive). Parcours utilisateur client&#160;: recherche, réservation, check, modification de voyage, gestion du compte client et du profil MAXtrotter Réalisations Résultats Applications simples et efficaces]]></description>
										<content:encoded><![CDATA[
<h2 class="wp-block-heading"><strong>Sortie en janvier&nbsp;2015</strong></h2>



<p>Conception de l&rsquo;expérience du&nbsp;nouveau service de voyage en train illimité <strong>iDTGV Max</strong>&nbsp;: conception des applications iPhone <a href="https://numerique.sncf.com/store/applications/idtgv-max-0/"><strong>iOS</strong></a> et <strong><a href="https://play.google.com/store/apps/details?id=iDTGVMax_2.iDTGVMax_2&amp;hl=fr">Android</a>,</strong> et du site web desktop et mobile (responsive).</p>



<p>Parcours utilisateur client&nbsp;: recherche, réservation, check, modification de voyage, gestion du compte client et du profil MAXtrotter</p>



<h2 class="wp-block-heading"><strong>Réalisations</strong></h2>



<ul class="wp-block-list">
<li>Exploitation de « Personas » utilisateur à partir des études marketings iDTGV et d’ateliers d’itération </li>



<li>Réalisation de prototypes HTML dynamique avec le progiciel <strong>Axure RP Pro</strong></li>



<li>Direction de la création visuelle et du design graphique des applications</li>
</ul>



<h2 class="wp-block-heading">Résultats</h2>



<p>Applications simples et efficaces</p>
]]></content:encoded>
					
					<wfw:commentRss>https://www.pierre-lannes.fr/conception-ux-ui-idtgv-max-iphone-ios-android-apps/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
		<item>
		<title>Conception UX/UI Back-Office unifié de publication multicanal</title>
		<link>https://www.pierre-lannes.fr/conception-ux-interface-utilisateur-back-office-unifie-publication-multicanal/</link>
					<comments>https://www.pierre-lannes.fr/conception-ux-interface-utilisateur-back-office-unifie-publication-multicanal/#respond</comments>
		
		<dc:creator><![CDATA[Pierre]]></dc:creator>
		<pubDate>Fri, 01 Aug 2014 07:56:07 +0000</pubDate>
				<category><![CDATA[Conception UX/UI produit]]></category>
		<category><![CDATA[Ergonomie]]></category>
		<category><![CDATA[Missions réalisées]]></category>
		<category><![CDATA[Recherche Utilisateur]]></category>
		<category><![CDATA[application métier]]></category>
		<category><![CDATA[desktop]]></category>
		<category><![CDATA[médias]]></category>
		<guid isPermaLink="false">http://www.pierre-lannes.fr/?post_type=portfolio_page&#038;p=18272</guid>

					<description><![CDATA[Projet 2014. Dans le cadre d&#8217;un projet de réunification maximale des back-offices et outils / web applications métier mis à la disposition des utilisateurs finaux des différents Business Units, création de l&#8217;interface utilisateur du nouveau back-office, unifiée, performante et proposant une expérience utilisateur améliorée pour les utilisateurs finaux&#160;: journalistes, rédacteurs programmateurs, community managers, etc. Contexte [&#8230;]]]></description>
										<content:encoded><![CDATA[
<p><strong>Projet 2014</strong>. Dans le cadre d&rsquo;un projet de <strong>réunification</strong> maximale des <strong>back-offices</strong> et outils / <strong>web applications métier</strong> mis à la disposition des utilisateurs finaux des différents Business Units, création de l&rsquo;interface utilisateur du nouveau back-office, unifiée, performante et proposant une expérience utilisateur améliorée pour les utilisateurs finaux&nbsp;: journalistes, rédacteurs programmateurs, community managers, etc.</p>



<h2 class="wp-block-heading">Contexte</h2>



<p>MyTF1 gère toute la production, la programmation et la distribution de contenus Multicanal en temps réel et différé du groupe TF1&nbsp;: sites web, applications mobiles, box internet, programmes, vidéos à la demande, animation et informations, etc. </p>



<p>Plusieurs systèmes de back-office ont vu le jour au fur et à mesure que se diversifiaient les modes et les supports de diffusion des contenus, aboutissant à un parc hétérogène en terme d’interfaces utilisateurs, complexe à prendre en main, avec des redondances entre applications, parfois des fonctionnalités lourdes pour la réalisation de certaines tâches par les utilisateurs, un parc applicatif lourd à maintenir.</p>



<h2 class="wp-block-heading">Réalisations</h2>



<ul class="wp-block-list">
<li>Prise de connaissance et analyse des études précédentes sur les expressions de besoin</li>



<li>Analyse de l’activité des utilisateurs pendant la réalisation des tâches, recueil les besoins utilisateurs, identification des problématiques rencontrées sur les différentes business units avec les outils backoffice existants&nbsp;: journalistes, rédacteurs programmateurs, community managers, etc.</li>



<li>Rapport d’évaluation ergonomique avec des recommandations d’ergonomie, les points d’attention</li>



<li>Production d’une maquette dynamique wireframe sans design graphique réalisée sous <strong>Axure RP Pro</strong></li>



<li>Animation des ateliers de conception itérative</li>
</ul>



<h2 class="wp-block-heading">Résultats</h2>



<ul class="wp-block-list">
<li>Design d’un concept d’IHM backoffice unifié</li>



<li>Adhésion des utilisateurs</li>



<li>Gains de productivité et de performance des tâches réalisées avec le nouvel outil</li>



<li>Amélioration de l&rsquo;expérience utilisateur</li>
</ul>
]]></content:encoded>
					
					<wfw:commentRss>https://www.pierre-lannes.fr/conception-ux-interface-utilisateur-back-office-unifie-publication-multicanal/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
		<item>
		<title>Conception UI app de maintenance des trains</title>
		<link>https://www.pierre-lannes.fr/conception-application-maintenance-trains/</link>
					<comments>https://www.pierre-lannes.fr/conception-application-maintenance-trains/#respond</comments>
		
		<dc:creator><![CDATA[Pierre]]></dc:creator>
		<pubDate>Thu, 23 Jan 2014 08:33:32 +0000</pubDate>
				<category><![CDATA[Conception UX/UI produit]]></category>
		<category><![CDATA[Ergonomie]]></category>
		<category><![CDATA[Missions réalisées]]></category>
		<category><![CDATA[application métier]]></category>
		<category><![CDATA[desktop]]></category>
		<category><![CDATA[maintenance]]></category>
		<guid isPermaLink="false">http://www.pierre-lannes.fr/?post_type=portfolio_page&#038;p=18270</guid>

					<description><![CDATA[2014 &#8211; Design de l&#8217;interface utilisateur (UI) d&#8217;une application métier L&#8217;application est utilisée par des techniciens, sur des ordinateurs PC portables, qu&#8217;ils connectent sur les armoires techniques des voitures de train RER afin de réaliser des diagnostics d&#8217;équipements. L&#8217;application existante était de conception ancienne, difficile à prendre en main et peu performante. Tout en tenant [&#8230;]]]></description>
										<content:encoded><![CDATA[
<p>2014 &#8211; Design de l&rsquo;interface utilisateur (UI) d&rsquo;une <strong>application métier</strong></p>



<p>L&rsquo;application est utilisée par des techniciens, sur des ordinateurs PC portables, qu&rsquo;ils connectent sur les armoires techniques des voitures de train RER afin de réaliser des diagnostics d&rsquo;équipements.</p>



<p>L&rsquo;application existante était de conception ancienne, difficile à prendre en main et peu performante.</p>



<p>Tout en tenant en compte des contraintes techniques et de budget, le partis pris en terme d&rsquo;expérience utilisateur a consisté à mettre à disposition des systèmes de visualisations de jauges analogiques, dans un tableau de bord personnalisable via des widgets, tout en laissant à disposition un système d&rsquo;affichage de logs et de commandes textuelles.</p>



<p>Direction du design de l&rsquo;eXpérience Utilisateur (sur avant-vente et projet gagné)</p>



<ul class="wp-block-list">
<li>Architecture de l’information</li>



<li>Maquette statique « file de fer /wireframe » (définition du zoning / emplacement des composants de l&rsquo;interface utilisateur</li>



<li>Prototypage avec l&rsquo;application <strong>Axure RP Pro</strong></li>



<li>Direction de la création graphique</li>
</ul>



<p></p>
]]></content:encoded>
					
					<wfw:commentRss>https://www.pierre-lannes.fr/conception-application-maintenance-trains/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
		<item>
		<title>UX/UI contrôle sûreté biométrique</title>
		<link>https://www.pierre-lannes.fr/ux-ui-controle-surete-biometrique/</link>
					<comments>https://www.pierre-lannes.fr/ux-ui-controle-surete-biometrique/#respond</comments>
		
		<dc:creator><![CDATA[Pierre]]></dc:creator>
		<pubDate>Fri, 21 Jun 2013 06:08:14 +0000</pubDate>
				<category><![CDATA[Conception UX/UI produit]]></category>
		<category><![CDATA[Conseil stratégie et innovation]]></category>
		<category><![CDATA[Ergonomie]]></category>
		<category><![CDATA[Missions réalisées]]></category>
		<category><![CDATA[aéroportuaire]]></category>
		<category><![CDATA[application grand public]]></category>
		<category><![CDATA[application métier]]></category>
		<category><![CDATA[biométrie]]></category>
		<category><![CDATA[multitouch]]></category>
		<category><![CDATA[parcours client]]></category>
		<category><![CDATA[parcours usager]]></category>
		<category><![CDATA[transport]]></category>
		<guid isPermaLink="false">http://www.pierre-lannes.fr/?post_type=portfolio_page&#038;p=16951</guid>

					<description><![CDATA[2013 Design UX des interfaces utilisateur des applications métier et display usagers&#160;d&#8217;un checkpoint sécurité biométrique aéroportuaire, Prototype présenté au Salon du Bourget Utilisateurs finaux Méthode et réalisations]]></description>
										<content:encoded><![CDATA[
<p><strong>2013 Design UX </strong>des<strong> interfaces utilisateur </strong>des<strong> applications métier </strong>et<strong> display usagers&nbsp;</strong>d&rsquo;un <strong>checkpoint sécurité biométrique</strong> <strong>aéroportuaire</strong>, </p>



<p><strong>Prototype </strong>présenté au <strong>Salon du Bourget</strong></p>



<h2 class="wp-block-heading">Utilisateurs finaux</h2>



<ul class="wp-block-list">
<li><strong>Opérateurs métiers</strong> des contrôles sécurité disposant de nouveaux équipements de contrôle des passagers et de leurs effets personnels&nbsp;: applications sur écrans tactiles</li>



<li><strong>Usagers PAX passagers</strong>, <strong>personnel navigant</strong> et autres <strong>métiers</strong> des contrôles de sécurité (accompagnement, guidage, identification…) avec de nouveaux dispositifs d’identification biométrique&nbsp;: reconnaissance faciale, rétinienne, empreintes digitales</li>
</ul>



<h2 class="wp-block-heading">Méthode et réalisations</h2>



<ul class="wp-block-list">
<li>Etude de l’existant (utilisateurs, produit), benchmark de solutions</li>



<li>Idéation (brainstorming, ateliers d’idéation) et définition de l’architecture de l’information, design d’interfaces utilisateurs et d’ interactions</li>



<li>Prototypage des applications en HTML via le progiciel Axure RP Pro</li>



<li>Direction de la production visuelle et graphique (design graphique, intégration CSS/HTML)</li>



<li>Itérations utilisateur&nbsp;: tests utilisateurs individuels, ateliers utilisateur</li>



<li>Réalisation et rédaction de la charte ergonomique et graphique des interfaces utilisateur, contenant les maquettes graphiques et les spécifications ergonomiques générales</li>
</ul>



<div style="height:47px" aria-hidden="true" class="wp-block-spacer"></div>



<figure class="wp-block-image aligncenter size-full"><img alt="" loading="lazy" decoding="async" width="1260" height="1269" src="https://www.pierre-lannes.fr/wp-content/uploads/2023/12/morphopass.jpeg" alt="" class="wp-image-53556" srcset="https://www.pierre-lannes.fr/wp-content/uploads/2023/12/morphopass.jpeg 1260w, https://www.pierre-lannes.fr/wp-content/uploads/2023/12/morphopass-298x300.jpeg 298w, https://www.pierre-lannes.fr/wp-content/uploads/2023/12/morphopass-1017x1024.jpeg 1017w, https://www.pierre-lannes.fr/wp-content/uploads/2023/12/morphopass-150x150.jpeg 150w, https://www.pierre-lannes.fr/wp-content/uploads/2023/12/morphopass-768x773.jpeg 768w" sizes="auto, (max-width: 1260px) 100vw, 1260px" /><figcaption class="wp-element-caption"><em> Prototype du checkpoint lors du Salon du Bourget 2013</em></figcaption></figure>
]]></content:encoded>
					
					<wfw:commentRss>https://www.pierre-lannes.fr/ux-ui-controle-surete-biometrique/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
	</channel>
</rss>
