BestHub
Sign in
Tagged articles

UI design

221 articles · Page 2 of 3
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
58UXD
58UXD
Sep 14, 2021 · Frontend Development

How UI Designers Create Value Across Mobile, VR/AR, and Emerging Platforms

This article explains how modern UI designers extend their role beyond mobile apps to include PC, VR/AR, automotive systems, and interactive art, illustrating the design process through real project cases that show background research, high‑fidelity mockups, and user‑experience strategies.

ARMobile AppUI design
0 likes · 7 min read
How UI Designers Create Value Across Mobile, VR/AR, and Emerging Platforms
58UXD
58UXD
Sep 3, 2021 · Fundamentals

How Accessible Design Improves Usability for Elderly Cleaning Staff

This article explains the concept of information accessibility, why it matters for a cleaning‑staff app, the specific barriers faced by older workers, and the design solutions—including optimal font size, adjustable text, color contrast, clear icons, simplified information, and multimodal feedback—that were implemented to create a more inclusive user experience.

UI designUser Researchaccessibility
0 likes · 8 min read
How Accessible Design Improves Usability for Elderly Cleaning Staff
Meiyou UED
Meiyou UED
Aug 10, 2021 · Frontend Development

2021 UI Design Trends: Bright Colors, Rounded Corners, Light Gradients and More

This article analyzes 2021 design trends for the Meiyou app, covering bright saturated colors, large rounded cards, light gradients, frosted‑glass effects, warm icon palettes, 3D graphics, data visualization, privacy‑focused features, intelligent interactions, and a life‑like emotional tone.

UI designUXcolor
0 likes · 13 min read
2021 UI Design Trends: Bright Colors, Rounded Corners, Light Gradients and More
Baidu MEUX
Baidu MEUX
Jul 12, 2021 · Product Management

How Eye‑Tracking Reveals Hidden User Behaviors in Short‑Video Apps

This article reports an eye‑tracking study conducted on a short‑video app to uncover users' visual strategies, evaluate the impact of title and recommendation layout variations, and identify subtle usability issues that traditional methods miss, providing data‑driven guidance for product design decisions.

UI designUser Researchbehavior analysis
0 likes · 13 min read
How Eye‑Tracking Reveals Hidden User Behaviors in Short‑Video Apps
Laravel Tech Community
Laravel Tech Community
Jul 1, 2021 · Frontend Development

How to Build a Visual Dashboard (Large Screen) Using FineReport

This article walks through the complete process of creating a high‑impact visual dashboard for large‑screen displays using FineReport, covering tool selection, data preparation, report creation, design, visual polishing, and adding dynamic effects.

Data IntegrationFineReportUI design
0 likes · 5 min read
How to Build a Visual Dashboard (Large Screen) Using FineReport
Python Crawling & Data Mining
Python Crawling & Data Mining
Jun 22, 2021 · Frontend Development

Why Python GUIs Look Ugly and How to Make Them Beautiful

Although many developers criticize Tkinter and PyQt5 for producing unattractive interfaces, this article explains that functionality is prioritized over aesthetics, draws parallels between PyQt5 widgets and web HTML/CSS/JS components, and offers practical tips—design prototypes, leveraging QSS, and using widget properties—to dramatically improve Python desktop GUI appearance.

GUIPyQt5Python
0 likes · 7 min read
Why Python GUIs Look Ugly and How to Make Them Beautiful
58UXD
58UXD
Jun 15, 2021 · Mobile Development

How Mobile VR UI Design Transforms Real Estate Experiences

This article explores the rapid rise of commercial VR in the post‑COVID era, explains XR concepts, outlines the unique challenges of mobile VR interfaces for real‑estate tours, and details a design overhaul that improves aesthetics, flexibility, and immersive user experience.

UI designVRXR
0 likes · 8 min read
How Mobile VR UI Design Transforms Real Estate Experiences
Qunhe Technology User Experience Design
Qunhe Technology User Experience Design
Jun 9, 2021 · Frontend Development

A Complete UI Standard Design Process: From Requirement Analysis to Implementation Tracking

This guide outlines a comprehensive UI standard design process—from requirement analysis and interaction design to visual design, design system creation, and implementation tracking—providing UI, interaction, and experience designers with structured steps, evaluation criteria, and best‑practice principles to deliver business‑driven, high‑quality products.

UI designdesign reviewdesign system
0 likes · 13 min read
A Complete UI Standard Design Process: From Requirement Analysis to Implementation Tracking
phodal
phodal
May 24, 2021 · User Experience Design

How UI Design Codification Bridges Designers and Developers with the Unflow DSL

This article explains the concept of UI design codification, why it matters in modern cloud‑based development, outlines the essential elements and workflow, and details the Unflow DSL—including its SEE‑DO‑REACT pattern, atomic‑design decomposition, and Flex‑based layout system—while providing concrete code examples and repository links.

UI designdesign systemdsl
0 likes · 12 min read
How UI Design Codification Bridges Designers and Developers with the Unflow DSL
Java Backend Technology
Java Backend Technology
May 20, 2021 · Frontend Development

How to Build Stunning Big‑Screen Dashboards with FineReport: A Step‑by‑Step Guide

This article walks you through creating impressive big‑screen visual dashboards using FineReport, covering tool selection, data preparation, decision‑report setup, dataset creation, layout design, visual polishing, dynamic effects, and final preview to help you deliver compelling data visualizations efficiently.

