DBO Design

DBO DESIGN

Content Reactor 3.0

Test de CMS: Grav

Rédigé par dbodesign Aucun commentaire
Classé dans : Webmastering Mots clés : aucun
Grav est un CMS de type "flat-file", sans base de données php-mysql. Récent, simple et léger comme la plupart des CMS de ce type, c'est une proposition tentante pour un nouveau site. Le test: Qu'est ce que Grav ? Historique: "Grav" vient de "gravity", mais n'est pas inspiré du film catastrophe spectaculaire en apesanteur montrant Sandra Bullock et George Clooney et mis en scène par Alfonso Cuarón (2013) d'après ses créateurs. C'est un simple nom de code initial et provisoire qui est resté. Comme l'indique la documentation officielle, le CMS utilise les dernières et meilleures technologies du genre comme:
L'équipe derrière ce CMS n'est pas néophyte: Rocket Theme s'est spécialisée pendant longtemps dans la personnalisation de templates pour Joomla, Magento, et Wordpress, avant de développer un pont ambitieux avec Wordpress, appelé Gantry 5. C'est ce framework qui permet d'ailleurs la construction du CMS Grav. Il est défini comme un CMS "Hybride", "Flat-File" dans le sens où il se sert de php. Les CMS statiques sont en général en html et ont comme triple avantage une faible consommation de ressources serveur et une sécurité quasi parfaite, ainsi qu'une sauvegarde plus simple. Grav utilise notamment des fichiers au format Yml ou en format json pour ses configurations. Le seul inconvénient est une vitesse d’écriture de fichiers plus lente que pour une base de données. Il offre aux développeurs et linuxiens la possibilité d'utiliser le CMS en ligne de commande également. Enfin Grav est un CMS open source et ses déjà nombreux templates et plugins sont également gratuits avec une communauté croissante, la plupart basés sur Bootstrap ce qui est en soit attendu, mais aussi toujours une bonne nouvelle pour plus de flexibilité. Alors souhaitons à ce CMS de se faire une place au soleil dans les années à venir.

Installation de GRAV:

Très simple. Il suffit d'envoyer les fichiers sur le ftp et de se logger sur la page par défaut pour l'installation, en remplissant les quelques données de base: Nom d'utilisateur, nom réel, nom d'admin, mail et mot de passe. Et pour ceux ayant accès aux lignes de commande, en deux lignes de quelques termes c'est fait. Comme la plupart des CMS, Grav fournit une page "démo" à personnaliser ou supprimer. Grav explique que contrairement aux CMS habituels à la courbe d'apprentissage élevée et aux nombreux conflits de plugins, son système se base entièrement sur le contenu, central, avec des "évènements" rapportés. Grav se dit aussi bien user friendly que designer-friendly et developer-friendly. C'est ce que nous allons voir.

Impressions de GRAV CMS

-1er point positif, l'interface rappelle furieusement le fameux template bootstrap, et le choix de themes modernes utilisables est intéressant, plus que pour certains CMS flat file assez pauvres et souvent non-responsives comme zwii et getsimple cms. Le thème de base "antimatter" est déjà en soit assez bien conçu. Remplacer la page de contenu dynamique d'exemple par le template "business" présenté est également assez simple, de même que la création de pages. -Laisser le site en jachère quelques temps m'a permis de tester la mise à jour, et elle est rapide et intuitive quoique moins facile d'usage que celle de wordpress. Il faut ouvrir les plugins un par un chaque fois pour éxécuter la mise à jour. Sur wordpress il suffit de cocher tous les plugins présents, de sélectionner update dans le menu déroulant, et chaque module se met à jour à son tour automatiquement sans quitter le gestionnaire. Il s'agit de point à améliorer dans le futur. -Autre point positif, l'ajout de "médias" se fait directement depuis le menu sous le champ de texte de l'éditeur et fonctionne en glisser-déposer. Reste un point à explorer, dans l'onglet "avancé" de l'éditeur de contenu, tester les fonctionnalités d'override. -Points plus négatifs par contre, il n'y a pas d'autosave (pas de BDD dont pas de scheduler), les codes d'images et de liens ne sont pas forcément intuitifs, et l'éditeur est assez minimaliste (pas de texte justifié par exemple). Maintenant il est presque certain q'un plugin existe ou sortira assez rapidement. J'ai trouvé une pirouette, en travaillant en mode code et en incluant en style en dur qui a fonctionné mais obligé à placer des espacements qui avaient sauté. Tout comme wordpress même en mode "code" les paragraphes (sauts de ligne) sont reconnus comme tels. Il a fallu donc jouer du "BR /", avant de revenir a un système de spans. Il faut savoir que l'éditeur génère son propre code, il faut donc l'apprivoiser. Ex. Un (gras) devient **Texte**, un (Italique) devient _texte_. Une image c'est [![](texte)], un lien c'est juste (texte). C'est assez économique en caractères et participe de la légèreté de l'ensemble tel que promis.

