Jesse James Arnold’s Post

Learn Design Tokens & UI Components with Nathan Curtis (https://lnkd.in/d-mgC7aD) Upcoming online training: Design Token and UI Component Architecture with Nathan Curtis  🗓️ Nov 18+19 2024 Online What's included: 📚 2x 4hours live workshop 🟢 Live Q&A with Nathan Curtis 📼 All recordings to rewatch anytime 🏆 Certificate of attendance This workshop exposes you to essential foundations of design system architecture — the kinds of naming, composition, configuration and process challenges involved — to equip you with techniques and activities to make, spread, and maintain a system yourself. What you will learn: Over two days, we’ll participate in presentations, collaborative activities, and in-depth discussions of design tokens and UI components. Day 1: Design tokens • Set a scope for your system’s visual foundation • Capture and name tokens for color, text, space, shape and size • Grow from generic and semantic into component-specific tokens • Tackle complicated challenges of composite tokens and theming • Plan an approach to start or refactor a token taxonomy Day 2: UI components • Organize a catalog, including naming, metadata and namespacing  • Establish a component anatomy of default, required, and varying elements • Architect prop configurations, including types, options and other models • Compose and arrange elements inside components • Balance flexibility and configurability in higher-order components Become a leading Design System expert - few spots left. 🔗 Link: https://lnkd.in/d-mgC7aD #uxdesign #ui #designsystems

You can't create a design system in a week... TL;DR: "Don’t put crap in the design system." - Josh Clark (from Brad Frost's article 'don’t put crap in the design system') I've been seeing a lot of posts claiming to have the ultimate answer or plugins that can churn out a design system in 10 minutes. Let's be real — this is nonsense. Most of these claims confuse a true design system with just component libraries in Figma. A true design system is much more than a set of components. It is about a consistent approach, standards and guidelines that ensure the coherence of your entire project. This includes standardized UI solutions, accessibility and spelling guidelines, as well as patterns, such as which notification or error status should be used in which situation, and much more. It is also deeply connected to your codebase to ensure that design and development work hand in hand. Automated tools often throw in a bunch of unnecessary stuff you'll never use. Worse, if you redesign, you're stuck carrying this junk along with you. Brad Frost's article 'don’t put crap in the design system' (https://lnkd.in/dphVdU9k) dives deeper into this issue. Don't fall for quick fixes. Building a solid design system takes time, thought, and effort - and, most likely, research. #DesignSystems #Architecture #Process #Workflow #Recipes #UX #UserExperience

Struggling with naming Design Tokens? I have a few spots left for our online training with Nathan Curtis Proud to host one of the best Design System trainings on the market: Design Token and UI Component Architecture with Nathan Curtis 🗓️ November 18+19 2024 🌍 Online 📼 All recordings and materials included About the workshop: This workshop exposes you to essential foundations of design system architecture — the kinds of naming, composition, configuration and process challenges involved — to equip you with techniques and activities to make, spread, and maintain a system yourself. What you will learn: Over two days, we’ll participate in presentations, collaborative activities, and in-depth discussions of design tokens and UI components. Day 1: Design tokens • Set a scope for your system’s visual foundation • Capture and name tokens for color, text, space, shape and size • Grow from generic and semantic into component-specific tokens • Tackle complicated challenges of composite tokens and theming • Plan an approach to start or refactor a token taxonomy Day 2: UI components • Organize a catalog, including naming, metadata and namespacing  • Establish a component anatomy of default, required, and varying elements • Architect prop configurations, including types, options and other models • Compose and arrange elements inside components • Balance flexibility and configurability in higher-order components What you will get: 📚 2x 4hours live workshop 🟢 Live Q&A with Nathan Curtis 📼 All recordings to rewatch anytime 🏆 Certificate of attendance 👉🏻 Secure your spot: https://lnkd.in/gfYGCU69 Join me to learn from the best and become a leading Design System expert. See you there! #uxdesign #designsystems #ui