Big ScreenData VisualizationFineReport
0 likes · 6 min read
How to Build Stunning Big‑Screen Dashboards with FineReport: A Step‑by‑Step Guide
JD.com Experience Design Center
JD.com Experience Design Center
May 18, 2021 · Frontend Development

Mastering Dark Mode: Design Principles, Color Contrast, and Accessibility

This article explains the purpose of dark mode, outlines design principles such as layer hierarchy, color contrast, saturation, text opacity, and state representation, and distinguishes dark mode from night mode, providing practical guidelines for creating accessible and visually appealing dark‑theme interfaces.

Material DesignUI designaccessibility
0 likes · 8 min read
Mastering Dark Mode: Design Principles, Color Contrast, and Accessibility
We-Design
We-Design
Apr 29, 2021 · Frontend Development

How Susan Kare’s Icon and Font Designs Shaped the Apple Macintosh UI

This article chronicles Susan Kare’s journey from a sculptor to Apple’s pioneering visual designer, detailing her interview, the hand‑drawn pixel‑icon process, the creation of iconic fonts like Chicago, and the lasting impact of her work on modern user interfaces.

Apple MacintoshSusan KareUI design
0 likes · 11 min read
How Susan Kare’s Icon and Font Designs Shaped the Apple Macintosh UI
JD.com Experience Design Center
JD.com Experience Design Center
Apr 29, 2021 · Frontend Development

How to Design Reverse Progress Bars When Less Is Better

This article explores the challenges of displaying negative or "less‑is‑better" metrics with progress bars, examines real‑world examples such as remaining storage, countdowns, and expense tracking, and proposes UI patterns like inverted bars, gauges, segmented steps, and clear textual cues to improve user understanding.

UI designfrontendprogress indicator
0 likes · 5 min read
How to Design Reverse Progress Bars When Less Is Better
We-Design
We-Design
Apr 28, 2021 · Mobile Development

Mastering watchOS App Design: Principles, Gestures, and UI Tips

This article outlines essential watchOS app design guidelines, covering three core principles—lightweight interactions, holistic hardware‑software integration, and personal communication—along with gestures, haptic feedback, cross‑device interaction, layout, typography, color, UI components, and notification strategies to help designers create effective wearable experiences.

UI designhapticswatchOS
0 likes · 18 min read
Mastering watchOS App Design: Principles, Gestures, and UI Tips
Suning Design
Suning Design
Apr 19, 2021 · Fundamentals

How to Make Key Information Stand Out: Proven Design Strategies

This article explores why highlighting key information matters, outlines four main goals, presents five practical design methods such as layout, contrast, radiation effect, visual guidance and prompts, and offers validation techniques like 5‑second tests, click tests, A/B testing and eye‑tracking to ensure effectiveness.

UI designdesign principleshighlighting
0 likes · 12 min read
How to Make Key Information Stand Out: Proven Design Strategies
58UXD
58UXD
Apr 9, 2021 · Frontend Development

2021 UI Design Trends: From Glassmorphism to Dark Mode and Beyond

This article surveys the 2021 UI/UX design trends—including Glassmorphism, 3D elements, Dark Mode, real‑photo integration, and Colorless UI—explaining their origins, key characteristics, and why designers should consider adopting them to create richer, more engaging digital experiences.

20213D designColorless UI
0 likes · 6 min read
2021 UI Design Trends: From Glassmorphism to Dark Mode and Beyond
ITPUB
ITPUB
Apr 1, 2021 · Frontend Development

Why Windows 10’s New Fluent Design Icons Sparked User Backlash

Microsoft’s Windows 10 Dev Build 21343 introduced new Fluent Design System icons for File Explorer, but users criticized the mismatched look because the Explorer UI itself wasn’t updated, leading to a stark contrast with other operating systems that integrate their icon sets more cohesively.

UI designWindowsfluent design
0 likes · 6 min read
Why Windows 10’s New Fluent Design Icons Sparked User Backlash
58UXD
58UXD
Mar 30, 2021 · Product Management

Boost Design Approval Rates with Four Key Evaluation Dimensions

This article outlines four practical dimensions—goal orientation, refinement, consistency, and innovation—that designers can self‑assess to increase the likelihood of their work being approved, offering concrete methods and visual examples for each.

Design thinkingProduct designUI design
0 likes · 7 min read
Boost Design Approval Rates with Four Key Evaluation Dimensions
58UXD
58UXD
Mar 25, 2021 · Fundamentals

Mastering the UI Design Process: From Prep to Validation

This guide walks UI designers through a three‑stage workflow—pre‑design preparation, in‑process creation, and post‑design delivery—offering practical steps, checklists, and visual references to help newcomers produce efficient, user‑focused designs.

Product designPrototypeUI design
0 likes · 9 min read
Mastering the UI Design Process: From Prep to Validation
21CTO
21CTO
Feb 23, 2021 · Fundamentals

Inside Deepin: How a Modern Desktop OS Is Built from the Ground Up

This article explains the architecture and design of Deepin's desktop operating system, covering its core components, programming languages, desktop environment layers, display manager, session daemons, UI services, bundled applications, and the rationale behind building a custom desktop environment for better user experience.

Desktop OSLinuxUI design
0 likes · 35 min read
Inside Deepin: How a Modern Desktop OS Is Built from the Ground Up
58UXD
58UXD
Jan 13, 2021 · Frontend Development

How Redesigning a Used‑Car Valuation Page Boosted Leads by 50%+

A detailed case study shows how clarifying user scenarios, simplifying page modules, and enhancing visual hierarchy on a used‑car valuation result page increased high‑quality leads by over 50% and doubled daily revenue.

