Le blog des équipes…

Il existe 3 types de services mobiles :

-    ”Mobile application” : Application Iphone, Android ou Blackberry
-    ”Mobile compatible site” :
-    ”Mobile website” : site web spécifique

Site compatible avec la téléphonie

1. Compatibilité du code source

Tous nos sites web sont validés W3C, ce qui signifie qu’ils peuvent être affichés sur l’écran d’un téléphone.
Cependant, W3C a aussi un validateur de téléphonie avec plus de règles : http://www.w3.org/Mobile/

Voici les directives que nous pouvons appliquer sur nos sites web pour la compatibilité avec la téléphonie :
- doit être défini sur W3C.
- ne pas utiliser les tableaux dans la mise en page, utiliser les CSS
- utilisation de code XML ou XHTML et d’encodage des caractères UTF-8
- la taille maximale d’une page web pour la téléphonie est de 20 kilobytes

2. Compatibilité du design

Nous pouvons voir comment un site web serait affiché sur un téléphone en utilisant des simulateurs.
Simulateur Google : http://www.google.com/gwt/n (indépendant de la taille de l’écran)
Écran Iphone : http://iphonetester.com/
Écrans Nokia N70 et Sony K750 :
http://emulator.mtld.mobi/emulator.php?webaddress=mobile.lemonde.fr&emulator=nokiaN70&Submit=Submit .

Site web de téléphonie

Un site web de téléphonie est une version légère d’un site web adapté à la téléphonie (petit écran).
Cette version légère consiste en quelques écrans.  Nous devons définir ce que Bysoft proposera dans la version légère des ses produits (Magento, Ez-publish, Drupal).

1. Magento

Il existe un thème pour démarrer avec la téléphonie :
http://www.magentocommerce.com/magento-connect/Magento+Core/extension/303/iphone-theme mais il n’est pas encore à jour sur la dernière version (CE 1.3 max et non-compatible EE)

Si nous développons une version légère, toutes les pages doivent être revues, en conservant le minimum d’informations :
o    Page d’accueil légère
o    Liste de produits (mode liste)
o    Panier
o    Mon compte
o    Recherche
o    Contact
o    Plan du site
o    Procédure de paiement
o    Pages CMS
o    …

Source : http://www.joomlart.com/blog/magento-templates/magento-themes-iphone-support

Coût
•    Du temps est nécessaire pour adapter le thème de téléphonie à la nouvelle version 1.4.
•    Pour la version légère, qui se résume à quelques écrans pour montrer le catalogue et la procédure de paiement. Intégration et développement doivent être définis
•    Si nous devons intégrer un design fait maison, le temps requis pour ce thème sera le même que pour un design fait maison habituel

2. Ez publish

