Webmail mobile

A. Bourdin, C. Chandelier, S. Fifre, Q. Grimaud

4 Février 2011

https://m.webmail.polytech.unice.fr/

Encadrants : A-M. Déry, P. Sander

Webmail mobile 2

Sommaire

Analyse du besoin

Choix de développement : technologies et méthodes

Interfaces et ergonomie

4/02/2011

Webmail mobile 3

Analyse du besoinPrésentation de l’existantObjectifs du sondageRésultats du sondageSynthèse des attentes

4/02/2011

Webmail mobile 4

Login Boîte deréception

Mailouvert

Ecritured’un mail

Présentation de l’existant

4/02/2011

Webmail mobile 5

Objectifs du sondage

Notre sondage avait pour but de recenser :

les habitudes des étudiants Fréquence d’utilisation du webmail OS mobiles utilisés

leurs opinions sur l’existantleurs attentes pour un webmail mobile

4/02/2011

Webmail mobile 6

Résultats du sondage

Résultats du sondage

286 réponses

4/02/2011

Webmail mobile 7

Résultats du sondage

4/02/2011

Webmail mobile 8

Synthèse des attentes

Attentes récurrentes des utilisateurs :

résolution d’écran smartphone ergonomie pensée pour le tactile affichage clair accessibilité rapide aux nouveaux mails facilité d’utilisation

4/02/2011

Webmail mobile 9

Analyse du besoin

Conclusion : Concerne plus de 35% des étudiants Attentes exigeantes

Mettre l’accent sur l’ergonomie Etude à mener

sur les applications sur les webmails

4/02/2011

Webmail mobile 10

Choix de développement :technologies et méthodes

Web ou application ?SquirrelMail vs. « from scratch »Choix technologiques

4/02/2011

Webmail mobile 11

Web ou application ?

4/02/2011

Webmail mobile 12

Web ou application ?

4/02/2011

Web Application

Site unique et multiplate-formes

Une application par OS mobile

Temps de développement minimal

Temps de développement trop important

Déploiement facile sur les serveurs de Polytech

Soumission aux stores onéreuse et potentiellement refusée

STMP de Polytech accessible Envoi d’emails impossible

Chargements multiples, temps de réponses du serveur importants

Fluidité des applications, possibilités accrues

Webmail mobile 13

SquirrelMail vs. « from scratch »

Thème pour SquirrelMail Architecture de SquirrelMail lourde Solution inintéressante

« from scratch » Partir des fonctions protocoles Architecture MVC

4/02/2011

Webmail mobile 14

Choix technologiques

Langage PHP Fonctions IMAP / SMTP Simplicité de déploiement

Framework JavaScript jQuery (AJAX) jQueryMobile (Eléments d’UI multiplate-

formes)

4/02/2011

Webmail mobile 15

Interfaces et ergonomie

Étude des webmails existantsLes choix que l’on a fait

4/02/2011

Webmail mobile 16

Webmails mobiles existants : réception

4/02/2011

Webmail mobile 17

Webmails mobiles existants : réception

4/02/2011

Webmail mobile 18

Webmails mobiles existants : composer

4/02/2011

Webmail mobile 194/02/2011

Webmails mobiles existants : message

Webmail mobile 204/02/2011

Webmails mobiles existants : message

Webmail mobile 21

Analyse de l’existant

Gros boutons avec images (adaptés à la précision du doigt et de la surface tactile) vs simples liens HTML

Ne garder que les fonctionnalités essentielles pour ne pas surcharger l’interface, les autres sont regroupées dans des menus

Plusieurs solutions d’IHM envisageables pour les mêmes fonctionnalités

4/02/2011

Webmail mobile 22

Les choix que l’on a fait

Optimiser l’espace

Placeholders

Détails dans bandeau déroulant

Menus

Ergonomie tactile : pagination, toolbars,

Swipe

4/02/2011

Webmail mobile 23

Placeholders et menus déroulants

4/02/2011

Webmail mobile 24

Menus

4/02/2011

Webmail mobile 25

Ergonomie tactile : pagination, swipe, toolbars

4/02/2011

Webmail mobile 26

Conclusion

4/02/2011

Analyse des problèmes rencontrésCe que nous avons apprisExtensions nécessairesExtensions possiblesAvant/Après

Webmail mobile 27

Analyse des problèmes rencontrés

Header et footer non fixes

Problèmes d’encodages persistants

4/02/2011

Webmail mobile 28

Ce que nous avons appris

Pratique des langages, protocoles et frameworks utilisés

Gestion d’un déploiement

Travail collaboratif Intégration du code et des modules

(modèles, contrôleurs, vues) SVN, GoogleDocs, DropBox

4/02/2011

Webmail mobile 29

Extensions nécessaires

Audit complet de sécurité

Meilleure prise en charge du HTML

4/02/2011

Webmail mobile 30

Extensions possibles

Gestion du carnet d’adresses

Ajout, suppression, édition d’adresses

Auto-complétion des destinataires

Attachement de pièces jointes

Actions groupées sur les listes de

messages

Gestion des favoris dans les mails

4/02/2011

Webmail mobile 31

Avant/Après

4/02/2011

Webmail mobile 324/02/2011

Avant/Après