Case StudyProduct RedesignUI design
0 likes · 7 min read
How Redesigning a Used‑Car Valuation Page Boosted Leads by 50%+
58UXD
58UXD
Dec 1, 2020 · Fundamentals

How Gravity, Reading Flow, and Visual Tension Shape UI Design

This article explains practical visual design principles—gravity, reading direction, visual tension, whitespace, and balance—showing how each influences user perception and offering concrete examples that designers can immediately apply to improve UI experiences.

UI designWhitespacegravity
0 likes · 7 min read
How Gravity, Reading Flow, and Visual Tension Shape UI Design
Tianxing Digital Tech User Experience
Tianxing Digital Tech User Experience
Oct 30, 2020 · Frontend Development

Redesigning Financial Digits: Custom Typography and SmartSlider Boost Mobile Banking UX

This case study explores how Tianxing Bank’s virtual banking app redesigns financial digit presentation and input through custom typography, a gesture‑based SmartSlider, and behavior‑driven design principles, achieving enhanced usability, visual harmony, and recognition across mobile platforms.

UI designdesign researchdigital typography
0 likes · 9 min read
Redesigning Financial Digits: Custom Typography and SmartSlider Boost Mobile Banking UX
58UXD
58UXD
Oct 20, 2020 · Game Development

Inside a Game Art Team: From Concept to Launch – A Complete Workflow

This article outlines the full workflow of a game art team, covering its organizational structure, each phase of game development from project initiation to post‑launch, and the detailed art production steps—including style definition, 2D and 3D creation, UI animation, special effects, asset integration, testing, and launch.

3D modelingGame DevelopmentTeam Organization
0 likes · 10 min read
Inside a Game Art Team: From Concept to Launch – A Complete Workflow
Meiyou UED
Meiyou UED
Oct 16, 2020 · Frontend Development

Why Figma Is Redefining UI Design Collaboration in the Cloud

This article examines the evolution of interface design tools, compares Photoshop, Sketch, and Figma, and explains how Figma’s browser‑based, cloud‑native collaboration, component system, and community resources are reshaping UI design workflows for individuals and teams.

Design ToolsFigmaProduct design
0 likes · 15 min read
Why Figma Is Redefining UI Design Collaboration in the Cloud
Tencent Mobility Industry Design Center
Tencent Mobility Industry Design Center
Sep 22, 2020 · Fundamentals

How Tencent’s Car‑Embedded Mini‑Programs Redefine In‑Vehicle UI Design

This guide explains how Tencent’s car‑embedded mini‑programs address the unique constraints of in‑vehicle infotainment by outlining experience highlights, design principles, interaction rules, visual standards, implementation steps, and future outlook for creating safe, efficient, and user‑friendly automotive interfaces.

Design GuidelinesHuman-Computer InteractionMini Program
0 likes · 15 min read
How Tencent’s Car‑Embedded Mini‑Programs Redefine In‑Vehicle UI Design
JD.com Experience Design Center
JD.com Experience Design Center
Sep 17, 2020 · Product Management

How JD’s Ranking Page Supercharged 618 Sales: Design, Data, and Efficiency Hacks

This case study details how JD.com’s ranking page for the 618 promotion leveraged data‑driven navigation, visual redesign, pixel‑perfect front‑end techniques, and component‑based development to boost click‑through rates, conversion, and overall GMV while outlining future optimization directions.

Product ManagementUI designdata optimization
0 likes · 12 min read
How JD’s Ranking Page Supercharged 618 Sales: Design, Data, and Efficiency Hacks
Alibaba Terminal Technology
Alibaba Terminal Technology
Sep 16, 2020 · Frontend Development

How Ear Amplifiers Inspire Smarter Frontend UI Design

This article draws analogies between ear‑phone amplifiers and front‑end development, exploring how hardware amplification concepts can illuminate UI and interaction design, reviewing Apple’s UI evolution, core animation, and the imgcook platform for intelligent, variable UI generation.

UI designapple quartz extremecore animation
0 likes · 12 min read
How Ear Amplifiers Inspire Smarter Frontend UI Design
58UXD
58UXD
Sep 4, 2020 · Blockchain

From Crypto to Gaming: How a Top Blockchain Designer Reinvents UI for Fast-Play

In this in‑depth interview, senior designer Liang Yulong shares his five‑stage design career, contrasts blockchain UI with traditional finance, explains the visual shift from crypto to fast‑play games, and offers advice on cross‑industry growth, skill development, and recommended reading.

UI designblockchaincareer interview
0 likes · 9 min read
From Crypto to Gaming: How a Top Blockchain Designer Reinvents UI for Fast-Play
Programmer DD
Programmer DD
Sep 2, 2020 · Fundamentals

What Made Windows 95 a Milestone? 25‑Year Retrospective

Marking the 25th anniversary of its August 24, 1995 launch, Windows 95 is revisited through a Microsoft video, podcast interviews, and a rundown of its groundbreaking features—such as the Start menu, plug‑and‑play hardware support, and the first bundled Internet Explorer—highlighting its lasting impact on modern Windows designs.

MicrosoftUI designWindows 95
0 likes · 6 min read
What Made Windows 95 a Milestone? 25‑Year Retrospective
Tianxing Digital Tech User Experience
Tianxing Digital Tech User Experience
Aug 14, 2020 · Frontend Development

How Narrative Storytelling Transforms UI Visual Design

