Tagged articles
220 articles
Page 1 of 3
Shuge Unlimited
Shuge Unlimited
May 18, 2026 · Frontend Development

OpenSpec Project Walkthrough #5: UI Visual Polish and Template Tweaks to Guide AI‑Generated Tasks

This article details how the OpenSpec v1.3.1 project upgraded its UI visual layer with a new color palette, icons, and animations, uncovered why AI‑generated tasks.md ignored schema instructions, fixed the issue by editing the template, and verified the changes through a full apply‑verify‑archive cycle.

AI code generationOpenSpecReact
0 likes · 24 min read
OpenSpec Project Walkthrough #5: UI Visual Polish and Template Tweaks to Guide AI‑Generated Tasks
Tech Minimalism
Tech Minimalism
Apr 25, 2026 · User Experience Design

8 Essential AI Agent Skills Every UI Designer Should Install

This guide lists eight AI‑powered agent skills for UI designers, explains why the installation order matters, provides concrete CLI commands and example workflows, and shows how these skills turn Claude Code from a code generator into a full‑featured design partner.

AI agentsClaude CodeTailwind
0 likes · 22 min read
8 Essential AI Agent Skills Every UI Designer Should Install
21CTO
21CTO
Apr 6, 2026 · Frontend Development

How Tailscale Solved the MacBook Pro Notch Icon Issue with a New Windowed UI

Tailscale released a macOS windowed version that eliminates the notch‑induced menu‑bar icon hiding problem by introducing dual‑mode interfaces, a hybrid AppKit‑SwiftUI architecture, performance and security upgrades, and developer‑friendly features, turning a UI limitation into a richer user experience.

AppKitNotchSwiftUI
0 likes · 11 min read
How Tailscale Solved the MacBook Pro Notch Icon Issue with a New Windowed UI
PMTalk Product Manager Community
PMTalk Product Manager Community
Nov 26, 2025 · Industry Insights

How AI Is Redefining the Roles of Product Managers, UI Designers, and Interaction Designers

The article analyzes how AI tools and market shifts are forcing product managers, UI designers, and interaction designers to evolve from narrow, visual‑only tasks toward full‑stack, data‑driven, and technically integrated roles, illustrated with real‑world case studies and hiring data.

AI ImpactInteraction DesignUI design
0 likes · 10 min read
How AI Is Redefining the Roles of Product Managers, UI Designers, and Interaction Designers
Zhixing ZXD Design Center
Zhixing ZXD Design Center
Nov 18, 2025 · User Experience Design

5 Real-World UI/UX Design Tricks That Boost Engagement and Conversion

This article showcases five recent mobile app design case studies—Xianyu’s AI‑generated listings, Alipay’s gamified banner, Qunar’s ticket‑refund retention flow, Endel’s shake‑to‑unlock subscription, and QQ Music’s pull‑down coin center—highlighting how low‑friction interactions, gamification, and visual cues can dramatically improve user engagement and conversion rates.

Interaction DesignUI designcase study
0 likes · 6 min read
5 Real-World UI/UX Design Tricks That Boost Engagement and Conversion
Code Mala Tang
Code Mala Tang
Sep 27, 2025 · Artificial Intelligence

Unlock Stunning UI Designs with Google’s Nano Banana AI: 3 Practical Prompts

This guide explores Google’s Nano Banana AI model, offering three actionable prompt templates for UI concept generation, low‑fidelity wireframing, and component design, along with tips on crafting clear, detailed prompts to achieve high‑quality, style‑consistent visual outputs using the free Google AI Studio.

AI image generationGoogle GeminiNano Banana
0 likes · 10 min read
Unlock Stunning UI Designs with Google’s Nano Banana AI: 3 Practical Prompts
58UXD
58UXD
Jul 31, 2025 · Artificial Intelligence

How AI Workflows Revolutionize Icon Design for Faster, High‑Quality Results

This article explores how AI-powered workflows transform UI icon creation by dramatically reducing manual tweaking, ensuring consistent style across series, and enabling designers to focus on user experience, while outlining practical steps, real‑world cases, and best practices for integrating AI into the design process.

AIUI designicon design
0 likes · 6 min read
How AI Workflows Revolutionize Icon Design for Faster, High‑Quality Results
Zhixing ZXD Design Center
Zhixing ZXD Design Center
Jul 1, 2025 · Fundamentals

5 UI Motion Cases That Turn Discounts Into Delightful Experiences

This article showcases five recent UI motion design cases—from Airbnb's envelope invitation to Grab's infinite‑saving symbol—illustrating how animated visual cues can strengthen trust, highlight discounts, and create a sense of ceremony that boosts user engagement and perception.

Interaction DesignProduct DesignUI design
0 likes · 6 min read
5 UI Motion Cases That Turn Discounts Into Delightful Experiences
Java Tech Enthusiast
Java Tech Enthusiast
Apr 25, 2025 · User Experience Design

How to Unlock and Use Windows 11’s New Start Menu Grid Layout

This guide explains Microsoft’s redesigned Windows 11 start menu that removes the secondary All‑apps list in favor of a grid view, compares it with the list view, shows how to enable the feature via ViveTool, and discusses its usability pros and cons.

UI designViveToolWindows 11
0 likes · 8 min read
How to Unlock and Use Windows 11’s New Start Menu Grid Layout
Baidu MEUX
Baidu MEUX
Feb 19, 2025 · Frontend Development

Build Scalable Design Components: Practical Steps for Usability & Maintenance

This article shares a practical methodology for creating high‑quality design components, outlining how to make them understandable, usable, and maintainable through multi‑layer nesting, flexible‑yet‑convergent construction, systematic variant mapping, and data‑driven maintenance, with a focus on Figma‑based workflows.

