UX Planet·1yUI Design with ChatGPT 4o
ChatGPT 4o can now generate sophisticated UI designs with real text by using detailed prompts. Although it may not produce an exact pixel-perfect design, it is useful for quickly experimenting with different ideas. The post provides a step-by-step guide on how to use ChatGPT for UI design, the importance of detailed prompts, and recommendations for refining designs using tools like Figma.
Medium·48w14 logic-driven UI design tips to improve any interface
A comprehensive guide presenting 14 practical UI design principles based on logic rather than intuition. Covers essential topics including proper spacing using 8-point grids, WCAG accessibility contrast ratios (3:1 for UI elements, 4.5:1 for text), button hierarchy and target sizes, typography best practices, and visual consistency. Demonstrates these principles by transforming a poorly designed profile page interface, addressing issues like inadequate contrast, confusing navigation, poor spacing, and accessibility problems. Emphasizes that good UI design follows structured guidelines rather than artistic instinct.
Hacker News·37wReshaped is now open-source
Reshaped, a design system that bridges React components and Figma libraries, has become fully open source after five years of paid development. The creator initially built it to solve the 80% of common web design patterns while providing flexibility for custom solutions. After making the React package free two years ago, both the React library source code and Figma library are now publicly available on GitHub and Figma Community respectively.
Community Picks·1yFree and open-source SVG illustrations
Flowbite Illustrations offers 54 free and open-source SVG illustrations compatible with Flowbite and Tailwind CSS. Customize colors easily and access support for SVG, PNG formats, and a Figma file. The illustrations can be used in personal and commercial projects with proper credits, and they are suitable for various front-end frameworks.
Community Picks·1yBuilding a Design System as a Solo designer in a startup
The post shares a detailed experience of building a design system as a solo designer in a startup environment. It highlights the challenges of creating an efficient design infrastructure, the process of learning and setting up components and documentation, and the importance of collaboration with engineering teams. The journey includes transitioning from initial failures to a more robust version using tools like ShadCN UI, Supernova, and AI integrations, resulting in significant improvements in product usability and company revenue.
Community Picks·1yHow to Turn Figma Designs into code with Next.js, Tailwind CSS, Shadcn in 2025
The post provides a comprehensive guide on translating Figma designs into functional code using Next.js, Tailwind CSS, and Shadcn. It explains setting up a front-end environment, integrating APIs, managing global state with Redux, and customizing design elements. Detailed instructions are included for transforming color palettes, typography, and component designs from Figma into code. It also introduces Ban, a JavaScript runtime, as an alternative to Node.js for improved performance and security.
DesignCourse·21w2026 UI/UX Design Trends - 2 of the Biggest Trends
Two major UI/UX design trends for 2026: First, designers should adopt AI-assisted development tools like Cursor to become full-stack capable, moving beyond Figma-only workflows to build functional prototypes and projects without deep coding expertise. Second, designers should learn low-code/no-code WebGL tools (Unicorn Studio, Spline 3D, HANA, Rive) to create distinctive experiences that differentiate from AI-generated designs. The combination of AI-assisted development skills and specialized visual tools will separate skilled designers from generic AI output.
Kiki's Bytes·28wHow Figma Scaled To 10 Million Users
Figma scaled from a single PostgreSQL database to a horizontally sharded architecture supporting 10 million users. The journey involved three phases: immediate relief through vertical scaling, read replicas, and connection pooling; medium-term stability via logical partitioning of table groups into dedicated databases; and long-term scalability through horizontal sharding with a custom query router. Key innovations included optimized logical replication by removing indexes during migration, two-phase deployment using PG Bouncer for safe routing changes, logical sharding with PostgreSQL views for testing before physical splits, and a custom Golang DB proxy for intelligent query routing across shards.
UX Planet·49wFigma MCP: Complete Guide
Figma MCP (Model Context Protocol) enables AI code generators like Cursor to understand Figma designs at a semantic level, providing better design-to-code conversion than screenshot-based approaches. The guide covers setup requirements including Figma Desktop app and compatible code editors, configuration steps for both Figma and Cursor, and troubleshooting common issues like 'get_code' and 'get_image' errors. MCP offers design token awareness and semantic precision, allowing AI to access exact variable names, hierarchy, and constraints for better alignment with design systems.
UX Planet·35w7 UX Skills that will be DEAD by 2026: AI will replace them
Seven traditional UX design skills are predicted to become obsolete by 2026 due to AI automation and changing industry demands. Static wireframing in Figma is being replaced by interactive prototypes built with AI-powered tools like Replit and Lovable. Manual handoffs to developers are giving way to design-to-code workflows that generate functional components. Traditional usability testing is being supplemented by AI-driven analysis and hybrid testing systems. The shift moves away from designing for average users toward adaptive, personalized experiences, replacing click-based navigation with gesture-first patterns, and emphasizing data-informed decisions over intuition. Modern UX designers must understand business metrics and ROI to remain strategically relevant.
Medium·47wTop UI/UX design trends to watch in 2025
UI/UX design in 2025 focuses on intelligent design systems with AI-assisted components, meaningful microinteractions, and subtle personalization. Key trends include voice UI integration, accessibility as a foundation rather than afterthought, smarter Figma workflows, motion design integration, trust-building interfaces, and adaptive UI that responds to user environment. The emphasis shifts from following trends blindly to understanding user needs and creating purposeful, accessible experiences.
Community Picks·49wMade with TailwindCSS, shadcn/ui, Radix UI and Figma.
MynaUI is a comprehensive design system and UI kit built with TailwindCSS, shadcn/ui, and Radix UI. It provides customizable building blocks including elements, forms, marketing components, and application-specific components for web development projects.
Figma·48w6 skills every engineer needs for the AI era
Software engineers need to develop six key skills to thrive in the AI era: using AI for problem exploration beyond automation, vibe coding to discover better solutions, leveraging agentic capabilities like Model Context Protocol for improved outputs, auditing pull requests with LLMs, managing teams of AI agents by breaking down complex problems, and continuously experimenting with AI tools to push beyond preconceived limitations. The focus should be on augmentation rather than just automation, allowing engineers to spend more time on meaningful problem-solving and user-focused development.
UX Planet·1yTurn Figma design into Code: Lovable vs Anima
Bridging the gap between design and development can be achieved using the right tools. Lovable and Anima are two solutions for converting Figma designs into code, each with its process and challenges. Lovable relies on Builder.io for exporting designs and often needs tweaks post-export, while Anima offers a more integrated process with fewer visual defects and a better AI understanding of user prompts. Both tools help streamline the design-to-code workflow, though they come with their own pros and cons.
GitHub Blog·27wLevel up design-to-code collaboration with GitHub’s open source Annotation Toolkit
GitHub open sourced the Annotation Toolkit, a Figma library that improves design-to-code handoffs by embedding accessibility documentation directly into design files. The toolkit uses numbered annotation stamps to document design intent, WCAG compliance requirements, and interactive behaviors, preventing accessibility issues before they reach production. GitHub's internal data showed 48% of accessibility audit issues could have been prevented with better upfront documentation. The toolkit is available on Figma Community and GitHub, includes interactive checklists and WCAG guidance, and accepts community contributions.
Atlassian·37wBehind the screens: Building Atlassian’s new icon system
Atlassian redesigned their entire icon system after six years, moving from 350+ inconsistent icons to a unified system with thinner strokes, consistent sizing, and better visual harmony. The project included building Icon Lab for team contributions, creating automated migration tools, and establishing clear naming conventions. Over 275 new icons have been contributed, with migration tools handling 16,000+ code changes across their products.
Open Source·1yWhat I Learned After 3 Hours of Typography Debugging
Learn about the challenges and solutions related to typography in web development, focusing on the differences in text rendering between Figma and browsers. This guide covers essential concepts like baseline, cap-height, x-height, and provides practical solutions for common text alignment issues.
YouTube·51wStitch AI: Google's New FREE AI Tool Creates Stunning UI In A Single Click!
Google launched Stitch AI, a free beta tool that generates UI designs for mobile and web apps from text prompts. Users can describe their desired interface, and the AI creates multiple screens within seconds. The tool supports theme customization, direct Figma integration, and experimental image-based design generation. Stitch allows iterative editing through conversational prompts and exports designs directly to Figma for further development.
Nordic APIs·29w10 APIs for UI Designers to Check Out
A curated list of 10 APIs that streamline UI design workflows, covering icons (Noun Project), color management (Color API), typography (Google Fonts), gradients (UI Gradients), stock images (Unsplash), design tools (Figma, Sketch), databases (Airtable), analytics (Google Analytics), and file sharing (Dropbox). Each API helps designers access assets, automate tasks, and maintain consistency without leaving their development environment.
CodePen·27wChris’ Corner: Cursors
CSS provides built-in cursor styles that can enhance user experience when applied thoughtfully. OS-supplied cursors support accessibility features like size adjustments, while custom cursors can create problems. The article explores cursor best practices, highlighting how tools like Figma extend cursor functionality with contextual information, preview states, and collaborative features without replacing the default cursor entirely.
Figma·30wIntroducing Figma Weave: the next generation of AI-native creation at Figma
Figma acquired Weavy, rebranding it as Figma Weave, to integrate AI-powered image, video, animation, and VFX generation capabilities into its platform. Weavy combines multiple leading AI models (Seedance, Sora, Veo, Flux, Ideogram) with professional editing tools in a browser-based, node-based canvas. The platform enables creators to generate AI outputs and refine them with hands-on editing controls like lighting adjustments, masking, and color grading. The acquisition aims to enhance Figma's vision of combining human craft with AI generation, moving beyond simple prompts to create more refined, professional creative work.
Juxtopposed·25wI Redesigned App UIs "LITERALLY"
A creative exploration of redesigning popular software interfaces based on their literal names. The author reimagines Blender as an actual blender with cylindrical workspace, SoundCloud as cloud-shaped music players, 7zip with seven zippers as progress bars, Steam with industrial pipes and valves, Obsidian with Minecraft-style blocks over lava, Chrome as metallic chromium, Telegram as vintage telegraph messages, TikTok with a prominent time counter, and Letterboxd as movie stamps in envelopes. Each redesign transforms functional UI elements into thematic visual metaphors while maintaining core functionality.
Codrops·42wDesigner Spotlight: Julie Marting
Julie Marting is a Paris-based interactive designer at Hervé Studio who specializes in creating immersive digital experiences using 3D design and WebGL. Her portfolio includes projects for major brands like LVMH, Cartier, and Lacoste, focusing on playful interactions and emotional user engagement. She emphasizes the importance of meaningful design that transports users beyond the ordinary, using tools like Figma and Cinema 4D while prioritizing communication between designers and developers.
DesignCourse·1yHas the Figma Killer arRIVE'd?
The writer discusses whether Rive, a new design tool, will replace Figma. They highlight Rive's advantages, including production-ready designs and superior animation and prototyping capabilities. The author anticipates new features like a component system and data binding, making Rive a strong competitor to Figma. Readers are invited to share their thoughts on Rive potentially making Figma obsolete.
Product Hunt·40wDualite: Local-first AI builder for mobile and web apps
Dualite is a local-first AI-powered development platform that enables building full-stack web and mobile applications while keeping all data and prompts secure on the user's browser. The platform integrates with popular tools like Figma for design imports, GitHub for code synchronization, and Supabase for backend functionality. It supports multiple frameworks including React, Angular, Vue, and offers features like automatic debugging, real-time API connections, and instant deployment through Netlify. The tool targets startups, agencies, enterprises, and indie developers who want to build applications quickly without extensive manual coding.