IUT de Troyes – MMI1

Année universitaire : 2013-2014

Soutenance de projet

Dream Factory:

Enguerran PoulainPaul FontaineAkram Benayaha

Arthur BiverMateo Sepulveda

2

L’Agence:

Logo et nom de l’agence représentatifs de l’état d’esprit de l’agence, un projet, un rêve? Nous y travaillons.

Nous nous consacrons en priorité à l’experience utilisateur.

3

Le projet:Un site qui suit les tendances actuelles

Ergonomique et intuitif

Dynamique

4

Pourquoi ce projet?Moderne, lié aux nouvelles technologies

En relation avec le monde de l’informatique

Exploitation des dernières tendances

5

ProblématiqueComment allier une apparence moderne qui suit les tendances, avec une accessibilité ergonomique et intuitive pour l’utilisateur et ses différents périphériques?

6

Plan:Problème / SolutionGabarit et ArborescenceGraphismeFonctionnalitésIntégrationFinalisation

7

Gabarit(arthur)Choix d’une construction simple:

Pour une construction aiséePour les utilisateurs: lisible et accessible, et adapté à de nombreux supports

8

Graphismes• Historique de la conception graphique:• 1er et 2nd jour : Construction des gabarits (page d'accueil + pages avec

contenu) et début des maquettes graphiques• 3e et 4e jour : Construction des modèles graphiques• 5e jour : Version définitive du modèle graphique et typographie• 8e et 9e jour : Conception/ajouts des éléments graphiques indépendants sur

le site

• Choix police : refléter aspect futuriste et moderne tout en restant sobre

9

Arborescence(akram)

10

Le choix des couleurs:• Couleurs simples et ergonomiques

11

Le fond• Blanc simple et neutre, mettant en valeur ce qui est important grâce

au contraste .

12

Les icônes :

• Icône flat design, esthétique et indicatifs .

13

FonctionnalitésRecherche des fonctionnalités « tendances »

Sélection des fonctionnalités à l’aide du gabarit

Seconde sélection, vis-à-vis de nos contraintes (temps, compétences…)

14

Eléments clésLe design responsive:

Ergonomique sur tous supports, le public cible étant nomadeFacilite l’integration du contenu sur tous suportsSuit les tendances et normes actuelles

L’utilisation de carrousels pour présenter les articles:Donne du dynamisme à la page

Met en valeur les articlesAttire l’oeil de l’utilisateur

15

IntégrationExpérimentations et apprentissage sur le responsive design:

16

ContraintesLe temps:Donner la priorité aux fonctionnalités les plus essentielles

Les compétences:Essayer de trouver des alternatives, apprendre à créer ou reproduire certaines fonctionnalités

17

Integration, ObjectifsProposer le même contenu sur tous supports

Une utilisation ergonomique, et intuitive

Une architecture qui respecte les normes du web actuelles

Un contenu dynamique et attractif (animations, carrousels)

Une apparence générale qui suit les tendances actuelles (flat design)

18

FinalisationsMise en forme du texte et corrections

Retouches et optimisations

Corrections d’erreurs

19

PréconisationsFinitions (mise en forme des boutons, zone de texte)

Typographie des articles

…

ConclusionExpérience tirée de ces semaines de projet