Component LibraryFigmaUI design
0 likes · 13 min read
Build Scalable Design Components: Practical Steps for Usability & Maintenance
KooFE Frontend Team
KooFE Frontend Team
Feb 15, 2025 · Frontend Development

Avoid Aggressive Error Messages: UI Design Rules for Better User Experience

This article explains how premature or overly aggressive error messages can frustrate users, outlines Nielsen's relevant usability principles, and provides practical guidelines with real‑world examples to help designers display errors only when necessary and use error styling appropriately.

Error HandlingUI designUsability
0 likes · 13 min read
Avoid Aggressive Error Messages: UI Design Rules for Better User Experience
Baidu MEUX
Baidu MEUX
Dec 31, 2024 · Product Management

How Baidu’s ‘Pinch‑to‑Read’ Transforms AI Summaries into Magazine‑Style Mobile UI

Leveraging Baidu’s AI large‑model capabilities, the MEUX team reimagined the app’s homepage with a pinch‑gesture‑triggered ‘Morning‑Evening Report’, introducing a structured framework, avant‑garde visual language, and intelligent content generation to boost reading efficiency and deliver a magazine‑like experience.

AIProduct DesignUI design
0 likes · 11 min read
How Baidu’s ‘Pinch‑to‑Read’ Transforms AI Summaries into Magazine‑Style Mobile UI
Qunhe Technology User Experience Design
Qunhe Technology User Experience Design
Nov 22, 2024 · Frontend Development

Taming Unstable 3D Tool Interactions with a Systematic Trigger Design

This article examines the challenges of unstable and inconsistent basic-function triggers in the Kujiale 3D design platform, analyzes root causes such as module isolation, compatibility gaps, and high coupling, and proposes a systematic, entropy-aware interaction architecture with layered trigger logic, progressive optimization strategies, and flexible user-centric configurations to improve stability, extensibility, and user adoption.

3D softwareUI designfrontend
0 likes · 11 min read
Taming Unstable 3D Tool Interactions with a Systematic Trigger Design
We-Design
We-Design
Oct 30, 2024 · Fundamentals

How Perspective Shaped Art and UI Design Across Millennia

From ancient Egyptian flat depictions to Renaissance linear perspective, through Impressionist challenges and modern UI design shifts, this article traces the evolution of visual perspective, revealing how artistic and interface conventions have repeatedly broken, refined, and reimagined spatial representation to align with cultural, technological, and perceptual changes.

UI designart historydesign evolution
0 likes · 15 min read
How Perspective Shaped Art and UI Design Across Millennia
KooFE Frontend Team
KooFE Frontend Team
Oct 5, 2024 · Fundamentals

How to Safely Handle Dangerous Actions in User Interfaces

This article explores what constitutes dangerous actions in UI design and presents various confirmation strategies—such as modal dialogs, extra user input, danger zones, inline guards, two‑factor authentication, and undo mechanisms—to prevent accidental irreversible operations and improve user safety.

UI designconfirmation patternsdangerous actions
0 likes · 21 min read
How to Safely Handle Dangerous Actions in User Interfaces
JD Cloud Developers
JD Cloud Developers
Sep 18, 2024 · Frontend Development

Mastering Flex Layout in JD Finance’s Dynamic UI: From Basics to Advanced Tricks

This article explains how JD Finance’s dynamic UI framework leverages standard Flex layout and the Yoga engine to achieve consistent cross‑platform designs, detailing container and item concepts, key Flex properties, list and absolute layouts, visibility controls, and common layout troubleshooting tips.

Responsive DesignUI designYoga Layout
0 likes · 17 min read
Mastering Flex Layout in JD Finance’s Dynamic UI: From Basics to Advanced Tricks
Zhixing ZXD Design Center
Zhixing ZXD Design Center
Aug 27, 2024 · Frontend Development

How Top Apps Use Emotional Design to Delight Users: 6 Inspiring Case Studies

This article showcases six real‑world mobile app examples—Taco Bell, Swiggy, Zomato, Cubox, Signal, and Gojek—demonstrating how thoughtful illustrations, animations, and empathetic copy turn ordinary screens into engaging, emotionally resonant experiences that reduce user frustration and strengthen brand connection.

UI designUser experiencecase study
0 likes · 7 min read
How Top Apps Use Emotional Design to Delight Users: 6 Inspiring Case Studies
VMIC UED
VMIC UED
Jul 30, 2024 · Frontend Development

Mastering Popup Design: Principles, Types, and Best Practices

This comprehensive guide explains what popups are, distinguishes modal and non‑modal varieties, outlines essential design principles for titles, content, buttons, and overlays, and provides a step‑by‑step workflow for selecting and implementing the right popup type to improve user experience.

DialogInteraction DesignUI design
0 likes · 14 min read
Mastering Popup Design: Principles, Types, and Best Practices
Architecture Digest
Architecture Digest
Jul 26, 2024 · Fundamentals

JetBrains Announces New Default UI for the Upcoming 2024.2 IDE Release

JetBrains revealed that its upcoming 2024.2 release will introduce a brand‑new default UI across all IDEs, featuring a modern light and dark theme, redesigned window bars, tool windows, navigation bar, compact mode, and a classic UI plugin for users who prefer the old look, while also offering a free programmer book promotion.

2024.2IDEJetBrains
0 likes · 3 min read
JetBrains Announces New Default UI for the Upcoming 2024.2 IDE Release
Java Tech Enthusiast
Java Tech Enthusiast
Jul 9, 2024 · Industry Insights

Why Windows’ 30‑Year‑Old Formatting Dialog Still Looks the Same