This article explores how plot‑driven narrative techniques—both static and dynamic—enhance UI visual design, addressing challenges such as missing timelines and logical flow, and proposes visual‑guidance methods, montage, symbolic timelines, narrative fields, and varied presentation forms to create more engaging user experiences.

UI designdynamic narrativenarrative storytelling
0 likes · 12 min read
How Narrative Storytelling Transforms UI Visual Design
58UXD
58UXD
May 28, 2020 · Frontend Development

Mastering Web Font-Family: Ensure Consistent Typography Across Platforms

This article explains how web fonts are rendered, why the same design draft can show different typefaces on Windows and macOS, and provides practical guidance on using the CSS font-family property, including handling of common fonts and Emoji symbols to achieve consistent, cross‑platform typography.

EmojiUI designcss
0 likes · 10 min read
Mastering Web Font-Family: Ensure Consistent Typography Across Platforms
We-Design
We-Design
May 25, 2020 · Game Development

What Nintendo’s UI Crunch Reveals About Game Design and Player Experience

The article summarizes Nintendo’s UI Crunch conference, detailing the company’s design environment, mindset, production methods, and social responsibilities, and shows how its “entertainment brain” and user‑first approach shape game UI/UX and family‑focused features like the Switch Guardian system.

NintendoUI design
0 likes · 20 min read
What Nintendo’s UI Crunch Reveals About Game Design and Player Experience
Suning Design
Suning Design
Apr 9, 2020 · Fundamentals

Mastering Font Line Height in Sketch: Proven Rules for Perfect Mobile UI

This article explains how to set accurate font line heights in Sketch for mobile UI design, presenting single‑line and multi‑line formulas, practical examples, testing results, and verification steps to ensure consistent visual alignment across iOS, Android, and front‑end implementations.

SketchTypographyUI design
0 likes · 12 min read
Mastering Font Line Height in Sketch: Proven Rules for Perfect Mobile UI
Ctrip Technology
Ctrip Technology
Mar 26, 2020 · Mobile Development

Implementing Dark Theme in Trip.com Mobile App: Design, iOS, Android, and React Native Solutions

This article details Trip.com’s comprehensive Dark Theme implementation across iOS, Android, and React Native, covering design principles, color mapping, illustration adjustments, platform‑specific adaptation techniques, code examples, and tooling that together reduced development effort while enhancing user experience and brand image.

AndroidMobile DevelopmentReact Native
0 likes · 17 min read
Implementing Dark Theme in Trip.com Mobile App: Design, iOS, Android, and React Native Solutions
NetEase Game Operations Platform
NetEase Game Operations Platform
Mar 14, 2020 · Fundamentals

Designing Effective Microinteractions: Principles, Components, and Case Studies

This article explains the concept of microinteractions, outlines their four essential components—trigger, rules, feedback, and loop/pattern—provides design guidelines for each, and illustrates the ideas with practical case studies from BaseUI, Meitu XiuXiu, and Snapseed, highlighting how thoughtful micro‑interaction design enhances user experience.

Product designUI designdesign principles
0 likes · 12 min read
Designing Effective Microinteractions: Principles, Components, and Case Studies
FangDuoduo UEDC
FangDuoduo UEDC
Jan 10, 2020 · Product Management

How to Boost Form Usability: 4 Proven Design Strategies

This guide outlines four key design principles—clear framework, reasonable presentation, efficient interaction, and real‑time feedback—to reduce user effort, prevent errors, and improve overall form experience across digital products.

Product ManagementUI designform design
0 likes · 4 min read
How to Boost Form Usability: 4 Proven Design Strategies
FangDuoduo UEDC
FangDuoduo UEDC
Jan 9, 2020 · Product Management

How Miller’s 7±2 Law Can Boost Your App’s Usability

The classic Miller’s 7±2 principle, which states that short‑term memory can hold about seven items, offers practical guidelines for UI designers: limit choices, group information hierarchically, chunk long data, and streamline navigation to improve app usability and reduce user error.

Miller's LawUI designUsability
0 likes · 5 min read
How Miller’s 7±2 Law Can Boost Your App’s Usability
Suning Design
Suning Design
Dec 31, 2019 · Frontend Development

How to Build Effective UI Design Standards for Consistent User Experience

This guide explains why UI design specifications are essential for product consistency, outlines the benefits for designers, developers, and newcomers, and provides a step‑by‑step process—from defining design principles and base guidelines to creating component libraries and iterating the system over time.

Design GuidelinesUI designfrontend
0 likes · 10 min read
How to Build Effective UI Design Standards for Consistent User Experience
流利说 Design Team
流利说 Design Team
Dec 20, 2019 · Mobile Development

How We Crafted a Child‑Friendly UI for a 3‑8 Year‑Old English Learning App

This article walks through the UI design process of the Liulishuo® children’s English app, covering user personas, core app functions, visual design goals such as efficient browsing, child‑friendly aesthetics, a structured design system, multi‑device adaptation, and component‑library collaboration to deliver a cohesive, engaging experience for both parents and kids.

Children's EducationMobile AppUI design
0 likes · 11 min read
How We Crafted a Child‑Friendly UI for a 3‑8 Year‑Old English Learning App
Tianxing Digital Tech User Experience
Tianxing Digital Tech User Experience
Dec 6, 2019 · Frontend Development

How Film Editing Continuity Shapes Modern UI Design

Continuity editing rules, originally devised for early 20th‑century cinema, guide smooth transitions between shots, and this article explores how those principles—content, motion, position, and time continuity—inform and improve UI design, from global navigation to animation guidelines in iOS and Material Design.