Le moteur de contenu multicanaux (http://ez.no/eZPublish/Core-features/Multichannel-Content-Engine) permet de définir le contenu selon le canal utilisé via une simple interface utilisateur web.

La version légère dépend du nombre de type de contenu, habituellement, un écran pour la liste et un écran pour l’article.
Au minimum :
o    Page d’accueil légère
o    Liste d’actualités
o    Détail des actualités
o    Liste d’événements
o    Détail des événements

Coût
•    Pour la version légère :
o    Intégration : de 0.5 à 1 jour
o    Développement : de 2 à 4 jours
•    Pour un thème fait maison : la moitié du temps d’un thème web original

3. Drupal

Un module  permet de changer le thème si le canal est la téléphonie : http://drupal.org/project/mobile_theme

Il existe des thèmes pour la téléphonie :
o     Un thème “Iphone-like” : http://drupal.org/project/iui ou http://drupal.org/project/iwebkit
o    Un thème de téléphonie vierge : http://drupal.org/project/mobile
o    Un thème Nokia : http://drupal.org/project/nokia_mobile

La version légère dépend du nombre de type de contenu, habituellement, un écran pour la liste et un écran pour l’article.
Au minimum :
o    Page d’accueil légère
o    Liste d’actualités
o    Détail des actualités
o    Liste d’événements
o    Détail des événements

Coût
•    Si nous utilisons un thème de téléphonie existant (“Iphone-like”), il suffit juste d’adapter l’écran selon la configuration de Drupal
•    Si nous devons créer un thème de téléphonie fait maison, il demandera autant de temps qu’un thème habituel Drupal, en partant d’un thème de téléphonie vierge
•    Si nous devons adapter un design fait maison, il nécessitera la moitié du temps d’un thème web original (parties développement et intégration faites)
•    Pour la version légère :
o    Intégration : de 0.5 à 1 jour
o    Développent : de 2 à 4 jours

4. Test

Nous pouvons tester le site web de téléphonie sur un écran de téléphone en utilisant des émulateurs.
Iphone : http://iphonetester.com/
Nokia N70 et Sony K750 : http://emulator.mtld.mobi/emulator.php?webaddress=mobile.lemonde.fr&emulator=nokiaN70&Submit=Submit

Applications de téléphonie existantes pour plateformes

1. Magento

Il est possible de créer une solution de téléphonie sur iphone en définissant le logo et les couleurs.
Puis, l’application est automatiquement crée dans la boutique Apple
http://www.magentocommerce.com/media/videos/magento-mobile

“Quick and easy setup. Magento Mobile installs directly into your existing Magento Admin panel and seamlessly integrates with your existing catalog, CMS, and store configurations.”

Compatibilité
-    Community Edition 1.3 et plus (perso je ne conseillerai qu’à partir de 1.4)
-    Enterprise Edition 1.6 et plus (perso je ne conseillerai qu’à partir de 1.9)
-    Professional Edition 1.8 et plus

Coût
-    L’extension Magento est gratuite
-    La licence iphone (Application key)
o    Offre mensuelle $799 pour la mise en place + $69 par mois
o    Offre annuelle $799 pour la mise en place + $699 pour l’année
-    Pas de développent, pas d’intégration, juste quelques configurations

2. Drupal

Application Iphone :

DRUPAL fournit une interface simple aux développeurs pour contrôler les sites Drupal depuis leurs iPhones
http://crenk.com/drupad-control-your-drupal-powered-site-via-this-iphone-application/

Coût
Prix fixe $4.99

Un bon dessin vaut mieux qu’un long discours…

La phase de Création Graphique est l’une des phases les plus difficiles et les plus déterminantes pour un projet Ecommerce. Beaucoup de critères sont à prendre en compte : marketing, technique, efficacité de la transformation, esthétique (et donc complètement subjectif), ergonomique, « user-friendlique ;-) », etc… Le montage graphique des pages, assuré par le Directeur Artistique de Bysoft, peut ainsi prendre beaucoup de temps pour arriver au bon compromis. Mais on ne met pas à jour une Créa en deux coups de cuillère à pot, à la demande. Cela demande de nombreuses retouches et ajustements pour arriver au bon résultat. Nous avons donc décidé, au sein du Pôle E-Commerce de Bysoft, de préparer au mieux le terrain en limitant au maximum la phase Créative à son rôle premier : la Création.

Le Chef de projet travaille donc en amont avec l’E-commerçant, sur un Storyboard le plus précis possible, qui détermine les blocs présents sur les pages, et permet de discuter, tourner et retourner les blocs simplement, et décider ensemble de leur positionnement. Tout ceci dans le respect des priorités du Marchand, des volontés Marketing, des contraintes techniques de la plateforme Ecommerce, et des préconisations ergonomique et de navigabilité.

Une fois le prototype défini, la « couche de peinture » peut alors être appliquée, et le Directeur Artistique peut se focaliser sur son art, en « oubliant » les longs débats sur l’ergonomie et les nombreuses modifications et « essais » qu’il devait auparavant essuyer. Bien entendu, au fur et à mesure de la phase Créative, des revirements apparaissent forcément, mais la plupart des questions auront déjà été posées en amont et les réponses correspondantes auront déjà été apportées.

Axure permet également de donner un rendu de l’enchainement des pages entre elles, ce qui est important pour le client comme pour l’intégrateur.

Axure

Dessins en « fils de fer »

Dans les premières phases du projet, Axure permet facilement et simplement de créer des pages en « fil de fer » pour définir et valider le « Zoning » du site.

Il s’agit de positionner les blocs au sein des pages et de prioriser leur affichage :

Voici un exemple de page d’accueil :

Un prototype réalisé avec Axure

Masters

Une fois toutes les pages déclinées, le Marchand voudra peut-être modifier quelque chose dans le Haut de page, qui se répète de page en page. Pas de panique, vous n’aurez pas à refaire toutes les pages, Axure intégrant un système de « Masters », c’est-à-dire de blocs pouvant être repris de page en page. En le modifiant une fois, les changements apportés à ce bloc y seront répercutés sur toutes les pages dans lesquelles il apparaît. Plutôt très pratique pour tout ce qui peut se retrouver sur plusieurs pages distinctes (Haut de page, Bas de page, Blocs HTML libres, Listes de produits, etc…).

Animation du prototype : Storyboarding

