Chez TroisPointZero, nous accompagnons les entreprises dans la sécurisation de leurs outils digitaux, mais nous avons aussi un rôle de sensibilisation. Nos clients sont des parents, soucieux de protéger leurs enfants sur Internet. C’est pourquoi nous partageons aujourd’hui des conseils concrets pour un usage plus sûr du web.

Safer Internet Day : L’importance de la protection des données personnelle

Les jeunes partagent souvent trop facilement leurs informations personnelles en ligne, sans se rendre compte des risques. Nom, adresse, école, numéro de téléphone… Ces données peuvent être utilisées par des personnes mal intentionnées pour du harcèlement, du phishing ou même du vol d’identité.

Un bel exemple avec cette vidéo intitulée “Une campagne choc que tous les parents devraient voir” de l’Association Caméléon qui met en lumière les dangers auxquels les enfants peuvent être exposés en ligne, notamment le cyberharcèlement et les prédateurs. Elle souligne l’importance pour les parents de rester vigilants et de dialoguer avec leurs enfants sur leur utilisation d’Internet.

Une règle simple à retenir : ne jamais publier ce que l’on ne voudrait pas voir affiché sur un panneau public. Les réseaux sociaux, en particulier, encouragent le partage, parfois à outrance. Aidez vos enfants à paramétrer correctement leurs comptes pour limiter l’accès à leurs informations personnelles. Sur Instagram ou TikTok, il est possible de passer en compte privé et de restreindre les interactions aux seuls amis proches.

Les réseaux sociaux : des plateformes attrayantes mais à risques

Les jeunes passent énormément de temps sur Instagram, TikTok et Snapchat. Ces applications sont conçues pour capter leur attention, mais elles présentent aussi de sérieux dangers.

Quelques exemples concrets :

• • Des contenus inappropriés : De nombreux adolescents tombent sur des vidéos violentes, sexuelles ou incitant à des comportements dangereux. TikTok, par exemple, a vu émerger des défis viraux comme le “Blackout Challenge”, mettant en danger la vie des jeunes utilisateurs.
• • Le cyberharcèlement : Snapchat, avec ses messages éphémères, peut faciliter le harcèlement en ligne, rendant difficile la collecte de preuves.
• • La désinformation : Instagram et TikTok sont des vecteurs de fake news, avec des vidéos parfois trompeuses qui influencent l’opinion des plus jeunes.

Que faire pour limiter ces risques ?

• • Vérifiez régulièrement les paramètres de confidentialité.
• • Encouragez un temps d’écran limité et contrôlé.
• • Discutez des contenus qu’ils voient et expliquez-leur comment signaler un problème.
• • Pour apprendre les bons réflexes face aux dangers d’Internet, nous vous invitons à découvrir cette vidéo en famille.

“En tant que professionnel du numérique, je suis évidemment ultra-sensibilisé sur les risques que peuvent représenter Internet et les réseaux sociaux pour les enfants. On a donc mis en place des règles à la fois sur le temps d’écran et sur les applications autorisées via le contrôle parental. Tout en expliquant bien sûr pourquoi ces règles sont mises en place (contenu inadapté, harcèlement, données personnelles) et en autorisant progressivement les accès à mesure que les enfants grandissent.”

Vincent Bouyssou, fondateur de l’entreprise TroisPointZero

L’intelligence artificielle : quand l’illusion devient réalité

Avec les avancées de l’intelligence artificielle (IA), il devient de plus en plus difficile de distinguer le vrai du faux. Aujourd’hui, les jeunes sont exposés à des deepfakes, ces vidéos ultra-réalistes créées par l’IA où des personnes semblent dire ou faire des choses qu’elles n’ont jamais dites ou faites.

Exemples de contenus dangereux liés à l’IA :

• • Deepfakes et vidéos truquées : Certaines vidéos virales peuvent être entièrement générées par l’IA pour tromper les spectateurs.
• • Fausses interactions : Des arnaqueurs utilisent l’IA pour se faire passer pour quelqu’un d’autre et manipuler les jeunes sur les réseaux sociaux.

Comment éviter de tomber dans le piège ?

• • Apprendre à vérifier la source d’une vidéo avant de la partager.
• • Toujours se demander : “Est-ce que cela semble trop beau (ou trop choquant) pour être vrai ?”
• • Ne jamais faire confiance à un inconnu en ligne sans preuve de son identité.

Comment réagir face aux dangers du web ?

Internet est un formidable outil, mais il est indispensable d’enseigner aux jeunes comment s’en servir intelligemment. Face à une situation douteuse, ils doivent savoir vers qui se tourner.

Les bons réflexes :

1. Ne jamais rester seul face à un problème : En cas de doute ou de malaise, parler à un adulte de confiance (parent, professeur, éducateur).
2. Signaler un contenu inapproprié : Les plateformes comme TikTok, Instagram et Snapchat permettent de bloquer et de signaler les abus.
3. Utiliser les ressources officielles pour obtenir de l’aide.

Contacts utiles en cas de problème en ligne :

• • Phishing ou mails frauduleux : transférer le message à phishing@cybermalveillance.gouv.fr
• • SMS frauduleux : signaler gratuitement en envoyant le message au 33700
• • Signalement de contenus inappropriés ou illégaux : https://www.internet-signalement.gouv.fr
• • Harcèlement ou cyberviolence : contacter 3018 (numéro gratuit et confidentiel) ou aller sur https://www.3018.fr

Un Internet plus sûr commence par une bonne éducation numérique

Le Safer Internet Day est l’occasion idéale pour rappeler l’importance de l’éducation numérique. En tant que professionnels du digital, nous avons un rôle à jouer dans la sensibilisation aux dangers du web. Un jeune informé est un jeune mieux protégé.