Verdict

Finalement, dans sa forme initiale présente, GRAV est déjà parfait pour un petit site vitrine d'une dizaine de pages, administrable par le client. Parions qu'avec la foule de plugins bientôt disponible des sites plus ambitieux seront possibles. Seul bémol cependant à l'usage, le fameux moteur du back office, Twig est assez verbeux et pas forcément intuitif pour des personnes habituées à Joomla et Wordpress; Pour quelqu'un qui n'a jamais eu de CMS et débute, c'est déjà plus facile, n'ayant rien de préconçu. J'aurai sans doute l'occasion de revenir sur ce CMS très intéressant lors de l'ajout de nouveaux contenus. Et vous, connaissez vous GRAV ? L'avez-vous testé ou même développé des sites pour des clients ou votre propre usage ? N'hésitez pas à me laisser vos impressions.

Lancement du WebXR

Rédigé par dbodesign Aucun commentaire
Classé dans : Realité Virtuelle Mots clés : aucun
Le 20 Octobre dernier, Mozilla annonçait le lancement officiel d'une API pour le WebXR, c'est à dire d'une application de réalité mixte pour le Web. Deux ans après les débuts du WebVR, qui mixera les éléments de la VR et de l'AR pour le web. Le WebAR reste relativement confidentiel (reste des expériences fascinantes, notamment autour des Google AR Experiments, car c'est surtout la VR qui à le vent en poupe: Outre le succès de A-Frame et ReactVR, Oculus browser et Samsung Internet shipped qui soutiennent le WebVR pour Gear VR, et Microsoft Edge qui le supporte également, tandis que des outils comme PlayCanvas, Vizor, WebVR Studio, and Sketchfab se multiplient pour apporter des contenus. En outre l'AR n'est pas compatible avec les casques VR, des OS propriétaires comme le casque de réalité mixte Meta 2, les smartphones compatibles iOS ARKit et Android ARCore, ou les casques AR comme Microsoft Hololens and les lunettes connectées ODG R9. Pourtant la XR (Réalité Mixte) pour le Web est un concept qui aura l'avantage de marier les deux, et d'uniformiser les process. Le premier brouillon d'API proposée par Mozilla va prendre en compte les éléments communs d'Hololens, ARKit, and ARCore. Il devra avoir la même simplicité de codage qu'A-Frame, tout en s'adaptant à chaque plateforme. La mission du groupe de travail autour de cette API n'est pas de créér un OS en réalité mixte, mais d'étendre le WebVR au support support AR pour l'ensemble des casques, smartphones compatibles pour la réalité mixte. Un exemple a été développé autour du WebXR Viewer iOS. Ce dernier impose donc d'ouvrir un compte développeur iOS pour avoir accés à l'API et de travailler sous ARKit. En attendant la vraie WebAR, l'utilisation d'éléments de type AR sur des photos panoramiques permet de simuler un environnement AR et donc déjà de tester des idées d'ergonomie. Exemple concret: Gallerie avec Explicatifs. Mozilla à annoncé un support plein et entier AR support pour les casques Meta 2. D'autre part, Mozilla annonce le lancement du Servo projet, qui rendra le WebXr compatible avec une nouvelle classe de casques de réalité mixte arrivant sur le marché à court terme. Quelques-unes des nouveautés incluent le support Servo DOM-to-Texture et le support intégré le Snapdragon 835 VR de Qualcomm. Alors que les experiences de VR se complexifient, et que l'on commence à concevoir des sites internet entiers dans de nombreux domaines en WebVR, gageons que le WebXr apportera une nouvelle couche de surprises, une nouvelle façon d'aborder les contenus du web ...sans écran.

Nouveau terme: La réalité étendue

Réalité virtuelle, augmentée et maintenant mixte. Difficile de s'y retrouver. Pourtant si les technologies et devices utilisés sont assez proches les marchés, tranches d'âge, cibles diffèrent. La réalité étendue est un terme récent qui commence à s'appliquer uniformément à ces trois formes de réalité digitale, pour plus de simplification. C'est une initiative d'autant plus salutaire qu'i est très probable qu'à l'avenir un système universel permettra de passer d'un mode à l'autre en fonction des activités de l'utilisateur.

En savoir plus: http://dbo-design.tech/webvr/realite-etendue-extended-reality-xr/ Et vous, que pensez-vous de ce nouveau développement ? Avez-vous déjà vu un exemple ou imaginé des applications ? Vos commentaires sont bienvenus. En savoir plus: https://blog.mozilla.org/blog/2017/10/20/bringing-mixed-reality-web/ github.com/mozilla-mobile/webxr-ios https://mixedreality.mozilla.org CMS de construction d'expériences WebVR: www.ideaspacevr.org/

Nouvelle expérience WebVR avec Firefox Quantum

Rédigé par dbodesign Aucun commentaire
Classé dans : Réalité Mixte Mots clés : aucun
Mardi dernier, Mozilla a sorti Firefox Quantum, la 57ème version du navigateur Firefox depuis ses débuts publics. Cette version officiellement 2x plus rapide et utilisant 30% de mémoire en moins, a remis au musée certains de ses composants principaux, remplacés avantageusement par des modules plus rapides et plus modernes. Quantum incorpore Quantum Flow, un effort holistique pour moderniser et améliorer les fondations du moteur Web Firefox, en identifiant et supprimant les sources principales de pollution de résultats sans toutefois tout réécrire de zéro. Quantum Flow a notamment un effet important et notable sur la stabilité de WebVR: Les clignotements intermittents de Firefox 55 correspondaient aux errements de l'ancien système, à travers lequel l'utilisateur était amené vers un espace sécurisé. L'effet est supprimé sur Quantum, il en résulte une expérience nettement plus fluide et agréable. Quantum Flow a éliminé en effet les goulets d'étranglement interfèrant avec la capacité du navigateur à envoyer de nouvelles images au système VR à temps. Pour comprendre comment ces optimisations globales affectent les performances de réalité virtuelle, il est nécessaire de connaître les exigences strictes des systèmes VR et de comprendre l'infrastructure de communication de Firefox: Vitesse de rendu: 16,6 Ms -Dans le navigateur, le contenu 3D normal est affiché à 60 Hz. Ce contenu a donc environ 16,6 millisecondes pour simuler le monde, rendre la scène et envoyer chaque nouvelle image au thread de compositeur du navigateur. Si la page Web répond avant cette limite, la fréquence d'images sera une constante de 60 images par seconde, l'animation paraîtra fluide et agréable. Navigateur:60 hz, VR: 90hz, voyez le problème Le contenu VR est affiché à 90 Hz avec un temps de rendu réduit donc à 11,1 ms, en général à un thread WebVR dédié. Le délai entre le moment où la page web commence à rendre la scène VR et l'affichage d'une nouvelle image à un impact direct sur la perception de l'utilisateur, alors même que celui-ci peut changer d'orientation. Cettee latence de mouvement peut causer vertiges et des nausées. Première solution: Reprojection des casques de VR Heureusement, les systèmes de Réalité Virtuelle peuvent corriger un partie cet effet sans augmenter la latence, en déformant la scène restituée avant de l'afficher dans le casque: La reprojection. En revanche, plus la latence est faible, plus la simulation est précise. Pour réduire le temps de latence, le navigateur ne démarre pas le rendu immédiatement après l'affichage de la dernière image. A la place, il demande au système VR une période d'attente pour retarder le rendu de la scène, ce que l'on veut éviter en général. Marier l'inconciliable Le contenu Web et le thread WebVR s'exécutent dans différents processus, mais doivent être coordonnés pour rendre la scène correctement. Avant Quantum Flow, la communication entre ces processus risquait de devenir un goulot d'étranglement. Pour la VR il y a deux points de communication critiques: l'un après l'attente, lorsque WebVR cède l'exécution à la page Web pour le rendu de la scène; et une autre après le rendu, lorsque le contenu Web envoie l'image au thread WebVR. Un retard inattendu de l'un ou l'autre entraînerait un pic de latence entre le mouvement et l'affichage. Firefox organize son execution au travers de plusieurs process: -Le process parent, qui contient l'UI navigateur et peut accéder aux resources système. -Le Process GPU qui communique spécifiquemet avec la carte graphique et contient le compositeur Firefox et WebVR. -D'autres proces qui gèrent le contenu web mais ne communiquent pas avec le système PC. Cette séparation des process permet de futures améliorations de la securité et empêchent un onglet en crashant de fermer le navigateur entier. Le problème des Communications Inter-Process Très souvent, ces process doivent communiquer entre eux et utilisent pour cela des messages de communication inter-processus ou IPC. Ces messages peuvent être synchrones ou asynchrones. Une IPC est synchrone lorsque toute autre tentative de nouveau message via IPC doit attendre que la communication en cours se termine: Attente pour envoyer le message, terminer la tâche et renvoyer le résultat. Le problème est qu'un onglet actif essayant de communiquer avec le processus parent peut bloquer la livraison du message, et force une attente jusqu'à ce que le résultat d'une communication différente atteigne l'initiateur, même en fond (donc non urgent) ou si la tâche en cours n'a rien à voir avec la tentative de communication. Une IPC asynchrone gère de façon indépendante l'envoi de la requête, l'exécution de la tâche, et le retour du résultat. L'exécution et la livraison des messages peuvent donc se produire dans le désordre et redéfinies de façon dynamique. Firefox à forcé la transition aux IPC asyncrones lors des dernières versions. L'un des objectifs de Quantum Flow a été d'identifier toutes ces IPC synchrones restantes pour les convertir en IPC asynchrones. Rendu et GPU outre les IPC synchrones, une autre communication est critique, celle qui permet d'exécuter la page Web pour lancer le rendu, et celle qui envoie cette information au casque, qui toutes les deux nécessitent un IPC de GPU > contenu et inversement contenu > GPU en retour. En raison du taux de trame VR, ces échanges à risque se produisent 180 fois par seconde. Dans Firefox 55, ces fréquences d'images élevées et l'activité de fond des autres onglets ouverts augmentaient la probabilité d'être retardé par une demande IPC synchrone en cours, avec des temps d'attentes souvent nombreux. Le navigateur ratait constamment les délais plus court imposés par l'équipement VR. Le développement de Quantum Flow pour Firefox 56 et 57, avec le passage aux IPC asynchrones ont réduit ce risque pratiquement à zéro. Bien que Quantum Flow ne visait pas spécifiquement à améliorer WebVR, en supprimant ces goulots d'étranglement, ses nouveaux composants peuvent contribuer efficacement au gain de performance global, qui bénéficie particulièrement à la VR. Ainsi, Firefox Quantum n'est pas seulement la version la plus rapide de Firefox pour le rendu de contenu 2D, mais aussi celle qui offrire l'expérience WebVR la plus stable et la plus fluide d'internet. Et le meilleur reste à venir. Traduit et adapté de https://hacks.mozilla.org/2017/11/a-super-stable-webvr-user-experience-thanks-to-firefox-quantum/ Voir aussi https://webvr.info/

Que vaut la création d'un Google site ?

Rédigé par dbodesign Aucun commentaire
Classé dans : Webmastering Mots clés : aucun

Un temps suspendu, Google sites, l'un des nombreux services de la galaxie Google (indexé sur Gmail) à fait son retour, à travers une intégration pro avec G suite. Sous abonnement, la suite ajoute à un nom de domaine propre l'espace web, une boite mail et les nombreux services Google dont le couplage automatique avec Google+. En version gratuite, on peut très bien créer un site Google gratuit si hébergé en sous-domaine comme la plupart des plate-formes de blogging.

Test et Impressions Google offre une interface en drag-and-drop java réactive et très ergonomique, intuitive à la manière d'un concrete5. Techniquement, la composition en "page unique" permet de réviser à tout instant les paramètres généraux (image d'en-tête, logo, slogan, titre...) et les contenus internes.