Microsoft engineer Dave Plummer recounts how a quick‑and‑dirty formatting dialog he built in 1994 using VC++ 2.0 became a 30‑year‑old UI staple, persisting unchanged into Windows 11 and even imposing the 32 GB FAT volume limit due to an early design shortcut.

Dave PlummerFAT32 limitLegacy Software
0 likes · 4 min read
Why Windows’ 30‑Year‑Old Formatting Dialog Still Looks the Same
VMIC UED
VMIC UED
Jun 18, 2024 · Product Management

How Vivo Game Center Revamped Its Homepage for Immersive Game Discovery

This case study details Vivo Game Center's strategic redesign of its homepage, addressing content exposure, navigation efficiency, and visual immersion through a restructured layout, dynamic video integration, and a refined waterfall flow that together boost game activation rates and user engagement across devices.

Responsive DesignUI designUser experience
0 likes · 13 min read
How Vivo Game Center Revamped Its Homepage for Immersive Game Discovery
Zhixing ZXD Design Center
Zhixing ZXD Design Center
Jun 18, 2024 · Product Management

6 Real-World UI Design Cases That Can Spark Your Next Product Idea

This article shares six recent online UI design cases—from Alipay's scrolling bullet to Hema's stylised comment shortcuts—highlighting how interactive elements, animations, and AI assistance can attract attention, improve user experience, and inspire fresh product design ideas.

Interaction DesignUI designcase study
0 likes · 7 min read
6 Real-World UI Design Cases That Can Spark Your Next Product Idea
Sohu Tech Products
Sohu Tech Products
Apr 24, 2024 · Mobile Development

How to Create a Rotating Color‑Changing Rounded Triangle in Android

This article walks through the mathematical analysis, coordinate calculations, and step‑by‑step Android code needed to draw an inverted equilateral triangle, animate a red/black tracing line, and rotate the shape with rounded corners, while addressing common pitfalls such as frame drops and aliasing.

AndroidCanvasCustom View
0 likes · 12 min read
How to Create a Rotating Color‑Changing Rounded Triangle in Android
58UXD
58UXD
Apr 24, 2024 · Frontend Development

Designing a User‑Centric Multimodal AI Platform: Key UI Principles

This article outlines practical UI design guidelines for building a multimodal AI platform, covering layout simplification, emphasis on key content, color schemes, typography consistency, icon style, interaction uniformity, and cross‑browser/device compatibility to create an intuitive and efficient user experience.

AIUI designUser experience
0 likes · 6 min read
Designing a User‑Centric Multimodal AI Platform: Key UI Principles
Sohu Tech Products
Sohu Tech Products
Jan 31, 2024 · Frontend Development

An In-Depth Overview of shadcn/ui: Features, Architecture, and Usage

shadcn/ui is a rapidly popular, copy‑and‑paste component collection that provides accessible, highly customizable Tailwind‑styled UI elements with a two‑layer architecture, theme editor, dark‑mode support, and CLI, offering simplicity and fine‑grained control while requiring manual integration and careful bundle‑size management.

Component LibraryReactShadcn UI
0 likes · 26 min read
An In-Depth Overview of shadcn/ui: Features, Architecture, and Usage
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Jan 26, 2024 · Frontend Development

Visual Hierarchy in UI Design: Using Font Weight, Color, and Layout to Emphasize Elements

This article explains how visual hierarchy in UI design can be achieved by strategically using font weight, color, and contrast instead of size, offering practical examples of emphasizing primary elements, weakening secondary ones, handling label-value patterns, and applying semantic HTML for clearer, more effective interfaces.

TypographyUI designcolor contrast
0 likes · 8 min read
Visual Hierarchy in UI Design: Using Font Weight, Color, and Layout to Emphasize Elements
Zhixing ZXD Design Center
Zhixing ZXD Design Center
Jan 23, 2024 · Frontend Development

5 Interactive UI Cases That Boost User Engagement – Lessons from NAVER, Agoda, Airbnb, Zomato, and TooGoodToGo

This article showcases five recent UI/UX case studies—including NAVER's interactive banner, Agoda's coupon animation, Airbnb's direct review button, Zomato's membership effects, and TooGoodToGo's dynamic pricing—highlighting how motion design and thoughtful interaction can capture attention, reinforce brand messaging, and improve user experience.

UI designUser experiencecase study
0 likes · 7 min read
5 Interactive UI Cases That Boost User Engagement – Lessons from NAVER, Agoda, Airbnb, Zomato, and TooGoodToGo
VMIC UED
VMIC UED
Jan 18, 2024 · Frontend Development

Master Layout Design: 4 Essential Principles Every UI Designer Must Know

This article explains what layout design is, why it matters, and walks you through the four fundamental principles—contrast, alignment, grouping, and repetition—illustrated with real UI examples to help designers create clear, engaging, and visually balanced interfaces.

UI designdesign principlesfrontend
0 likes · 12 min read
Master Layout Design: 4 Essential Principles Every UI Designer Must Know
58UXD
58UXD
Dec 27, 2023 · Frontend Development

Optimizing CRM Tables for Better Readability and Usability

This article examines the vital role of tables in B‑end CRM applications, identifies common visual and interaction problems, and presents a set of readability‑ and operability‑focused design guidelines—including typography, component sizing, hover feedback, header handling, row and column treatments—to enhance user efficiency and experience.

CRMTable OptimizationUI design
0 likes · 8 min read
Optimizing CRM Tables for Better Readability and Usability
VMIC UED
VMIC UED
Dec 12, 2023 · Mobile Development

Master Mobile UI Design Adaptation: Reduce Workload and Ensure Consistent Experience