En appliquant ces conseils et en maintenant un dialogue ouvert avec vos enfants, vous contribuez à faire d’Internet un espace plus sûr pour eux.

L’article Safer Internet day : Protéger les jeunes sur le web est apparu en premier sur TroisPointZéro - Agence digitale sur mesure - Paris, Vichy, Vesoul.

Nota bene : À tous les natalophobes, cet article peut être dangereux pour vous !

1 – Compte à rebours Noël

Bien évidemment, on commence par LA meilleure des applications de Noël… Celle qui te fait un compte à rebours avant Noël. N’est-ce pas la base pour les fans de Noël que de rentrer dans le bureau tous les matins en criant : PLUS QUE 21 JOURS AVANT NOËL !!! Ça t’énerve ? Impossible, personne n’est autorisé à détester Noël ou tout ce qui se rapporte à Noël, y compris ton collègue criard ! Humour, bien sûr, tu as le droit de détester. Mais quand même… C’est très mal vu… Voilà !

Tic tac… plus que 21 jours pour télécharger l’application :

Sur Google, Play c’est ici
Sur Apple c’est ici

2 – Christmas Radio

Elle mérite tellement cette deuxième place. Car après le décompte, il y a l’ambiance ! Votre collègue fan de Noël vous le dira, et Mariah Carey aussi d’ailleurs… Le glaçon a fondu, alors on peut lancer les festivités. Et pour cela, rien de tel qu’une application qui vous propose une radio spéciale pour Noël. Ça reste entre nous… mais je la teste pour vous en ce moment même… la la la, Here comes Santa Claus, la la la

Échauffez-vous la voix :

Sur Google, Play c’est ici 
Sur Apple c’est ici

3 – Christmas Sweeper 3 – Match 3

Pour rester dans l’ambiance, jour après jour, parmi le top 5 des applications de Noël, il y a celle-ci : Christmas Sweeper 3 – Match-3. On a tous connu Candy Crush ? C’est le même principe, sauf que là, on joue avec des petites cloches, des petits cadeaux, des petits pains d’épices et des flocons de neige… Allez j’arrête de jouer, j’ai assez testé !

À vous de jouer :

Sur Google, Play c’est ici
Sur Apple c’est ici

4 – PNP – Père Noël portable

Vous la connaissez peut-être déjà, et peut-être même que vous l’avez déjà utilisée ?! C’est notre cas à nous ! En effet, c’est notre petit péché mignon à cette période. On aime l’idée de ces vidéos personnalisées, où le Père Noël s’adresse personnellement au destinataire. La bonne nouvelle ? Vous pouvez envoyer la vidéo à qui vous voulez. Vos enfants, mais aussi vos collègues et même à votre patron !

Allez, c’est parti :

Sur Google, Play c’est ici
Sur Apple c’est ici

5 – La liste des cadeaux de Noël

Pour terminer ce top 5 des meilleures applications de Noël, on vous propose “La liste des cadeaux de Noël”. Parce que vous avez surement un bloc note au bureau ou un logiciel ou autre pour tenir à jour vos “To Do”. Et bien ici, vous allez pouvoir tenir à jour les achats de Noël pour vos petits loups. Mais aussi pour Jean-Michel, votre collègue adoré, Silviane, votre belle-maman préférée, ou encore Martin, le chien du voisin ! Vous avez peur pour le budget, n’ayez crainte. Vous allez pouvoir gérer sur l’application en assimilant à chacun le petit pactol prévu. Bien sûr, pour Gérard, le collègue criard, vous pouvez vous limiter à 5 euros… Non, 1 euros ! On plaisante pas avec Noël… Allez pour cette fois, ça passe, c’est Noël après tout !

Alors, alors, par qui vous allez commencer ?

Sur Google, Play c’est ici
Sur Apple c’est ici

Nous espérons que ces applications de Noël vous accompagneront jusqu’à la venue du grand homme rouge. Et si vous pensez à d’autres applications, aussi bien, ou même mieux que celles proposées, alors on est tout ouïe !

Si vous souhaitez faire partie de ce top 5 pour l’année prochaine, contactez-nous pour réaliser la meilleure des applications de Noël ! Nous serons ravis de pouvoir vous accompagner, vous guider, vous conseiller. Chaque projet mérite d’être unique, nous sommes là pour le rendre magique…

L’article Applications de Noël – Top 5 de l’année est apparu en premier sur TroisPointZéro - Agence digitale sur mesure - Paris, Vichy, Vesoul.

Un site web pour Noël, du rouge, du vert, du blanc !

Halloween est passé et la magie de Noël s’installe doucement, un peu partout. Dans les boutiques, dans les rues, sur les maisons… alors pourquoi pas sur votre site web. Une belle façon de jouer sur le capital sympathie. Cela montre que vous maintenez votre site et que vous avez souhaité mettre en place un design festif pour l’occasion . Et entre nous… Quoi de plus joyeux que d’arriver sur un site e-commerce aux couleurs de Noël pour faire ses petits achats…

Ça peut être très simple et très rapide.

Un bonnet de Noël sur votre logo, quelques étoiles brillantes sur la home, un menu renommé pour l’occasion, la mise en avant des idées cadeaux… et pourquoi pas, une typographie adaptée ?!

Votre graphiste est parti au ski ? Alors c’est parti, on relève ses manches et on devient créatif. Dafont, Google Font, Pexel, Freepik, Pixabay… Tous ces sites sont à votre disposition. Sinon, vous avez aussi l’IA maintenant, votre meilleure amie alors profitez-en !

PENSEZ AUSSI À VOS RÉSEAUX SOCIAUX !
On le sait tous maintenant, la communication ça passe aussi par là, alors pensez à décorer vos différents réseaux ! Créez une ambiance festive !

Mon cadeau sera là pour Noël ?