Pour simplifier l'interface, on ne voit pas de différences entre "pages" et "articles". Cela simplifie la gestion et ce type de site est d'avantage vu comme une vitrine (Pour publier des posts, utilisez Google+). Le panneau d'interface comprend quatre actions principales: -Insérer un texte (fonctions basiques de mise en page, p. ex. on ne peux changer ni le style de police, ni la couleur, ni justifier...). Un séparateur est accessible depuis le panneau, "composant". -Insérer une image: Depuis une URL externe (hotlink), ses albums, Google Drive, ou via une recherche. -Insérer un lien (URL externe) -Importer (depuis son ordinateur). On suppose des documents et photos. Plus bas, Google propose d'uploader des contenus depuis Google drive. Il semble toutefois impossible d'ouvrir les dossiers (bug?). A retester donc depuis Chrome.

Intégrations: Les classiques "Embeds" sont facilités, Google permettant d'intégrer: -Vidéo Youtube (Via des "imports" (depuis où?) et directement par recherche) -Agenda (importé depuis le service du même nom) -Carte (Embed Google maps, avec toutes ses fonctionnalités, mode street, earth, pins, etc).

Insertions: Tirant parti de la puissance de son cloud et de ses 5GO offerts, Google Sites offre la possibilité d'intégrer des documents type Google Docs, textes, tableaux, sliders, feuille des calcul, et graphiques, dont ceux générés avec la G suite. (Réponse à la fameuse suite Microsoft(R)).