#DesignSystems Why should you invest in a Design System?? It's simple, as Greg Shuster explains, "Spend less time designing <and developing> and more time shipping!" Furthermore, Greg shares several of the top design systems as well as a design starter kit!! #DesignThinking #UIUX #UX #UserExperience #UXD #UserExperienceDesign #ProductDesign #EfficiencyInDesign #ScaleByDesign #DevTools

🎉 Milestone Achieved: Design Systems Certificate 🎉 I’m excited to share that I’ve just completed the Design Systems Course from Design System University! 🎨✨ Over the past few weeks, I’ve gained a deep understanding of creating cohesive, scalable design systems that improve collaboration between design and development. From design tokens to component libraries, I now have a toolkit that will help me build consistent and efficient user experiences. 🛠️ What I learned: - Design Systems Basics. - Processes, Workflows (Agile, Waterfall, Hot Potato), and Frameworks (React). - Design System Tools for designing and coding the components (Figma, Visual Studio Code). - How do I do Documentation & Reference Websites by using the zeroheight website? - Some Tips for Creativity and Deviating. A big thank you to Dan Mall and everyone who supported me on this learning journey! 🙏 I’m eager to apply these new skills to future projects and continue contributing to user-centered, scalable design solutions. 💡 On to the next challenge! to learn more about the design system and about the front-end frameworks to create the component inshallah🚀 Please visit 👀: www.mustafakamel.com #DesignSystems #UserExperience #UXDesign #ProductDesign #ContinuousLearning #DesignCommunity #UIUX #GrowthMindset

🎇Thrilled to Announce 🤗 I've completed Course 3 of 7 - Build Wireframes and Low-Fidelity Prototypes from Google on Coursera. Key takeaways: •Building Paper and Digital wireframes. •Sketching low fidelity Prototypes both in paper and figma. •Benefits and Drawbacks of prototypes. •Information Architecture and its importance. •How to keep biasness in mind while designing. Here's to new beginnings and endless possibilities! 💼🌟 #Certified #AchievementUnlocked #FutureReady #uxdesign #wireframes #coursera #prototypes

I'm gearing up to create design system (DS) documentation and looking for advice! Our goal is to enable speed to delivery by empowering product managers and engineers with simple, easy to use docs. I'm thinking to use Confluence for custom components/patterns and for anything else, direct users to Material UI. (Our DS is based in Material UI and not yet custom-themed.) Example use case: Team wants to build a new module or add a new step to an existing flow, but the UX resource is busy on another strategic project. Instead of breaking the UXer's focus, the PM & Engineers would reuse existing components from the DS and follow established patterns. As needed, they could request new components to be added to the DS, or new configurations to be made available for existing components. * In your eyes, what does a REAL MVP of DS docs look like? * What are essential processes to have outlined BEFORE it's used? * How do you keep team engagement and UI consistency high? * How do you reduce or remove dependency for engineers to update docs? (I'm thinking of using Confluence.) Many thanks in advance! #DesignSystems #UserExperienceStrategy

Why Product Designers Should Embrace No-Code Tools Product designers, the power of no-code tools is in your hands! These tools allow you to: - Prototype faster: Skip lengthy handoffs to developers and build interactive prototypes yourself, getting valuable user feedback quicker. - Bridge the communication gap: Communicate design ideas more effectively by creating functional prototypes that showcase interactions and user flows. - Boost your creativity: Experiment with new features and concepts without coding limitations, pushing design boundaries. - Collaborate seamlessly: Work hand-in-hand with developers by creating high-fidelity prototypes that translate easily into code. No-code tools don't replace designers, they empower them! Ready to level up your design process? Explore no-code tools and see how they can supercharge your workflow! #ProductDesign #NoCode #DesignThinking #Prototyping

Great blog from one of our partners Rangle.io on Dev Mode and some of the key points it helps to address around improving efficiency, providing a single source of truth and improving collaboration between design and development. Check it out here: #uxdesign #designprocess #devmode

In this article, I have written the process of handoff design to developers. I invite you to read through it and share your feedback. https://lnkd.in/g4v9sFvt #designhandoff #uxdesign #uicommunication #developerhandoff #productdesign #designprocess #collaboration #development