En boutique, c’est facile, c’est tangible, on achète, on possède. Mais en ligne, on achète et on attend. Combien de temps ? À Noël, c’est un élément essentiel que de savoir. Alors c’est le bon moment pour mettre en avant vos éléments de réassurance sur le délai de livraison par exemple, ou bien sur les conditions de retour etc.

On vous rappelle qu’un client très satisfait en parle à 3 personnes alors qu’un client mécontent en parle à 12. Bien sûr, vous voulez faire plaisir à tout le monde, mais à Noël, les livraisons sont plus longues alors soyez honnêtes ! Mieux vaut perdre des ventes que des clients…

PENSEZ AUSSI À VOS RÉSEAUX SOCIAUX !
Comme pour la mise en avant de votre graphisme de Noël, pensez aussi à prévenir vos clients via les réseaux. Informez-les de ce que vous avez prévu pour Noël ! Story, réel, publicité, tout ce que vous voulez tant que c’est dit quelque part !

Noël, la période des cadeaux

À Noël, on pense cadeaux, surprises… alors sortez l’artillerie lourde ! Sortez vos offres web de Noël et vos promotions en ligne de fin d’année ! Proposez un emballage cadeau, proposez une réduction supplémentaire… Pour les plus audacieux, osez la landing page événementiel, une page spécifique, réalisée spécialement pour Noël ! Celle-ci pourra proposer un contenu simple aux couleurs de Noël ou bien proposer un contenu plus ludique comme un calendrier de l’avent, un jeu concours spécial Noël…

Et pour prévenir vos clients ?! Très simple ! Vous leur concoctez une newsletter magique qui fait rêver et surtout, qui donne envie de cliquer.

Exceptionnellement, vous pouvez offrir la livraison pour tous les achats avant le 24 décembre par exemple. Un cadeau surprise ou bien autre chose en fonction de votre activité. Tout est possible !

PENSEZ AUSSI À VOS RÉSEAUX SOCIAUX !
Est-ce que ce serait pas le meilleur moment pour contacter quelques influenceurs et leur proposer de parler de vous. Quitte à faire des cadeaux, autant que ce soit pour la bonne cause non ?!

Noël, cadeaux, guirlandes, tous les mots sont bons !

Le référencement, c’est le nerf de la guerre. Dans la vie, vous aurez besoin de deux amis, l’IA, et Google ! Un pour la créativité et l’autre pour rentabiliser l’activité… Trève de plaisanterie, si vous le pouvez, mettez à jour votre site web pour Noël afin qu’il ait des mots clés pertinents et impactants. Cela vous permettra d’être mieux référencé et de faire venir plus facilement les clients qui pourraient être intéressés. Si vous êtes novice en la matière, on vous donne un petit coup de pouce, mais juste parce que c’est Noël !

PENSEZ AUSSI À VOS RÉSEAUX SOCIAUX !
À défaut d’utiliser des mots clés comme on pourrait le faire sur le web, ici, il vous faudra utiliser les bons hashtags de Noël. Astuce : le site Tagsfinder vous offre une liste de # pour vos réseaux.

Si vous souhaitez réaliser un magnifique site web de Noël, contactez-nous ! Nous serons ravis de pouvoir vous accompagner, vous guider, vous conseiller. Chaque projet mérite d’être unique, nous sommes là pour le rendre magique…

L’article Illuminez votre site web pour Noël est apparu en premier sur TroisPointZéro - Agence digitale sur mesure - Paris, Vichy, Vesoul.

« Il était une fois : Alpine, DataOnDemand et TroisPointZéro… »

Comme dans les contes, il y a souvent une bonne fée à l’origine d’une rencontre magique. Ici, la fée s’appelle DataOnDemand (DOD), agence experte de l’acquisition et la fidélisation de clients.

D’un côté, la marque automobile française de renom a besoin de proposer rapidement des sites locaux dans le cadre de son développement international. Alors, de l’autre, DataOnDemand, qui accompagne déjà Alpine Cars sur des campagnes CRM, recherche une équipe très réactive. Une équipe pouvant travailler dans un environnement international, à la hauteur des exigences de qualité et de sécurité de son prestigieux client. Un challenge relevé par TroisPointZéro, comme l’explique Gwendoline Chossat, Directrice Conseil pour DataOnDemand.

« Notre client Alpine Cars a eu besoin très réactivement de créer un site web pour le marché hongrois. Ce n’est pas directement notre cœur de métier. C’est pourquoi nous nous sommes tournés vers l’agence TPZ et son dirigeant… avec lequel nous avions collaboré auparavant… En affichant clairement cette sous-traitance, nous avons également fait le choix d’une totale transparence avec le groupe Alpine Cars. Nous avions donc besoin de nous sentir en confiance et accompagnés par des experts. C’est exactement ce qui s’est passé ! »

Une collaboration Alpine Cars qui démarre sur les chapeaux de roues

Le premier site développé par l’agence digitale TroisPointZéro pour Alpine Cars est le site destiné au marché hongrois. Piloté par les équipes locales, l’expérience de TroisPointZéro dans les projets avec des grands comptes et à l’international permet à l’équipe de s’intégrer rapidement et s’interfacer avec les équipes DataOnDemand, Alpine Hongrie et la DSI du Groupe.

« Les choses ont pu se mettre rapidement en place. Vincent sait parler le même langage que nous. Le lien s’est donc fait immédiatement en plus d’une implication totale dès le début du projet. Nos deux agences, assez similaires dans leurs tailles et valeurs, ont permis de synchroniser une méthode de travail efficace. Par la fluidité de nos échanges, la disponibilité et l’écoute apportée, notre équipe a eu la sensation de travailler avec un collègue et non un prestataire extérieur. »

Une première aventure qui donne naissance à une grande histoire…

