acti, agence web lyon

Le Blog

Blend Web Mix 2016 – Le compte rendu de Vân – Jour 2

Par Vân, le vendredi 4 Nov 2016 dans Création de site web

Après la première journée de Blend Web Mix, je me suis concentrée sur les conférences axées sur la technologie et le design.

Voici un résumé de la suite des conférences auxquelles j’ai participé :

 

10- État de l’art de ES2015+ dans Node.js et le navigateur

Animé par Christophe Porteneuve

Cette conférence (très technique) a permis un tour d’horizon des technologies les plus en vogues actuellement (front-end et back-end) : Autour de l’ECMAScript, l’auteur recommande différentes technologies : Babel, Visual Studio CodeElectron, JetBrains, CodePen, JSFiddle, Cloud9, Browserify, Webpack, Rollup, Gulp, Grunt, TypeScript

Voir sa présentation ici 

 

11 – La Culture Google en 6 outils

Animé par Pascal Corpet

Ayant travaillé chez Google, Pascal Corpet nous présente les valeurs et la culture Google à travers ces (bonnes) pratiques internes :

  1. Snippets : logger ses progrès de manière ouverte
  2. CodeSearch : code accessible par tout le monde
  3. Ideas : partager ses idées en interne
  4. Badges : collecter des badges (comme des médailles) sur différentes thématiques
  5. EasyOKRs : publier ses objectifs de manière ouverte
  6. TotT : une tribune technique dans un endroit insolite
  7. http://go/ : des URL courts, lisibles et faciles à mémoriser
  8. Kudos : féliciter ses collègues publiquement
  9. MemeGen : des news internes et externes en memes

Ces pratiques/outils ont pour objectif de faire circuler et adopter les valeurs de Google, dans toutes les strates de l’entreprise : la transparence, la fun theory, l’esprit positif, la bienveillance envers autrui, une volonté d’amélioration continue, la recherche de performance et l’esprit d’initiative.

Voir sa présentation ici

 

12 – Aidez moi à remplir vos formulaires mobile !

Animé par Stéphanie Walter

Super présentation de Stéphanie Walter ! Elle a détaillé une liste de bonnes pratiques à appliquer, et de problèmes à anticiper pour la mise en place de formulaires sur mobile (mais valable finalement également sur desktop).

  • Réduire le nombre de champs peut aider (n’hésitez pas à faire un A/B testing)
  • Mettre des labels clairs, concis au dessus des champs en format portrait, et à gauche en format paysage
  • Ajouter des descriptions pour aider à remplir les champs
  • Attention aux placeholders qui apportent souvent de la confusion
  • Penser à la taille des champs, des boutons et aux retours au touch
  • Utiliser les menus déroulants en derniers recours – Prévenir des erreurs tout au long du remplissage
  • Attention aux messages d’erreur – Tester ! 

Voir sa présentation ici

 

13 – Un site web pour liseuse

Animé par Agnès Haasser

La conférence portait sur la compréhension des contraintes liés à une navigation sur un site web depuis une liseuse : 

  • pas de couleur
  • pas de niveau gris subtile
  • pas de scroll > il faut mettre des paginations partout (logique)
  • pas d’animation
  • pas de SVG …

Créer un site web pour une liseuse : quelle idée ! 😉

 

14 – Designing with protocoles – retour au fondamentaux des relations humaines appliqués à l’UX / CX

Animé par Christophe Cotin Valois

Qu’est-ce qu’un protocole ?

Nous nous conformons tous au quotidien à des protocoles dans notre usage d’outils ou utilisation de services (qui comprennent souvent différents mini-protocoles). Par exemple : retirer de l’argent d’une borne automatique, regarder un DVD, s’inscrire sur un site Internet… 

Les protocoles sont la clé de l’innovation ! 5 règles à retenir :

  1. Identifier & délimiter les protocoles liés à l’usage du service
  2. Optimiser le plus possible pour maintenir l’attention
  3. Penser en flow : séquence modulaire & services responsives
  4. Identifier des technologies capables de réduire les protocoles
  5. Tracker chaque protocole pour obtenir des KPI de retours d’expérience

 

15 – La Data Visualization

 

Conférence de Romain Vuillemot
Conférence de Romain Vuillemot

Animé par Romain Vuillemot

Les données d’aujourd’hui ne sont plus accessibles seulement sur des tableaux de chiffres, ou des graphes simples sous forme de camembert. On peut aller très loin dans le traitement, l’analyse et la visualisation des données. Romain nous a expliqué comment les données peuvent être traitées, présentées, parfois manipulées : exploitation par des non « data scientist », visualisation de schémas de données complexes, mise en place d’infographie ludique…  Quelques outils disponibles pour la visualisation de data : d3js, vega-lite, brunel, NVD3…  

Voir sa présentation ici

 