UI designcontinuityfilm editing
0 likes · 9 min read
How Film Editing Continuity Shapes Modern UI Design
FangDuoduo UEDC
FangDuoduo UEDC
Nov 7, 2019 · Fundamentals

How the F‑Pattern Shapes UI Design: Insights from Eye‑Tracking

This article explains the F‑shaped reading pattern discovered through eye‑tracking studies, shows how it influences users' visual flow on web and app interfaces, and offers practical UI design tips—like emphasizing visual focal points and using motion—to guide attention effectively.

F-patternUI designeye tracking
0 likes · 5 min read
How the F‑Pattern Shapes UI Design: Insights from Eye‑Tracking
FangDuoduo UEDC
FangDuoduo UEDC
Oct 30, 2019 · Frontend Development

Quickly Create a Minimalist Mood Board for Urgent Banners

Learn how to efficiently build a minimalist mood board by extracting keywords, gathering visual assets, and generating a final visual guide, a process especially useful for fast‑turnaround banner and popup designs.

UI designbanner creationdesign workflow
0 likes · 3 min read
Quickly Create a Minimalist Mood Board for Urgent Banners
网易UEDC
网易UEDC
Oct 25, 2019 · Fundamentals

Essential UI/UX Book List for Aspiring Designers

This article curates a concise list of five influential design books, offering brief reviews and key takeaways to help beginners and career‑switchers understand UI principles, design psychology, and practical design thinking.

UI designUX booksdesign fundamentals
0 likes · 7 min read
Essential UI/UX Book List for Aspiring Designers
FangDuoduo UEDC
FangDuoduo UEDC
Oct 17, 2019 · Frontend Development

Transform Basic Icons into Six Distinct UI Styles: A Practical Guide

This article explains how a simple 1px rectangular icon can be evolved through six different styling techniques—adjusting strokes, corners, colors, and backgrounds—to suit various UI contexts such as finance apps, system tools, and mobile interfaces.

Style GuideUI designfrontend
0 likes · 4 min read
Transform Basic Icons into Six Distinct UI Styles: A Practical Guide
FangDuoduo UEDC
FangDuoduo UEDC
Oct 16, 2019 · Product Management

How UI Patterns Influence User Retention Across Similar Apps

This article examines how users compare and switch between multiple apps of the same type—such as video, social, and real‑estate platforms—highlighting the impact of consistent UI patterns, reading modes, and filter designs on user comfort, cognitive load, and overall retention.

Product ManagementUI designapp comparison
0 likes · 6 min read
How UI Patterns Influence User Retention Across Similar Apps
FangDuoduo UEDC
FangDuoduo UEDC
Sep 26, 2019 · Frontend Development

Why Card‑Based UI Design Boosts User Experience and Visual Hierarchy

This article explains the concept, advantages, proper techniques, typical use cases, characteristics, and drawbacks of card‑based UI design, illustrating how it adds visual hierarchy and flexibility while also noting when list‑style interfaces may be more appropriate.

UI designcard UIfrontend
0 likes · 7 min read
Why Card‑Based UI Design Boosts User Experience and Visual Hierarchy
JD.com Experience Design Center
JD.com Experience Design Center
Sep 20, 2019 · Fundamentals

How Visual Designers Should Interpret Interaction Mockups and Adjust Layouts Effectively

This article explores how visual designers can understand interaction drafts, maintain information hierarchy, and thoughtfully adjust layouts across operation‑type and platform‑type pages, using real‑world examples to illustrate best practices and common pitfalls in UI design collaboration.

LayoutUI designinformation hierarchy
0 likes · 9 min read
How Visual Designers Should Interpret Interaction Mockups and Adjust Layouts Effectively
FangDuoduo UEDC
FangDuoduo UEDC
Sep 4, 2019 · Product Management

Three Smart UI Design Tricks That Boost Flight Ticket Booking Experience

This article showcases three thoughtful UI design techniques used in Ctrip's flight ticket pages—highlighting how tomorrow's tickets are prioritized at night, price trends replace traditional calendars, and a dynamic bottom filter bar enhances both selection clarity and immersive browsing.

CtripProduct designUI design
0 likes · 3 min read
Three Smart UI Design Tricks That Boost Flight Ticket Booking Experience
FangDuoduo UEDC
FangDuoduo UEDC
Sep 3, 2019 · Product Management

How Taobao’s Homepage Recommendations Work: Full‑Page vs Section‑Focused Browsing

This article examines Taobao’s homepage recommendation system, comparing the full‑page browsing mode that displays a continuous stream of items with the section‑focused mode that groups products into distinct blocks, highlighting their design principles, user experience implications, and underlying recommendation strategies.

TaobaoUI designe-commerce
0 likes · 1 min read
How Taobao’s Homepage Recommendations Work: Full‑Page vs Section‑Focused Browsing
58UXD
58UXD
Aug 29, 2019 · Frontend Development

5 Proven Car‑Image Design Hacks to Boost UI Visuals

This article shares five practical techniques for optimizing car photographs—choosing the right vehicle type, adjusting highlights and shadows, recoloring, perspective layout, and motion effects—to seamlessly integrate automotive visuals into UI and marketing pages, enhancing overall design quality.

Image optimizationUI designVisual Storytelling
0 likes · 5 min read
5 Proven Car‑Image Design Hacks to Boost UI Visuals
Tianxing Digital Tech User Experience
Tianxing Digital Tech User Experience
Jul 26, 2019 · Frontend Development

