Le salon livr’avenir Soutenance de projet – janvier 2015 Le salon consacré à la lecture augmentée Le salon livr’avenir Pour le Centre régional des lettres et du livre Nord-Pas-de-Calais

Introduction • L’agence Dév’ Art est composée de quatre membres : Loick LEGALLAIS (intégrateur Web) Alex MESSAOUDI (rédacteur) Maurine SCALISE (graphiste) Axel GUILLAUME (chef de groupe) • Le rôle de l’agence : fournir des sites Web selon les dernières tendances et qui se démarquent. • Rappel de la commande : site vitrine du salon Livr’avenir portant sur la lecture augmentée.

SOMMAIRE 3 I – Démarche esthétique & rendu final A – Recherche de l’identité visuelle B – Charte graphique C – Gabarits, maquettes et rendu final du site II – Fonctionnalités du site et ergonomie A – Fonctionnalités premières B – Ergonomie et navigation III – Vaste univers de contenu A – Contenu pratique et illustratif sur le salon Livr’avenir B – Contenu relatif à la lecture augmentée Conclusion finale et démonstration du site 3

I – DÉMARCHE ESTHÉTIQUE & rendu final A — Recherche de l’identité visuelle • Quête d’idées : conception d’une mindmap et d’une moodboard 4

• Conception du logo - ébauches : rejetées car trop complexes et archaïques - logo final, adapté selon l’environnement - variations finales pour l’aspect multimédia 5

B — Charte graphique 6 • Couleurs dominantes et teintes voisines • Formes et mise en page : - design carré et épuré - division ordonnée et méthodique du contenu - la simplicité est le mot d’ordre. 6

• Typographies : - Mindblue : pour les titres, les menus • Typographies : - Mindblue : pour les titres, les menus. - Geosanslight : pour le corps de texte. - Angelface : logo et slogans. 7

C — Gabarits, maquettes et rendu final du site • Conception de trois gabarits selon les fonctionnalités exigées par le commanditaire 8

Non retenue, car trop pauvre en matière de visuel. • Évolution en maquettes : Non retenue, car trop pauvre en matière de visuel. Non retenue, car trop chargée en contenu et en motifs esthétiques. Retenue pour le design du site. 9

10 • Design final du site sur quelques pages principales Page d’accueil Stands et exposants Contact 10

• Ajout d’une mascotte, guide pour l’utilisateur (rôle approfondi dans la partie II — B) - élément graphique renforçant davantage l’aspect du site - rappel du “V” du logo ; symbole du livre ouvert 11

II – FONCTIONNALITÉS ET ERGONOMIE A — Fonctionnalités premières du site • Deux espaces de navigation : un pour les visiteurs (celui par défaut), un pour les exposants - accès plus rapide à des fonctionnalités et des contenus réservés aux exposants - menus épurés : meilleure cohérence visuelle - optimisation du site selon chaque utilisateur 12

• Espace visiteurs (par défaut) • Espace exposants 13

• Inscription à la newsletter • Réserver un stand • Inscription à la newsletter 14

B — Ergonomie et navigation • Contenu aisément accessible : - répartition ordonnée des articles et des blocs d’informations pratiques - application de la règle des 3 clics - arborescence simplifiée - mascotte/guide au design adapté à chaque page 15

• Animations fluides • Texte formaté selon les normes : - crénage (espace entre les caractères) étendu pour une meilleure lisibilité des mots - interlignes espacés pour faire respirer le texte - respect des différentes tailles de texte pour les titres, sous-titres des articles • Interactivité poussée avec le contenu : - rappel des liens principaux du menu dans le footer, hypertexte répandu - bannière intelligente : chaque illustration mène à un article précis, une page, etc. 16

III – VASTE UNIVERS DE CONTENU A — Contenu pratique et illustratif sur le salon Livr’avenir • Liste des exposants sur la page Exposants : - tri par tranches alphabétiques - nom du stand, logo et activité - mise en valeur de stands phares 17

• Articles consacrés à des stands phares • Informations pratiques accessibles sur une même page et allant à l’essentiel • Carrousel pour promouvoir des stands • Aucun vide ou espace inutilisé 18

B — Contenu relatif à la lecture augmentée • Page Actualités : articles sur la lecture augmentée - phénomène en pleine expansion - mieux renseigner l’utilisateur qui s’y intéresse déjà • Sur l’accueil, liens vers des articles d’autres sites • Promotion d’un concours d’écriture organisé par NuméLivre • Publicités ciblées sur la lecture augmentée 19

CONCLUSION FINALE • Visuel du site destiné à toutes les générations • Réalisation sur-mesure du site pour les visiteurs et les exposants • Contenu riche et ouvert éveillant la curiosité de l’internaute. • Travail d’intégration supplémentaire (plan interactif) 20

DÉMONSTRATION • Quelques scénarios : - Chercher des informations détaillées sur un stand en particulier, et en trois clics - S’inscrire en tant qu’exposant et commander un stand - S’inscrire à la newsletter 21

Nous vous remercions de votre attention.