This article explains what UI design adaptation is, why it’s essential for consistent mobile experiences, introduces key concepts such as logical and physical resolution, and details practical methods—including fixed‑size and responsive techniques—to streamline design work across diverse screen sizes.

Design GuidelinesMobileResponsive Design
0 likes · 14 min read
Master Mobile UI Design Adaptation: Reduce Workload and Ensure Consistent Experience
21CTO
21CTO
Nov 25, 2023 · Mobile Development

What’s New in Aurora OS 5.0? A Deep Dive into Russia’s Latest Mobile Platform

At the Mobius 2023 conference in St. Petersburg, Russia’s Open Mobile Platform unveiled Aurora OS 5.0, showcasing a revamped UI, gesture controls, and enhanced multitasking for large‑screen tablets, while tracing its roots to Sailfish OS and its government‑focused deployment.

Aurora OSGesture controlMobile OS
0 likes · 3 min read
What’s New in Aurora OS 5.0? A Deep Dive into Russia’s Latest Mobile Platform
Ximalaya Technology Team
Ximalaya Technology Team
Nov 15, 2023 · Mobile Development

Implementing Gradient Text Effects for Android Live Chat Nicknames

The article explains how to give privileged Android live‑chat users gradient nicknames by applying a LinearGradient shader via a custom GradientColorSpan, handling multi‑line text with restart or continuous strategies, and integrating these spans in a LiveGradientTextView that measures, inflates, and renders the gradient consistently across all live‑room scenarios.

AndroidCustom SpanShader
0 likes · 14 min read
Implementing Gradient Text Effects for Android Live Chat Nicknames
Huolala Tech
Huolala Tech
Sep 14, 2023 · Operations

Designing an Effective UI for Monitoring Alerts: Insights from Huolala

This article shares Huolala's experience designing a unified monitoring platform UI, covering the evolution from open‑source dashboards to a fully self‑developed solution, simplification of PromQL, computed metrics, log and trace integration, and the challenges of alert configuration and visualization.

AlertingOperationsPrometheus
0 likes · 16 min read
Designing an Effective UI for Monitoring Alerts: Insights from Huolala
We-Design
We-Design
Aug 16, 2023 · Frontend Development

Mastering Keyboard Shortcuts: Design Principles and Best Practices

This article explains why keyboard shortcuts boost efficiency, reduce fatigue, and improve precision, classifies accelerators and access keys, outlines discoverable, conflict‑free, and memorable design principles, and provides a step‑by‑step workflow for creating a robust shortcut system across platforms.

Human-Computer InteractionUI designfrontend development
0 likes · 7 min read
Mastering Keyboard Shortcuts: Design Principles and Best Practices
KooFE Frontend Team
KooFE Frontend Team
Jul 19, 2023 · Frontend Development

Transform UI Design with 16 Simple Rules for Better Usability

This article translates the "16 Little UI Design Rules" into practical guidelines, showing how applying spacing, consistency, contrast, typography, and accessibility principles can dramatically improve the usability and visual hierarchy of a short‑term rental property detail page.

UI designUsabilityaccessibility
0 likes · 16 min read
Transform UI Design with 16 Simple Rules for Better Usability
VMIC UED
VMIC UED
Jun 25, 2023 · Fundamentals

Mastering UI Design: Essential Gestalt Laws and Interaction Principles for Better User Experience