How Constraint‑Based Design Can Revolutionize Financial Numeric Input

This article explores how applying constraint‑driven design, rooted in Don Norman's psychology, can reshape financial numeric input controls by limiting data ranges, minimizing UI interference, supporting integer habits, and enabling rapid adjustments, ultimately improving efficiency and reducing errors.

Financial TechUI designconstraint design
0 likes · 11 min read
How Constraint‑Based Design Can Revolutionize Financial Numeric Input
Youzan Coder
Youzan Coder
Jul 19, 2019 · User Experience Design

How UI Standardization Transformed Youzan Retail’s Mobile Apps

This article details the background, challenges, and step‑by‑step solution for standardizing UI across Youzan Retail’s iOS and Android apps, covering designer and developer perspectives, the creation of a shared style library, component architecture, resource management, delivery outcomes, pitfalls, and future automation plans.

AndroidComponent LibraryMobile Development
0 likes · 17 min read
How UI Standardization Transformed Youzan Retail’s Mobile Apps
Alibaba Cloud Developer
Alibaba Cloud Developer
Jun 28, 2019 · Frontend Development

How a Frontend Pioneer Built Ant Design and Shaped China’s UI Landscape

This article traces the career of Yu Bo, from his early doubts at the Chinese Academy of Sciences to leading Ant Financial’s Experience Technology team, highlighting his open‑source contributions, his views on frontend value, and the management principles that drive today’s enterprise‑grade UI ecosystems.

CareerExperienceUI design
0 likes · 11 min read
How a Frontend Pioneer Built Ant Design and Shaped China’s UI Landscape
Suning Design
Suning Design
Apr 24, 2019 · Frontend Development

Mastering Navigation Design: Principles, Forms, and Real-World Examples

This article explores essential navigation design principles, various navigation patterns such as top menus, sidebars, breadcrumbs, tabs, pagination, steps, and dropdowns, and demonstrates their application through a case study of Suning Logistics' Tianyan platform, offering practical guidance for creating coherent, user‑friendly web interfaces.

NavigationUI designfrontend
0 likes · 14 min read
Mastering Navigation Design: Principles, Forms, and Real-World Examples
网易UEDC
网易UEDC
Apr 15, 2019 · Fundamentals

How to Create High-End Visual Texture in UI Design: A Step‑by‑Step Guide

This tutorial explains the concept of visual texture, breaks down its essential elements such as overall lighting, subtle gradients, and fine details, and walks you through an eight‑step case study using Photoshop to produce a polished, high‑quality design that feels rich and tactile.

PhotoshopUI designdesign
0 likes · 9 min read
How to Create High-End Visual Texture in UI Design: A Step‑by‑Step Guide
Tianxing Digital Tech User Experience
Tianxing Digital Tech User Experience
Mar 30, 2019 · Frontend Development

Designing Effective Navigation Bars: Principles and Best Practices

This article explores the fundamentals of navigation bar design for mobile apps, covering component structure, why traditional bars need redefinition for financial products, layout rules for left/right actions and titles, and guidelines for fixed top bars to improve usability while maintaining visual consistency.

Design GuidelinesMobile AppUI design
0 likes · 6 min read
Designing Effective Navigation Bars: Principles and Best Practices
Programmer DD
Programmer DD
Mar 30, 2019 · Frontend Development

Top 20 Must-Have Front-End Tools and Resources for Developers

This guide compiles a curated collection of essential front‑end development tools, asset libraries, and community sites—including bookmark managers, placeholder image generators, code‑beautifiers, free image sources, UI design resources, and popular forums—to help developers streamline workflows and discover valuable online resources.

ResourcesToolsUI design
0 likes · 7 min read
Top 20 Must-Have Front-End Tools and Resources for Developers
Tianxing Digital Tech User Experience
Tianxing Digital Tech User Experience
Mar 22, 2019 · Frontend Development

Designing Secure and Efficient Input Fields for Financial Apps

This article examines how basic text‑field controls evolve into specialized, secure, and range‑limited input components for financial products, highlighting the interplay with keyboards, the distinction between general and constrained inputs, and design patterns such as default values, plus/minus steppers, and gesture‑based interactions.

UI designfinancial UXinput fields
0 likes · 11 min read
Designing Secure and Efficient Input Fields for Financial Apps
网易UEDC
网易UEDC
Feb 18, 2019 · Frontend Development

Mastering Dark Mode UI: Essential Design Tips for Elegant Interfaces

This article explores the advantages and challenges of dark mode UI, offering practical guidelines on text color, spacing, typography, icon design, button states, dividers, color usage, visual hierarchy, and whitespace to create refined and readable dark‑theme applications.

UI designdark-modefrontend
0 likes · 7 min read
Mastering Dark Mode UI: Essential Design Tips for Elegant Interfaces
Tianxing Digital Tech User Experience
Tianxing Digital Tech User Experience
Jan 25, 2019 · Fundamentals

Unlocking Efficiency: How Modular Design Transforms Products and UI

This article explains the concept of modular design, outlines its efficiency, innovation, and consistency benefits, showcases real-world examples from manufacturing to construction, and demonstrates how modular thinking can be applied to interaction flows, page frameworks, content, and visual elements in digital product design.

EfficiencyProduct DevelopmentUI design
0 likes · 8 min read
Unlocking Efficiency: How Modular Design Transforms Products and UI
网易UEDC
网易UEDC
Dec 24, 2018 · Fundamentals

How Strategic Color Choices Elevate UI Design and Brand Perception

