Créer un système de couleurs dans Bubble | Tutoriel

Описание: Dans cette vidéo YouTube, nous allons discuter de l'importance de la couleur dans le design d'interface utilisateur (UI) et du rôle qu'elle joue dans la création d'expériences utilisateur captivantes. Comprendre la psychologie de la couleur nous permet de créer des designs qui résonnent véritablement avec nos clients. En exploitant la couleur, nous pouvons guider les interactions des utilisateurs vers des éléments essentiels tels que les boutons d'inscription, les boutons de connexion et les appels à l'action (CTA).

Si vous avez déjà utilisé Figma et travaillé dans une agence ou une équipe de développement, vous avez probablement rencontré Untitled UI et divers kits UI. Ces kits offrent des systèmes de couleurs étendus avec de nombreuses nuances et teintes. Cependant, lorsque vous travaillez seul ou dans une petite équipe avec Bubble, vous pourriez avoir besoin d'un système de couleurs plus concis.

Je vais partager avec vous le système de couleurs qui m'a bien servi dans tous mes projets. Nous explorerons les couleurs neutres, les couleurs primaires et des couleurs supplémentaires comme le succès, l'avertissement et le danger. Ensuite, je vous montrerai comment configurer ces couleurs dans le système de style de couleur défini par Bubble.

Avec ce système, vous aurez une approche simplifiée et efficace de la sélection des couleurs. Nous aborderons également le concept d'interaction des couleurs, comme la façon dont les couleurs changent lorsque les boutons sont survolés ou cliqués.

Créer un système de couleurs harmonieux peut être un défi, mais nous explorerons diverses ressources et outils qui peuvent aider, tels que ColorsUI et des systèmes de couleurs existants comme Material de Google. En utilisant la couleur de manière stratégique et réfléchie, nous pouvons créer des designs équilibrés et visuellement attrayants.

Tout au long de la vidéo, nous fournirons des exemples pratiques et des aperçus pour vous aider à mettre en œuvre des choix de couleurs efficaces dans vos propres designs. Préparez-vous à plonger dans le monde fascinant de la couleur dans le design UI !

==========

⏰ Codes temporels ⏰
0:00 - Introduction
00:28 - Exemples de systèmes de couleurs
01:46 - Mon système de couleurs Bubble
03:02 - Variables de couleur dans Bubble
09:08 - Styles de bouton
10:39 - Comment créer un système de couleurs
14:40 - Règle des 60 30 10
17:32 - Équilibre des couleurs
18:24 - Commentaires de clôture

==========

👨‍🏫 Qui est votre instructeur ? 👩‍🏫

Gregory John, votre instructeur de cours, est un expert de Bubble chevronné avec 7 ans d'expérience dans la création d'applications sans code, travaillant avec des startups sans code et même enseignant le no-code à l'Université Yale. Il sera votre guide tout au long de ce voyage passionnant, partageant des astuces, des conseils et les meilleures pratiques pour garantir votre succès.

Ne manquez pas cette opportunité de vous lancer dans votre aventure sans code ! Appuyez sur le bouton "S'abonner", activez les notifications, et préparez-vous à révolutionner votre jeu de développement web avec Bubble.

📅 Restez à l'écoute pour la date de sortie de la première leçon et commençons ensemble ce voyage excitant ! 🚀

#Bubble #NoCode #DéveloppementWeb #TutorielPourDébutants #ApprendreBubble #DéveloppementSansCode

==========

👨‍🏫 Cours

BeginnersCamp : Une introduction complète à Bubble 🔥
👉 https://buildcamp.io/course/beginners...

Flexcamp : Maîtriser le design réactif dans Bubble 🔥
👉 https://buildcamp.io/course/flexcamp-...

Saascamp : Construire une entreprise Saas rentable avec le no-code. 🔥
👉 https://buildcamp.io/course/saascamp-...

MarketplaceCamp : Construire un marché locatif à deux côtés avec le no-code 🔥
👉 https://buildcamp.io/course/marketpla...

Apprenez à utiliser Bubble 👨‍🎓
👉 https://buildcamp.io

Rejoignez notre communauté no-code 🧑‍🤝‍🧑
👉 https://community.buildcamp.io

==========

Suivez Buildcamp sur Twitter
🐦   / buildcamp  

Suivez Gregory John sur Twitter
🐦   / _gregoryjohn