À l’image de Alpine Cars Hongrie, ce sont quatre autres pays qui emboitent le pas.

« Après cette première collaboration réussie pour le site hongrois, avec TroisPointZéro, nous avons « templatisé » son armature pour permettre des répliques de site pour d’autres pays : Slovénie, Espagne, Italie et République Tchèque. »

À la suite de la création des sites dédiés par pays, un autre projet. En effet, l’idée est maintenant de réaliser une plateforme pour accompagner un événement de premier plan : Le concours d’excellence mécanique. Ce concours, organisé par Alpine Cars, est un challenge en 3 épreuves dédié à la mécanique automobile. Il récompense le savoir-faire et le savoir-être des jeunes pousses de la discipline. En parallèle, l’équipe de TroisPointZéro se mobilise pour relever son challenge. Celui du temps, de la qualité et de la performance de son code.

 « TroisPointZéro nous a permis également de créer, une nouvelle fois très rapidement, une plateforme d’inscriptions pour un concours d’excellence mécanique. Dernière collaboration en date, la création d’un Hub européen, permettant de gérer la redirection des demandes émanant de pays ne disposant pas encore de site web dédié. »

To be continued…

« À chaque mission, la force de TroisPointZéro réside dans son agilité, sa haute connaissance technique et la proposition de choix toujours judicieux et adaptés. Vincent est également très au fait des réglementations, de la mise en conformité notamment sur la gestion des données. Il nous offre un accompagnement robuste et documenté indispensable, face aux enjeux de vigilance et à l’exigence de nos clients. Une belle collaboration qui ouvre d’autres perspectives sur la durée. »

La collaboration Alpine Cars, DataOnDemand et TroisPointZéro a fait naître des projets gagnants-gagnants mettant en avant des idéaux respectifs. L’excellence, la qualité et la rapidité : des garanties que l’on retrouve chez la marque automobile renommée aussi bien que dans les valeurs des deux agences. Une symbiose exceptionnelle qui aura permis aux passionnés de la marque automobile de pouvoir bénéficier rapidement de supports digitaux à l’international.

Si vous aussi, vous souhaitez vivre une aussi belle aventure digitale, contactez-nous ! Nous serons ravis de pouvoir vous accompagner, vous guider, vous conseiller. Chaque projet mérite d’être unique, nous sommes là pour le rendre magique…

L’article Alpine Cars et TroisPointZéro : un projet web à 200 à l’heure est apparu en premier sur TroisPointZéro - Agence digitale sur mesure - Paris, Vichy, Vesoul.

Cyberattaques et autres joyeusetés…

Quel que soit le moyen utilisé, l’attaque aura pour but de voler, détruire, ou modifier certaines de vos données sensibles, voir la totalité. Parmi les cyberattaques les plus courantes, on note :

• Le phishing : Récupérer des données en se faisant passer pour un organisme que vous connaissez.
• Le déni de service (DoS) : envoi de requêtes qui font saturer le serveur et le rendent inaccessible / création d’une panne générale du service.
• Piratage de compte : Récupérer l’accès à différents comptes via un mot de passe trop fragile et tenter l’élévation en compétence pour accéder aux comptes bancaires de l’entreprise…
• Logiciels malveillants : Sur ordinateur, sur smartphones, ou tout autre matériel lié à votre réseau, des logiciels malveillants peuvent être téléchargés et permettre l’accès à toutes les données.

Il existe bien d’autres possibilités de s’attaquer à une entreprise. Mais alors, comment s’en protéger…

Faites place à la cybersécurité

Dans un premier temps, si l’on doit vous conseiller UNE chose pour améliorer la cybersécurité de votre entreprise, c’est de faire un audit de sécurité informatique. Cela vous permettra de déterminer votre niveau et de repartir avec un plan d’action pour améliorer la situation actuelle.

Dans un second temps, il vous faudra déterminer « les joyaux de votre couronne informatique ». Plus simplement, vous devrez être capable de classifier les données informatiques que vous possédez. Sont-elles d’ordre secret, restreint, ouvert ? En fonction, cela vous permettra d’adapter votre niveau de sécurité.

La BPI propose un accompagnement pour les entreprises qui souhaitent mettre en place des actions. Il s’agit d’un suivi réalisé par des consultants et spécialistes de la cybersécurité.

Quelques conseils pour limiter les attaques

Pour commencer, il faudrait informer tous vos collaborateurs de cette malveillance qui rode dans le monde de l’entreprise. Surtout que dans 80% des cas, l’attaque se produit du fait de l’erreur humaine. Une clé USB infectée reliée à un ordinateur en réseau, un mail de phishing ouvert… Il est important que chacun des membres de vos équipes ait le même niveau d’information. Sachez qu’il existe des formations de préventions pour accompagner vos salariés. Vous trouverez également de nombreuses fiches d’aides sur le site www.cybermalveillance.gouv.fr.

Ensuite, il faut privilégier les authentifications multifonctionnelles. Une façon de renforcer le contrôle des connexions à vos services. La personne qui souhaite accéder à un logiciel/site/compte, doit prouver de plusieurs manières que c’est bien elle.

Pour les entreprises qui possèdent des données classées « secrètes », il est recommandé de mettre en place une stratégie de sauvegarde 321.

• 3 copies d’un même fichier
• 2 supports différents de sauvegarde
• 1 sauvegarde « hors site »

Cette stratégie vous permettra de protéger au mieux vos données en cas d’attaque. Vous pouvez également faire le choix de confier vos sauvegardes à un ou plusieurs prestataires externes.

Vous trouverez également des conseils sur les sites suivantes :

• DGSI – Direction Générale de Sécurité Intérieure
• ANSSI – Agence nationale de la sécurité des systèmes d’information – Guide d’hygiène

Pour conclure, souvenez-vous d’une chose…
Le risque 0 n’existe pas !