Comme précisé dans les caractéristiques du site, l'espace disponible est de 100mo, mais ne précise pas si cela inclus les "rapatriements" depuis le Drive, ou même le web (hotlink). Aucune limite en revanche pour le nombre de pages. J'ai testé une arborescence à 5 niveaux (4 niveaux de pages filles) sans problème. Reste évidemment dans ce cas l'affichage.

Le système est parfaitement responsive. Tout est dynamique et les contenus se replacent gentiment en colonne sur mobile. Il y a même un effet de profondeur en scroll sur la bannière d'en-tête qui peut changer sur chaque page. La solution trouvée pour l'affichage des sous-menus est assez élégante: Seule la page fille s'affiche, et un icône est sollicité pour afficher la sous-page fille et ainsi de suite, presque sans décalage (qui pose un problème de "sortie" du cadre en général et oblige à scroller en latéral). Le classique hamburger affiche une colonne latérale large et lisible qui permet de déplier le menu.

La construction en drag-and-drop est très intuitive et permet cependant une certaine latitude de mise en page. Les pages sont construites en "sections" chacune pouvant être personnalisée et/ou duplicable. Des "guides" avec un magnétisme réduit sont également présents pour dimensionner les blocs de contenus (texte, image, embeds,..) avec des poignées, ce qui permet éventuellement d'espacer un peu plus les blocs que le standard. A l'ancienne il faudrait batailler avec des padding et spacing tous azimuth et de fréquentes updates du serveur pour afficher le résultat. On apprécie aussi le fait que les images importées ont un "cadre" qui se redimensionne de manière intelligente en agrandisant et "cachant" des portions de l'image pour correspondre au format voulu.