Merci à Blend Web Mix et à acti pour ces deux jours 100% digital.

Rendez-vous l’année prochaine pour encore plus de nouveauté !

Nounours acti prend son déjeuner au Blend Web Mix 2016
Nounours acti prend son déjeuner au Blend Web Mix 2016
Commenter cet article Voir les commentaires (1)

Blend Web Mix 2016 - Le compte rendu de Vân - Jour 1

Par Vân, le jeudi 3 Nov 2016 dans Création de site web

Organisé par la Cuisine du Web, Blend Web Mix est un évènement autour du digital et devenu un rendez-vous incontournable à Lyon. Pour cette première journée de l’édition 2016, le choix des conférences a été difficile car les thématiques, diverses, étaient toutes intéressantes. J’ai choisi mon programme autour de différents thèmes : le Design, Tech, Blend pour varier les sujets autour du digital.

Je vous propose un tour d’horizon (synthétique) des conférences auxquelles j’ai participé, pour vous donner ou non l’envie d’aller plus loin lorsque les vidéos seront disponibles. C’est parti !

1 – Performances et tiers : combien vous coûte cet emplacement pub ?


Les espaces pub ou les widgets (partage sur les réseaux sociaux) peuvent générer des coûts importants pour une marque.
Jean-Pierre Vincent cite un exemple intéressant : en supprimant les boutons de partage, l’internaute se concentre plus sur le bouton « Ajouter au panier ». Intéressant ! 

Voir sa présentation

2 – Phygital

Animé par Eric Marillet

L’e-commerce a évolué au cours des 10 dernières années. Comment le digital a apporté sa plus-value dans notre monde réel ? Comment les marques ont-elles fait pour s’adapter aux nouveaux comportements des utilisateurs en mode virtuel ? La réponse : Physical + Digital = Phygital. Eric Marillet a cité trois exemples remarquables : Timberland – Tap a tag, Undiz machine, et le showroom de Made.com à Paris.

3 – Mes data sont à moi

Animé par Gaspard Koenig

Très bonne découverte que ce philosophe, qui n’a utilisé aucun support de présentation. L’angle de réflexion philosophique est très intéressant car il permet de prendre du recul sur la thématique de la propriété de nos datas, poussant l’analogie avec la propriété de notre propre corps. Une idée choc : Gaspard Koenig propose d’intégrer la notion de « data » dans le droit d’auteur pour initier de la rémunération dessus.
 
Quelques citations : 
« Le secret des correspondances est dissous par les algorithmes de l’Etat »
« Les conditions d’utilisation de Paypal sont plus longues que la tragédie d’Hamlet »
 

4 – Sketch, le petit soft de design à tout faire de 7 à 77 ans

Animé par Adrien Weil


Nous avons eu un aperçu rapide de ce logiciel simple, peu coûteux (100$) et d’apparence très pratique, une alternative à Photoshop pour la réalisation de maquettes vectorielles. Il propose notamment des exports optimisés, très légers. Pour ma part, je trouve que c’est un bon outil pour produire des wireframes HD plutôt que pour remplacer totalement Photoshop dans le workflow de conception. Pour la création des maquettes, je pense que les designers ne vont pas l’adopter tout de suite.

5 – Découvrez le Design Sprint : UX & Design Thinking façon Google Ventures

 
« Si une image vaut 1000 mots, un prototype vaut 1000 meetings » 
Stéphane Cruchon nous explique une nouvelle méthode de travail pour développer une idée en 5 jours afin de limiter les risques avant de se lancer et de présenter le projet / concept à des sponsors. 

Les étapes :
J1 : découvrir/comprendre
J2 : esquisse
J3 : wireframe
J4 : prototype
J5 : tester, tester, tester
 
Conférence de Stéphane Cruchon
Conférence de Stéphane Cruchon

6. Accessibilité et utilisabilité : astuces d’intégrateurs pour webdesigners

Animé par Véronique Lapierre

Véronique Lapierre nous rappelle les bonnes pratiques à mettre en oeuvre pour faciliter la vie des internautes : le choix des couleurs, la taille / le contraste des textes, le fil d’Ariane, les zones cliquables, les boutons play / pause à mettre sur les carrousels, la navigation au clavier, les libellés des champs à remplir… où l’on s’aperçoit que tout cela n’est finalement que du bons sens. Jetez un oeil aux sources citées dans la présentation pour consulter en détail toutes les bonnes pratiques du web.

Voir sa présentation ici

7. La performance du rendu CSS

Animé par Thomas ZILLIOUX

Le speaker pousse la performance d’un site jusqu’à la transition d’un style en CSS.
A retenir : Ne pas faire de transition ou d’animation CSS avec une autre propriété que : opacity, transform, filter 

Voir les slides

Conférence de Thomas ZILLIOUX
Conférence de Thomas ZILLIOUX