Pensez à partager avec nous vos conseils. Qu’avez-vous mis en place de votre côté pour contrer les attaques malveillantes ? Avez-vous déjà été confronté à une attaque ? Quelles sont les actions que vous avez mise en place pour adapter votre cybersécurité ?

L’article Cybersécurité – Comment protéger son entreprise ? est apparu en premier sur TroisPointZéro - Agence digitale sur mesure - Paris, Vichy, Vesoul.

Rencontre avec Nidia SANCHEZ, Public Website Product Owner qui est en charge du site public hsbc.fr. Elle nous parle de la démarche d’évolution continue des systèmes d’HSBC France.

Mettre les dernières technologies au service du client

L’évolution des technologies d’une part, et de l’usage numérique d’autre part, demandent des ajustements, de l’anticipation et l’amélioration continue des solutions digitales. Ceci est nécessaire pour délivrer un service de qualité. La fluidité et la lisibilité des services est d’autant plus importante lorsqu’on s’adresse aux particuliers. Avec la double casquette « marketing et technique », Vincent Bouyssou, fondateur de TroisPointZéro, accompagne les équipes marketing digital de la banque HSBC France depuis 15 ans. Sa mission est de conjuguer les contraintes techniques avec l’ergonomie, l’efficacité des campagnes avec l’évolution de l’environnement digital des services HSBC destinés aux particuliers.

« Je travaille avec Vincent et l’agence TroisPointZéro depuis mon arrivée chez HSBC en 2015. Il est surement l’un des seuls à connaître, maîtriser et donc sécuriser aujourd’hui, tout l’historique de la technologie de notre service. Son savoir-faire et accompagnement sont donc essentiels pour nous. »

Nidia SANCHEZ, Public Website Product Owner | Digital Delivery HSBC France

TroisPointZéro développe des projets web et mobiles pour HSBC grâce à sa maitrise des technologies et des environnements digitaux internes. Ainsi, les projets de refonte ou de restructuration peuvent être menés en parallèle des opérations de maintenance pour un meilleur service aux clients.

Un lab d’innovation digitale externalisé pour conjuguer innovation et réactivité

D’une première collaboration en 2008, Vincent Bouyssou est devenu, au fils des années, un référent technique sur le site public. Désormais, TroisPointZéro intervient comme un laboratoire d’innovation en développant des projets sur les dernières technologies tout en respectant les contraintes de sécurité du secteur bancaire. Ensuite, l’agence accompagne les équipes techniques en interne sur ces technologies pour une prise en main efficiente.

« En tant qu’intervenant extérieur, TroisPointZéro nous garantit une réactivité et facilité d’intervention, avec en plus des solutions innovantes, car son équipe passionnée d’experts IT, est toujours en veille sur ce qui se fait de mieux. »

Nidia SANCHEZ, Public Website Product Owner | Digital Delivery HSBC France

Avec TroisPointZéro, les services d’HSBC peuvent faire appel à une équipe qui maitrise leurs environnements digitaux. Ceci permet de répondre aussi bien aux urgences techniques qu’aux urgences commerciales.

«  TroisPointZéro a notamment réussi, dans un temps et budget réduits, à créer un kiosque digital, en pleine pandémie. Celui-ci nous a permis de mettre en place l’envoi rapide de brochures aux clients, que nous ne pouvions plus voir en rendez-vous physiques.  Des solutions qui intègrent toujours la réalité d’éco-conception, devenue grâce à eux, un standard dans nos solutions digitales. »

Nidia SANCHEZ, Public Website Product Owner | Digital Delivery HSBC France

TroisPointZéro sensibilise ses clients au numérique responsable. En effet, les développements sont réalisés dans une démarche de sensibilisation à l’éco-conception de services numériques. Ce pragmatisme conduit aussi à une sobriété numérique qui limite l’impact environnemental et à une bonne maitrise budgétaire des projets.

« Il faut savoir sortir de l’adage « qui peut le plus, peut le moins ! » et se concentrer sur les besoins et fonctionnalités nécessaires pour chaque projet. Nous accompagnons nos clients vers une sobriété numérique qui a trois intérêts majeurs pour les entreprises : limiter l’impact environnemental des développements numériques, gagner en performance et en rapidité d’affichage et aussi limiter les budgets d’investissement. »

Vincent Bouyssou, Président de TroisPointZéro

La banque, un secteur sensible avec de fortes exigences

Collaborer avec des clients qui évoluent dans des environnements internationaux et des secteurs sensibles, tel que le secteur bancaire, a permis à TroisPointZéro de développer une expertise unique. Celle-ci s’étend jusqu’aux sujets de sécurisation des environnements et des données (RGPD) ou encore de l’accessibilité (RGAA).

« C’est une équipe à taille humaine, qui connaît bien l’exigence d’HSBC et sait répondre parfaitement à nos standards de sécurité très très élevés. Tous les process lourds et obligatoires, quand on gère un projet avec des prestataires externes, sont aussi bien respectés qu’avec de plus grosses entreprises. Plus personnellement, Vincent Bouyssou est un fin pédagogue qui sait parler et aux équipes business ou marketing. Ses qualités humaines, sa patience extrême, ses conseils, sa souplesse et adaptabilité et sa gestion anticipée des plans B ou C, font de lui un partenaire très apprécié par tous, dans une relation de confiance absolue ».

Nidia SANCHEZ, Public Website Product Owner | Digital Delivery HSBC France

La qualité de la relation de TroisPointZéro avec HSBC France a permis à l’agence de développer des compétences qui profitent à tous les clients de TroisPointZéro qu’il s’agisse d’un groupe international, d’une startup ou d’une PME.

Chez TroisPointZéro, chaque client et chaque projet compte, nous avons hâte d’en discuter avec vous !