Côté SEO: Venant de Google on s'attend bien entendu à un sans faute. Pourtant à la vue du code on ne décele ni titre ni description (certes plus prise en compte) et le code se révèle finalement assez lourd (Voir ici) et les textes ne sont même pas accessibles, l'ensemble donnant l'impression d'être encodé en base 64 (Un paradoxe car l'éditeur ne supporte pas les images enocodées en base 64). Pour un test de long terme, il faudrait donc créer un site de test riche en mots-clefs et attendre 3 mois en publiant une nouvelle page de contenus chaque semaine.

Bilan: Pour un néophyte, créer son site sur Google donnera la satisfaction d'un résultat rapide et facile, particulièrement si Google est utilisé pour tout ou presque. Maintenant on ne le comparera qu'à des plate-formes freemium comparables, car face aux CMS classiques que sont Wordpress, Joomla et Drupal, on pense notamment à la foule de plugins utilisables par ces trois plate-formes (Forum, E-commerce, etc). On ne parlera pas non plus du choix très restreint de "templates" et finalement d'une personnalisation réelle assez limitée.

Comparons donc ce qui est comparable. Dans son registre du microsite, Google Site est une excellente façon de débuter sans prise de tête. Mais pour un webmaster (pas de mode code!) ou un utilisateur averti, les limitations de Google sites finiront par apparaitre assez vite, le concept est trop frais et complètement intesté sur le plan du référencement, sans compter la présence en bas de page de la référence publicitaire "fait avec". Nulle doute également que la nature des données entrées en disent long sur l'utilisateur, alimentant encore les databank commerciales du géant Californien. ;). Sur le plan collaboratif en revanche, et la construction d'un mini-intranet, Google Sites se révèle finalement bien plus facile à mettre en place grâce à ses nombreuses possibilités d'intégration.

Particulier ou association qui souhaite une présence en ligne facile? Parfait !. Si vous êtes un professionnel desespéré d'avoir un site le jour même, Google site est aussi une solution de facilité. Idem pour mettre en place rapidement un intranet basique. Pour le reste, rien de tel que le sur mesure.

Avez-vous testé Google Sites ? Pensez-vous l'utiliser ? N'hésitez pas à commenter votre expérience. Exemple live: https://sites.google.com/s/0B7bURKf82hn-UUdMZUFqdEdQMnc/p/0B7bURKf82hn-VDVyazNJSVkwWG8/edit Pour aller plus loin: alternatives-to-google-products Comparatif Wordpress/Google site (il fallait oser)

I tested Google cardboard VR: Good, but...

Rédigé par dbodesign 1 commentaire
Classé dans : Realité Virtuelle Mots clés : PluXml

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.

Lire la suite de I tested Google cardboard VR: Good, but...

Fil RSS des articles