Axure ne se contente pas de pages statiques. Il est aussi possible d’animer les pages pour créer un prototype complet, simulant la navigation du client. Vous pouvez ainsi créer des liens d’une page à une autre au clic de souris, déclencher des évènements au passage de la souris, animer des menus horizontaux ou verticaux, définir des états pour des panneaux dynamiques, variables en fonction d’évènements prédéfinis, etc… Cela permet de se rapprocher au maximum de la navigation qui sera mise en place sur le site web, et donc d’en donner au marchand la vision la plus fidèle possible, pour éviter les surprises.

Arborescence des pages

Les pages que vous créez via Axure peuvent être classées dans une arborescence à niveaux, pour mieux comprendre le plan du site.

Arborescence des pages

Les pages peuvent être indentées entre elles, et déployées/réduites.

Prototype au format HTML

Un prototype, c’est bien, mais encore faut-il qu’il soit accessible rapidement et simplement par les différents interlocuteurs travaillant sur le projet. Axure permet ainsi de générer automatiquement un prototype au format HTML. Nous mettons alors ce prototype à disposition sur un espace Web pour que le marchand puisse le consulter à tout moment.

Un prototype

Le prototype présente une frame sur la gauche, listant l’arborescence des pages du site et permettant d’y accéder directement. Les éventuels commentaires sur la page apparaissent dans une autre frame, en bas.

Impression PDF des pages du site

Grâce à des utilitaires d’impression PDF, les pages peuvent être imprimées sur Papier pour permettre au Marchand de travailler dessus plus facilement. Le travail collaboratif peut également être partagé sur Axure, pour permettre à plusieurs personnes de modifier le storyboard en même temps, sans conflit.

Illustration avec la Créa

Une fois le prototype terminé, la phase de Création Graphique peut prendre le relais. Une fois les créas validées, nous mettons à jour le storyboard en supprimant les fils de fer et en replaçant sur le storyboard les pages de la créa, tout en conservant la navigation. Cela permet au client de vérifier le fonctionnement en « situation réelle », et surtout à l’équipe d’intégration de bien comprendre la navigation du site pour mettre en place le design sur le moteur de la plateforme.

Ce complément aux spécifications peut s’avérer précieux dans la mise en place du projet, notamment pour détecter les incohérences d’ergonomie et de navigation sur le site.

Spécifications

Axure permet d’ajouter, tout au long du storyboard, des indications, des annotations, des clarifications sur tous les éléments qui le composent. Tous ces éléments, que le Chef de projet aura pris du temps à apporter au storyboard, ne doivent pas être ressaisis dans les documents de spécification. Axure propose un moteur de génération automatique de spécifications. Un clic lance la création d’un document Word comportant toutes les pages, les descriptifs et les interactions mises en place (« au clic sur tel lien, on est envoyé vers telle page », etc…).

Ces spécifications peuvent servir de base pour la rédaction des spécifications complètes du projet, et notamment pour la description complète des pages du site.

Schémas, Workflows et Process

Un bon schéma est bien plus compréhensible et bien plus impactant que des pages de spécifications textuelles. Un diagramme de séquences, des cas d’utilisation, un workflow… Tous ces schémas ou diagrammes permettent de synthétiser l’information et de la rendre claire, accessible et compréhensible dans un minimum de temps, aussi bien pour nos Clients que pour nos équipes de développement, avides de schémas permettant d’identifier tous les cas d’utilisation pouvant se présenter dans la vie du projet.

Axure permet de créer des diagrammes de flux , en choisissant les widgets « Flow » :

Accès au menu Flows

Et en choisissant le type de diagramme « Flow » pour une page donnée :

Choisir son type de diagramme

Les diagrammes se construisent alors très simplement :

Exemple de diagramme réalisé avec Axure

LIVRE BLANC – eZ Publish vs Drupal – Comparatif pour le choix de la meilleure solution

eZ Publish
eZ Publish est un gestionnaire de contenu très évolué. Il a été développé par une entité commerciale, ez System. La force d’ez publish est du à une administration évolué qui contient un grand nombre de fonctionnalité, incluant la gestion du workflow.
Drupal
Drupal est un gestionnaire de contenu développé par une communauté d’internaute.
Grace à cette communauté, il existe aujourd’hui plusieurs centaines de modules qui peuvent s’intégrer facilement au noyau de base de l’application. Cela permet d’ajouter des fonctionnalités sur mesure et obtenir un produit qui s’adapte au besoin du client.

Drupal peut ainsi s’adapter autant à un blog personnel qu’à un site corporate

Différence fonctionnelles de base :
Le noyau de base de Drupal 6.x ne contient que les fonctionnalités basiques, il faut ensuite rajouter tout les modules nécessaires. Environ 18 modules nécessaires pour atteindre le niveau fonctionnel d’Ez publish.
Acquia Drupal propose une version de Drupal avec un certain nombre de module déjà installé ainsi que des thèmes et un support payant