L’article 10 ans d’innovation digitale sous haute sécurité pour HSBC France est apparu en premier sur TroisPointZéro - Agence digitale sur mesure - Paris, Vichy, Vesoul.

• SPA : Application mono-page.
• SSR : Application dont le rendu est géré côté serveur.
• PWA : Progressiv Web App
• BEX : Extension de navigateur
• Applications mobiles : Android, iOS,… via Cordova ou Capacitor
• Applications de bureau multi plateformes : utilisant Electron

La philosophie de Quasar :

Écrire du code une fois et le déployer simultanément en tant que site Web, application mobile et / ou application Electron.

L’objectif est d’avoir une base de code pour chacun d’eux, qui nous aide à développer une application en un temps record en utilisant une CLI (Interface en ligne de commande). Lorsque vous utiliserez Quasar, vous n’aurez pas besoin de bibliothèques lourdes supplémentaires comme Hammerjs, Momentjs ou Bootstrap. Ces besoins sont couverts en interne et le tout avec un faible encombrement !

Installation

D’abord nous allons installer l’interface en ligne de commande avec l’un des deux gestionnaires de paquets de NodeJS à savoir yarn ou npm.

Installation globale de la CLI :

yarn global add @quasar/cli
npm install -g @quasar/cli

Ensuite placez-vous dans le dossier de votre choix et exécuter la commande suivante afin d’initialiser un projet Quasar.

quasar create <folder_name>

Tout comme la CLI de VueJS, vous allez devoir répondre à plusieurs questions pour configurer le projet. Libre à vous de choisir ce qu’il vous plaira mais voici les choix les plus pertinents pour ma démonstration:

• Pour le preprocessor css: Sass with SCSS syntax ou rien
• Pour la stratégie d’importation des composants Quasar : Auto-import
• Sélectionnez les dépendances que vous souhaitez joindre au projet à l’aide votre barre d’espace puis validez avec la touche “Entrée”.
• Si vous souhaitez créer une application mobile, vous devez ensuite saisir un identifiant unique pour cette application.
• Pour le gestionnaire de paquet, fonctionnez à votre guise également.

Et voilà ! vous êtes prêt à mettre les mains dans le cambouis et commencer à développer votre projet Quasar.

Mon Application Desktop

Pour développer une application Quasar Electron, vous devez ajouter le mode Electron à votre projet en utilisant la CLI et en saisissant la commande suivante :

quasar mode add electron

Remarquez l’apparition du dossier src-electron au sein de votre projet.

Chaque application Electron à deux threads ou fil d’exécution. Le principal thread s’occupe du traitement de la fenêtre OS et de l’initialisation du code. C’est dans ce dossier src-electron que tout cela est géré. Le second thread, du dossier src, traite du contenu réel de notre application.

Si tout est bon, vous pouvez démarrer le développement de votre projet avec la commande suivante:

quasar dev -m electron

A noter : il n’est pas nécessaire d’ajouter le mode electron au préalable, si vous exécutez la commande ci-dessus, ce mode sera automatiquement ajouté.

Remarquez l’ouverture de votre application, avec le contenu par défaut de Quasar. L’inspecteur s’ouvre directement et vous êtes enfin prêt pour commencer à coder.

Bonus : installer tailwindCSS

Et en bonus voici une commande qui vous permettra d’ajouter TailwindCSS à votre projet :

quasar ext add tailwindcss

L’article Comment initialiser un projet d’application desktop avec Quasar ? est apparu en premier sur TroisPointZéro - Agence digitale sur mesure - Paris, Vichy, Vesoul.

Qu’est-ce que Globiflow ?

GlobiFlow, c’est un outil d’automatisation avancé disponible automatiquement lorsque l’on souscrit à un plan Premium sur Podio. Il a été racheté par Citrix il y a quelques années et théoriquement on ne devrait plus le nommer GlobiFlow mais Citrix Podio Worfklow Automation… C’est un détail mais il me semble important de le préciser car chez TPZ nous utilisons toujours son ancien patronyme au lieu du nouveau.

A noter : si Podio est un mot inconnu pour vous, n’hésitez pas à consulter ce billet pour découvrir le potentiel de cet outil avant de poursuivre votre lecture

A quoi sert-il ?

Et bien on l’utilise principalement pour :

• automatiser des actions sur un environnement Podio : telles que la création ou la modification d’items, la création de tâches, le post de commentaires suite à une action donnée, ou encore l’envoi de notification lorsqu’un item Podio atteint ou dépasse une deadline
• configurer des workflows plus ou moins complexes comme générer un devis ou envoyer un email personnalisé à un client à partir des données renseignées dans Podio et selon ses propres règles métier
• générer des rapports statistiques visuels plus poussés que ceux présents dans Podio par défaut

En étant couplé à Podio cet outil permet de couvrir un large champ d’action sur les divers postes d’une société :

• Gestion de projet
• Comptabilité
• Marketing / CRM
• Ressources Humaines
• Suivi de l’activité / Management des opérations

Vous pourrez d’ailleurs trouver divers use cases qui pourront vous donner quelques idées concernant l’optimisation de vos process.

Comment utiliser Globiflow ?

Comme précisé dans les paragraphes du dessus, vous devez premièrement souscrire à un plan Premium sur Podio. Ensuite vous n’aurez qu’à vous rendre sur la page de login de Globiflow qui vous demandera tout d’abord de vous connecter à votre compte Podio (si vous ne l’êtes pas déjà). La liaison entre les deux services s’effectuera automatiquement une fois connecté.

Dashboard

Une fois connecté vous serez redirigés sur une page de ce type : 

Depuis cet écran vous aurez accès : 

