Contexte & missions


adopt-a-design.com est un site qui vend des composants graphiques (flyers, affiches, templates, etc.) prêts à l’emploi. Ma mission a été de concevoir la maquette graphique et le gabarit html de la newsletter.

La mise en page de la newsletter est fluide et responsive pour s’adapter harmonieusement à n’importe quelle largeur d’écran (Desktop, tablette, smartphone).

Newsletter responsive

Design visuel & interactions

Conçus pour les mobiles

images rétina

Une qualité d'affichage irréprochable sur les écrans HD ( haute définition)

Taille des caractères

La taille des titres a été réduites et la taille du texte courant augmenté pour une lisibilité optimale sur smartphones.

3

Espaces négatifs repensés

Les marges latérales ont été réduites pour augmenter la longueur des lignes de textes.

4

Boutons "finger friendly"

Des boutons élargis pour faciliter l'interaction tactile sur petits écrans

Intégration html


Code robuste

Le code a été développé pour répondre aux nombreuses contraintes des outils de messagerie. Il a été vérifié auprès du W3C afin de s'assurer qu'il ne comporte aucune erreur.

Rendu testé

Le code a été testé dans près de 50 outils de messagerie (logiciels de messagerie, webmails et appli mobile ios et android) via l'outil de test-rendering Email on Acid.

Images optimisées

Les images ont fait l'objet d'une compression minutieuse afin de réduire les temps de chargement notamment sur smartphone.

Code modulaire

Le code a été conçu sous forme de fragments de code pour être facilement réutiliser et manipuler . Il peut être ainsi facilement intégré dans n'importe quel outil d'email templating.

Exemple de Test de rendu dans Email on Acid
Exemple de Test de rendu dans Email on Acid