Concevoir : Recette "Bonne Année 2014"

Voici la petite recette que je vous propose pour cette année qui commence :

1. Prenez quelques fous rires en famille, ajoutez y de bons moments entre amis et une pincée de bonne humeur, mélangez le tout et réservez dans un grand saladier "vie privée".
2. Munissez vous d'un calendrier 2014, positionnez sur celui-ci vos grandes étapes professionnelles.
   Puis collectez les sujets qui vous font vibrer et les domaines dans lesquels vous prendrez le plus de plaisir à travailler.
   Ajoutez le tout dans un bol "vie professionnelle" avec quelques pincées de "bon vivre aux travail" et "échanges sympas entre collègues"
3. Récupérer un stock de "Santé", et quelques moments sportifs... 
4. Il ne vous reste qu'à préparer les décoctions avec les proportions qui vous conviennent pour profiter de 2014

MEILLEURS VŒUX A VOUS ET AUX PERSONNES QUI VOUS SONT CHÈRES !

Concevoir : La transformation numérique...

Je profite de ce bel EDITO de @cxpoeilexpert où Claire LEROY aborde le sujet de l'indispensable transformation numérique des entreprises pour reprendre la plume.

Par le biais des nouvelles technologies que sont notamment le cloud, le big data et les applications mobiles, Claire LEROY explique le changement de paradigme qui s'opère dans nos entreprises.

En effet, les différents services qui composent nos organisations ont désormais les yeux rivés sur leurs propres clients et tentent de répondre aux mieux à leur attente en se projetant à leur place :

• La DSI doit traiter de la tendance BYOD (Bring Your Own Device) et permettre une grande mobilité à ses collaborateurs tout en maîtrisant la sécurité du Système d'Information. 
• Le Marketing, lui, s'outille pour identifier au mieux les pratiques de ses clients. La "Customer Experience" permet d'analyser les actes clients au sein des différents canaux de vente pour en déterminer des pistes d'optimisations possibles. Combiné aux technologies de traitement des données (Data Mining, Analyse de sentiment, Data vizualisation, ...), l'analyse des comportements clients permet de fournir aux équipes Marketing des tableaux de bords détaillés sur les taux de conversions et les raisons d'abandon. 
• Les équipes R&D repensent leur façon de travailler. Tout en adoptant majoritairement l'agilité, elle se tourne vers l'utilisateur final, en se focalisant sur la conception et mise à disposition rapide d'un produit minimal à Forte Valeur Ajoutée pour le client (Minimum Valuable Product). Pour cela, on part de ce que l'on nomme la "user experience", ou plus simplement, quels sont les cas d'usages de mes utilisateurs et, parmi ceux-ci, lesquels sont les plus porteurs de valeurs.
  Dans le même temps, le courant de pensée DevOps prolonge les méthodes Agile des équipes de développement vers ceux de l'exploitation, avec comme letmotiv, de fournir régulièrement en production de nouvelles versions d’applications, qui suivent au plus près l’évolution des besoins du métier et de l'organisation.

En parallèle de la modification de la façon de penser de l'entreprise, se développe la changement de la manière de faire. Les technologies tel que la Réalité Augmenté, la Géolocalisation et la multiplication des objets connectés ouvrent de nouvelles voies au commerce. Les séquences des films d'anticipation de ces dernières années sont aujourd'hui bien réelles, et le jour où vous serez guidés par vos lunettes connectées, au sein des rayons de votre supermarché, pour acheter le bien que vous avez préalablement mis en situation, en réalité augmentée, dans votre salon n'est plus si loin...

D'une manière générale, l'ensemble des réflexions, autour de cette digitalisation des usages, est tourné vers la conception et la mise à disposition de nouveaux services aux clients et prospects.

On ne pense plus Produit mais Service !

Dans le prolongement de ces mutations, c'est tout le modèle managérial qui est revisité par le courant de "libéralisation" des entreprises : remise à plat des organisations, partage égalitaire de valeurs, suppression des signes de pouvoir, ... 

En 2014, un seul slogan : "Move 2 Digital !"

Concevoir : éco-conception et informatique : est-ce compatible ?

