{"id":1508,"date":"2026-03-23T23:22:26","date_gmt":"2026-03-24T03:22:26","guid":{"rendered":"https:\/\/bbathalon.dectim.ca\/TP2\/?page_id=1508"},"modified":"2026-04-14T13:04:22","modified_gmt":"2026-04-14T17:04:22","slug":"nuit-totale","status":"publish","type":"page","link":"https:\/\/bbathalon.dectim.ca\/TP2\/nuit-totale\/","title":{"rendered":"Nuit Totale"},"content":{"rendered":"\n
\n
\n
\n

Bathalon, Benjamin<\/p>\n\n\n

Nuit Totale<\/h1>\n\n\n

Projet de renouvellement pour le site de la compagnie \u00a0\u00bbTim \u00c9douard Production\u00a0\u00bb, vendeur de jeu-vid\u00e9o<\/p>\n\n\n\n

\n
#UX design<\/a><\/div>\n\n\n\n
#Brands<\/a><\/div>\n\n\n\n
#UI Designer<\/a><\/div>\n<\/div>\n<\/div>\n\n\n\n
\"\"<\/figure>\n\n\n\n
\n

Contexte<\/h2>\n\n\n\n

La marque Tim \u00c9douard Production nous a contact\u00e9 dans le but de refaire le design de leur jeu de survie le plus r\u00e9cent, Nuit Totale.<\/p>\n\n\n\n

Ils ont \u00e9t\u00e9 satisfait du prototype propos\u00e9 \u00e0 la fin de l’exp\u00e9rience.<\/p>\n<\/div>\n\n\n\n

\n
\"\"<\/figure>\n\n\n\n
\"\"<\/figure>\n<\/div>\n<\/div>\n\n\n\n
\n
\"\"\n\t\t\t\n\t\t\t\t\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n\n\n\n
\"\"\n\t\t\t\n\t\t\t\t\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div>\n\n\n\n
\n
\n

Objectif du projet<\/h3>\n\n\n\n

L’objectif de ce projet \u00e9tait de cr\u00e9er un prototype pour le jeu qui respectait le moodboard et quelles sentiments doivent \u00eatre envoyer au joueur.<\/p>\n<\/div>\n\n\n\n

\n

Description du projet<\/h3>\n\n\n\n

Un long travail a \u00e9t\u00e9 fait avec nos collaborateurs afin d’obtenir un r\u00e9sultat qui pourrait donner une ouverture \u00e0 un nouveau projet avec un prototype d’\u00e9cran titre fait sur Figma.<\/p>\n<\/div>\n<\/div>\n\n\n\n

\n

01<\/h1>\n\n\n\n
\n

Moodboard<\/h3>\n\n\n\n

Offrez \u00e0 votre marque un nouveau d\u00e9part.<\/p>\n<\/div>\n<\/div>\n\n\n\n

\n
\n
\n

Moodboard<\/h3>\n\n\n\n

Tim \u00c9douard Production nous a procur\u00e9 quelques images d’inspiration apr\u00e8s quoi nous avons \u00e9labor\u00e9 le design et look g\u00e9n\u00e9ral du prototype.<\/p>\n<\/div>\n<\/div>\n\n\n\n

\n
\n
\"\"\n\t\t\t\n\t\t\t\t\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n\n\n\n

Moodboard de l’\u00e9cran titre<\/p>\n<\/div>\n\n\n\n

\n
\n
\"\"\n\t\t\t\n\t\t\t\t\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n\n\n\n

Genre d’avatar planifi\u00e9.<\/p>\n<\/div>\n\n\n\n

\n
\"\"<\/figure>\n\n\n\n

Comparables du fond de jeu<\/p>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n

\n

02<\/h1>\n\n\n\n
\n

Wireframe<\/h3>\n\n\n\n

Offrez \u00e0 votre marque un nouveau d\u00e9part.<\/p>\n<\/div>\n<\/div>\n\n\n\n

\n
\n

Wireframes<\/h3>\n\n\n\n

Des wireframes pour chaque pages ont \u00e9t\u00e9 fait afin d’avoir une vague id\u00e9e de comment les choses \u00e9taient pour \u00eatre plac\u00e9 malgr\u00e9 le fait qu’il y a eu quelques changements par la suite.<\/p>\n\n\n\n

\n
\"\"<\/figure>\n\n\n\n
\"\"<\/figure>\n\n\n\n
\"\"<\/figure>\n<\/figure>\n<\/div>\n<\/div>\n\n\n\n
\n

03<\/h1>\n\n\n\n
\n

Maquette<\/h3>\n\n\n\n

Offrez \u00e0 votre marque un nouveau d\u00e9part.<\/p>\n<\/div>\n<\/div>\n\n\n\n

\n
\n

Maquette<\/h3>\n\n\n\n

Nous avons r\u00e9alis\u00e9 un produit final qui suit la direction artistique souhait\u00e9 en plus d’avoir cr\u00e9e des images et assets personalis\u00e9s pour le projet.<\/p>\n<\/div>\n\n\n\n

\"\"<\/figure>\n<\/div>\n\n\n\n
\n
\n

D\u00e9fis rencontr\u00e9s<\/h3>\n\n\n\n
    \n
  • Placement des informations<\/li>\n\n\n\n
  • Polices d’\u00e9criture erron\u00e9<\/li>\n\n\n\n
  • Message incoh\u00e9rent<\/li>\n<\/ul>\n<\/div>\n\n\n\n
    \n

    Solutions apport\u00e9es<\/h3>\n\n\n\n
      \n
    • Meilleures transitions<\/li>\n\n\n\n
    • Changement de l’ordre et positions des informations<\/li>\n\n\n\n
    • Changement d’images<\/li>\n\n\n\n
    • Red\u00e9finition du message<\/li>\n<\/ul>\n<\/div>\n<\/div>\n\n\n\n
      \n
      \n