8. Mettez des composants VueJS dans votre application traditionnelle en 15 minutes

Animé par Benjamin Richard


Benjamin Richard présente un exemple de VueJS, utilisé pour la refonte de
euronews.com : c’est une programmation réactive, adaptée pour un système d’évènement. VueJS a des directives à la « angular ». Son message : n’hésitez pas à moderniser vos applis.

9 – « To patch or not to patch »

Animé par Bastien Jaillot


Bastien nous a transmis quelques idées intéressantes : 
– Le code parfait n’existe pas car un code évolue à la même vitesse que l’apparition de nouvelles technologies
– Attention à la refonte “from scratch” qui représente une charge de travail importante, qui peut démotiver une équipe
– Mieux vaut se rendre dispensable qu’indispensable dans les métiers du web
– La théorie de la fenêtre brisée : avec le temps, on s’habitue à vivre avec une fenêtre brisée et ce défaut devient la norme, on ne fait plus d’effort pour améliorer les choses.

Bastien Jailot, co-fondateur JoliCode, l’auteur du livre « La dette technique »

La journée s’est terminée autour d’un échange sur les start-up et des investisseurs, animé par 
Guilhem BertholetJérôme Masurel.
 
A très vite pour la suite de Blend Web Mix !
 
Commenter cet article Voir les commentaires (1)

Pourquoi choisir Drupal ?

Par Damien, le mardi 17 Mai 2016 dans Création de site web

Drupal, ce mot vous dit vaguement quelque chose ? Vous souhaitez en savoir plus ? Ne cherchez plus vous êtes au bon endroit ! Aujourd’hui, l’équipe technique d’acti vulgarise pour vous les rouages d’un outil très utilisé dans de nombreux sites web : Drupal.

Drupal-lego

Les origines

Drupal a vu le jour en 2001, Dries Buytaert, fondateur et développeur du projet qualifie lui-même sa création comme « un assembleur rapide de site web ». Depuis son lancement, Drupal n’a cessé de séduire et de s’améliorer au fil des versions. La plate-forme a même été récompensée de nombreuses fois par le prix du meilleur CMS open source

Le terme CMS « Content Management System » signifie littéralement Système de Gestion de Contenu. Il peut être perçu tel un ensemble d’outils permettant la conception et la mise à jour dynamique de site internet.

L’arrivée de la version 7 en 2010 a été une révolution dans le monde des CMS. Plus simple d’utilisation et plus éclectique, Drupal a connu un essor important depuis cette version. Depuis novembre 2015 et l’arrivée de la version 8 de Drupal qui s’articule maintenant sur le framework Symfony 2 (dont nous vous avions parlé ici) l’engouement pour Drupal ne cesse de croître.

Les avantages de Drupal

Drupal permet de créer des applications web, principalement des sites Internet, mais aussi des intranet/extranet.

Le grand intérêt de Drupal est qu’il permet de réaliser des sites complexes sans avoir à recréer à chaque nouveau projet les fonctionnalités basiques. Cela permet de se concentrer sur d’autres éléments essentiels que sont l’ergonomie, le design et le référencement.

Si l’on compare Drupal à un développement « custom » : Drupal sera la plupart du temps l’option la moins chère et la plus rapide, avec une meilleure capacité de maintenance, si une page ne vous convient plus ou si des modifications ou mises à jour sont nécessaires. 

Les inconvénients de Drupal

La lourdeur : de par sa souplesse et son évolutivité, Drupal peut parfois être gourmand en ressources. Il peut ne pas convenir à certains hébergement low cost.

Apprentissage : la courbe d’apprentissage de Drupal est plus longue que celle de ses concurrents. Ceci est notamment dû à une interface d’administration qui n’est pas reconnue pour son intuitivité.

Complexité : la solution Drupal peut être disproportionnée pour des sites simples de quelques pages par exemple

Une valeur sûre

Voici quelques exemples de sites utilisant Drupal à ce jour (8% des 100 000 sites plus fréquentés au monde en 2015) :

Drupal est-il fait pour mon projet ?

Le choix de la technologie d’un projet ne devrait pas être déterminé par les affinités individuelles des personnes amenées à l’utiliser.

Chaque projet est unique et dispose de fonctionnalités qui lui sont propres. Avant de lancer un projet, vous devez vous poser les bonnes questions : quelle est l’envergure ? Quels sont les besoins métiers (e-commerce, blog, intranet, etc.) ? Mon projet sera-t-il amené à évoluer ?

N’hésitez pas à lire notre article « Créer un site Internet : quels sont les réflexes à avoir » si vous souhaitez en savoir plus sur cette étape préliminaire importante.

Car il n’existe pas de formule miracle pour déterminer si Drupal est un bon choix pour votre projet : cela dépend des nombreuses caractéristiques qui entourent votre projet.

Commenter cet article Voir les commentaires (2)

Rechercher