On poursuit avec des applications Surface sur la santé :
Applications sur le dossier santé d’un patient : Très intéressant pour expliquer au patient ses maux.
Surface Demo: Patient Consultation Interface Surface Application
Explication de la connexion de téléphone mobile sur la Surface :
Microsoft Surface Mobile Connect Walkthrough
Démonstration sur l’interaction Microsoft entre un mobile et la Surface
http://vimeo.com/3383743
Lightbox en Jquery très performante
Voici une lightbox facile à intégrer et qui permet d’insérer des flash ou autre page via Iframe
Elle comporte des thèmes différents : clair, foncé, avec sous ans coins arrondis.
Un petit défaut pas de traduction en français. Il faut juste changer les boutons.
http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/
Microsoft en Surface : Les applications (2)
Encore des applications sur Surface :
Un jeu de cible: on lance des petits galets sur la surface et la position donne le score.
Bon exemple de tags.
Un autre exemple de TAG : une carte de visite avec toutes les informations sur l’usager : photo, …
Encore un dernier exemple de TAG, on pose une carte sur la surface et des informations en ressortent.
En plus une démo pour le choix d’un bague avec la possibilité de changer le diamant. Le résultat
est visualisé en 3D. Splendide!!
De nouveaux attraits pour les (nouvelles) technologies web (3) : Jquery
Suite d’une liste de plugins en Jquery utiles pour vos sites
Attention certains des ces liens peuvent ne plus fonctionner
Menus
http://www.getintothis.com/pub/projects/rb_menu/
Type Ipod
http://www.getintothis.com/blog/2006/09/26/my-first-jquery-plugin-a-sliding-menu/
http://www.filamentgroup.com/lab/jquery_ipod_style_drilldown_menu/
http://www.filamentgroup.com/examples/menusHierarchical/index2.php
http://www.filamentgroup.com/lab/jquery_ipod_style_drilldown_menu/
http://p.sohei.org/jquery-plugins/clickmenu/
http://p.sohei.org/stuff/jquery/clickmenu/demo/demo.html
http://www.gmarwaha.com/blog/2007/08/23/lavalamp-for-jquery-lovers/
http://jdsharp.us/jQuery/plugins/jdMenu/
http://users.tpg.com.au/j_birch/plugins/superfish
http://p.sohei.org/jquery-plugins/menu/
http://javascript-array.com/scripts/multi_level_drop_down_menu/?j
http://javascript-array.com/scripts/jquery_simple_drop_down_menu/
Menu Contextuel
http://www.trendskitchens.co.nz/jquery/contextmenu/
http://abeautifulsite.net/notebook/80
Popup
http://webexpose.org/2006/12/28/jquery-pop-up-menu-tutorial/
Menu over sorte de bulles
http://www.webdesignerwall.com/demo/jquery/
Microsoft en Surface : Les applications (1)
Après un bref article en novembre 2008, je vous propose de faire un petit tour des applications développées pour Surface.
Pour ma part cet outil qui allie le multi-touch, l’intuitivité, l’utilisation multi-utilisateurs, l’utilisation à 360° peut avoir des applications fabuleuses.
La fluidité des objets à manipuler est impressionnante et la cerise sur le gâteau, Microsoft Surface peut identifier des objets posés à sa surface grâce à des Tags collés sur l’objet lui-même.
Je pense que cette table peut changer la façon d’utiliser les logiciels et les ordinateurs en y rajoutant un facteur important : Une manipulation NATURELLE.
On parle d’ailleurs de NUI : Natural User Interface.
On peux également remarquer que tous les logiciels présentés ont un design superbe, très professionnel.
Application pour l’éducation : vie scolaire
On va donc voir des applications pour l’éducation avec la manipulation de photo mais également de jeux à plusieurs autour de la table :
Voici donc les 1eres vidéos :
La manipulation de carte de façon très naturelle.
La détection d’accidents sur une carte
Après Surface voici Second Light : applications du futur (2)
Pour ceux qui n’auraient pas suivi ce qu’est Surface (voir ici)
Second light quand à lui à la même capacité que Surface mais avec 2 projecteurs embarqués
ce qui permet de faire des effets de superposition d’image liés à des objets en surface.
L’écran n’est autre qu’une dalle de verre.
Vous passez une feuille de papier au dessus de l’image affichée sur l’écran et apparait sur la feuille des informations complémentaires à l’image survolée.
Elle peut également projeter une vidéo.
http://research.microsoft.com/en-us/um/people/shodges/papers/secondlight_cr3.pdf
De nouveaux attraits pour les (nouvelles) technologies web (2) : Jquery
Voici une liste de plugins JQUERY très utiles pour améliorer l’expérience utilisateur (l’ergonomie d’un site web).
On s’aperçoit qu’avec ce type de fonctionnalités le rapprochement en terme d’ergonomie et d’intuitivité d’un site web vers une application traditionnelle est très fort. Je dirais même qu’une interface logicielle peut être beaucoup moins ergonomique (je ne parlerais pas bien sûr de WPF qui est une évolution majeure dans le développement de logiciel, malheureusement loin d’être utilisé par grands nombres d’éditeurs de logiciels):
Boites de dialogue :
http://plugins.jquery.com/project/jmodal
Colonnes
http://www.codeasily.com/demo/few-column-list/few-column-list.html
Effets Fading
http://medienfreunde.com/lab/innerfade/
Effets de transitons sur des images :
http://www.malsup.com/jquery/cycle/int2.html
Effets de Zooms
http://www.mind-projects.it/jqzoom_v10
http://www.mind-projects.it/projects/jqzoom/
Carrousels:
http://plugins.jquery.com/project/carousel3d
http://plugins.jquery.com/files/carousel3d_1.1_0.zip
http://www.webcssdesign.com/css/coins-arrondis-avec-jquery-css-et-une-seule-image/
Effets panoramiques
http://www.openstudio.fr/Animated-InnerFade-with-JQuery.html?lang=fr
des blogs font l’inventaire de plugins Jquery :
http://www.noupe.com/jquery/50-amazing-jquery-examples-part1.html
http://www.webcssdesign.com/ajax/jquery-plugins-240-tutoriels-a-decouvrir/
La réalité augmentée : applications du futur (1)
Qu’est ce que la “réalité augmentée” le principe est d’avoir un objet physique qui peut interagir dans le monde du virtuel
et inversement un objet virtuel pouvant s’associer à un objet physique.
Par exemple une feuille de papier dans le monde physique est filmée par une webcam et un objet virtuel comme un personnage vient grimper sur la feuille.
L’utilisateur bouge la feuille et le personnage s’agrippe comme il peut dessus!
Nous avons tendance à rester passif devant des vidéos de synthèse! On intègre des mondes virtuels via des avatars mais le lien entre la réalité et le virtuel
se bornait au clavier et à la souris.
Voici donc des vidéos très intéressantes sur cette technologie qui risque, un jour, d’intégrer nos chaumières et de changer nos habitudes.
http://webloria.loria.fr/~gsimon/ra/
http://www.dunod.com/livre-dunod-9782100498604-integrer-images-reelles-et-images-3d.html
http://www.fredcavazza.net/2008/01/16/une-illustration-interessante-de-la-realite-augmentee/
http://www.jsmansart.com/post/Life-20-la-realite-augmentee
http://fr.wikipedia.org/wiki/R%C3%A9alit%C3%A9_augment%C3%A9e
Bonne lecture
De nouveaux attraits pour les (nouvelles) technologies web (1)
De nombreuses librairies javascripts (jquery, extjs, scriptaculous,dojo,…) existent pour rendre plus intuitives vos interfaces web.
Mais une a plus particulièrement attirée mon attention : Jquery
Pourquoi choisir cette librairie ?
- – elle est très complète
- – la communauté est importante
- – les plugins importants
- – les bugs réparés rapidement
Qu’a t-elle de spéciale par rapport aux autres ?
- Son concept de base : utiliser la structure hiérarchique du document HTML (Le DOM)
- Le script ne parasite pas le code HTML : utilisation des attributs “id” et “class” des tags
- Elle supporte l’XmlHttpRequest (Ajax)
- Externalisation du script qui permet de gérer les événements
- Installation très facile par de simples liens (link) et l’étiquetage des tag Html via Id ou Class
- Légèreté de la librairie
Les principes de bases :
- Des actions sur les noeuds du DOM (choix d’éléments, boucle sur des éléments, événements : un langage dans le langage, …)
- Des effets et animations : fade, déplacement (sliding), de tremblement, de glissement, …
- Des widgets : drag and drop, accordéon, sliders, tri, barre de progression, datepicker, boite de dialogue, onglets, …
Beaucoup d’animations pour enrichir vos interfaces web et en améliorer l’expérience utilisateur.
On se rapproche de logiciels classiques avec peut-être encore plus d’esthétique et d’ergonomique.
Que peut-on faire avec Jquery ?
- des carrousels,
- des popup nouvelles génération (lightbox, thickbox, greybox)
- des menus de toutes sortes : verticaux, horizontaux, onglets, hierarchique, …
- des Glisser-Déplacer
- des menus déroulants plus ergonomiques
- des tooltips plus joli, plus paramétrables
- …
sans rechargement des pages bien sûr!
voir le site www.jquery.com
et les sites en version française :
www.jquery-france.com
www.jquery.info
Un prochain article listera les différents plugins utiles : menus, boite de dialogue, lightbox, thickbox, greybox, drag and drop, …
Une autre libraire peut également faire des effets similaires mais je trouve qu’elle n’a pas tous ces avantages : c’est Library Ajax de l’ASP.NET. Fournie de nombreux exemples avec l’AjaxToolkit