En 2010, Facebook possédait 30 000 serveurs et consommait la bagatelle de 100 Millions de KWh par an, soit l'équivalent de la consommation annuelle électrique de 43 millions de malgaches ! Bien sûr il faut ramener cela à l'échelle des 400 milliards de pages servies chaque mois mais cela représente tout de même une sacrée facture ! En développant un système de compilation PHP (HipHop PHP), Facebook a dégagé une économie annuel de 60.000 tonnes de CO2, soit plus de 8 millions de dollars par an.

La consommation électrique en 2011 de Google s’est élevée à 2 675 898 MWh, soit 1,3% de la consommation mondiale des Datacenters. Le 09 octobre dernier, Google a convié une poignée d’institutions à une réunion sur le thème de « la contribution du numérique à la transition énergétique ». L'idée principale de cette évènement : mettre en avant les actions de la firme pour minimiser son impact environnemental et plus précisément expliciter les démarches décrites sur leur site : http://www.google.com/green/
Selon Google, faire du Green IT n’a pas contribué à augmenter les dépenses, bien au contraire : l’ensemble des mesures mises en œuvre aurait permis de baisser la facture électrique de l’ordre d’un milliard de dollars
Source : http://www.greenit.fr

Malheureusement la consommation n'est pas la seule responsable, il faut aussi regarder du côté de l'"informatique inutile". D'après une étude du Standish Group : 64 % des logiciels déployés ne sont jamais, voire très peu, utilisés. Le côut de ces Obésiciels : plus de 100 000 dollars par an. (Source : http://www.indexel.net/actualites/obesiciels-un-cout-de-plus-de-100-000-dollars-par-an-3692.html)

Si ça vous fait vibrer, résonner et donc raisonner... faites moi signe et contribuer avec moi : ecologiciel.blogspot.com

Concevoir : PHP de plus en plus plébiscité en entreprise !

Comme le prouve l'étude réaliser par la société Zend sur le dernier trimestre 2011, nommé Zend Developper Pulse, l'utilisation de PHP en entreprise est en pleine progression et la tendance pour 2012 est encore plus encourageante.

Il faut certes relativiser cette étude en fonction du panel choisi, 3335 entreprises de toutes tailles et certainement pas totalement étranger au développement PHP, mais cela permet tout de même de dégager des statistiques et des tendances pour le moins intéressantes. 

Et en plus c'est bien présenté et pensé pour la diffusion partielle (tous les graphes peuvent être téléchargés indépendamment : BRAVO Zend Technologies !

Je ne vais pas reprendre toutes l'étude, je vous laisse le soin de la lire mais j'en retiens tout de même quelques graphiques et surtout la conclusion.

Temps passé au développement PHP

Ce graphique met en évidence une importante mise en oeuvre du langage PHP.

Ce qui est confirmé par les statistiques d'indeed.com avec une forte croissance des demandes concernant des profils PHP.

Marché du travail - tendances

Java toujours présent...