This article explains the core Gestalt principles—simplicity, proximity, similarity, continuity, closure, figure‑ground, and common fate—and the five interaction‑design laws (Occam's razor, Miller's law, the 400 ms response threshold, Jakob Nielsen's law, and the "save effort" principle), showing how they can be applied to create clearer, more efficient, and more engaging interfaces.

Gestalt principlesInteraction DesignUI design
0 likes · 21 min read
Mastering UI Design: Essential Gestalt Laws and Interaction Principles for Better User Experience
Yunxuetang Frontend Team
Yunxuetang Frontend Team
Jun 25, 2023 · Frontend Development

Front‑End Mastery: ChatGPT Pair‑Programming, Clean JavaScript, and UI Metrics

This article curates recent front‑end engineering insights, including a ChatGPT‑driven pair‑programming approach using the driver‑observer model, a rapid 200‑line Vue‑like framework built with AI assistance, practical JavaScript code‑cleanliness techniques, strategies for optimistic UI design, and a lightweight method for measuring user‑experience metrics.

ChatGPTJavaScriptUI design
0 likes · 4 min read
Front‑End Mastery: ChatGPT Pair‑Programming, Clean JavaScript, and UI Metrics
Baidu MEUX
Baidu MEUX
May 24, 2023 · Product Management

How Baidu Designs Incentive Video Ads to Boost Conversion

This article explores Baidu's incentive video ad framework, detailing layout consistency, component selection, reward timing, video playback strategies, landing‑page integration, exit‑retention tactics, and conversion‑step reduction to maximize user engagement and revenue.

UI designconversion optimizationincentive video ads
0 likes · 10 min read
How Baidu Designs Incentive Video Ads to Boost Conversion
Zhaori User Experience
Zhaori User Experience
May 12, 2023 · Frontend Development

Mastering UI Shape Design: Icons, Cards, and Banners Explained

Explore the essential visual elements of UI shape design—including icon, card, and banner forms—by learning their definitions, key principles such as uniformity, semantics, balance, brand relevance, and innovation, and practical guidelines for creating effective, responsive, and engaging interfaces.

UI designbanner designcard design
0 likes · 10 min read
Mastering UI Shape Design: Icons, Cards, and Banners Explained
Alipay Experience Technology
Alipay Experience Technology
May 4, 2023 · Frontend Development

Why Ant Design 5.0’s New Design Principles Boost Productivity and Aesthetics

The article reviews Ant Design 5.0’s redesign, explaining how its focus on clearer visuals, reduced distractions, and a relaxed feel—through updated color palettes, larger interaction zones, and a flexible corner‑radius algorithm—enhances user efficiency and creates a more pleasant virtual office experience.

Ant DesignUI designUser experience
0 likes · 9 min read
Why Ant Design 5.0’s New Design Principles Boost Productivity and Aesthetics
政采云技术
政采云技术
Apr 20, 2023 · Mobile Development

Mobile Navigation Design: Types, Patterns, and Design Guidelines

This article explains the classification of mobile navigation into global, instant, and hybrid types, describes six basic navigation patterns and two emerging hybrid patterns, and provides design guidelines and real‑world examples for selecting and combining navigation modes in mobile apps.

Design GuidelinesUI designmobile app
0 likes · 5 min read
Mobile Navigation Design: Types, Patterns, and Design Guidelines
Zhaori User Experience
Zhaori User Experience
Apr 7, 2023 · Frontend Development

Why Microinteractions Matter: Tiny UI Tricks That Boost Engagement

This article explains what microinteractions are, why they are crucial for user experience, outlines common types such as click, long‑press, pull‑to‑refresh, and scroll effects, and showcases real‑world examples like NetEase Cloud Music that demonstrate how tiny UI animations can boost engagement and usability.

Interaction DesignUI designUser experience
0 likes · 9 min read
Why Microinteractions Matter: Tiny UI Tricks That Boost Engagement
Yunxuetang Frontend Team
Yunxuetang Frontend Team
Mar 17, 2023 · Frontend Development

Top Frontend Tech Insights: IOC, JS Frameworks, Mobile Evolution, and AI Trends

This article curates key front‑end and emerging tech topics—including Inversion of Control in JavaScript, the overload of JS frameworks, Facebook's iOS codebase evolution, GPT‑4's launch, prompt‑engineering automation, and nuanced UI control design—offering concise insights for modern developers.

Artificial IntelligenceIoCJavaScript
0 likes · 4 min read
Top Frontend Tech Insights: IOC, JS Frameworks, Mobile Evolution, and AI Trends
58UXD
58UXD
Mar 14, 2023 · Fundamentals

How Visual Flow Shapes UI: From Gutenberg to F‑ and Z‑Models

The article explains visual flow concepts—originating from interior design and Gutenberg’s printing principles—and describes how the Gutenberg, F‑shaped, and Z‑shaped models guide UI layout on both web and mobile, offering practical examples and tips for designers to improve readability and user experience.

F-shaped modelGutenberg principleUI design
0 likes · 7 min read
How Visual Flow Shapes UI: From Gutenberg to F‑ and Z‑Models
We-Design
We-Design
Mar 3, 2023 · Frontend Development

When Design Systems Fail: Lessons from Architecture, Industry, and UI

The article examines the rise of UI design systems, their promised efficiencies, and the hidden risks they inherit from historical precedents in industrial, architectural, and transportation design, urging designers to maintain critical reflection and avoid over‑reliance on rigid standards.

UI designdesign critiquedesign systems
0 likes · 12 min read
When Design Systems Fail: Lessons from Architecture, Industry, and UI
58UXD
58UXD
Feb 21, 2023 · Fundamentals

How to Instantly Boost UI Design Quality: Proven Tips for a Premium Look

This guide outlines practical UI design techniques—such as typographic hierarchy, strategic spacing, precise alignment, consistent styling, micro‑textures, and proper image proportions—to help designers create visually rich, high‑quality interfaces that delight users and strengthen brand perception.

AlignmentUI designdesign-consistency
0 likes · 8 min read
How to Instantly Boost UI Design Quality: Proven Tips for a Premium Look
Yuewen Experience Design (YUX)
Yuewen Experience Design (YUX)
Feb 16, 2023 · Product Management

How a Reward Center Boosts User Engagement with Video Ads: Design Strategies and Visual Effects

This case study details how a reading app’s Welfare Center aggregates video‑ad rewards, using interaction and visual design, vitality visualizations, and spring‑based animations to keep non‑paying users active, improve the reading experience, and gradually convert them to paying customers.

FigmaProduct DesignUI design
0 likes · 9 min read
How a Reward Center Boosts User Engagement with Video Ads: Design Strategies and Visual Effects
58UXD
58UXD
Feb 16, 2023 · Product Management

Designing Real-Time Collaboration Tools for Seamless Teamwork

This article explores the unique design principles of real-time collaborative office tools, outlining four key characteristics—member status visibility, non‑interference, timely communication, and predictive operations—to help designers create efficient, user‑friendly teamwork experiences across platforms.

Product DesignUI designUser experience
0 likes · 8 min read
Designing Real-Time Collaboration Tools for Seamless Teamwork
21CTO
21CTO
Jan 24, 2023 · Frontend Development

Top 10 Free Front-End Tools to Boost Your Web Development Efficiency

Discover ten essential, free front‑end development tools—from gradient generators and responsive testing apps to API libraries, image sources, SVG illustration collections, documentation browsers, regex debuggers, template sites, code formatters, and icon repositories—that can streamline your workflow and enhance productivity.

ResourcesUI designWeb Development
0 likes · 6 min read
Top 10 Free Front-End Tools to Boost Your Web Development Efficiency
NetEase Cloud Music Tech Team
NetEase Cloud Music Tech Team
Jan 9, 2023 · Mobile Development

Design and Implementation of a Standardized IM Message Flow Interaction Layer for iOS

The paper presents a customizable, dependency‑injected iOS IM framework that separates message‑flow structure from interaction, defines reusable MessageView components with pluggable size‑strategies and a snapshot cache, and exposes standard service protocols, enabling low‑cost integration, business extensibility, and reduced maintenance across diverse chat scenarios.

Instant MessagingUI designiOS
0 likes · 12 min read
Design and Implementation of a Standardized IM Message Flow Interaction Layer for iOS
JD Retail Technology
JD Retail Technology
Dec 21, 2022 · Frontend Development

Introduction and Design of JD Waterdrop Low-Code Canvas

The article presents an overview of JD's Waterdrop low-code platform, detailing the canvas concept, types, research on existing solutions, development goals, design architecture, adaptive layout algorithms, common layout patterns, and future plans for enhancing the front‑end building experience.

CanvasDrag-and-DropUI design
0 likes · 11 min read
Introduction and Design of JD Waterdrop Low-Code Canvas
Zhaori User Experience
Zhaori User Experience
Dec 16, 2022 · Frontend Development

How to Build a Scientific Color System for Enterprise Mobile Banking Apps

This article explains how to create a rational, extensible, and harmonious color system for an enterprise mobile banking app, covering principles, a step‑by‑step workflow, brand color evolution, auxiliary palette generation, WCAG contrast validation, and implementation details for design and development teams.

UI designaccessibilitycolor design
0 likes · 10 min read
How to Build a Scientific Color System for Enterprise Mobile Banking Apps
政采云技术
政采云技术
Dec 15, 2022 · Frontend Development

Visual Hierarchy: Building Effective Information Architecture for UI Design

Visual hierarchy is fundamental to building effective information architecture, helping designers structure and organize interface elements through size, color, contrast, spacing, proximity, and weight to create clear, professional, and visually appealing pages.

UI designdesign principlesinformation architecture
0 likes · 2 min read
Visual Hierarchy: Building Effective Information Architecture for UI Design
We-Design
We-Design
Dec 12, 2022 · Product Management

Designing Multilingual Mobile UI: Key Adaptation Principles for WeChat

This article explains how to adapt mobile UI designs for multiple languages by addressing script differences, text length, layout adjustments, icon usage, and strategies for displaying long strings, providing practical guidelines for creating a seamless experience for both Chinese and non‑Chinese users.

MobileUI designlayout
0 likes · 5 min read
Designing Multilingual Mobile UI: Key Adaptation Principles for WeChat
NetEase LeiHuo Testing Center
NetEase LeiHuo Testing Center
Nov 25, 2022 · Game Development

Designing Interaction for Complex Game Mechanics: From Abstract Concepts to Concrete Player Experiences

The article analyzes how game UI and interaction design translate abstract game mechanics into concrete player actions, using examples like Just Dance, Naraka: Bladepoint, and It Takes Two, and discusses tutorials, HUD layout, visual/audio cues, and hidden information to enhance playability in complex games.

Interaction DesignUI designgame mechanics
0 likes · 12 min read
Designing Interaction for Complex Game Mechanics: From Abstract Concepts to Concrete Player Experiences
Baidu MEUX
Baidu MEUX
Nov 24, 2022 · Product Management

How Baidu Wenku Revamped Its UI for a Younger Audience: A Design Case Study

This article examines Baidu Wenku's decade‑old document platform and explains how user research revealed outdated visuals and interactions, prompting a comprehensive visual and experiential redesign that aligns the product with the preferences of younger users.

Product RedesignUI designUser experience
0 likes · 4 min read
How Baidu Wenku Revamped Its UI for a Younger Audience: A Design Case Study
Baidu MEUX
Baidu MEUX
Nov 16, 2022 · Frontend Development

Mastering X, Y, Z Axes: Design Rules for Enterprise UI Layouts

This article explores how to structure B‑end interfaces using three spatial axes—X for horizontal expansion, Y for vertical information handling, and Z for stacking order—offering concrete layout patterns, adaptation strategies, and layering guidelines to create logical, scalable enterprise UIs.

UI designY-axisZ-axis
0 likes · 11 min read
Mastering X, Y, Z Axes: Design Rules for Enterprise UI Layouts
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Nov 14, 2022 · Mobile Development

Building an Add Identity Card Page with SwiftUI

This tutorial walks through designing and implementing an "Add Identity Card" screen in a SwiftUI iOS app, covering UI element priority, state variable declarations, custom platform selector with LazyVGrid, multiline link input, and data binding to persist new cards.

LazyVGridMobile DevelopmentState Management
0 likes · 12 min read
Building an Add Identity Card Page with SwiftUI
Coolpad Technology Team
Coolpad Technology Team
Nov 11, 2022 · Frontend Development

Quantitative Color Extraction and Optimization for UI Design

This article presents a scientific color adaptation solution that uses a quantization algorithm to extract dominant image colors, refines them via HSB adjustments, validates against WCAG contrast standards, and demonstrates practical deployment in app store and game center interfaces.

Android PaletteHSBUI design
0 likes · 8 min read
Quantitative Color Extraction and Optimization for UI Design
Baidu MEUX
Baidu MEUX
Nov 8, 2022 · Product Management

How Baidu Hotel’s Price‑Comparison Design Boosted User Conversion

This case study details Baidu Hotel’s design process for a price‑comparison feature, outlining market background, user research, strategic touchpoints, competitive analysis, and three implementation phases that together enhanced perception, built cognition, and reinforced memory, ultimately improving conversion rates.

Product DesignUI designUser experience
0 likes · 11 min read
How Baidu Hotel’s Price‑Comparison Design Boosted User Conversion
Taobao Design
Taobao Design
Oct 31, 2022 · User Experience Design

Smart Home UI Design: 3 Real‑World Scenarios to Inspire Your Next App

This article showcases three typical smart‑home user scenarios—pet owners, family caregivers, and professionals—detailing the UI design concepts of apps such as automatic feeders, smart litter boxes, robot vacuums, intelligent lighting, family smart screens, smart toilets, switches, fitness mirrors, and artistic speakers, while highlighting visual and interaction patterns that improve usability and user delight.

IoTUI designapp interface
0 likes · 10 min read
Smart Home UI Design: 3 Real‑World Scenarios to Inspire Your Next App
Zhaori User Experience
Zhaori User Experience
Oct 7, 2022 · Fundamentals

Unlocking Visual Psychology: 6 Design Secrets Every Designer Must Know

This article explores essential visual psychology concepts for designers, covering how we observe, read, remember, think, focus, and make decisions, and offers practical design guidelines such as leveraging optical illusions, peripheral vision, pattern recognition, color‑blind accessibility, cultural color meanings, and the proximity principle to create more intuitive user experiences.

UI designUser experienceVisual Perception
0 likes · 18 min read
Unlocking Visual Psychology: 6 Design Secrets Every Designer Must Know
政采云技术
政采云技术
Sep 15, 2022 · Fundamentals

Guidelines for Chinese Text Layout and Punctuation in Product Development

This article provides practical guidelines for Chinese text layout and punctuation in product development, recommending spacing adjustments, punctuation substitutions, and typographic practices to balance professionalism and visual appeal while addressing cost and time constraints.

Chinese typographyProduct DevelopmentUI design
0 likes · 5 min read
Guidelines for Chinese Text Layout and Punctuation in Product Development
Zhaori User Experience
Zhaori User Experience
Sep 9, 2022 · Frontend Development

Top 9 UI Design Trends to Elevate Financial Apps and Boost User Trust

Discover the nine essential UI design elements shaping modern financial apps—from brand colors and gradient backgrounds to typography, icon styles, whitespace, rounded cards, illustrative graphics, micro‑interactions, data visualisation, and component‑based systems—each helping convey corporate identity, enhance trust, and improve user experience.

UI designUser experiencedesign trends
0 likes · 10 min read
Top 9 UI Design Trends to Elevate Financial Apps and Boost User Trust
Baidu MEUX
Baidu MEUX
Aug 24, 2022 · Mobile Development

How Baidu App Achieves Immersive Video Playback on Mobile Screens

This article explains Baidu App's immersive video design, detailing how maximizing screen real‑estate, optimal placement, and continuous viewing interactions such as window squeezing and floating mini‑windows create a focused, distraction‑free experience across diverse mobile devices.

Mobile DevelopmentResponsive DesignUI design
0 likes · 11 min read
How Baidu App Achieves Immersive Video Playback on Mobile Screens
We-Design
We-Design
Aug 3, 2022 · Fundamentals

Why Skeuomorphism Returns: From Decorative Roots to Modern UI Design

This article traces the rise, fall, and resurgence of skeuomorphic design—from its decorative origins in ancient artifacts and early automobiles to its pivotal role in early graphical user interfaces, the flat‑design backlash, and its renewed relevance in modern mobile, AR, and VR experiences.

UI designdesign principlesdigital interfaces
0 likes · 14 min read
Why Skeuomorphism Returns: From Decorative Roots to Modern UI Design
Qunhe Technology User Experience Design
Qunhe Technology User Experience Design
Jun 28, 2022 · Frontend Development

Mastering Grid Systems: Boost Design Efficiency Across Devices

This article explains the history, fundamentals, components, and practical guidelines of grid systems for UI design, showing how they improve layout consistency, reduce cognitive load for users, streamline designer‑developer collaboration, and enable responsive designs across multiple screen sizes.

UI designdesign efficiencydesign‑development collaboration
0 likes · 28 min read
Mastering Grid Systems: Boost Design Efficiency Across Devices
58UXD
58UXD
May 20, 2022 · Fundamentals

Why “Intuitive Design” Is a Myth and How Design Patterns Solve It

This article debunks the overused term “intuitive design,” explains what intuition really means, shows how familiarity—not unconscious reasoning—drives perceived intuitiveness, and demonstrates how applying proven design patterns and emerging AI technologies can create clearer, more efficient user experiences.

AIDesign PatternsIntuitive Design
0 likes · 9 min read
Why “Intuitive Design” Is a Myth and How Design Patterns Solve It
JavaScript
JavaScript
Mar 1, 2022 · Frontend Development

Why Did Hyperlinks Turn Blue? The History Behind the Web’s Signature Color

Research by Elise Blanchard reveals that blue hyperlinks became the web standard in 1993 after early 1990s conferences and the Mosaic browser adopted blue to replace black, a shift rooted in late‑1980s industry meetings that promoted blue as the interactive text color for UI components.

Mosaic browserUI designWeb History
0 likes · 2 min read
Why Did Hyperlinks Turn Blue? The History Behind the Web’s Signature Color
58UXD
58UXD
Feb 23, 2022 · Frontend Development

Why Design Guidelines Matter: Boost Collaboration and Visual Consistency

This article explains how establishing clear design specifications improves team collaboration, speeds up component assembly, ensures visual consistency across a product, and outlines a practical process for creating, reviewing, and iterating design guidelines within a mobile app ecosystem.

UI designVisual consistencydesign system
0 likes · 4 min read
Why Design Guidelines Matter: Boost Collaboration and Visual Consistency
Xianyu Technology
Xianyu Technology
Jan 18, 2022 · Frontend Development

Design and Implementation of Xianyu Front-end Component Library

The Xianyu front‑end component library was designed as a Lerna‑based multi‑package system that unifies UI specifications, provides reusable atomic to industry‑specific components, employs CSS modules and strict linting, and uses Storybook for documentation, ultimately boosting development efficiency, quality, and cross‑team consistency across the product’s many business lines.

Component LibraryLernaStorybook
0 likes · 11 min read
Design and Implementation of Xianyu Front-end Component Library
58UXD
58UXD
Jan 17, 2022 · Fundamentals

How 58 Local Revamped Its UI for Rural Users: Localization Design Secrets

This article explains how 58 Local leveraged localized visual and textual cues, upgraded icons, refined reading experiences, and introduced adaptive font sizes to create a more relevant and user‑friendly product for lower‑tier cities and older users.

Product DesignUI designUser experience
0 likes · 7 min read
How 58 Local Revamped Its UI for Rural Users: Localization Design Secrets
WeChat Game Design
WeChat Game Design
Jan 7, 2022 · Fundamentals

Uncovering UI Subtext: How Hidden Visual Cues Shape User Experience

This article explores the concept of visual subtext in UI design, explaining why designers should consider hidden cues, defining subtext, and illustrating its three main functions—conveying hidden information, building emotional connections, and reducing cognitive load—through real game‑interface case studies.

UI designUser experiencedesign principles
0 likes · 9 min read
Uncovering UI Subtext: How Hidden Visual Cues Shape User Experience
We-Design
We-Design
Jan 5, 2022 · Fundamentals

Mastering Icon Design: Tips, Tools, and Vector Techniques for Modern UI

This article explores how icons reduce comprehension effort and convey information efficiently, examines industry-leading examples like Apple’s SF Symbols, explains vector specifications, shares practical drawing methods, and offers guidance on balancing weight, color, localization, and tool workflows for high‑resolution screens.

SF SymbolsUI designdesign tools
0 likes · 11 min read
Mastering Icon Design: Tips, Tools, and Vector Techniques for Modern UI
ELab Team
ELab Team
Jan 1, 2022 · Frontend Development

How to Build a Powerful Figma Plugin from Scratch: A Step‑by‑Step Guide

This article walks through the fundamentals of Figma plugin development, explaining the architecture of main and UI threads, demonstrating core features of the lego‑quiz‑figma plugin, and providing a complete workflow from creating the manifest to publishing the plugin, complete with code examples and best‑practice tips.

FigmaJavaScriptPlugin Development
0 likes · 19 min read
How to Build a Powerful Figma Plugin from Scratch: A Step‑by‑Step Guide
JD.com Experience Design Center
JD.com Experience Design Center
Nov 23, 2021 · Frontend Development

Master ProtoPie: Build Realistic Interactive Prototypes with Layer‑Trigger‑Feedback

This tutorial explains how ProtoPie uses the simple "layer + trigger + feedback" principle to create high‑fidelity interactive prototypes, covering basic concepts, a step‑by‑step click‑to‑zoom example, animation tweaks, conditional logic, and tips for extending prototypes in more complex projects.

ProtoPieUI designdesign tutorial
0 likes · 9 min read
Master ProtoPie: Build Realistic Interactive Prototypes with Layer‑Trigger‑Feedback
JD.com Experience Design Center
JD.com Experience Design Center
Nov 5, 2021 · Frontend Development

Reimagining Data Flow Visualization: A Card‑Based Alternative to Sankey Diagrams

This article examines the limitations of traditional Sankey diagrams for visualizing entity state transitions and proposes a card‑based data flow visualization that offers customizable start/end states, improved readability for disparate data scales, and enhanced user experience through interactive layouts and clear styling.

Data visualizationSankey diagramUI design
0 likes · 11 min read
Reimagining Data Flow Visualization: A Card‑Based Alternative to Sankey Diagrams
Architect's Journey
Architect's Journey
Oct 29, 2021 · User Experience Design

When Code Sidetracked a UI Designer: My Journey Through Themes, Input Methods, and Product Experiments

The author recounts how a high‑school love for graphic design led to Windows Mobile theme hacking, a prize‑winning custom Wubi input layout, Xiaomi theme creation with MAML DSL and WebSocket push, and a later product concept that was ultimately blocked, illustrating the evolution from UI hobbyist to self‑taught developer.

MAML DSLUI designWindows Mobile
0 likes · 10 min read
When Code Sidetracked a UI Designer: My Journey Through Themes, Input Methods, and Product Experiments
Baidu MEUX
Baidu MEUX
Sep 29, 2021 · Frontend Development

Boost Mobile Reading Comfort: UI Typography Tricks for Faster, More Attractive Content

Based on China’s 2020 national reading survey, this study redesigns Baidu Mobile’s article pages by adapting screen‑friendly fonts, optimizing font weight, spacing, and punctuation rules, applying Chinese typographic standards to improve readability, efficiency, and visual appeal for billions of mobile readers.

Chinese typographyFont OptimizationUI design
0 likes · 16 min read
Boost Mobile Reading Comfort: UI Typography Tricks for Faster, More Attractive Content
JD.com Experience Design Center
JD.com Experience Design Center
Sep 14, 2021 · Frontend Development

How Dynamic Front‑End Interactions Boost User Retention and Sales

This article examines practical front‑end interaction techniques—such as animated hero images, dynamic timelines, price‑segment filters, random coupon pop‑ups, and retention red‑envelopes—that enhance user memory, lower cognitive load, increase dwell time, and drive higher conversion rates during major e‑commerce events.

UI designconversion optimizationfrontend
0 likes · 7 min read
How Dynamic Front‑End Interactions Boost User Retention and Sales