UI Design
User interface (UI) design involves creating visually appealing, intuitive, and friendly interfaces that enable users to interact with the system or application effectively.
Followed by 301 others
Recommended resources
Courses
Course
UX Design Foundations
Learn UX design basics to acquire a solid foundation in UX design principles. Acquire the skills needed for product development and improving user experience.
Course
Design Terminology
Learn UX terminology and key UX/UI terms that boost collaboration between designers, developers, and stakeholders for smoother, clearer communication.
Course
UI Components I
Learn to create user-friendly interfaces using core UI components, building a solid foundation for designing intuitive and efficient digital products.
Course
UI Components II
Learn advanced techniques to design dynamic, scalable interfaces using optimized UI components and streamlined navigation for better user experiences.
Course
Mobile Design
Learn mobile UI/UX patterns, workflows, and platform-specific strategies to create exceptional, user-friendly mobile experiences across different devices.
Course
Color Psychology
Learn how color influences perception, emotion, and behavior. Discover how to apply color psychology to design more impactful and engaging experiences.
Course
Common Design Patterns
Learn design patterns most valued in product development to create intuitive, visually compelling experiences that seamlessly blend form and function.
Course
Accessibility Foundations
Learn the fundamentals of digital accessibility and how to create inclusive experiences for all users. Explore key principles, tools, and best practices.
Course
Wireframing
Learn to create effective wireframes that seamlessly integrate into your design workflows, improving communication and driving better design outcomes.
Course
UX Writing
Learn to write microcopy that communicates clearly and concisely to improve user experience, build trust, and boost conversions across digital products.
Course
Design Composition
Learn the fundamental principles of visual layout, balance, and structure to create compelling and effective design compositions that engage and intrigue users.
Course
Typography
Learn typography fundamentals, from typeface and font selection to layout and spatial arrangement, to create captivating designs that communicate powerfully.
Course
UX Design Patterns with Checklist Design
Learn common UX design patterns and how to apply them with practical checklists, ensuring the creation of intuitive, user-friendly, and exceptional interfaces.
Course
HTML Foundations
Learn the fundamentals of HTML, from basic formatting and structure to advanced elements and best practices, to create accessible and responsive web pages.
Course
Enhancing UX Workflow with AI
Learn how to integrate AI into UX design to create smarter, more personalized user experiences. Explore tools, trends, and best practices in AI-driven design.
Course
CSS Foundations
Learn the basics of CSS, including the box model, element style, and content positioning, to improve communication, design handoff, and web decision-making.
Course
Introduction to Figma
Learn essential Figma tools like layers, styling, typography, and images. Master the basics every UX designer needs to create clean, user-friendly designs.
Course
3D Design Foundations
Learn essential 3D design principles, from spatial thinking and dimensional relationships to form, lighting, and texture, for a solid foundation in the field.
Course
Information Architecture
Learn the basics of organizing, structuring, and labeling content to design clear, user-friendly information systems that enhance usability and navigation.
Course
Apple Human Interface Guidelines
Learn Apple’s Human Interface Guidelines to design modern, high-performing apps, focusing on UI principles and best practices for creating effective interfaces.
Course
Introduction to Design Audits
Learn the art of systematic design evaluation to improve consistency, effectiveness, and create more user-centered products that meet user expectations.
Course
AI Fundamentals for UX
Explore AI concepts, principles, and practices essential for creating human-centered, trustworthy AI-powered experiences.
Course
Government Design Foundations
Learn best practices and core principles for government design to create impactful, user-centered digital services that improve accessibility and efficiency.
Lessons
Lesson
What is UX Design?
Learn UX fundamentals to create user-centered products that balance customer needs with business goals for maximum impact.
Lesson
Image Terminology
Discover the different types of images and their functions in design
Lesson
UX Design Principles
Learn how to differentiate your product with the UX Honeycomb of 7 principles for irresistible user experiences.
Lesson
Common UI Component Definitions I
Discover the most common components you'll encounter on any given user interface
Lesson
Designing for Mobile Interfaces
Learn the basics of creating user-friendly, intuitive, and functional mobile interfaces
Exercises
Briefs
Brief
Design an Empty State Page
Showcase your skills in designing succinct and useful empty state pages that are in line with a brand voice and style.
Brief
Design a Product Catalog Page
Harness your content strategy and UI skills to craft an intuitive e-commerce catalog page.
Brief
Design a Profile Page
Deepen your analytical and UI design skills by creating a profile page for hiring.
Assessments
Assessment
Figma
Test your knowledge of how Figma helps teams collaboratively brainstorm, build, test, and share designs, and see how you stack up against designers worldwide.
Assessment
Principles of Design
Put your knowledge of the guiding principles of design to the test and see how you stack up against designers and developers worldwide.
Assessment
Design Patterns
Demonstrate your mastery of UX/UI design patterns and see how you stack up against designers worldwide.
Assessment
Landing Pages
Test your knowledge of the theory and best practices of designing landing pages, and see how you stack up against thousands of other designers worldwide.
Assessment
Typography
Put your knowledge of typography to the test and see how you stack up against designers worldwide.
Tutorials
Tutorial
Mastering the 60-30-10 Rule in Design
Learn the 60-30-10 color rule to make your designs look great! Follow along to improve your skills.
Tutorial
Responsive Type Scales: Part 1
In this tutorial, you will learn what a type scale is, how to decide which scale to use, and an intro to making a scale responsive.
Tutorial
16 Best Practices for Posting Your First Project
Learn the best practices for preparing your first project to get noticed by the Uxcel community and become a gem in your portfolio.
Tutorial
Learn 8 essential techniques to design in Figma like a pro
Master essential Figma techniques to boost your design speed and efficiency. Elevate your workflow and create stunning designs faster.
Tutorial
Master Auto Layout in Figma with This Tutorial
Auto Layout can make your designs so much easier this tutorial explains it step by step, helping you create flexible and responsive designs
Projects
Editors’ Choice
Project
Uxcel Halloween Icon Pack
🎃 Introducing the Uxcel Halloween Icon Pack! 🎃 This custom Halloween-themed icon set was created to enhance the seasonal user experience o
Editors’ Choice
Project
Waze: Playful Icon Transformations
Waze is a highly popular navigation app that provides real-time, user-generated updates on traffic conditions, road hazards, speed cameras,
Community Choice
Project
Duolingo Halloween Icon Pack
Why Duo?Who better fits the theme of halloween than the famously unhinged green owl who hops on every trend on social media. Duolingo has br
Project
Starbucks Halloween Icon Pack
Halloween is so on! 🎃This project transforms Starbucks’ app into a Halloween haven by redesigning key icons with spooky, playful twists. In
Editors’ Choice
Project
HireHarbour Allies: UX/UI Case Study for Inclusive Landing Page
Note: Figma link contains multiple prototypes from research to the actual desktop view. It’s best viewed from a desktop screen. Problem: Wor
FAQs
What is UI design?
UI design, or User Interface design, is a discipline within digital product design that focuses on creating the visual elements and interactions of a user interface. It involves designing the layout, typography, colors, icons, buttons, and other visual components that users interact with when using websites, mobile apps, software, or any digital product. The main goal of UI design is to create an aesthetically pleasing and user-friendly interface that enhances the overall user experience and makes it easy for users to interact with the product.
How is UI design different from UX design?
UI design and UX design are related but distinct disciplines within digital product design:
- User Interface (UI) Design: UI design deals with the visual aspects and presentation of the product. It focuses on creating a visually appealing and cohesive interface by designing the layout, selecting appropriate colors, choosing fonts, and creating interactive elements. UI designers are responsible for the look and feel of the product, ensuring that it is visually attractive and consistent with the brand's identity.
- User Experience (UX) Design: UX design, on the other hand, is concerned with the overall user experience of the product. It involves understanding user needs, behaviors, and pain points through research and analysis. UX designers work to create intuitive and seamless interactions that align with user goals and expectations. They are responsible for ensuring that the product is easy to use, efficient, and delivers a positive and satisfying experience to the users.
How does UI design contribute to the success of a digital product?
UI design plays a crucial role in the success of a digital product for several reasons:
- First impressions: A visually appealing and well-designed interface creates a positive first impression, capturing users' attention and encouraging them to explore further.
- User engagement: Intuitive and user-friendly interfaces keep users engaged, reducing friction and frustration during interactions, which can lead to higher retention and satisfaction rates.
- Brand identity: The UI design reflects the brand's personality and identity, contributing to brand recognition and differentiation in a competitive market.
- Conversion and goals: An effective UI design can guide users towards specific actions, such as making a purchase or signing up for a service, improving conversion rates and achieving business goals.