Design systems : Bench et reco sur les outilsIdean France
Cette liste d’outils permet de donner une bonne vision d’ensemble de ce qui existe aujourd’hui sur le marché. Les outils de design sont en évolution constante et rapide ces dernières années donc il faut s’attendre à beaucoup d’autres nouveautés. Pour en savoir plus, visionnez cette présentation réalisée par Audrey Hacq, Lead Designer chez Backelite
Design Systems : à votre marque, prêts, partez !Idean France
“Design System”, il semble que ce mot soit sur toutes les lèvres en ce moment… Mais qu’est-ce que cela signifie vraiment ? Quels sont les différents types de Design Systems ? Par où commencer et quelles sont les bonnes questions à se poser ?
Par Audrey Hacq, Lead Designer chez Backelite
Et parce que cohérence et productivité ne doivent pas rimer avec uniformisation, découvrez comment bien démarrer vos projets avec un concept créatif. Une présentation de Florian Cordier, Creative Lead chez Backelite : http://bit.ly/2lTCciA
Nous vous partageons cette présentation sur la recette graphique, réalisée par Aurélie Radom, Directrice Artistique / UI Designer chez Backelite. Au programme :
La collaboration entre Designers et Développeurs
- Qu'est-ce qu'une recette graphique ? - petite définition
- Une check-list non exhaustive (à destination des UI / UX / Dev) des éléments à vérifier lors d'une phase de recette, que vous pourrez étoffer / compléter
- Une liste d'outils (extensions web et apps) facilitant la recette du côté des designers et du côté des devs avec des fonctionnalités inspect, détection de typos, couleurs, superposition de maquettes en overlay, screenshots full page etc.
- Les bonnes pratiques avec le process idéal du côté des UI
Retrouvez la présentation de retour d'expérience utilisateurs de la plateforme Simplicité. Qui de mieux pour en parler que des clients satisfaits.
Partie 1 : Présentation de la plateforme Simplicité
Partie 2 : Témoignage de la startup Lofty
Partie 3: Témoignage d'un client grand compte Silca filiale du groupe Crédit-Agricole
Partie 4 : IBM
Design systems : Bench et reco sur les outilsIdean France
Cette liste d’outils permet de donner une bonne vision d’ensemble de ce qui existe aujourd’hui sur le marché. Les outils de design sont en évolution constante et rapide ces dernières années donc il faut s’attendre à beaucoup d’autres nouveautés. Pour en savoir plus, visionnez cette présentation réalisée par Audrey Hacq, Lead Designer chez Backelite
Design Systems : à votre marque, prêts, partez !Idean France
“Design System”, il semble que ce mot soit sur toutes les lèvres en ce moment… Mais qu’est-ce que cela signifie vraiment ? Quels sont les différents types de Design Systems ? Par où commencer et quelles sont les bonnes questions à se poser ?
Par Audrey Hacq, Lead Designer chez Backelite
Et parce que cohérence et productivité ne doivent pas rimer avec uniformisation, découvrez comment bien démarrer vos projets avec un concept créatif. Une présentation de Florian Cordier, Creative Lead chez Backelite : http://bit.ly/2lTCciA
Nous vous partageons cette présentation sur la recette graphique, réalisée par Aurélie Radom, Directrice Artistique / UI Designer chez Backelite. Au programme :
La collaboration entre Designers et Développeurs
- Qu'est-ce qu'une recette graphique ? - petite définition
- Une check-list non exhaustive (à destination des UI / UX / Dev) des éléments à vérifier lors d'une phase de recette, que vous pourrez étoffer / compléter
- Une liste d'outils (extensions web et apps) facilitant la recette du côté des designers et du côté des devs avec des fonctionnalités inspect, détection de typos, couleurs, superposition de maquettes en overlay, screenshots full page etc.
- Les bonnes pratiques avec le process idéal du côté des UI
Retrouvez la présentation de retour d'expérience utilisateurs de la plateforme Simplicité. Qui de mieux pour en parler que des clients satisfaits.
Partie 1 : Présentation de la plateforme Simplicité
Partie 2 : Témoignage de la startup Lofty
Partie 3: Témoignage d'un client grand compte Silca filiale du groupe Crédit-Agricole
Partie 4 : IBM
Angular n'est pas un simple framework mvc, il va plus loin et change fondamentalement notre manière de concevoir des applications web.
De l'avis de ses auteurs Angular est la plateforme qu'aurait été le couple html et JavaScript si ils avaient été créés aujourd'hui. SignalR quand a lui change aussi radicalement la manière de voir l'interaction avec les utilisateurs grace a sa communication bi-directionnelle simplifiée.
Il est intéressant de réunir les deux pour profiter du meilleur des deux mondes, de voir comment des bindings et des évènements se propagent de bout en bout et ainsi avoir un aperçu des applications de demain.
Joseph Glorieux & Mathieu Brun Maintenant que mon delivery pipeline est en pl...matteo mazzeri
On réduit souvent DevOps au déploiement d’outils permettant le provisionning automatique de l’infrastructure et le déploiement rapide de nouvelles fonctionnalités. Cependant, ces nouvelles possibilités, couplées à l’introduction de nouvelles pratiques comme l’IaC, permettent de donner de l’ampleur à notre transformation DevOps.
Mais voilà, après quelques mois, la fréquence des livraisons est en chute libre et la tension entre les équipes s’est accrue : les Ops grognent à cause des 5 derniers déploiements ratés, et les Devs taclent les Ops pour leur ignorance de l’architecture microservice.
Une vague impression de déjà-vu peut-être… Et si nous avions oublié quelque chose…
Dans cette session, nous vous proposons de partager les modèles d’organisation mis en place ou observés ces dernières années au sein des entreprises pour lesquelles nous avons travaillé. Si tout ne s’est pas toujours déroulé comme prévu, ces changements organisationnels restent le catalyseur nécessaire pour faciliter la transformation DevOps et la pérenniser.
Talk sur la "Performance Web : Enjeux, techniques et méthodologie" pour @RennesJS
Rappel du programme :
"Après la découverte de quelques success stories sur la performance web - des éléments pour se convaincre et savoir convaincre de l'importance de la webperf - nous aborderons les techniques élémentaires pour mettre vos pages web au régime (compression, optimisation des images, politique de cache, etc).
Ce sera aussi l'occasion d'aborder HTTP/2 : les bonnes pratiques de performance ne sont peut être plus celles que vous croyez et vos habitudes vont devoir changer, nous verrons pourquoi !
Nous n'oublierons pas d'évoquer les différents indicateurs de performance (speedindex, start render, etc), et il est fort possible que je m'égare à l'occasion sur d'autres outils de qualité front-end, comme la Content Security Policy...
En conclusion, on parlera de budget. Pas celui de la soirée, mais du budget de performance, à appliquer sur vos projets, pour créer une véritable culture de la performance web dans votre équipe !"
Ou comment augmenter la productivité de vos équipes de dev .NET en diminuant leur charge de debugging en prod. Avant de corriger un problème, il est généralement nécessaire de le reproduire. Les études souhaitent des informations contextualisées, la prod ne peut fournir des exports de bases journaliers, et des tensions se créent. Imaginez que vous puissiez obtenir la pile d'appel de l'utilisateur se plaignant... la résolution ne serait-elle pas plus aisée ? C'est ce que vous pouvez faire avec Compuware APM. Grâce aux technologies dynaTrace PurePath™ et PureStack™, il vous est possible de corriger des incidents survenus en prod sans passer par la case reproduction. Pourquoi s’en préoccuper maintenant ? Parce que la complexité des architectures .NET et des environnements Web, mobile, Azure, … est sans cesse croissante. Conséquences, vous subissez : - une perte de visibilité et de contrôle sur les services rendus à l'utilisateur (performance, disponibilité, …) - une multiplication des cellules de crises - une augmentation du temps consacré à rechercher l'origine des incidents en prod. Consacrez enfin votre énergie à développer de nouvelles applis et fonctionnalités ! Session présentée par le partenaire : Compuware.
Speakers : Jérôme Guillaume (Compuware), Antoine Ferte (Compuware)
davask web limited - presentation - françaisdavask web ltd
davask web limted, une agence conseil en développement digital au service de la création de valeur économique des entreprises.
CONCEPTION DIGITALE
conception, création, mise en œuvre et développement technique de vos sites internet et mobiles.
SUPERVISION DIGITALE
Migration et maintenance de vos plate-formes digitales tout au long de l’année.
MISSION
Révéler le potentiel digital des entreprises et des marques pour les aider à atteindre leurs objectifs techniques.
Angular n'est pas un simple framework mvc, il va plus loin et change fondamentalement notre manière de concevoir des applications web. De l'avis de ses auteurs Angular est la plateforme qu'aurait été le couple html et JavaScript si ils avaient été créés aujourd'hui. SignalR quand a lui change aussi radicalement la manière de voir l'interaction avec les utilisateurs grace a sa communication bi-directionnelle simplifiée. Nous vous proposons aujourd'hui de réunir les deux pour profiter du meilleur des deux mondes, de voir comment des bindings et des évènements se propagent de bout en bout et ainsi avoir un aperçu des applications de demain.
Speakers : Rui Carvalho (ArtOfNet)
Présentation Versusmind de la Plateforme Meteor par Arthur Maroulier : Meteor est une série de projets 100% open source intégrés pour créer une plateforme d'application JavaScript complète pour le développement d'applications réactives sur web et mobile.
Self-Service infrastructure pour GCP avec Terraform et GitlabJulien Wittouck
Ce REX présente comment nous utilisons Gitlab, Gitlab-CI et Terraform pour construire une infrastructure GCP en self-service pour nos utilisateurs (squads/projets).
Chez Kiabi, dans le cadre de la migration sur le cloud GCP (depuis l'été 2021), nous mettons à disposition de nos développeurs une project-factory, en self-service, pour de l'infrastructure cloud (VM/Databases/Buckets etc...). Le but est d'accélérer les phases de démarrage des projets, en rendant autonomes au maximum les développeurs sur le provisionning de l'infrastructure essentielle à leurs développements.
Nous allons voir dans ce REX comment nous avons assemblé le module Terraform google-project-factory avec Gitlab et Gitlab-CI pour:
* créer des projets sur GCP pour plusieurs environnements en quelques minutes
* fournir des templates de code Terraform prêts à l'emploi sur Gitlab à nos développeurs
* utiliser des pipelines Gitlab-CI pour exécuter le code Terraform et provisionner l'infrastructure de nos projets
Ce REX est destiné aux développeurs curieux de l'infrastructure as code, quelques notions de Terraform, Gitlab et GCP sont les bienvenues pour bien le comprendre.
Le Big Data en temps réel n’est plus seulement réservée projets à gros budget. En s'appuyant sur Apache Spark, Talend 6 permet aux entreprises de toute taille et de tout secteur d’activité de convertir des Big Data et données issues de l’Internet des Objets en connaissances exploitables immédiatement.
Les exemples d’utilisation d’analytique en temps réel tels que les recommandations personnalisées, la détection des fraudes, les soins préventifs et la tarification prédictive représentent seulement un échantillon des possibilités qui s’offrent aux entreprises ayant accès en temps réel aux informations métier. Cette présentation permet de découvrir les nouvelles capacité de Talend 6 dans ce domaine et aussi de manière plus générale, et aussi comment :
- révéler les données utiles concernant vos produits, clients, et opérations ;
- passer sans efforts au traitement Big Data temps réel et aux applications pour données décisionnelles ;
- capturer et traiter des données issues de l’Internet des Objets facilement pour délivrer des insights rapidement ;
- fournir des données plus sécurisées et fiables grâce à la qualité de données.
Matinale Technologique : création de visualisations dynamiques avec Qlik Sense en live
Avec Qlik Sense, outil d'analyse et de Data Visualisation, découvrez comment construire vos indicateurs à la volée, analyser et accélérer vos prises de décision.
Tous les baromètres révèlent le rôle crucial de la donnée dans la transformation digitale des entreprises, même si la majorité se dit déjà pilotée par la donnée, il leur reste beaucoup d'efforts à faire en termes d'outils et de compétences pour l'être réellement. Parmi les outils incontournables pour une transformation digitale : Qlik Sense, une solution Qlik, leader sur le marché de l'exploration de la donnée et de la Data Visualisation, qui vous permet :
• D’analyser et explorer vos données en suivant le cheminement de vos pensées,
• De développer des visualisations dynamiques et inégalées consultables sur mobile (responsive design),
• De révéler les associations entre vos données (« Smart search »),
• D’ajouter des sources de données à la volée,
• De donner la main aux métiers pour développer leurs dashboard en libre-service.
Start with a Concept and Stop Designing like a MachineIdean France
From idea to execution.
The digital industry is moving fast. Creative people need to be more productive as competition is growing up everyday. While many tasks can be more and more automated, conceptualization remains a powerful, efficient and truly human tool to create strong, memorable and engaging experiences.
A keynote by Florian Cordier, Lead Creative @Backelite.
Because a good concept is nothing if it's not share with the teams, you can check this presentation about Design Systems by Audrey Hacq, Lead Designer @Backelite: http://bit.ly/2MNo1qW
Angular n'est pas un simple framework mvc, il va plus loin et change fondamentalement notre manière de concevoir des applications web.
De l'avis de ses auteurs Angular est la plateforme qu'aurait été le couple html et JavaScript si ils avaient été créés aujourd'hui. SignalR quand a lui change aussi radicalement la manière de voir l'interaction avec les utilisateurs grace a sa communication bi-directionnelle simplifiée.
Il est intéressant de réunir les deux pour profiter du meilleur des deux mondes, de voir comment des bindings et des évènements se propagent de bout en bout et ainsi avoir un aperçu des applications de demain.
Joseph Glorieux & Mathieu Brun Maintenant que mon delivery pipeline est en pl...matteo mazzeri
On réduit souvent DevOps au déploiement d’outils permettant le provisionning automatique de l’infrastructure et le déploiement rapide de nouvelles fonctionnalités. Cependant, ces nouvelles possibilités, couplées à l’introduction de nouvelles pratiques comme l’IaC, permettent de donner de l’ampleur à notre transformation DevOps.
Mais voilà, après quelques mois, la fréquence des livraisons est en chute libre et la tension entre les équipes s’est accrue : les Ops grognent à cause des 5 derniers déploiements ratés, et les Devs taclent les Ops pour leur ignorance de l’architecture microservice.
Une vague impression de déjà-vu peut-être… Et si nous avions oublié quelque chose…
Dans cette session, nous vous proposons de partager les modèles d’organisation mis en place ou observés ces dernières années au sein des entreprises pour lesquelles nous avons travaillé. Si tout ne s’est pas toujours déroulé comme prévu, ces changements organisationnels restent le catalyseur nécessaire pour faciliter la transformation DevOps et la pérenniser.
Talk sur la "Performance Web : Enjeux, techniques et méthodologie" pour @RennesJS
Rappel du programme :
"Après la découverte de quelques success stories sur la performance web - des éléments pour se convaincre et savoir convaincre de l'importance de la webperf - nous aborderons les techniques élémentaires pour mettre vos pages web au régime (compression, optimisation des images, politique de cache, etc).
Ce sera aussi l'occasion d'aborder HTTP/2 : les bonnes pratiques de performance ne sont peut être plus celles que vous croyez et vos habitudes vont devoir changer, nous verrons pourquoi !
Nous n'oublierons pas d'évoquer les différents indicateurs de performance (speedindex, start render, etc), et il est fort possible que je m'égare à l'occasion sur d'autres outils de qualité front-end, comme la Content Security Policy...
En conclusion, on parlera de budget. Pas celui de la soirée, mais du budget de performance, à appliquer sur vos projets, pour créer une véritable culture de la performance web dans votre équipe !"
Ou comment augmenter la productivité de vos équipes de dev .NET en diminuant leur charge de debugging en prod. Avant de corriger un problème, il est généralement nécessaire de le reproduire. Les études souhaitent des informations contextualisées, la prod ne peut fournir des exports de bases journaliers, et des tensions se créent. Imaginez que vous puissiez obtenir la pile d'appel de l'utilisateur se plaignant... la résolution ne serait-elle pas plus aisée ? C'est ce que vous pouvez faire avec Compuware APM. Grâce aux technologies dynaTrace PurePath™ et PureStack™, il vous est possible de corriger des incidents survenus en prod sans passer par la case reproduction. Pourquoi s’en préoccuper maintenant ? Parce que la complexité des architectures .NET et des environnements Web, mobile, Azure, … est sans cesse croissante. Conséquences, vous subissez : - une perte de visibilité et de contrôle sur les services rendus à l'utilisateur (performance, disponibilité, …) - une multiplication des cellules de crises - une augmentation du temps consacré à rechercher l'origine des incidents en prod. Consacrez enfin votre énergie à développer de nouvelles applis et fonctionnalités ! Session présentée par le partenaire : Compuware.
Speakers : Jérôme Guillaume (Compuware), Antoine Ferte (Compuware)
davask web limited - presentation - françaisdavask web ltd
davask web limted, une agence conseil en développement digital au service de la création de valeur économique des entreprises.
CONCEPTION DIGITALE
conception, création, mise en œuvre et développement technique de vos sites internet et mobiles.
SUPERVISION DIGITALE
Migration et maintenance de vos plate-formes digitales tout au long de l’année.
MISSION
Révéler le potentiel digital des entreprises et des marques pour les aider à atteindre leurs objectifs techniques.
Angular n'est pas un simple framework mvc, il va plus loin et change fondamentalement notre manière de concevoir des applications web. De l'avis de ses auteurs Angular est la plateforme qu'aurait été le couple html et JavaScript si ils avaient été créés aujourd'hui. SignalR quand a lui change aussi radicalement la manière de voir l'interaction avec les utilisateurs grace a sa communication bi-directionnelle simplifiée. Nous vous proposons aujourd'hui de réunir les deux pour profiter du meilleur des deux mondes, de voir comment des bindings et des évènements se propagent de bout en bout et ainsi avoir un aperçu des applications de demain.
Speakers : Rui Carvalho (ArtOfNet)
Présentation Versusmind de la Plateforme Meteor par Arthur Maroulier : Meteor est une série de projets 100% open source intégrés pour créer une plateforme d'application JavaScript complète pour le développement d'applications réactives sur web et mobile.
Self-Service infrastructure pour GCP avec Terraform et GitlabJulien Wittouck
Ce REX présente comment nous utilisons Gitlab, Gitlab-CI et Terraform pour construire une infrastructure GCP en self-service pour nos utilisateurs (squads/projets).
Chez Kiabi, dans le cadre de la migration sur le cloud GCP (depuis l'été 2021), nous mettons à disposition de nos développeurs une project-factory, en self-service, pour de l'infrastructure cloud (VM/Databases/Buckets etc...). Le but est d'accélérer les phases de démarrage des projets, en rendant autonomes au maximum les développeurs sur le provisionning de l'infrastructure essentielle à leurs développements.
Nous allons voir dans ce REX comment nous avons assemblé le module Terraform google-project-factory avec Gitlab et Gitlab-CI pour:
* créer des projets sur GCP pour plusieurs environnements en quelques minutes
* fournir des templates de code Terraform prêts à l'emploi sur Gitlab à nos développeurs
* utiliser des pipelines Gitlab-CI pour exécuter le code Terraform et provisionner l'infrastructure de nos projets
Ce REX est destiné aux développeurs curieux de l'infrastructure as code, quelques notions de Terraform, Gitlab et GCP sont les bienvenues pour bien le comprendre.
Le Big Data en temps réel n’est plus seulement réservée projets à gros budget. En s'appuyant sur Apache Spark, Talend 6 permet aux entreprises de toute taille et de tout secteur d’activité de convertir des Big Data et données issues de l’Internet des Objets en connaissances exploitables immédiatement.
Les exemples d’utilisation d’analytique en temps réel tels que les recommandations personnalisées, la détection des fraudes, les soins préventifs et la tarification prédictive représentent seulement un échantillon des possibilités qui s’offrent aux entreprises ayant accès en temps réel aux informations métier. Cette présentation permet de découvrir les nouvelles capacité de Talend 6 dans ce domaine et aussi de manière plus générale, et aussi comment :
- révéler les données utiles concernant vos produits, clients, et opérations ;
- passer sans efforts au traitement Big Data temps réel et aux applications pour données décisionnelles ;
- capturer et traiter des données issues de l’Internet des Objets facilement pour délivrer des insights rapidement ;
- fournir des données plus sécurisées et fiables grâce à la qualité de données.
Matinale Technologique : création de visualisations dynamiques avec Qlik Sense en live
Avec Qlik Sense, outil d'analyse et de Data Visualisation, découvrez comment construire vos indicateurs à la volée, analyser et accélérer vos prises de décision.
Tous les baromètres révèlent le rôle crucial de la donnée dans la transformation digitale des entreprises, même si la majorité se dit déjà pilotée par la donnée, il leur reste beaucoup d'efforts à faire en termes d'outils et de compétences pour l'être réellement. Parmi les outils incontournables pour une transformation digitale : Qlik Sense, une solution Qlik, leader sur le marché de l'exploration de la donnée et de la Data Visualisation, qui vous permet :
• D’analyser et explorer vos données en suivant le cheminement de vos pensées,
• De développer des visualisations dynamiques et inégalées consultables sur mobile (responsive design),
• De révéler les associations entre vos données (« Smart search »),
• D’ajouter des sources de données à la volée,
• De donner la main aux métiers pour développer leurs dashboard en libre-service.
Similaire à Cocoheads react native + redux par Nicolas Fontaine (20)
Start with a Concept and Stop Designing like a MachineIdean France
From idea to execution.
The digital industry is moving fast. Creative people need to be more productive as competition is growing up everyday. While many tasks can be more and more automated, conceptualization remains a powerful, efficient and truly human tool to create strong, memorable and engaging experiences.
A keynote by Florian Cordier, Lead Creative @Backelite.
Because a good concept is nothing if it's not share with the teams, you can check this presentation about Design Systems by Audrey Hacq, Lead Designer @Backelite: http://bit.ly/2MNo1qW
From Business to Buttons by Pierre HarléIdean France
What we've learned after going to the "From Business to Buttons" conference in Stockholm on April 27, 2017 :
- Story first : create products that engage ( Donna Lichaw)
- When UX goes offline ( Katie Dill, Director of Experience Design at Airbnb)
- Evolving design systems for flexibility and scale ( Dawn Ressel, Design strategist at Intuit Design System)
- Engaging with compassion ( Eric Meyer, Web legend and author of "Design for Real Life")
- How to fight fascism (Mike Monteiro, Co-founder and Design Director at Mule Design)
A developer who knows how to design by Audrey HacqIdean France
A balanced and understandable interface must follow certain basic page layout rules. This is the job of the designer, not of the developer.
Yet, in order for a mockup to be put together correctly, (and therefore to avoid long and painful hours of revisions), it is vital that the designer and the developer understand each other and speak the same language.
Read on for our guiding principles that will help developers better understand design.
Introduction et présentation de CocoaPods et ses bonnes pratiques. Tout ce qu’il faut savoir sur son fonctionnement, comment et pourquoi écrire ses propres librairies tierces et bien utiliser cet outil (astuces et bonnes pratiques).
Messages Extensions par Nicolas FontaineIdean France
Les Message Extensions, nouveauté iOS10, quelle valeur ajoutée ? Comment ça marche ? Cette présentation répond à vos questions et vous guide sur la manière de créer / architecturer votre extension en swift.
Un développeur sachant designer par Audrey HacqIdean France
Une interface équilibrée et compréhensible se doit de respecter certaines règles basiques de mise en page. C’est le métier du designer, pas celui du développeur.
Et pourtant, pour qu’une maquette soit correctement intégrée (et pour éviter ainsi à chacun de longues et pénibles heures de recette graphique), il est primordial que le designer et le développeur puissent se comprendre et parler le même langage.
App groups, faire communiquer ses applications {Cocoaheads Montpellier}Idean France
Présentation et live coding - Les apps groups permettent à vos applications de communiquer, d’échanger toutes sortes de données. Une véritable pluvalue pour un écosystème applicatif que vous pourrez appréhender plus sereinement après cette intervention.
FLUPA - UX Days 2016 : "Quand les militaires se prennent au jeu du Design Spr...Idean France
Les UX Days de FLUPA sont l'occasion de revenir sur les sujets UX qui ont marqué l'année. Les 16 & 17 juin, Marie-Amélie Cotillon, Responsable du Studio Créatif chez Backelite, a eu l'occasion de présenter une conférence : "Quand les militaires se prennent au jeu du Design Sprint". Au cours de ce Design Sprint, nous avons eu la chance de travailler avec le personnel des 3 armées pour penser et concevoir un portail ayant pour but de faciliter le départ des militaires en OPEX (Opérations Extérieures). Nous avons réalisé divers ateliers pour trouver la meilleure façon d'optimiser le parcours utilisateur et ainsi simplifier et faciliter l'expérience utilisateur globale. Face au succès rencontré, nous vous proposons de découvrir sa présentation et de vous immerger dans ce projet qui nous a passionnés !
Cocoaheads Montpellier Meetup : La programmation réactive sur iOS avec Réacti...Idean France
Suite au dernier meetup CocoaHeads de Montpellier du 12 mai 2016, retrouvez le compte rendu de la conférence "Programmation réactive sur iOS avec Réactive Cocoa" !
How to design forms that deliver a great user experienceIdean France
Everyone can agree: filling out forms can be painful, boring and long! However, forms allow brands and sites to collect vital information and are often a first or key interaction in a service's interface. With this in mind, it's essential to carefully design forms to make sure you are delivering the best possible user experience!
We've compiled a list of a few best practices that can make forms intuitive and playful, creating a more positive relationship between consumers and brands.
Les Formulaires - Les bonnes pratiques pour une meilleure expérience utilisat...Idean France
Remplir un formulaire, c’est pénible. Tout le monde s’accorde sur ce point. Pourtant, le formulaire permet de collecter des données, d’interagir avec un service, de devenir acteur d’une interface. Il est donc essentiel de soigner vos formulaires pour assurer la meilleure expérience utilisateur possible !
Suivre quelques bonnes pratiques peut rendre un formulaire intuitif et ludique, instaurant ainsi une relation positive entre l’humain et la marque.
Les Formulaires - Les bonnes pratiques pour une meilleure expérience utilisat...
Cocoheads react native + redux par Nicolas Fontaine
1. Backelite – Digital Service Design by Capgemini
React Native
Part 2 : Introduction à Redux
1
2. Backelite – Digital Service Design by Capgemini
Votre intervenants
Nicolas Fontaine
Backelite
iOS & Web developer
2
3. Backelite – Digital Service Design by Capgemini
Sommaire
1. Rappel + Qu’est-ce que redux
2. Principes
3. React + Redux
A. Store et Reducer
B. Connect
C. Action creators
D. Middlewares
4. Démo
5. Standing ovation spontanée du public
3
4. Backelite – Digital Service Design by Capgemini
Rappel
4
React Native permet de développer des
applications natives (iOS, Android…) en
javascript.
On utilise des “components” imbriqués pour
créer notre interface graphique. (Arbre)
On contrôle facilement l’affichage via JS (if,
else, for, map…)
On stylise le tout avec une syntaxe dérivée
du CSS.
On peut utiliser de nombreuses librairies JS
(ex : faire un appel WS)
Il est originaire de Facebook.
5. Backelite – Digital Service Design by Capgemini
Qu’est-ce que Redux ?
5
C’est très simple de créer une petite application de
2-3 écrans…
Mais comment gérer des évènements, la
navigation et des flux de données au travers d’une
application complète.
6. Backelite – Digital Service Design by Capgemini
Qu’est-ce que Redux ?
6
La réponse : Redux
Un conteneur d’état (state), qui permet une grande
homogénéité dans la gestion des flux.
Redux n’est pas restreint à react native
8. Backelite – Digital Service Design by Capgemini
Principes
8
Que votre application soit simple ou complexe, la
totalité des états de votre applications seront
représenté comme un unique objet Javascript.
(dénomination : state ou state tree)
1
9. Backelite – Digital Service Design by Capgemini
Principes
9
Le state tree est redondant, pour le changer :
ancien state + Action = nouveau state
Action = type de l’action + data
2
10. Backelite – Digital Service Design by Capgemini
Principes
10
Le reducer
Une fonction qui a pour but de répondre aux
actions et renvoyer un nouveau state tree par la
suite.
Attention aux fonctions “impures”
3
11. Backelite – Digital Service Design by Capgemini
Principes
11
Le store
C’est lui qui va permettre de dispatcher des actions
vers le reducer et récupérer le state tree.
Méthodes : getState / dispatch / subscribe
4
12. Backelite – Digital Service Design by Capgemini
Principes
12
VIEW
Reducer
Actions
State tree
14. Backelite – Digital Service Design by Capgemini
React + Redux
14
Ex d’implémentation : (le store)
15. Backelite – Digital Service Design by Capgemini
React + Redux
15
Ex d’implémentation : (reducer)
16. Backelite – Digital Service Design by Capgemini
React + Redux
16
Ex d’implémentation : (combiner des reducer)
17. Backelite – Digital Service Design by Capgemini
React + Redux
17
C’est bien beau tout ça mais comment faire ces
fameux dispatch ou recevoir le nouveau state tree
depuis un component ?
19. Backelite – Digital Service Design by Capgemini
Connect
19
Un fonction qui va vous permettre d’encapsuler votre “component” afin
que les propriétés de ce dernier (props) soient mises à jour dès que le
state change !
20. Backelite – Digital Service Design by Capgemini
Connect
20
Et donc ?
● Nouvelles props = render
● Plus besoin d’un state local à chaque component
● Homogénéité des informations aux travers de l’application.
(pour peu que votre store soit bien pensé)
21. Backelite – Digital Service Design by Capgemini
Connect
21
Connect ajoute la fonction dispatch au props de votre component.
Ce component devient donc capable d’envoyer des actions !
23. Backelite – Digital Service Design by Capgemini
Action Creators
23
Donc… on fait tous les traitements dans nos
components et on envois les résultats avec
dispatch ? C’est pas joli joli...
Ca marcherait mais… non
24. Backelite – Digital Service Design by Capgemini
Action Creators
24
Exemple :
25. Backelite – Digital Service Design by Capgemini
Action Creators
25
VIEW
Reducer
Actions
State tree
Action
creators
30. On continue avec React Native ?
Quels sujets vous intéressent ?
● Redux
● Déployez vos applications React.Native (de expo à xcode / android studio)
● Créer un composant React.Native avec du code natif.
● Ajouter du React.Native dans une application existante
● Architecturer un projet React.Native
30