This article explains why color selection feels uncomfortable when done arbitrarily, outlines a goal‑driven strategy for choosing primary and secondary hues, compares industry‑specific color objectives, demonstrates the impact of simplified color hierarchies and contrast schemes through real‑world UI case studies, and reveals how gradients, subtle shadows and fine details create a premium sense of quality in digital products.

UI designbrandingdesign quality
0 likes · 19 min read
How Strategic Color Choices Elevate UI Design and Brand Perception
JavaScript
JavaScript
Sep 8, 2018 · Artificial Intelligence

How Sketch2Code Turns Hand‑Drawn UI Designs into Ready‑to‑Use HTML with AI

Sketch2Code leverages Microsoft’s custom vision model, OCR, and Azure services to automatically convert hand‑drawn UI mockups into functional HTML code, detailing its workflow—from image upload and element prediction to layout generation and final HTML output—plus links to the repository and demo site.

AIAzureHTML generation
0 likes · 3 min read
How Sketch2Code Turns Hand‑Drawn UI Designs into Ready‑to‑Use HTML with AI
网易UEDC
网易UEDC
Jul 9, 2018 · Frontend Development

Unlocking UI Metaphor Design: Types, Methods, and Real‑World Examples

This article explains the concept of UI metaphor design, categorizes common visual, auditory, and haptic metaphors, and outlines four design approaches—conceptual, feature‑based, structural, and behavioral—providing concrete examples and illustrations to inspire effective interface design.

UI designfrontendinteraction design
0 likes · 9 min read
Unlocking UI Metaphor Design: Types, Methods, and Real‑World Examples
Youzan Coder
Youzan Coder
Mar 23, 2018 · Frontend Development

Building an Excellent React Component Library: Design, Development, Testing, and Maintenance (Zent Case Study)

The article details how Youzan’s frontend team created the Zent React component library—defining a unified design philosophy, strict code standards, a CLI‑driven workflow, Jest/Enzyme testing, and disciplined maintenance practices—to replace duplicated code, support diverse business needs, and foster open‑source collaboration.

Component LibraryReActUI design
0 likes · 10 min read
Building an Excellent React Component Library: Design, Development, Testing, and Maintenance (Zent Case Study)
网易UEDC
网易UEDC
Mar 19, 2018 · Game Development

15 Essential UI Design Tips for Card Game Development

This article shares fifteen practical UI design principles for card‑based games, covering art style selection, player‑targeted aesthetics, consistency with game lore, leveraging known IPs, creating distinctive visuals, simplifying interfaces, ensuring usability on mobile, and enhancing overall player experience.

Game DevelopmentUI designcard games
0 likes · 10 min read
15 Essential UI Design Tips for Card Game Development
ITFLY8 Architecture Home
ITFLY8 Architecture Home
Oct 18, 2017 · Backend Development

How to Build Maintainable Backend System Prototypes with Axure

This article explains how to design standardized, maintainable backend system prototypes using Axure, covering framework layout, dynamic panel setup, responsive functions, multi‑level menus, component libraries, and practical tips for efficient UI design and reuse across projects.

AxureBackend PrototypeComponent Library
0 likes · 23 min read
How to Build Maintainable Backend System Prototypes with Axure
Baidu Intelligent Testing
Baidu Intelligent Testing
Sep 18, 2017 · Mobile Development

Design Guidelines and 13 Essential Changes for iPhone X UI

This article provides comprehensive iPhone X UI design guidelines, covering screen dimensions, safe‑area layout, status‑bar adjustments, home‑indicator considerations, color gamut updates, Face ID integration, custom keyboard rules, larger navigation bars, and resources for designers and developers.

Design GuidelinesMobile DevelopmentUI design
0 likes · 10 min read
Design Guidelines and 13 Essential Changes for iPhone X UI
BiCaiJia Technology Team
BiCaiJia Technology Team
Aug 13, 2017 · Frontend Development

What Makes Great UI Design for Games and Mobile Apps?

This article explains the fundamentals of UI design, covering its definition, key components, and the distinct approaches for game interfaces and mobile applications, highlighting how visual appeal and functional interaction together create effective user experiences.

Mobile UIUI designfrontend
0 likes · 4 min read
What Makes Great UI Design for Games and Mobile Apps?
网易UEDC
网易UEDC
Aug 8, 2017 · Product Management

Designing a Cohesive Mobile Payment UI: NetEase Pay Case Study

This article examines how NetEase Pay’s product positioning shapes its design system, analyzes competing payment apps, outlines key visual keywords, and showcases iterative UI solutions—including icon unification and card‑based game branding—to create a cohesive, user‑friendly mobile payment experience.

Brand IntegrationProduct designUI design
0 likes · 9 min read
Designing a Cohesive Mobile Payment UI: NetEase Pay Case Study
Suning Technology
Suning Technology
May 23, 2017 · Product Management

How Microcopy Transforms Empty UI Scenes: A Design Playbook

This article explores how thoughtful microcopy—tiny UI text elements—can turn empty screens into engaging, personality‑rich experiences by aligning visual design, brand voice, and user emotions, offering practical guidelines and examples for product designers.

Product designUI designbranding
0 likes · 6 min read
How Microcopy Transforms Empty UI Scenes: A Design Playbook
Architecture Digest
Architecture Digest
May 8, 2017 · Product Management

10 Best Practices for Improving Search Result Page User Experience

This article presents ten practical guidelines—ranging from preserving the original query to offering alternative suggestions for empty results—to help designers and product managers create more effective, user‑friendly search result pages that boost engagement and conversion.