Le comparatif suivant prend en compte tout les modules disponibles dans la communauté Drupal.

Comparatif-eZ Publish-drupal-Livre-Blanc-Bysoft-v1

Modules “Core” de Drupal

Modules “Communautaires” De Drupal

Architecture Evolutive et Flexibilité de la Gestion de Contenu

Joomla et Drupal proposent une approche de la gestion de contenu tout à fait différente.

Joomla propose une approche qui privilégie la facilité d’accès pour le débutant.
Les sites s’organisent principalement en articles, qui sont organisés dans une arborescence à 2 niveaux. Un article est toujours classé dans une catégorie, elle-même classée dans une section.

Drupal, lui, propose une approche plus conforme à celle d’un développeur web, basé sur le concept de  noeud, c’est le concept même du contenu. Un noeud peut être un article, mais aussi être une page statique, un texte de profil utilisateur. C’est un contenu auquel on peut définir un rôle selon son utilité. Exit le système de catégories et sections, c’est celui de taxonomie qui fait place. Cela consiste en le “tagging” d’un noeud avec un mot ou un rôle, ce qui organise le contenu de façon plus sémantique que hiérarchique et offre une flexibilité très importante sur la structure des contenus et leurs interactions.
Une différence notable avec Joomla, c’est le fait que la plupart des modules dépendent d’autres modules, contrairement à Joomla où chacun des composants et module travaillent chacun dans leur coin.

Ainsi Drupal est nettement plus puissant et beaucoup plus souple. Les outils d’organisation de Drupal (Vues, CCK, panneaux) donnent un avantage énorme à Drupal comparé à Joomla! pour traiter des types de données aux structures et traitements différents et les faire évoluer souplement. Vous ne pouvez simplement pas obtenir cette souplesse avec Joomla sur lesquels les développeurs ne peuvent que contourner le modèle de données rigide de Joomla (Section/Categorie/Article) avec très peu de liberté.

Vous pouvez lancer un site très vite avec Joomla, mais très vite aussi les limitations vont se faire sentir et être coûteuse à dépasser. Par exemple, il existe des modules d’annuaire pour Joomla, mais ceux-ci sont difficilement extensibles au-delà de leurs fonctionnalités nominales, ce qui pourra devenir un problème très rapidement pour la pérennité d’applications vouées à évoluer.

Performances

Joomla offre de bonnes performances pour des sites simples.
Drupal dépasse très nettement  les performances de Joomla sur les sites de niveau entreprise (applications plus complexes que le site vitrine) avec très peu d’efforts à faire en optimisation (utilisation du cache voire de la compression gzip).

Quelques chiffres :

• Quand le cache est désactivé :  Joomla! est 44% plus rapide que Drupal
• Lorsque le cache est activé, Drupal est 320% plus rapide que Joomla!

En ce qui concerne la compression GZip, couplée au cache, elle rend Drupal encore un peu plus rapide, tandis qu’elle réduit un peu les performances de Joomla.

Gestion des Droits

La gestion fine des droits d’accès est un élément natif dans Drupal particulièrement bien fait. Dans Joomla par contre, il faut passer par systématiquement par des extensions qui vont contourner le modèle initial limité à « Public », « Membre » et « Special » et être difficile à maintenir sur l’ensemble d’un site plus complexe et en évolution.

Conclusion

Drupal l’emporte pour les sites professionnels exigeants en flexibilité et performances
Joomla! est une bonne solution pour des sites relativement simples qui gère des articles/pages avec une structure relativement figée et des droits d’utilisateurs simples/

Drupal est la meilleure solution quand il s’agit de publier des contenus de structures différentes avec un niveau élevé de flexibilité et de règles d’accès. Il offre également les meilleures performances lors de la mise en œuvre des optimisations (cache, compression gzip, etc…)

Drupal, Solution CMS Open Source récompensée et reconnue au niveau international

Drupal est une solution internationalement reconnue et plusieurs fois récompensée (devant Joomla). En particulier :

• Best Overall Open Source CMS 2008
• Best PHP Open Source CMS 2008
• Best Overall Open Source CMS 2007

Source : http://www.packtpub.com/open-source-cms-award-previous-winners

Sources :
http://tuto.dashcircle.com/index.php/home/3-administration-web/85-petit-comparatif-joomla-contre-drupal
http://www.topnotchthemes.com/blog/090224/drupal-vs-joomla-frank-comparison-ibm-consultant
http://blogs.techworld.com/a-world-without-walls/2009/09/why-we-moved-to-drupal/