{"id":9894,"date":"2024-05-04T15:22:31","date_gmt":"2024-05-04T13:22:31","guid":{"rendered":"https:\/\/studio.ican-design.fr\/?p=9894"},"modified":"2024-05-05T12:37:46","modified_gmt":"2024-05-05T10:37:46","slug":"lheritage-de-larry-tesler-webdesign-02","status":"publish","type":"post","link":"https:\/\/studio.ican-design.fr\/lheritage-de-larry-tesler-webdesign-02\/","title":{"rendered":"L’h\u00e9ritage de Larry Tesler… \/ Webdesign 02"},"content":{"rendered":"

“L’h\u00e9ritage de Larry Tesler<\/em>, au-del\u00e0 du copier-coller”, un projet One page design<\/em> & Scrollytelling.<\/em>
\n<\/p>\n

Un projet r\u00e9alis\u00e9 par : \u00c9lodie TOUN, Julie KENNEL, Camille SCHUWER<\/strong><\/p>\n

\"\"Intentions<\/h2>\n

L’objectif \u00e9tait de retravailler un article web et de cr\u00e9er une exp\u00e9rience interactive mobile, avec une interface de type \u00abone page\u00bb. Notre choix d’article c’est port\u00e9 sur “L’h\u00e9ritage de Larry Tesler<\/em>, au-del\u00e0 du copier-coller”… Nous souhaitions rendre l\u2019article agr\u00e9able et dans un environnement graphique des ann\u00e9es 1970, date \u00e0 laquelle Larry Tesler<\/em> d\u00e9veloppe le concept du \u00abcopier-coller\u00bb.
\n> Dossier Final_Scrollytelling_Tesler<\/a><\/strong><\/p>\n

\u00c9l\u00e9ments du processus cr\u00e9atif \/ UX<\/h2>\n

Un sketchnote<\/em> <\/strong>est une technique de facilitation graphique permettant la prise de note visuelle. Gr\u00e2ce \u00e0 cet exercice, nous avons r\u00e9ussi \u00e0 savoir quels \u00e9l\u00e9ments sont importants pour la r\u00e9alisation de notre scrollytelling<\/em>. Celui-ci nous a permis de synth\u00e9tiser les informations de notre article et ainsi de nous aider \u00e0 d\u00e9velopper notre cr\u00e9ativit\u00e9 tout en facilitant notre m\u00e9moire.<\/p>\n

\"\"<\/p>\n

Sc\u00e9nario utilisateurs \/ Ux Design<\/strong><\/p>\n

C’est une histoire qui d\u00e9crit comment l\u2019utilisateur interagit avec le service, dans une situation donn\u00e9e. Les sc\u00e9narios d\u2019usage\/utilisateurs racontent une exp\u00e9rience concr\u00e8te, illustr\u00e9e, de l\u2019usager. Cela permet d\u2019approfondir les diff\u00e9rentes dimensions de l\u2019innovation ou du service, telles que les vit l\u2019utilisateur et il permet de travailler sur l\u2019acceptabilit\u00e9 d\u2019une innovation.<\/p>\n

\"\"<\/p>\n

Identit\u00e9 visuelle<\/h2>\n

Nos recherches graphiques se sont port\u00e9es sur le th\u00e8me des ann\u00e9es 70, car c\u2019est \u00e0 ce moment-l\u00e0 que Larry Tesler<\/em> d\u00e9veloppe la formule du copier-coller. Nous avons choisi des couleurs<\/strong> faisant r\u00e9f\u00e9rence aux ann\u00e9es 70. Elles permettent un contraste fort avec notre fond beige et nos contours et ombres tr\u00e8s noirs. Nous nous inspirons des bandes de couleurs du saint clair cumpunting ZX80.<\/p>\n

La typographie<\/strong> Courier<\/em> est utilis\u00e9e pour nos titres. Elle a \u00e9t\u00e9 cr\u00e9\u00e9e dans les ann\u00e9es 60-70 et c\u2019est une M\u00e9cane<\/em> faisant r\u00e9f\u00e9rence aux machines \u00e0 \u00e9crire.
\nLa typographie Titilium<\/em> est utilis\u00e9e pour notre texte courant. C’est une Lin\u00e9ale<\/em> qui a un effet “carr\u00e9” au niveau de ses lettres.<\/p>\n

\"\"<\/p>\n

Nous avons \u00e9galement choisi des \u00e9l\u00e9ments graphiques<\/strong> s\u2019inspirant des premi\u00e8res interfaces d\u2019ordinateurs. Les couleurs, les bords \u00e9pais noirs et les fen\u00eatres pop up l\u00e9g\u00e8rement arrondis permettent de nous plonger dans cet ambiance.<\/p>\n

\"\"<\/p>\n

Maquettes \/ UI<\/h2>\n

\"\"<\/p>\n

> Dossier Final_Scrollytelling_Tesler<\/a><\/strong><\/p>\n

D\u00e9mo du site<\/h2>\n