Du flat design au responsive en passant par les sites mono-page, ce slideshare de l'agence Nineteengroupe retrace les 11 tendances du webdesign en 2014.
telmedia* : tendances webdesign 2015, l'année de l'UXtelmedia
Découvrez notre dossier tendance 2015 avec un focus sur l'expérience utilisateur au sein de vos projets digitaux.
Webdesign, RWD, vidéo, contenu ou encore interactions possibles, le dossier réalisé par le studio telmedia* alimentera vos réflexions pour l'année à venir ;-)
En savoir plus sur telmedia* ? Nous sommes une agence digitale avec une moyenne d’âge de 33 ans, où ingénieurs et designers conçoivent des produits et des services adaptés aux nouveaux comportements des consommateurs.
www.telmedia.fr
PS : Toutes les photos et/ou illustrations présentent dans notre dossier sont la propriété intellectuelle d'artistes et sont protégées par la législation en vigueur sur le droit d'auteur.
près avoir passé une année 2015 basée sur la mobilité, nous allons continuer sur ce chemin :
Le webdesign doit s’adapter à l’ensemble des supports sans aucune rupture !
On y est, le webdesign n’est plus considéré comme une création artistique ou décorative, mais il sert bien à délivrer un message à l’utilisateur.
C’est le liant entre les données et l’utilisateur. Il se veut simple, efficace et accessible à tous.
Pour 2016, on scénarise, on crée des expériences uniques et on délivre des messages percutants !
telmedia* : tendances webdesign 2015, l'année de l'UXtelmedia
Découvrez notre dossier tendance 2015 avec un focus sur l'expérience utilisateur au sein de vos projets digitaux.
Webdesign, RWD, vidéo, contenu ou encore interactions possibles, le dossier réalisé par le studio telmedia* alimentera vos réflexions pour l'année à venir ;-)
En savoir plus sur telmedia* ? Nous sommes une agence digitale avec une moyenne d’âge de 33 ans, où ingénieurs et designers conçoivent des produits et des services adaptés aux nouveaux comportements des consommateurs.
www.telmedia.fr
PS : Toutes les photos et/ou illustrations présentent dans notre dossier sont la propriété intellectuelle d'artistes et sont protégées par la législation en vigueur sur le droit d'auteur.
près avoir passé une année 2015 basée sur la mobilité, nous allons continuer sur ce chemin :
Le webdesign doit s’adapter à l’ensemble des supports sans aucune rupture !
On y est, le webdesign n’est plus considéré comme une création artistique ou décorative, mais il sert bien à délivrer un message à l’utilisateur.
C’est le liant entre les données et l’utilisateur. Il se veut simple, efficace et accessible à tous.
Pour 2016, on scénarise, on crée des expériences uniques et on délivre des messages percutants !
Les 10 Tendances Webdesign de 2014 by VanksenVanksen
Découvrez les tendances webdesign de l'année 2014 selon Vanksen.
This presentation is also available IN ENGLISH, here : https://fr.slideshare.net/Vanksen/10-webdesign-trends-for-2014
La mode s'évapore, la tendance s'érode… Seul le style reste.
Je vous présente les évolutions graphiques et digitales. Un point sur les tendances webdesign et autour du web. Une étude pour y voir plus clair.
[MàJ : décembre 2014]
Article complémentaire à cette présentation, rédigé pour Alsacréations :
http://www.alsacreations.com/article/lire/1657-tendances-du-webdesign-2015.html
Autre présentation en rapport : Apple, Branding Story 2015
http://fr.slideshare.net/philipperondepierre37/apple-une-question-dimage
Philippe Rondepierrre - Directeur Artistique
http://philipperondepierre.com
Préambule
Les RSS LUNCH = un format de veille sous l’angle du planning stratégique, qui pointe des solutions innovantes adaptées à la problématique client. Une veille rapide animée par le planning stratégique de sqli agency, sorte de "pérégrinations du web" sur lesquelles rebondir avec les experts de l’agence.
Sqli la met ensuite à disposition sur son blog et slideshare et par là tenter de vous interpeller et ouvrir cet échange à vos remarques.
François VERRON, planneur stratéqique sqli agency.
Les tendances du webdesign 2019 à retenirConcept Image
Découvrez les tendances webdesign 2019, et nos conseils en tant que webdesigner et directeur artistique. Qu'est-ce qu'une tendance ? A quoi sert le webdesign ? Quelles sont les tendances pour 2019 ?
Tendances techniques, webdesign, des composants HTML, CSS et graphiques du moment.Recensement non exhaustif des tendances du moment. Analyse des avantages et inconvénients pour chacun d'eux
Retour d'expérience sur la conception et la construction d'une application ME...Microsoft Technet France
La plupart des applications WP7 restent dans les lignes visuelles METRO. Pourtant il est possible de créer des applications ayant une forte personnalité graphique, tout en suivant l'ergonomie METRO. Nous vous proposons de vous faire partager notre expérience, avec les bonnes pratiques en terme d'utilisation de composants et de workflow. Comprenez l'ergonomie METRO et mettez du graphisme dans vos applications !
Grande Rétrospective 2013, Chiffres clés et Tendances 2014Teester
Restrospective des évènements marquants du monde d'Internet et de la Communication en 2013 ainsi que me principaux projets réalisés. Imprégnez-vous ensuite des Chiffres Clés et Tendances 2014 pour attaquer cette nouvelle année sur de très bonnes bases. Bonne lecture.
Mobile First - Vincent Pillet & Asma Moumni - YOODx 2018YOODx
Vincent et Asma mettent en avant 4 enjeux pour la performance digitale, dans un monde où l’usage mobile est majoritaire :
- La performance technique : Penser les interfaces pour qu’elles soient aussi fluides à utiliser
que simples à comprendre
- Le contenu : Une production de contenu qui doit elles aussi devenir mobile first
- L’ergonomie : Une ergonomie à géométrie variable
- Le parcours client : Des services repensés dans leurs ensemble
Le mobile est devenu du “connect everything”.
----------------------
Conférence donnée au YOODx #VEM9 le 14 février 2018
Evènement organisé par YOODA.com
Bientôt, nous serons plus nombreux à accéder à Internet via un écran mobile que via notre PC…
L’accessibilité de votre contenu sur les plateformes mobiles est donc, aujourd’hui, un enjeu majeur. Time Magazine l’a bien compris, lui qui est passé, ce lundi 22 octobre, au responsive Web design avec des versions optimisées pour smartphones et tablettes qui offrent même l’accès aux archives remontant jusqu’en 1923! Time.com est d’ailleurs le premier grand site d’information à franchir le pas.
Un contenu unique qui s’adapte à toutes sortes et toutes tailles de supports : la convergence frappe à nos portes soutenue par le responsive Web design et l’avènement du langage de programmation HTML5 aux nouvelles fonctionnalités résolument innovantes.
Le département communication de Vanksen - Vicky Balnave, Marie-Magali Sarry
et Christophe Dos Santos - décrypte pour VOUS les forces en marche avec des mots simples pour que la révolution de la convergence et de la mobilité soient embrassées par le plus grand nombre.
Le monde des applis et du webdesign est en constante évolution, d’un point de vue technologique, mais également éditorial et graphique. On parle chaque année de nouvelles tendances. Mais les tendances, c'est comme la mode ? Un peu, mais pas complètement. En matière de webdesign, les tendances ne sont pas juste des couleurs que tous les sites arboreront fièrement au printemps, et il est intéressant de les analyser pour nourrir vos réflexions.
Nous ferons un tour d'horizon des tendances UX et UI actuelles, du design émotionnel à la réalité augmentée, en passant par les animations et les chatbots.
Et nous essayerons de répondre ensemble à 3 questions :
- Comment interpréter les tendances actuelles ?
- Quelles tendances se sont imposées de façon pérenne ?
- Quelles sont les tendances émergentes ?
Les tendances graphiques pour avoir un site agréable et moderne - Agence Pilo...Julien Dereumaux
Découvrez nos conseils pour avoir un site internet moderne et agréable. Nous vous présentons les tendances graphiques 2017, des ressources utiles et des conseils simples à mettre en place.
Atelier startup « communiquer sur son innovation Deep Tech pour mieux convain...Thomas Le Mouellic
Nous étions les invités de l'incubateur Pulsalys le mardi 11 mai 2021 pour animer un atelier autour de la communication digitale et de l'innovation. Pulsalys est un incubateur d'innovations Deep Tech créé en 2013 dont les projets d'entreprise sont principalement issus de découvertes scientifiques des laboratoires de l’Université de Lyon.
Nous avons partagé pendant cette séance les meilleures pratiques pour présenter une innovation au travers d'une expérience web, du concept jusqu'à sa conversion en produits ou services.
Les 10 Tendances du Design d'interface en 2016Idean France
Chez Backelite, nous remettons constamment en question nos méthodes de conception pour répondre à l'évolution des devices, des besoins utilisateurs et des marques.
Le propre des tendances étant d’évoluer, elles sont aussi là pour être challengées en mode "test & learn".
Partageons ensemble notre vision sur l'évolution du design en 2016 avec ces 10 grands principes clés de l'UI Design.
Intervention dans la cadre du programme de formation 2008 de la Fédération Régionale des offices de Tourisme et Syndicats d'Initiative de Midi-Pyrénées.
Les 10 Tendances Webdesign de 2014 by VanksenVanksen
Découvrez les tendances webdesign de l'année 2014 selon Vanksen.
This presentation is also available IN ENGLISH, here : https://fr.slideshare.net/Vanksen/10-webdesign-trends-for-2014
La mode s'évapore, la tendance s'érode… Seul le style reste.
Je vous présente les évolutions graphiques et digitales. Un point sur les tendances webdesign et autour du web. Une étude pour y voir plus clair.
[MàJ : décembre 2014]
Article complémentaire à cette présentation, rédigé pour Alsacréations :
http://www.alsacreations.com/article/lire/1657-tendances-du-webdesign-2015.html
Autre présentation en rapport : Apple, Branding Story 2015
http://fr.slideshare.net/philipperondepierre37/apple-une-question-dimage
Philippe Rondepierrre - Directeur Artistique
http://philipperondepierre.com
Préambule
Les RSS LUNCH = un format de veille sous l’angle du planning stratégique, qui pointe des solutions innovantes adaptées à la problématique client. Une veille rapide animée par le planning stratégique de sqli agency, sorte de "pérégrinations du web" sur lesquelles rebondir avec les experts de l’agence.
Sqli la met ensuite à disposition sur son blog et slideshare et par là tenter de vous interpeller et ouvrir cet échange à vos remarques.
François VERRON, planneur stratéqique sqli agency.
Les tendances du webdesign 2019 à retenirConcept Image
Découvrez les tendances webdesign 2019, et nos conseils en tant que webdesigner et directeur artistique. Qu'est-ce qu'une tendance ? A quoi sert le webdesign ? Quelles sont les tendances pour 2019 ?
Tendances techniques, webdesign, des composants HTML, CSS et graphiques du moment.Recensement non exhaustif des tendances du moment. Analyse des avantages et inconvénients pour chacun d'eux
Retour d'expérience sur la conception et la construction d'une application ME...Microsoft Technet France
La plupart des applications WP7 restent dans les lignes visuelles METRO. Pourtant il est possible de créer des applications ayant une forte personnalité graphique, tout en suivant l'ergonomie METRO. Nous vous proposons de vous faire partager notre expérience, avec les bonnes pratiques en terme d'utilisation de composants et de workflow. Comprenez l'ergonomie METRO et mettez du graphisme dans vos applications !
Grande Rétrospective 2013, Chiffres clés et Tendances 2014Teester
Restrospective des évènements marquants du monde d'Internet et de la Communication en 2013 ainsi que me principaux projets réalisés. Imprégnez-vous ensuite des Chiffres Clés et Tendances 2014 pour attaquer cette nouvelle année sur de très bonnes bases. Bonne lecture.
Mobile First - Vincent Pillet & Asma Moumni - YOODx 2018YOODx
Vincent et Asma mettent en avant 4 enjeux pour la performance digitale, dans un monde où l’usage mobile est majoritaire :
- La performance technique : Penser les interfaces pour qu’elles soient aussi fluides à utiliser
que simples à comprendre
- Le contenu : Une production de contenu qui doit elles aussi devenir mobile first
- L’ergonomie : Une ergonomie à géométrie variable
- Le parcours client : Des services repensés dans leurs ensemble
Le mobile est devenu du “connect everything”.
----------------------
Conférence donnée au YOODx #VEM9 le 14 février 2018
Evènement organisé par YOODA.com
Bientôt, nous serons plus nombreux à accéder à Internet via un écran mobile que via notre PC…
L’accessibilité de votre contenu sur les plateformes mobiles est donc, aujourd’hui, un enjeu majeur. Time Magazine l’a bien compris, lui qui est passé, ce lundi 22 octobre, au responsive Web design avec des versions optimisées pour smartphones et tablettes qui offrent même l’accès aux archives remontant jusqu’en 1923! Time.com est d’ailleurs le premier grand site d’information à franchir le pas.
Un contenu unique qui s’adapte à toutes sortes et toutes tailles de supports : la convergence frappe à nos portes soutenue par le responsive Web design et l’avènement du langage de programmation HTML5 aux nouvelles fonctionnalités résolument innovantes.
Le département communication de Vanksen - Vicky Balnave, Marie-Magali Sarry
et Christophe Dos Santos - décrypte pour VOUS les forces en marche avec des mots simples pour que la révolution de la convergence et de la mobilité soient embrassées par le plus grand nombre.
Le monde des applis et du webdesign est en constante évolution, d’un point de vue technologique, mais également éditorial et graphique. On parle chaque année de nouvelles tendances. Mais les tendances, c'est comme la mode ? Un peu, mais pas complètement. En matière de webdesign, les tendances ne sont pas juste des couleurs que tous les sites arboreront fièrement au printemps, et il est intéressant de les analyser pour nourrir vos réflexions.
Nous ferons un tour d'horizon des tendances UX et UI actuelles, du design émotionnel à la réalité augmentée, en passant par les animations et les chatbots.
Et nous essayerons de répondre ensemble à 3 questions :
- Comment interpréter les tendances actuelles ?
- Quelles tendances se sont imposées de façon pérenne ?
- Quelles sont les tendances émergentes ?
Les tendances graphiques pour avoir un site agréable et moderne - Agence Pilo...Julien Dereumaux
Découvrez nos conseils pour avoir un site internet moderne et agréable. Nous vous présentons les tendances graphiques 2017, des ressources utiles et des conseils simples à mettre en place.
Atelier startup « communiquer sur son innovation Deep Tech pour mieux convain...Thomas Le Mouellic
Nous étions les invités de l'incubateur Pulsalys le mardi 11 mai 2021 pour animer un atelier autour de la communication digitale et de l'innovation. Pulsalys est un incubateur d'innovations Deep Tech créé en 2013 dont les projets d'entreprise sont principalement issus de découvertes scientifiques des laboratoires de l’Université de Lyon.
Nous avons partagé pendant cette séance les meilleures pratiques pour présenter une innovation au travers d'une expérience web, du concept jusqu'à sa conversion en produits ou services.
Les 10 Tendances du Design d'interface en 2016Idean France
Chez Backelite, nous remettons constamment en question nos méthodes de conception pour répondre à l'évolution des devices, des besoins utilisateurs et des marques.
Le propre des tendances étant d’évoluer, elles sont aussi là pour être challengées en mode "test & learn".
Partageons ensemble notre vision sur l'évolution du design en 2016 avec ces 10 grands principes clés de l'UI Design.
Intervention dans la cadre du programme de formation 2008 de la Fédération Régionale des offices de Tourisme et Syndicats d'Initiative de Midi-Pyrénées.
4. FLAT DESIGN
EXEMPLE
Se débarrasser des effets de
profondeur, éviter le superflu,
fini le skeumorphisme.
FLAT DESIGN VS. REALISM
Un site pour apprendre la différence entre le flat et le
skeumorphisme (design réaliste).
Il se caractérise par des
aplats de couleurs sobres.
Il s’agit d’un style
minimaliste.
http://www.flatvsrealism.com/
4
5. TYPOGRAPHIE
EXEMPLE
Expérimenter et pousser
dans ses derniers
retranchement les typos en
jouant sur l’écartement des
lettres, les tailles des polices,
la variétés des formes...
Elles créent le dynamisme et
la personnalité d’un site
sobre en permettant la
hiérarchisation des contenus.
BABDUM
Apprendre une langue en s’amusant. Ce site trouve sa
personnalité et son originalité dans le traitement des typos qui
contraste avec le design simple des arrières-plans et éléments
graphiques.
http://babadum.com/
5
6. MENU DÉROULANT
Le menu est devenu
tellement intuitif avec l'essor
des terminaux mobiles qu'il
n'est plus nécessaire de
l'afficher.
Le gain de place de ce type
de menu sert à ne pas
"polluer" le message visuel.
EXEMPLE
SOMOS DEDO
Site d’agence en navigation horizontale pourvu d’un menu
déroulant inspiré des menus de sites mobile.
http://www.somosdedo.com/
Plus complet qu’un menu
classique, le menu déroulant
apporte une plus grande
clarté quant à la structure
d’un site, pour que
l’internaute s’y retrouve plus
simplement.
6
7. DÉFILEMENT INFINI
Avec le flux Facebook,
Pinterest, Instagram et les
usages de navigation issus
du mobile, les internautes
ont maintenant plus
l’habitude de scroller que de
cliquer pour consulter du
contenu.
EXEMPLE
GET STRIKR
Site de la bière Carlsberg avec scrolling infini, vidéo
background, effet de parallaxe et animation au scroll. Il retrace
les événements qui se sont déroulés sur Twitter pendant la diff
d’un match de foot pour promouvoir l’app foot de la marque.
http://www.getstrikr.com/
Les sites doivent permettre
l’accès aux contenus
seulement en scrollant.
7
8. BACKGROUND VIDEO
Fini les images fixes en fond.
La vidéo permet d’amener
outre du dynamisme, un
discours de marque ou un
storytelling propice à la
diffusion d’un message plus
précis.
La techno HTML5, la
compression des vidéos et la
généralisation du haut débit
sur tous les devices
permettent désormais
d’utiliser la vidéo partout où
c’est nécessaire.
EXEMPLE
Firestorm
Un web-reportage autour d’une catastrophe naturelle. Un site
en scroll vertical. Un témoignage poignant réalisé grâce une
succession de vidéos.
bit.ly/1bix0J3
8
9. RESPONSIVE DESIGN
EXEMPLE
Un français sur deux se
connecte désormais depuis
son mobile selon
Médiamétrie en décembre
2013.
On ne peut plus oublier les
devices mobiles lorsqu’on
conçoit un site web. Celui-ci
doit alors s’adapter au
support utilisé pour le
consulter. C’est le propre du
responsive design.
HUGE INC
Un design adaptatif à tous les supports. Les encarts se
redimensionnent et se placent automatiquement les uns en
dessous des autres en fonction de la taille des écrans.
http://www.hugeinc.com/
Desktop
Mobile
9
10. COULEUR SIMPLE
2014 est l’année de la
simplification. Faciliter l’accès
à l’information principale en
un minimum de temps est le
nouvel enjeu du web.
Moins il y a d’éléments qui
distraient l’internaute, mieux
c’est.
Les couleurs en font partie,
moins il y en a, plus elles
sont communes, mieux
c’est.
EXEMPLE
SYDNEY STOCKHOLM
Une agence qui a un message principal à faire passer en un
minimum de temps. Elle emploie alors une home vide
construite autour d’un fond d’une couleur primaire et d’un
texte en blanc. Résultat : on ne voit que le message.
http://www.sydneystockholm.com.au/
Adieu les dégradés de bleu...
privilégiez les classiques.
10
11. ANIMATION AU SCROLL EXEMPLE
Les pages en défilement
infini, la volonté de ne plus
cliquer et le développement
de la techno du parallaxe
permettent maintenant de
créer des animations sans
recourir à une action de
l’internaute.
COMPUTING HISTORY
Un voyage dans le temps autour de l’histoire des ordinateurs
en une seule page en scrolling infini. Des éléments narratifs
qui apparaissent au scroll et une direction artistique épurée
pour ne privilégier que l’histoire à raconter.
http://www.akita.co.uk/computing-history/
Avec les animations activées
au scroll, l’internaute peut
créer des interactions avec
un site sans rien faire d’autre
q u e n a v i g u e r. C e s
animations permettent
d'aiguiller l’oeil du visiteur
sur les informations
primordiales à délivrer.
11
12. + DE VIDÉOS
La tendance au zapping des
internautes ne faiblit pas en
2 0 1 4 , a u c o n t r a i re e l l e
s’accroit. Aujourd’hui le
contenu doit être plus
attrayant que jamais et le
texte ou les photos ne
suffisent plus.
EXEMPLE
GOOGLE GLASS
Les google glass, une innovation encore méconnue dans son
usage. La marque doit faire preuve de pédagogie pour entrer
ce produit dans le quotidien des gens et créer le besoin. La
vidéo, courte en background full screen, aide à cela...
https://glass.eleks.com/
La meilleure solution pour
délivrer un message devient
alors la micro-vidéo.
Avec l’apparition de Vine les
internautes veulent
consommer des vidéos
courtes. Un site doit répondre
à ces attentes pour délivrer
son message.
12
13. INFOGRAPHIE
INTERACTIVE
L’infographie, ce long jpeg
qui délivre des données
statistiques par des
graphiques, camemberts et
autres diagrammes est une
tendance déjà présente
depuis plusieurs années sur
le web.
EXEMPLE
L’ÉVOLUTION DU WEB
Un site consacré à l’évolution du web, de ses technos et
navigateurs en une timeline. L’internaute pourra actionner
divers hotspot pour faire apparaitre du contenu
complémentaire.
http://www.evolutionoftheweb.com/
En 2014, l’infographie n’est
plus un simple jpeg mais un
site complet, avec lequel on
peut interagir sur les
données pour en savoir plus.
13
14. SITE À PAGE UNIQUE
Le premier constat qui n’est
plus à faire est que le scroll
est moins compliqué que le
clic. Le 2nd est qu’une
longue page est un atout
majeur pour simplifier la
navigation. Les sites à page
unique voient alors le jour.
Leur atout : ils chargent
l’ensemble du contenu en
une seule fois.
EXEMPLE
MY DIRTY DESK
Site portfolio d’un web designer. Nul besoin d’une multitude
de pages pour montrer son travail. Une seule longue en
scrolling vertical est suffisante.
http://www.mydirtydesk.com/
Généralement le site à page
unique propose une barre de
navigation classique ou une
timeline cliquable permettant
au visiteur d’accéder
immédiatement au contenu
désiré via un système
d’ancre.
14
15. STORYTELLING
Pour délivrer un message
commercial, de sensibilisation
ou d’image, un site peut
raconter une histoire. Le site
est alors construit, dans son
arborescence comme dans
son expérience de navigation,
autour d’un schéma narratif
classique emprunté au récit.
EXEMPLE
THE WALKING DEAD
Une page unique, une navigation au scroll avec animation et
parallaxe, un mouvement horizontal de la caméra pour
raconter une histoire de manière interactive autour de la série.
Un site proche du jeu et de la BD interactive.
http://www.cabletv.com/the-walking-dead
Situation initiale, élément
d é c l e n c h e u r, p é r i p é t i e s ,
résolution et fin, on verra en
2014 apparaitre des sites de
marque ou de produit
proposant tous les éléments
constitutifs d’une «brand
adventure».
15
16. ?
et pour vous... 2014
quelles sont les TENDANCES
parlons-en :
Nineteengroupe
Grégoire Lacoste
Twitter @nineteengroupe
Responsable stratégie digitale
glacoste@nineteengroupe.fr
16