The design system revolution of the last decade has brought with it all sorts of tools and strategies to enhance product development workflows. Design tokens are one of those tools many design systems, including Google’s Material Design 3 and MUI, have adopted to make UI elements easier to implement, manage, and update. Announcement: UXPin’s design
(…)UXPin Blog — Design Studio
-
-
What are Interactive Components? Bring your Prototypes to Life in UXPin
Interactions are vital for prototyping because they provide usability participants and stakeholders with a realistic user experience. The problem many designers have is building interactive components is time-consuming, and the results are underwhelming in most design tools. Discover component-driven prototyping with UXPin Merge and how you can use interactive components to create fully functional prototypes
(…) -
Laravel and Tailwind CSS — A Quick Integration Guide
If you’re developing a web application that requires both robust backend functionalities and a flexible, stylish frontend, Laravel and Tailwind CSS make a perfect combination. There are several other popular CSS frameworks and libraries you can use with Laravel. Tailwind CSS stands out from other CSS frameworks due to several distinctive features that cater to
(…) -
Material UI vs Bootstrap – What to Use?
When it comes to building responsive, aesthetically pleasing web applications, two frameworks often come into the spotlight: Material UI and Bootstrap. Both are powerful tools in a developer’s arsenal, each with unique strengths and philosophies. Let’s dive into a comparative analysis of these two front-end giants to help you decide which one aligns best with
(…) -
ChatGPT in UI Design – How UXPin Can Generate UI Components
ChatGPT is a language model developed by OpenAI. It is part of the generative AI tools which utilize deep learning techniques to understand and generate text. The model works like a chatbot for asking questions or giving prompts, and it generates contextually relevant responses. Designed to handle a variety of natural language understanding and generation
(…) -
Code to Design Complete Guide for 2024
Design-to-code is a familiar workflow. Designers create a prototype using a design tool, and developers convert it to code–a simplified version of the standard product development process. UXPin Merge turns this process upside down with a revolutionary code-to-design workflow. This article explains code to design and how it enhances the product development process with four
(…) -
React Design System – Where to Start?
Building a React design system from scratch requires careful planning and consideration. Input from multiple departments and stakeholders is crucial for creating a component library that serves the organization and its end users. This article is an introduction to React design systems and how to approach component development, documentation, governance, design tools, and more. We
(…) -
How to Use Tailwind to Build Responsive UI Design
Tailwind provides a set of pre-designed and pre-built styles that you can apply directly to your HTML markup. Unlike traditional CSS frameworks, which often come with pre-defined components and styles, Tailwind focuses on providing low-level utility classes that you can combine to create custom UI designs. To start a project, front-end developers typically install it
(…) -
User Interface Elements Every Designer Should Know
UI elements are the most integral part of product design. They are the core building blocks for all products. As a UI designer or UI developer, it’s crucial to have a deep understanding of UI elements and how users interact with them. It will help you create a better application/website structure. Designers don’t usually draw
(…) -
Ant Design 101 – Introduction to a Design System for Enterprises
Ant Design is a popular design system for developing enterprise products. The comprehensive component library has everything product teams need to solve most modern B2B design problems. Key takeaways: With UXPin Merge, design teams can import Ant Design UI components to build fully functioning prototypes. This article outlines the benefits of working with Ant Design,
(…) -
Best Prototyping Tools that Use React
Are you creating a React app or website? If you are, you can use real React components in prototyping. How to that? You will find an answer in this article. Key tools: Build React prototypes with your dev’s components coming from Git, Storybook, or npm. Try UXPin Merge and assemble stunning, production-ready layouts 10x faster.
-
Figma Component Library vs UXPin Component Library – Which is Better?
Figma Component Libraries are a great way to create and share reusable UI elements with team members. Designers can use Figma components to build user interfaces and prototypes, and they help to maintain consistency across projects. However, Figma Component Libraries have some limitations, such as the inability to create interactive prototypes. UXPin Merge is a
(…) -
Is MUI for Figma the Best Solution for Designers? [+ Alternative Inside]
MUI (Material-UI) is a widely-used React UI framework built on Google’s Material Design principles, empowering organizations with customizable components and styles to align with brand standards. This article delves deep into its MUI for Figma’s capabilities and limitations. We also explore the alternative approach of integrating MUI with UXPin’s Merge technology, including a real-world example
(…) -
How to Design a Date Picker that Makes Your UI Shine
Date pickers are some of the most familiar UI patterns in digital product design. UX designers use date pickers on websites, applications, games, enterprise software, operating systems, and more. Designers must understand how these date pickers will work across screen sizes, operating systems, devices, etc., to test the impact on the product’s aesthetics, functionality, and
(…) -
How to Bring Bootstrap Components to UXPin – npm Integration Walkthrough
UXPin’s npm Integration empowers design teams to prototype at a higher fidelity and with code-like functionality. Component-driven prototyping in UXPin allows designers to create prototypes that previously required engineers to code. With npm Integration, teams can bring component libraries to UXPin’s design tool and leverage full interactivity of shared components without complicated technical setup. Let’s
(…)
UXPin is a product design platform used by the best designers on the planet. Let your team easily design, collaborate, and present from low-fidelity wireframes to fully-interactive prototypes.
Start your free trial