• aux logs (1) : très utiles pour contrôler la bonne exécution de vos workflows ou pour avoir des informations sur la source de l’erreur qui empêche un flow de s’exécuter (oui parce que soyons honnête ça arrive) 
• à l’aide (2) : diverses rubriques allant des exemples de workflows à mettre en place à un lien vers l’environnement Podio dédiés aux utilisateurs de Globiflow qui échangent et partagent des tips ou des idées d’évolution
• à votre compte (3) : où vous pourrez ajouter des utilisateurs qui auront le droit d’utiliser votre compte Globiflow et visualiser diverses statistiques sur l’utilisation que vous faîtes de cet outil
• aux organisations Podio auxquelles vous avez accès (4) 
• aux espaces de travail Podio auxquels vous avec accès (5) : certains espaces se distinguent car leur nom est en gras, cela signifie qu’il existe déjà un ou plusieurs flow mis en place sur ces espaces
• à une série de raccourcis (6) : permettant de mettre à jour GlobiFlow avec les dernières modifications effectuées sur votre environnement Podio ou de déplier / replier rapidement les listes d’organisations et d’espaces.

Ensuite ? Et bien c’est à vous de jouer !

Création de flow

Commencez par cliquer sur un de vos espaces de travail et ensuite sur une app qu’il contient et vous serez redirigés sur cet écran :

En cliquant sur le bouton “Add New” vous pourrez alors ajouter un nouveau Flow. Il vous faudra ensuite choisir le “trigger” de votre Flow (création d’un item sur Podio, update d’un item, lorsqu’une certaine date est atteinte…) et vous pourrez ensuite définir :

• les conditions qui doivent être remplies pour que le flow s’exécute (exemple : si le statut “Truc” est égal à X)
• les actions concrètes qui doivent être exécutées par le flow (exemple : ajouter un commentaire sur l’item Podio)

A noter : si vous souhaitez modifier le “trigger” sélectionné, veillez à le faire avant d’avoir renseigné vos “conditions d’exécution” et vos “actions” car tout sera automatiquement réinitialisé.

Enfin le petit lien en bas de page “simulate vars” vous permettra d’effectuer une simulation de l’exécution du flow avec des données issues de Podio. C’est une fonctionnalité très utile surtout sur les flows complexes, elle permet de “pré-tester” son flow avant une exécution live sur Podio.

Je ne vais pas m’étendre plus sur Globiflow. On vient de faire le tour des principaux intérêts de cet outil. Maintenant les cas d’utilisation concrets viendront dans de futurs articles tutos dédiés 🙂

En attendant ces billets, n’hésitez pas à nous laisser un petit témoignage de votre expérience avec Globiflow. Surtout si vous avez déjà eu l’occasion de prendre en main cet outil. Et dans le cas où vous seriez bloqués n’hésitez pas non plus à nous contacter on peut surement vous aider ! 

L’article Automatisation sous Podio avec Globiflow (Podio Workflow Automation) est apparu en premier sur TroisPointZéro - Agence digitale sur mesure - Paris, Vichy, Vesoul.

Depuis quelques temps, React a introduit la notion des Hooks. Il s’agit d’une approche (presque) totalement différente de ce qu’on a pu connaître jusqu’à présent où Redux régnait, et règne encore d’ailleurs. Notamment dans la gestion de notre état et des lifecycles. Et comme beaucoup, j’apprécie fortement cette “nouvelle” façon de faire avec les Hooks. Cela permet d’éviter toute la complexité de Redux mais aussi d’obtenir un code beaucoup plus modulaire.

React Hooks inclus des puissantes primitives, comme useReducer, useState ou encore useContext pour gérer l’état global de notre application React. Alors, est-il inutile de devoir passer par une nouvelle librairie tierce pour gérer notre état ?

LES PROBLÈMES QUE JE RENCONTRE SANS LIBRAIRIE TIERCE

Instinctivement, la réponse à la question précédente est oui, et c’est vrai. Cependant, on peut vite se retrouver dans un “goulot d’étranglement” au fur et à mesure que notre projet gagne en complexité et en fonctionnalités.

En effet, il faut alors une parfaite connaissance des Hooks et s’affranchir d’une rigueur sans pareille pour limiter les dégâts si nous voulons éviter que notre application devienne rapidement une “usine à gaz”. C’est d’autant plus vrai lorsque des bogues apparaissent ! Il est souvent laborieux de les identifier rapidement, bien que React travaille de plus en plus à proposer des outils de débogages particulièrement robustes.

Hélas, par manque de temps et pour améliorer ma productivité, je me suis mis à la recherche d’une solution alternative aux Hooks pour gérer l’état global de mon application react-native. Et ne voulant pas revenir à Redux pour conforter malgré tout l’utilisation des Hooks (bien que Redux ait toujours sa place dans l’écosystème React), je sentais que mon projet justifiait de plus en plus d’adopter définitivement un système d’état plus robuste.

C’est là que j’ai découvert une librairie tierce (encore une) : easy-peasy ! Une fois n’est pas coutume, certains d’entre vous me demanderont pourquoi ne pas refaire confiance à Redux ? Tout simplement car j’avais le désir de découvrir de nouvelles façons de travailler avec React et je voulais perfectionner mon utilisation des nouvelles API Hooks. Donc c’est avant tout pour “me mettre à jour” mais aussi parce que j’aime ce code facilement maintenable que ces nouvelles API proposent.

Dans mes recherches, certaines librairies sortaient également du lot : MobX/Mobx State Tree, Rematch ou encore React Easy State. Toutes ont leurs avantages et leurs inconvénients, chacun aura son avis sur le sujet.

En ce qui me concerne, aucune ne regroupait tout ce dont j’avais besoin en même temps : flux de données unidirectionnel, outils de débogage, extensibilité, peu de configuration, des workflows asynchrones, une API simple à utiliser pour un développement rapide, etc..