Product ManagementUI designsearch UX
0 likes · 9 min read
10 Best Practices for Improving Search Result Page User Experience
Hujiang Design Center
Hujiang Design Center
May 5, 2017 · Fundamentals

How to Master Visual Hierarchy: Proven Techniques to Boost User Focus

This article explains why visual hierarchy is crucial in interface design, outlines four key dimensions—size, spacing, content form, and color—and demonstrates their application through real‑world case studies that improve user focus and reduce cognitive load.

UI designdesign principlesinformation architecture
0 likes · 7 min read
How to Master Visual Hierarchy: Proven Techniques to Boost User Focus
网易UEDC
网易UEDC
Mar 22, 2017 · Mobile Development

Choosing Between ActionSheets, BottomSheets, and Popovers for Mobile UI

This article examines less‑common mobile overlay patterns—half‑screen pages, ActionSheets, BottomSheets, and Popovers—explaining their use cases, design advantages, and best‑practice tips for iOS and Android applications.

ActionSheetsBottomSheetsMobile Development
0 likes · 11 min read
Choosing Between ActionSheets, BottomSheets, and Popovers for Mobile UI
Hujiang Design Center
Hujiang Design Center
Mar 16, 2017 · Fundamentals

Designing for Color Blind Users: 5 Essential Tips to Boost Accessibility

With roughly one in 12 men and one in 200 women affected by color vision deficiency, this guide explains what color blindness is, why inclusive design matters, and offers five practical strategies—using symbols, limiting colors, adding textures, ensuring contrast, and avoiding problematic color combos—to create more accessible web and app experiences.

UI designaccessibilitycolor blindness
0 likes · 7 min read
Designing for Color Blind Users: 5 Essential Tips to Boost Accessibility
Hujiang Design Center
Hujiang Design Center
Dec 30, 2016 · Fundamentals

Boost Your Design with Contrast & Analogous Colors – Insights from a Japanese Drama

This article explores how contrast and analogous color combinations, illustrated through outfits from the Japanese drama “Proof of the Goodness of Simplicity – Proofreader Girl Kono Etsuko,” can inform visual and UI design, offering practical proportion guidelines and inspiring a positive, detail‑focused mindset for designers.

UI designanalogous colorscolor theory
0 likes · 10 min read
Boost Your Design with Contrast & Analogous Colors – Insights from a Japanese Drama
AI Cyberspace
AI Cyberspace
Jul 29, 2016 · Product Management

Why Design Specs Matter: Boost Team Efficiency and Brand Consistency

This article explains how well‑crafted design specifications improve multi‑designer collaboration, reduce development redundancy, and preserve brand identity across product iterations, while also highlighting common pitfalls and offering a step‑by‑step guide to building an effective design system for newcomers.

Design GuidelinesUI designdesign system
0 likes · 15 min read
Why Design Specs Matter: Boost Team Efficiency and Brand Consistency
58UXD
58UXD
Mar 8, 2016 · Frontend Development

How Psychology Shapes User Experience: 5 Design Tricks That Influence Behavior

This article explores how fundamental psychological principles—such as compulsion, conformity, visual illusion, and facial attraction—shape user experience design, illustrating each concept with real-world examples and visual cues to help designers create more engaging, trustworthy, and intuitive interfaces.

UI designbehavioral designdesign psychology
0 likes · 8 min read
How Psychology Shapes User Experience: 5 Design Tricks That Influence Behavior
58UXD
58UXD
Jan 1, 2016 · Fundamentals

Choosing the Right Feedback: Indicators, Validations, and Notifications Explained

This article explains how to select the appropriate communication method—indicators, validations, or notifications—by examining their purposes, urgency, and required user actions, helping designers provide clear, contextual feedback that enhances user experience across interfaces.

NotificationsUI designfeedback
0 likes · 14 min read
Choosing the Right Feedback: Indicators, Validations, and Notifications Explained
21CTO
21CTO
Nov 1, 2015 · Product Management

What Makes an Error Dialog Truly Helpful? Lessons from Apple and Windows

This article examines why many error dialogs frustrate users, outlines Apple’s human‑interface guidelines for clear notifications, critiques real‑world examples from Windows Phone, Google Chrome and Twitter, and distills three essential principles for designing useful, user‑friendly error messages.

Error handlingProduct ManagementUI design
0 likes · 9 min read
What Makes an Error Dialog Truly Helpful? Lessons from Apple and Windows
Suning Design
Suning Design
Oct 13, 2015 · Product Management

What Do UX, UI, Visual, Interaction, and Product Designers Actually Do?

This article demystifies the many design titles—UX, UI, visual, interaction, product, and user‑research designers—explaining their core responsibilities, typical deliverables, essential tools, and how they differ across industries, helping readers navigate the confusing landscape of modern design roles.

Product designUI designUX design
0 likes · 12 min read
What Do UX, UI, Visual, Interaction, and Product Designers Actually Do?
JD.com Experience Design Center
JD.com Experience Design Center
Jun 9, 2015 · Fundamentals

Why UI Designers Should Sketch (And When It’s Not Essential)

This article explains that UI design requires only basic drawing skills as a tool for visual research, compares UI with related fields like comics, game art, and film, and outlines essential sketching fundamentals—structure, perspective, color, and composition—that boost efficiency and creativity.

UI designcolor theorydrawing fundamentals
0 likes · 8 min read
Why UI Designers Should Sketch (And When It’s Not Essential)