Home / Ergonomie

déc

25

Le responsive web design : explication

Posted by : oalessandri | On : 25 décembre 2011

Category: Ecommerce, Ergonomie, Mobile, Programmation, Site vitrine, Veille technologique, Web en général

Tags:,

Le responsive web design est né de la multitude d’écrans disponibles et surtout depuis l’avènement des tablettes et l’utilisation fréquente des Smartphones. Pour répondre à tous ces formats on est obligé de créer des sites différents réellement adaptés à chaque contenu :

  • Un écran d’ordinateur de bureau (mac ou pc) permet d’afficher
    • des contenus plus longs et plus complexes,
    • plusieurs colonnes sur une page,
    • des images plus grandes avec des agrandissements plein écran.
    • Plus d’éléments dans un site donc plus lourd.
  • Un écran de tablette affiche
    • déjà beaucoup moins d’informations,
    • des images plus petites
  • Pour les Smartphones c’est encore plus complexe puisque les écrans varient d’un fabriquant à l’autre mais on retrouve
    • des images plus petites pour les Smartphones,
    • et un contenu de quelques lignes,
    • des écrans plus nombreux avec des transitions entre eux,… La navigation n’est plus la même, plus humaine avec le doigt et non une souris ce qui change également le comportement des utilisateurs
    • Des pages plus légères à charger
    • Moins d’effet ou plutôt des effets différents (librairie javascript, jquery)

Continue Reading

nov

05

Wireframe : explication

Posted by : oalessandri | On : 5 novembre 2011

Category: Ecommerce, Ergonomie, Programmation, Site vitrine, Web en général

Tags:, ,

Depuis quelques années la conception web est devenue, pour certaines sociétés, très professionnelle. Elles ont mis en place des méthodes de travail permettant de proposer aux clients des aspects d’interfaces fonctionnelles avant de concevoir le produit et ainsi optimiser ou même maximiser la satisfaction du client par rapport à sa demande.

C’est là qu’intervient le Wireframe qui permet de concevoir des interfaces virtuelles comme des maquettes (sans graphisme) et ainsi de construire avec le minimum d’effort des interfaces.

Cette étape semble être une perte de temps mais ce n’est pas le cas car cette action, intervenant avant la conception graphique,  va accélérer la création de la maquette. En se basant sur l’interface issu du Wireframe, validée par le client, le travail du graphiste va en être facilité. Cela évite ainsi de nombreux aller-retour entre la société conceptrice et le client.

Un logiciel très performant comme Visio de Microsoft a des fonctionnalités bien plus poussées que la simple conception de Wireframe puisque qu’il sait également générer du code mais ceci est un autre sujet

Certaines méthodes facilitent donc la conception de pages web, l’organisation de contenu, l’optimisation de l’ergonomie et la disposition des éléments sur une page, l’interaction entre plusieurs pages ou écrans, …

Voici quelques exemples

imageimage

imageimageimage

août

11

WP7 et Mango

Posted by : oalessandri | On : 11 août 2011

Category: Ergonomie, Mobile, Programmation, Wp7

Tags:,

Enfin une mise à jour majeure pour Windows Phone 7 qui doit être diffusé en octobre.

Windows Phone 7 : Microsoft livre de nouveaux détails sur la mise à jour Mango

Olivier Ribet, Microsoft France : « Windows Phone 7 Mango apporte des nouveautés encore jamais vues »

Voici une partie des 500 fonctionnalités de cette version 7.5 alias Mango :

Objectif centraliser les informations des différents sites et accélérer l’accès aux informations

  • multi-tâches – multi-applications – application en fond tâche – économise la batterie
  • interface commune pour le chat à travers des SMS, Facebook chat et Windows Live Messenger
  • Réseaux sociaux sont unifiés et intégrés au carnet d’adresse : on avait déjà windows live, google, facebook,s ‘ajoute linkedin, twitter, Messenger
  • boites mail liées et accessibles depuis la même interface ou pas
  • système de calendrier et de demande rendez vous
  • intégration de IE9 ouf! : html 5, accélération matérielle
  • stockage en ligne avec skydrive et Office 365
  • navigation avec guidage vocale
  • SMS dictés
  • système d’identification de musique intégré à Bing
  • mode conversation pour les emails affichés dans la boite de réception
  • recherche sur le serveur de la messagerie électronique
  • Lecture intégrée des QRCode, Micrsoft Tags, et code barres
  • Lync sera disponible gratuitement sur le Marketplace Windows Phone pour accéder au service de communications unifiées (lui est payant Clignement d'œil)
  • Pour les développeurs : accès aux multi-tâche, réalité augmentée, API  de capteurs, APN, capacité de notification évoluées, accès aux calendriers,n aux contacts

Continue Reading

déc

28

Mon Windows phone 7

Posted by : oalessandri | On : 28 décembre 2010

Category: JqueryMobile, Mobile

Tags:, , ,

Après avoir attendu deux mois que Bouygues veuille bien lancer leurs offres, j’ai enfin mon Windows phone 7 le HTC HD7 : 1ère remarques

L’utilisation est très fluide sur le HTC HD7, les icônes sont beaucoup plus grands que sur un IPhone et je trouve plus clair. Chose bizarre Microsoft n’a pas pensé à autoriser la personnalisation des sonneries, alors que le simple mobile de base à cette fonction ? Bien sûr par rapport l’iPhone il manque des fonctions mais cela suffit largement pour le moment.

Les fonctions très intéressantes sont la fusion des contacts en une seule fiche, la centralisation sur Windows live des contacts et calendrier, l’utilisation des photos de Facebook pour ses amis et l’affichage de leur mur.

En ce qui concerne le téléphone, le seul problème pas d’extension avec une carte ce qui a long terme sera certainement gênant.

C’est en fait une micro tablette.

Pour revenir au JqueryMobile, il passe pour le moment très sur WP7 car ce dernier intègre IE7.

nov

15

Lightbox en Jquery très performante

Posted by : oalessandri | On : 15 novembre 2009

Category: Ecommerce, Ergonomie, Site vitrine, Veille technologique

Tags:, ,

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.

image

http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/