Les histogrammes ci-dessous montre encore un fort attrait pour le Java, mais surtout une utilisation en masse du javascript. Cela s'explique en partie avec la pratique importante de PHP, car il est rare d'utiliser Java et PHP alors que Javascript est un complément courant (même s'il ne respecte pas les règles d'accessibilité mais c'est un autre sujet ;))

Une forte tendance à l'Open Source

Cette étude met aussi en avant les résultats d'une enquête de Forrester Research (un peu plus ancienne puisque 3ème trimestre 2010), qui place les technologies Open Source sur le devant de la scène.

Génération Y ?

L'enquête ne dit pas l'âge des votants mais on peut voir sur ce graphique que les préoccupations pour l'année à venir ne sont que très peu liées au travail...

"Un esprit sain dans un corps sain" me semble une bonne philosophie pour être performant dans l'entreprise !

Conclusion

Je vous laisse lire de vous même la conclusion de l'étude mais en résumé Zend Technologies dessine des tendances liées à la mobilité, au cloud et aux réseaux sociaux (ah bon ;))

Concevoir : Un jeu pour découvrir SCRUM...

Une très bonne initiative à mon sens, la formalisation de règles d'un jeu basé sur les célèbres légo qui permet la vulgarisation et l'apprentissage de la méthode SCRUM.
A savoir que les règles sont en cours de traduction et qu'il peut être adapté à d'autres méthodes agile.

http://agileee.org/wp-content/uploads/2011/12/Scrum-Simulation-with-LEGO-Bricks-v2.0.pdf

Concevoir : Les licences Open Source

Avant propos: Ce billet est la copie complète d'un article rédigé, par un Collaborateur HARDIS, pour apporter des réponses concrètes à un ensemble de problématiques. Si un point vous paraît obscur, si vous pensez qu'une erreur s'est glissée, qu'un point mériterait d'être complété, vous pouvez le signaler à l'auteur Frédéric DISS : man.publication'at'yogamaven.com

Introduction: les bonnes pratiques de l'Open Source

Le DSI qui réalise ou recourt à des développements informatiques comprenant des briques ou composants issus de logiciels libres doit :

• veiller au respect des conditions de licences spécifiques à chaque logiciel libre (redistribution du code, citation du nom et des droits des auteurs, etc.), à défaut de quoi elle expose l’entreprise au paiement de dommages et intérêts au profit de l’auteur et à l’interdiction de poursuivre l’utilisation du logiciel ;
• anticiper l’interopérabilité des différentes solutions open source entre elles ;
• gérer la réparation des anomalies/bugs.

Fort de ce constat, il est plus que jamais recommandé aux entreprises de mettre en place une politique open source permettant :

• s’agissant des développements internes, d’identifier, contrôler l’emploi de composants open source et vérifier les dispositions contenues dans les licences dont ils relèvent (Apache, BSD, CPL, GNU GPL…) ;
• s’agissant des développements externes, d’obtenir du prestataire une garantie d’éviction, afin d’être assuré que l’usage du logiciel développé n’entrera pas en conflit avec une licence open source.

Cette politique open source, pourra alors s’inscrire dans le cadre d’un audit interne plus global du parc logiciels de l’entreprise aux fins de s’assurer du respect de l’ensemble des conditions de licence et, le cas échéant, initier les régularisations nécessaires.source file pdf

Il est donc utile de connaitre les principales Licences Open Source. Mais nous verrons que ces dernières sont insuffisantes si l'on souhaite protéger efficacement un logiciel. Le nom de ce dernier peut également faire l'objet d'une protection à part entière.

Concevoir : Ressources pour un site Adaptatif (Responsive Design)

Tout pleins de ressources (images, vidéos et slideshows) pour réaliser un site au design adaptatif !

http://blog.websourcing.fr/webdesign-express-responsive-slideshow-image-video/

Concevoir : un Carrousel avec Ext JS

Au détour de mes lectures Webistiques, je suis tombé sur ce tutoriel pour la mise en place d'un carrousel avec la librairie de Sencha (voir ma précédente présentation).

C'est bien écrit et le rendu est sympa alors je ne peux que vous en conseiller la lecture sur BlogNT.

Concevoir : Tester le rendu de vos design adaptatif

Matt Kersley, designer web, propose une page permettant de visualiser rapidement le rendu de votre site à différentes résolutions.
Simple et pratique : http://mattkersley.com/responsive/

Concevoir : Les besoins changent tout le temps...

Qui n'a pas déjà entendu cela de la part de ses développeurs ?
Personne car la fluctuation des besoins d'un client fait partie intégrante d'un projet de développement.

Une fois ce constat fait, il y a plusieurs façons de réagir :

• Fataliste : on ne peut rien y faire donc on va se protéger. On réalise la conception et on fait signer le client sur cette base. Ensuite on prévoit les mécanismes pour limiter au maximum les changements : avenants, surfacturation, ...
• Arrangeante : on accepte les moindres demandes du client. C'est vrai cela va lui faire plaisir... dans un premier temps ! Le résultat cependant certainement moins car soit vous livrerez en retard (ce qui implique aussi que vous aurez dépassé les charges : qui paie ?), soit vous livrerez une solution qui ne sera pas d'une qualité irréprochable (vos développeurs auront modifiés à la marge, surchargés à la hâte, non documentés, ...)
• Agile : On se met d'accord sur les attentes fonctionnelles et on ajuste au fur et à mesure les besoins.

Vous allez me dire : "C'est bien sûr l'approche Agile qui paraît la plus pertinente !". Et vous avez, à mon sens, tout à fait raison !

Car les besoins ne peuvent être réellement figés...
Les causes de cette incapacité à définir clairement la cible sont multiples :

• méconnaissances du client des possibilités qui lui sont offertes
• difficulté du fournisseur à estimer le coût de la réalisation
• la valeur ajoutée d'une fonctionnalité n'est réellement quantifiée qu'une fois celle-ci utilisée

Mais alors pourquoi les méthodes Agiles ne sont pas (ou peu) mises en oeuvre ?
Pour de nombreuses raisons :

• elles nécessitent une implication "quasi" quotidienne du client, dans l'idéal le client doit être représenté au sein de l'équipe
• elles impliquent une visibilité limitée sur le coût de la solution : même s'il s'avère que, dans 99% des cas, le coût final est moindre pour le client
• elles provoquent une sensation de non maîtrise du résultat final pour le client : alors que l'on va s'adapter tout au long du projet à ces attentes...

La solution que je préconise actuellement, au sein de Logi-Tech Informatique, et mets en oeuvre chez mes clients, est de prendre appui sur les principes fondateurs de l'agilité (voir le Manifeste Agile) et de ménager dans un premier temps les impacts du changement dans leur structure.
Sans parler d'Agilité, je leur présente les avantages inhérents à ces pratiques, notamment l'adéquation optimale aux besoins, et leur propose de réfléchir ensemble aux "efforts" qui leurs semblent envisageables en interne pour aller dans cette voie.

De cette manière, je définis d'un commun accord les principales métriques (fréquences des réunions fonctionnelles, fréquences de livraison, ...) de mon projet Agile et remporte l'adhésion du client à cette démarche.

Amenez calmement vos clients vers l'Agilité, prouvez leurs ses bienfaits et le cycle en V sera vite oublié !

Concevoir : L'adaptabilité des vidéos

Vous voulez que vos vidéos YouTube, Dailymotion, Vimeo, etc. s’adaptent à la taille de la fenêtre de l'utilisateur.
Pour cela, utilisez FitVids.js : un plugin jQuery qui permet une largeur adaptative.

Encore du RWD (Responsive Web Design) !

Concevoir : L'adaptabilité grâce à des frameworks...

Aujourd'hui, je vous propose deux frameworks à mettre en oeuvre et à suivre de près... N'hésitez pas à me faire part de vos premières impressions !

• http://lessframework.com/ qui se base sur le concept de Responsive Design
• http://centage.peruste.net/ qui se base sur LESS (une syntaxe structurée pour le CSS) et calcule la mise en page optimale en fonction de l'équipement de lecture.

Concevoir : Ext JS, un framework impressionnant !

Voici un petit billet sur une technologie que nous mettons en œuvre depuis quelques temps chez Logi-Tech Informatique pour présenter des applications légères ergonomiquement efficace et agréable pour nos clients.

Ext JS est une bibliothèque Javascript Open Source (en GPLv3) qui propose de nombreux composants de RIA (Rich Internet Application).
A l’origine c’est une branche de la bibliothèque JavaScript développée par Yahoo! sous l'appellation YUI. Dès sa version 1.0, Jack Slocum, cherche à en faire un produit industrialisé. Ext-JS s'est ainsi rapidement retrouvé au rang des meilleures bibliothèques JavaScript Open Source. Elle est d’ailleurs utilisé par de grands noms comme Adobe, IBM ou encore Sony.

La version 4 vient d'être diffusée en version finale (avril 2011).
Les composants proposés par le framework Ext JS sont nativement hautement paramétrables. Malgré cela, il arrive que nos clients aient des besoins non couverts... aucun soucis, la mise à disposition du code nous permet de réaliser les évolutions nécessaires rapidement.

Avantages :

• Un nombre impressionnant de composants paramétrables à loisir
• Une "facilitation" de la mise en œuvre d'une architecture MVC
• Compatibilité avec les principaux navigateurs du marché
• Des graphiques ne nécessitant pas de plugins
• Une haute adaptabilité à votre charte graphique
• Une interopérabilité avec des références du marché comme Google Maps

Je n'avance pas que ce framework est LA librairie à utiliser mais notre retour d'expérience nous permet de confirmer sa haute valeur ajoutée pour qui souhaite réaliser des outils WEB ergonomiques et graphiquement réussis.
Pour plus d’informations sur les possibilités de la librairie Ext JS 4 : http://www.sencha.com/products/extjs/examples/

Concevoir : Less, moins de CSS pour d'avantage d'efficacité

Une bonne façon de s'obliger à structurer ses développements CSS : http://lesscss.org/

"LESS est un langage de présentation qui étend CSS pour lui apporter ce qu’il manque : productivité, facilité de maintenance et un héritage de propriétés. Il ressuscite quelque peu le fameux CSS Server Side.
À vrai dire, il apporte tout ce qu’il manquait à la réalité du terrain. De la souplesse et une possibilité supplémentaire d’industrialiser les développements d’interface."

Un très bon article de Thomas Parisot sur le sujet : http://www.clever-age.com/veille/blog/less-moins-de-css-pour-davantage-d-efficacite.html

Concevoir : CSS3, un bon site pour trouver de l'inspiration

Vincent De Oliveira nous propose différentes créations en CSS3 avec de bonnes explications.
Un très bon point de départ et de nombreuses inspirations pour le développement CSS3.

Il faut un navigateur compatible...

http://www.css3create.com/

Concevoir : Mockup ? Kesako ?

En informatique, le terme mock-up (qui vient du même mot anglais qui signifie une maquette à l'échelle 1:1) désigne un prototype d'interface utilisateur. Un mock-up a ainsi pour rôle de présenter les idées sur l'utilisation d'un logiciel. (Wikipedia)

Sur ce site vous trouverez une sélection de 18 outils gratuits de création d’interfaces graphiques (et de schémas) pour vos projets. L'auteur donne son impression pour chaque outil testé.

Le mockups qui sort du lot est : Mockflow qui est une application, online ou en application, via une interface Adobe Air, qui permet de maquetter des applications avec différent rendus tel que :

• Facebook
• iPhone
• iPad
• Android

Concevoir : eZ publish sera notre CMS PHP de prédilection !

Suite à une étude réalisé en juillet 2010 (« HARDIS - e-Solutions - Veille - Choix d'une solution CMS Open Source.pdf »), nous avions sélectionné deux CMS (un PHP et un Java) qui répondaient à nos attentes pour un système de gestion de contenu performant et robuste.

eZ publish nous semble être une bonne solution dans un environnement PHP car :

·         il permet une gestion multi-site simple et claire.

·         il propose un nombre important de fonctionnalités en natif. Cela permet de s’affranchir de la tâche fastidieuse d’installation et de paramétrage des plugins et assure lors des montées de version une plus grande robustesse.

·         il possède une interface d’administration conviviale, dissociée de la partie FrontOffice et présente le site sous forme arborescence ce qui permet une navigation rapide.

·         malgré une communauté moins importante, la qualité et la réactivité des développements est très bonne. Le business model de la société eZ n’y est surement pas étranger.

eZpublish est aujourd'hui une solution CMS très aboutie. C'est ce que l'on peut appeler une solution "professionnelle", en comparaison avec d'autres types de CMS, à visée plus communautaire.

Pour Logi-Tech Informatique (Groupe HARDIS), eZ publish est un outil pérenne, avec une adaptabilité extraordinaire aux besoins spécifiques, grâce à une architecture ouverte 100% objet, basée sur le modèle MVC.

Concevoir : L'adaptabilité maximale ou le Responsive Design

La multiplication des médias permettant l'accès à nos sites devient extrême.
Là où, il y a encore 2 ans, on devait traiter le cas de l'affichage d'un site dans 2 résolutions cibles (800x600 et 1024x768), on arrive à un nombre de résolutions possibles quasiment égal au nombre de terminaux (tablette, smartphone, portable, TV, ...).

Si vous avez déjà été confronté aux problématiques d'impression sur des sites Web, vous avez surement, au moins une fois, résolu cette problématique par l'utilisation d'une feuille de style dédiée à l'impression(media="print").
De même, il est envisageable de traiter la multitude de support par du spécifique :

• définition de redirection en fonction du média sur un site dédié = une charge de maintenance importante (même si c'est en partie géré si l'on utilise un CMS)
• chargement d'une feuille de style spécifique au média = autant de CSS que de terminaux, à faire évoluer pour tout nouveau terminal non compatible
• optimisation du site pour les médias de faible résolution = limitation des possibilités en terme d'ergonomie et de contenu

On voit clairement qu'il n'y a pas de solution miracle parmi celles ci-dessus, une réponse à ce manque d'adaptabilité passe par le "Responsive Design". Basé sur les "Fluid Grids", "Fluid Images"  ce concept propose une mise en page adaptative...

A partir de votre Mockup, vous définissez l'unité de base de votre page et toute la mise en page est définie sur la base de cette unité via la définition de taille en ems (si vous avez bataillé avec IE pour le redimenssionnement de texte cela ne doit pas être une unité inconnue ;)).

De cette manière, vos conteneurs (div) sont eux aussi proportionnels à votre contenu, dans l'exemple d'Ethan Marcotte,

on définit :

• corps de texte : 16px (soit 1 em)
• Titre H1 : 1,5em (24px/16px)
• Enumeration : 0,875em (14px/16px)

En traitant les conteneurs à l'identique (#page{max-width.61.75em} soit 988px/16px) on a une taille maximale variable fonction de la taille du texte du navigateur.

Ajouter à cela la nouvelle capacité de CSS3, à savoir les media queries et vous avez un environnement adapté au média qui consulte vos pages au sein d'un même design : That's all folks !


Sources :
http://www.w3.org/TR/css3-mediaqueries/
http://www.alistapart.com/articles/howtosizetextincss/
http://www.alistapart.com/articles/responsive-web-design/
http://www.alistapart.com/articles/fluidgrids/
http://unstoppablerobotninja.com/entry/fluid-images

Concevoir : Fancy Zoom, un script de zoom très réussi !

Pour faciliter la lecture d'une page tout en la rendant plus agréable à lire, nous l'agrémentons d'images en miniature.
Il est alors souvent nécessaire de permettre à l'utilisateur de visualiser ces illustrations en plus grand (voire en taille réelle).

La solution basique est d'insérer un lien href sur l'image, pour ouvrir l'image dans une nouvelle fenêtre. Vous avouerez que, même si c'est efficace, ce n'est pas très sexy. Il faut, de plus, gérer une à une toutes les images de vos sites... fastidieux !

C'est là qu'intervient Fancy Zoom, un script développé par Cabel.name.
Il va vous permettre de créer sur tous les liens pointants vers des images présentes sur votre site, un effet de Zoom du plus bel effet, positionnant l'image sélectionnée au centre de la page en surimpression.

Sa mise en oeuvre est très simple :

• Télécharger le fichier suivant : FancyZoom 1.1.zip
• Déclarer les deux scripts suivants avant la balise de fin de header "/head" :
• < script src="/js-global/FancyZoom.js" type="text/javascript">< /script>
• < script src="/js-global/FancyZoomHTML.js" type="text/javascript">< /script>
• Réaliser l'appel à la méthode d'initialisation du composant setupZoom() au chargement de votre page : onload="setupZoom()"

Voilà, vous pouvez tester !!
Pour les images que vous ne voulez pas zoomer, ajoutez dans votre balise href : rel=”nozoom”

Ce script est offert gracieusement par son auteur, uniquement pour les sites à but non commercial. Rapprochez vous de lui si votre utilisation n'est pas dans ce cadre !

Il existe aussi une version JQuery : http://www.dfc-e.com/metiers/multimedia/opensource/jquery-fancyzoom/