Tu as prévu de créer un site internet cette année ou tu songes à moderniser un peu celui que tu as actuellement ? L’article du jour devrait t’intéresser ! 😊 Eh oui, c’est le retour de ma série spéciale “inspiration webdesign” pour t’aider à faire le plein d’idée et à avancer sur ton projet web. 🙂
Alors que nous entamons (déjà 😱) le deuxième trimestre de 2024, je te propose de découvrir 3 grandes tendances webdesign parmi les plus en vogue cette année : le bento design, le maximalisme et le calm design.
De quoi t’en mettre plein les yeux et doper à fond ton inspiration ! 💡💪
1. Le bento design : en 2024, think inside the box ! 😆
Inspiré des présentations Keynote d’Apple, le bento design tire son nom de la célèbre boîte à lunch japonaise, caractérisée par ses petits compartiments pour répartir les aliments. 🍱
L’idée est d’appliquer ce même principe de découpage aux pages web en dispatchant les contenus dans des boîtes qui s’imbriquent entre-elles, un peu comme un Tetris ! 🙂👾
Si ce style de conception graphique figure parmi les tendances webdesign les plus suivies cette année, c’est notamment parce qu’il offre une approche intéressante en termes d’UX (expérience utilisateur). 👍
En effet, le fait de compartimenter l’interface utilisateur permet d’organiser l’information et de délimiter clairement les différentes fonctionnalités du site. 📦
Cela permet également d’utiliser efficacement tout l’espace, d’apporter une certaine structure aux contenus, d’attirer l’attention et de faciliter la hiérarchisation en faisant ressortir les éléments clés. 🔆
Le bento design est aussi très pratique, car optimisé pour le responsive design, c’est-à-dire que les sites de ce type s’affichent généralement très bien sur tous types de supports (téléphones, tablettes, ordinateurs…). 📲
En plus d’avoir un côté fonctionnel et “bien rangé” 📥 pour les internautes, les sites conçus dans ce style ont aussi un chouette potentiel créatif. 🎨 En effet, il suffit de jouer habilement avec les couleurs, les contrastes, les textes et les visuels pour créer un patchwork original et impactant qui en met plein les yeux. 😍
Mais trêve de bavardage 🙂, passons aux exemples pour que tu puisses te faire une idée plus précise de cette nouvelle tendance… 👇
Lollaparis.com
Comme tu le vois, le design de ce site est compartimenté en boxes avec une sorte de quadrillage coloré et contrasté qui vient délimiter et faire ressortir certains éléments clés comme la date du festival, le lieu, le champ d’inscription à la newsletter et les partenaires. Les textes, eux, sont réduits au strict minimum.
Ici, on mise avant tout sur les photos et éléments graphiques pour véhiculer l’ambiance de l’événement avec une identité visuelle vivante et festive. 🥳
Ikea.com
Pour la célèbre marque aux étagères Billy et Kallax, compartimenter son site s’imposait un peu comme une évidence. 😆
Ici, tout est bien rangé, avec une alternance de boxes en pleine page, puis en deux colonnes pour donner du rythme grâce à l’alternance des formats.
Sur cette page d’accueil ergonomique, chaque boîte est cliquable pour aller rapidement là où on le souhaite et faciliter la navigation. 👩💻
Par ailleurs, l’utilisation d’espaces blancs permet de poser le regard et évite de surcharger les pages.
Bref, comme tu le vois, c’est simple, agréable à regarder et surtout très efficace. 👌
Serretoundra.com
Encore un bel exemple de bento design, mais dans un tout autre univers puisque nous sommes maintenant sur le site d’un producteur canadien de concombre et de cornichons 🥒😄.
Là encore, tout est bien compartimenté dans de grandes boîtes colorées. On peut aussi relever les angles arrondis des encarts 🔲 qui confèrent au site un côté fun et convivial tout en évitant la “rigidité” que pourrait donner ce type de design web. 👍
Et comme sur la plupart des sites de ce style, les textes sont savamment dosés et utilisés avec parcimonie, pour valoriser au maximum les visuels produits. 📸
Jungl-dating.com
Passons à présent à un autre exemple de site vitrine à la fois original et minimaliste destiné à promouvoir l’application de dating “Jungl” 🤳. Ici encore, on retrouve nos boxes aux contours arrondis avec, à l’intérieur, différents contenus très visuels.
Un fois de plus, il y a assez peu de texte. La marque préfère s’appuyer sur les images pour véhiculer son message et mise avant tout sur les photos et éléments graphiques. 🖼️
L’idée est vraiment de distiller intelligemment les contenus textuels pour aérer et éviter d’alourdir le rendu global (imagine, si tous les blocs contenaient du texte, le site deviendrait vite indigeste pour l’utilisateur 🤪).
Bolt.com
Allez, tu reprendras bien un dernier petit bento pour la route ! 😂
Comme tu peux le voir sur ce dernier site très dynamique, les compartiments ne sont pas utilisés sur l’ensemble du site, mais uniquement sur certaines sections, ce qui est intéressant en termes d’expérience utilisateur pour faire ressortir certains éléments et guider le regard. 👁️
De même, il y a beaucoup d’espace autour de chaque box et un vrai contraste avec l’arrière-plan ce qui permet de bien mettre en avant les informations qui y figurent. 👍
Petit tips si tu apprécies ce type de design : sache qu’il existe un super outil pour relooker ton arbre à lien Instagram en mode bento (et pas que pour Insta d’ailleurs) : bento.me. C’est tout simple à créer et visuellement, ça fait vraiment la différence !😍
2. Le maximalisme : l’une des tendances webdesign les plus prisées du moment
Bien que les sites web minimalistes aient toujours la cote, il existe une autre tendance, à l’extrême opposé, qui séduit de plus en plus de webdesigners ces dernières années : le maximalisme. 🙂
Ce courant graphique, qui se retrouve aussi en décoration, s’inspire en partie de l’architecture baroque et du mouvement rococo qui se caractérise par un mélange de style et par l’utilisation de couleurs, textures et motifs très variés. 🎨
Les sites internet maximalistes s’appuient généralement sur une base de flat design (avec de grands aplats de couleur) et se caractérisent par leur aspect audacieux et énergique, voire un peu excentrique. 👩🎤
Ils se reconnaissent facilement par l’utilisation d’une large palette de couleurs vives, par une profusion d’éléments graphiques et des mélanges de styles parfois osés. 🤘
Les typographies y sont particulièrement bien mises en avant et jouent un rôle central, tout comme les images qui s’affichent souvent en grand format. 😮
Ici, les designers n’hésitent pas à jouer avec les formes et les motifs, à faire des collages en juxtaposant des photos et divers éléments graphiques, voire à intégrer des illusions d’optique pour un effet encore plus captivant et immersif. 💥
Enfin, le maximalisme tend à favoriser les expériences interactives et immersives par l’intégration d’animations, de vidéos, gifs et autres effets de mouvements qui renforcent l’impact visuel sur le visiteur. 😍
Tu l’auras compris, tout est fait pour mettre les sens en éveil et créer le fameux effet “wahou !” 🤩
Pour la petite histoire, cette tendance webdesign a notamment émergé pour s’adapter aux millénials et Gen-Z qui sont de gros utilisateurs d’applications telles que Tik-Tok et Instagram et donc reçoivent quotidiennement une énorme quantité d’infos. Leur attention étant beaucoup plus volatile, ce type de design “choc” permet de mieux retenir leur attention.
Mais comme des images parlent souvent mieux qu’un long blabla, voici maintenant quelques exemples de sites maximalistes !
Currentvehicles.com
Commençons par faire un petit tour sur le site de ce service de location de voitures électriques.
Il fait tout de suite son petit effet n’est-ce pas ? 🤩
Des couleurs flashy et joyeuses, des éléments graphiques distillés un peu partout, de jolies courbes, une typo extra bold et des photos grand format… pas de doute, on est bien sur un site maximaliste.
Comme tu le vois, il y a une vraie patte créative et tout est fait pour retenir l’attention 😍
Manayerbamate.com
Ici encore, on a affaire à un site très cool et haut en couleur avec des illustrations XXL qui s’animent (avec de jolis personnages) et des éléments graphiques en mouvement à l’effet quasi hypnotique.
🌟 Mention spéciale pour la super animation qui se déploie lors du défilement de la page avec la canette qui se retourne, puis s’ouvre et les encarts de textes avec les avantages produits qui se mettent à tourner tout autour.
C’est simple, chaque détail a été soigneusement pensé (les photos grand format, les jeux de typos, les pictos…) et on en prend plein la vue du début à la fin. 😍 Une chose est sûre, l’objectif “capter l’attention” est 100% atteint ! 🎯
Junioneda.com
Là aussi l’audace et la créativité sont au rendez-vous !
Une palette de couleur riche et variée, des teintes saturées qui attirent le regard, des fonds pleins de peps qui font ressortir les textes et les illustrations 🖍️, une petite touche rétro mêlée de modernité, une typographie expressive… À peine arrivé, on comprend immédiatement que ce site respire la créativité, mais aussi une forte personnalité (on voit tout de suite qu’on est sur le site d’un artiste 👨🎨😉).
Ce site se distingue aussi par ses innombrables détails avec de nombreux motifs et éléments graphiques, des illustrations très riches et un bel effet de mouvement
D’ailleurs, petit détail sympa et original : le personnage allongé en bas de page, qui reste fixe lors du scroll et qui semble regarder le contenu qui défile. Cela crée une mise en perspective très intéressante, et renforce encore un peu sa singularité.
Enfin, tu remarqueras qu’il y a très peu d’espaces vides et que l’ensemble du site est recouvert, ce qui lui donne un côté saturé et foisonnant de créativité. Bref, tous les ingrédients sont réunis pour en faire le site maximaliste par excellence ! 🙂
Cash.app
Dans le genre “wahou”, le site cash app n’est pas mal non plus ! 😄
Une fois de plus, les couleurs sont flashy et contrastées et les visuels captivants avec un mélange harmonieux de photos et d’animations 3D aux teintes néon irisées. Cela donne un aspect assez magnétique, tout en mouvement, presque électrique ⚡… Parfait pour retenir l’attention des internautes ! 🤩
Là aussi, tout l’espace est occupé, ce qui crée un effet de densité et d’opulence.
Le webdesigner semble lui avoir volontairement donné un côté rococo, un peu “bling bling” 😎, pour évoquer la notion d’enrichissement personnel et faire écho à la proposition de valeur de la marque. Et comme tu le vois, ça fonctionne très bien ! 👌
Sneakenergy.com
Nouveau site, nouvelle ambiance, mais dans l’esprit maximaliste toujours. 🙂
Ici, les couleurs vives viennent contraster avec un fond sombre, ce qui capte immédiatement le regard. 👀 Si le rouge et le bleu dominent, de nombreuses couleurs, très vitaminées, sont aussi amenées par le biais des photos, ce qui donne au site une certaine densité.
Les polices ont du caractère et les éléments se superposent tout en occupant un maximum d’espace. Le style est moderne et dynamique et incarne parfaitement l’énergie vibrante de la marque. ⚡
Les bandeaux de texte qui défilent contribuent eux aussi à cet effet et donnent du rythme à la mise en page.
Enfin, on notera la mise en avant des produits avec des photos audacieuses qui attirent le regard tout en reflétant une personnalité affirmée et pleine de peps .
Studio-job.com
Prête à en prendre plein les yeux ??? Attache bien ta ceinture, car ce site-là décoiffe ! 🤩
Ici, aucun doute, on est sur du pur maximalisme avec un design ultra créatif, très chargé et vraiment original. Un savant mélange d’univers baroque et rock’n’roll avec une pointe de kitch qui le rend assez unique, mais aussi très fun. 😆
Maximaliste, mais pas que ! Eh oui, car il surfe aussi sur la tendance du bento design 🍱 avec un système de grille qui lui permet d’accumuler les visuels de créations en tout genre. 😮
Comme tu peux le voir sur la vidéo ci-dessous, il y a un effet de scroll infini avec une multitude de photos, d’illustrations et d’éléments graphiques qui se succèdent (dont certains reviennent en boucle régulièrement). On peut aussi noter plein de petites animations et fonctionnalités disséminées un peu partout, comme la possibilité de lancer une musique d’ambiance 🎵.
Les typographies, elles aussi, sont très variées et très recherchées avec une forte personnalité pour chacune d’entre elles. 💥
Enfin, comme tu pourras le constater si tu navigues un peu sur le site, il y a eu un vrai travail de réflexion autour de l’ergonomie et de l’expérience utilisateur. Si cela peut sembler fouillis de prime abord, tout est bien rangé et on accède facilement à ce qu’on est venu chercher. 👍 Bref, on peut saluer les designers du site 👏, car on voit qu’il y a eu énormément de travail pour le concevoir et pour ce qui est d’aspirer notre attention, il fait vraiment son « job » ! 😆
Halomedia.com
On finit avec un autre genre de maximalisme, plus sobre et glamour cette fois. 😎
Ici, même si le noir prédomine, il est relevé par des apports de couleurs fortes dans les photos. 📸 Cela donne plus d’impact aux textes et aux images en les faisant ressortir davantage.
Ce qui captive sur ce site, c’est surtout la puissance des photos et des vidéos, marquée par des personnalités expressives et des décors élégants.
Le grand cercle avec la vidéo qui tourne en boucle en enchaînant diverses prises de vues (toutes très soignées) donne un côté captivant, presque hypnotique 👁️, tout comme les animations et les jolis effets de zoom sur les photos. 👍
3. Le calm design : parce que respirer un peu, ça fait du bien aussi ! 😅
Après toute cette opulence, je te propose de revenir à des univers plus simples et plus posés avec ce qu’on appelle le “calm design”.
À l’inverse du maximalisme, cette tendance webdesign se reconnaît à ses palettes de couleurs neutres, ses designs épurés, ses photos apaisantes, ses animations subtiles et ses typos douces et légères.
Sur ces sites tout est fait pour inspirer une ambiance humaine et accueillante, un espace de quiétude où l’on se sent bien. 🧘♀️
Inspiré du concept de “calm technology”, ce type de conception vient répondre à la demande croissante d’avoir des espaces numériques qui favorisent le bien être mental.
Ces sites internet sont pensés pour faciliter la concentration avec des interfaces qui cherchent d’abord à prendre soin de nous, à nous préserver, en favorisant la détente et la tranquillité, plutôt qu’à nous assaillir de stimuli et à chercher sans cesse à capter notre attention. 😅
Voyons de plus près à quoi ça ressemble avec quelques jolis exemples… 🔎
Typology.com
Comme tu peux le voir, le site de la marque Typologie coche toutes les cases du calm design. Il arbore un look doux et épuré avec un camaïeu de teintes très claires (blanc, gris, écru), des visuels élégants et minimalistes et beaucoup d’espaces vides qui apaisent le regard. 🧘♀️
Les éléments interactifs y sont subtils, tout en légèreté et il en émane une certaine sobriété qui lui donne un côté luxueux et reposant. 👌
Shine.fr
Dans un autre style, le site de la banque en ligne Shine produit le même effet apaisant et rassurant pour les internautes. 😊 Le choix d’un jaune doux et chaleureux , associé au blanc et au gris lui donne un aspect lumineux et très lisible.
Les typographies simples et légères contribuent également à cette clarté. On peut aussi saluer l’ergonomie du site avec une organisation et une hiérarchie de l’information qui permet aux internautes de tout trouver en quelques clics. 👏
Les photos enfin, avec leurs visages souriants et leur jolie lumière inspirent la sérénité et la confiance.
Aesop.com
Ici on retrouve un esprit assez proche de celui du site Typologie avec des teintes claires, des polices de caractères toutes simples et des photos lumineuses et dépouillées qui valorisent le produit. 🧴
Un look minimaliste qui ne va pas sans rappeler le design des packagings de la marque. 😉
L’idée est vraiment d’aller droit au but 🎯 et de ne pas fatiguer le regard avec des fioritures.
After.com
On finit sur un tout autre univers avec un site qui aborde un thème assez sensible : la préparation des funérailles.
Face à un sujet grave et généralement source d’angoisses, on ne peut que valider ce choix de design à la fois rassurant et apaisant. ✅
Les teintes douces et pastels, les illustrations qui évoquent la nature 🌱⛰️, les photos de personnes aux visages sereins et bienveillants 🙂, les nombreux espaces blancs, la douceur des courbes, les choix typographiques… tout est réuni pour rendre la navigation agréable et fluide, renforcer la confiance des internautes, tout en favorisant la clarté et l’accessibilité des informations (ce qui est bien vu pour une cible généralement âgée 🧓).
Et voilà chère Audacieuse Créative, c’est fini pour aujourd’hui ! J’espère que cette petite session à la découverte des dernières tendances webdesign t’a donné plein d’idées et t’a motivée pour te lancer dans la création de ton site internet !
Tu as besoin de concevoir un site efficace et attractif pour aider ta marque à se démarquer sur le web ? Le seul hic : tu n’as pas le temps ni les compétences suffisantes pour le faire par toi-même… 😬 Savais-tu que je peux aussi t’aider dans la conception de tous les éléments de ton identité visuelle et de tes différents supports de communication (création de site internet, de logo, de charte graphique, de templates Instagram, etc.) ? Pour en savoir plus, n’hésite pas à jeter un œil à mes offres de service !
(N’oublie pas d’enregistrer cet article dans ton compte Pinterest ! 👇🏻)