POURQUOI EASY PEASY ?

Tout d’abord parce que c’est intuitif ! Il est possible de gérer rapidement (et facilement!) l’état de votre application React. Cette librairie permet de gérer cela avec un minimum de code et surtout avec beaucoup moins de complexité que d’autres outils qu’on a l’habitude d’utiliser, tels que Redux.

Attention, il ne s’agit pas de faire un procès à Redux mais davantage d’entrevoir la possibilité d’accroître sa productivité et de gagner du temps dans un contexte professionnel nous demandant de respecter des délais de livraison précis.

Pour résumer, voici ses forces :

• aucune configuration
• se base sur les nouvelles API Hooks React
• récupération et effets secondaires des données
• conservation de l’état dans la session ou le local storage
• prise en charge étendue de TypeScript
• store global partagé au niveau des composants
• support react-native (je suis développeur react-native !!!)
• un support des outils dév Redux
• et un support du hot reloading

Comme je vous l’ai dit, ce plugin vous permettra de gagner du temps et de vous concentrer essentiellement sur la logique métier de votre application.

Lien vers le paquet officiel : https://github.com/ctrlplusb/easy-peasy

UTILISATION BASIQUE

/!\ Avant de l’utiliser, n’oubliez pas que cette librairie a été construite sur les API Hooks React, et n’est donc disponible qu’en version react & react-dom >= 16.8.0.

Voici les 2 principales étapes à retenir :

1. Définir un modèle avec un Store et des Actions diverses sur ces objets.
2. Importer des actions pour définir des actions personnalisées, qui peuvent être appelées à partir de n’importe quel composant.

Easy-peasy repose sur plusieurs concepts de base :

• Les Stores : qu’il faut créer via createContextStore permettant d’exposer l’état à des parties spécifiques de notre application en les encapsulant dans des contextes provider.
• Les Models : pour définir nos stores. Personnellement, je préfère “splitter” mes modèles en plusieurs fichiers pour une meilleure compréhension architecturale.
• Les Thunks Actions : pour effectuer une action spécifique sur notre modèle, tel que faire une demande à une API. (voyez ça comme un équivalent à redux-saga).
• Les Actions : pour déclarer une action sur notre modèle. Une action est utilisée pour effectuer des changements dans notre store.
• Computed : un concept peu utilisé mais particulièrement utile dans certains cas. Il permet de lier une propriété calculée à votre modèle en fournissant une fonction de calcul qui prendra l’état et renverra une valeur dérivée (ex: calculer la taille d’un tableau). Notez que cet état calculé est accessible comme tout autre état du store.
• useStoreState : à importer dans vos composants. Ce hook permet à vos composants d’accéder à l’état de votre store (voyez ça comme un équivalent à mapStateToProps de connect de react-redux)
• useStoreActions : à importer également dans vos composants. Ce hook permet à vos composants d’accéder aux actions de votre store (voyez ça comme un équivalent à mapDispatchToProps de connect de react-redux)

Pour la partie TUTO, et puisqu’il serait contreproductif de “plagier” le site officiel d’easy-peasy (qui propose une documentation très épurée et parfaitement compréhensible), voici un lien vous permettant de démarrer rapidement avec cette librairie : https://easy-peasy.now.sh/docs/quick-start.html

En tout cas chez TPZ, nous l’avons adopté dans la plupart de nos nouveaux projets react-native et nous en sommes très satisfaits. Voilà, c’est tout ! C’était Easy-Peasy en bref.

L’article Gestion de l’état global dans React Hooks avec Easy Peasy est apparu en premier sur TroisPointZéro - Agence digitale sur mesure - Paris, Vichy, Vesoul.

Storybook est un outil open source qui vous permettra de développer vos composants UI en complète isolation et il est compatible avec la plupart des frameworks front-end (Vue, React, Angular …).

Cette manière de procéder devrait vous permettre de rester focus et organisé lors de la création de vos composants UI.

Storybook s’exécute dans son propre environnement (dans un dossier à part de votre projet, typiquement .storybook). Vous pouvez ainsi créer vos composants UI sans vous préoccuper des dépendances de ceux-ci et vous concentrer uniquement sur leur rendu.

Dans quels cas utiliser Storybook

• Bibliothèque de composants : besoin d’une bibliothèque de composants ? Centralisez tous vos composants en un seul endroit avec la possibilité de les tester en isolation
• Design systems : le design system correspond à un ensemble de composants qui peuvent être utilisé individuellement. Ou bien au contraire assemblez les pour produire des templates pour vos pages 
• Test visuel : Visualisez le rendu de vos composants ainsi que leur comportement
• Travail en équipe : Partagez votre Storybook avec votre équipe en l’exportant au format statique

Ecrire des stories avec Storybook

Storybook repose sur un système de stories. Ainsi chaque composant de votre application aura donc une “story” qui correspond à une fonction censée le retourner à l’écran. Ci-dessous un exemple de story :

import React from 'react';
import { action } from '@storybook/addon-actions';
import Button from './Button';

export default {
  component: Button,
  title: 'Button',
};

export const text = () => <Button onClick={action('clicked')}>Hello Button</Button>;

export const emoji = () => (
  <Button onClick={action('clicked')}>
    <span role="img" aria-label="so cool">
      😀 😎 👍 💯
    </span>
  </Button>
);

Conclusion

Storybook est donc un outil formidable qui vous permettra à la fois de documenter vos projets , construire votre bibliothèque de composants réutilisables et développer des composants en isolation.

Dans cet article nous avons découvert Storybook et dans quel cas il peut nous être utile. Et dans un prochain article nous verrons concrètement comment l’utiliser dans un projet.

L’article Storybook : développement de composants est apparu en premier sur TroisPointZéro - Agence digitale sur mesure - Paris, Vichy, Vesoul.