Easily Learn UI Design! From Entry to Advanced, Quickly Raise Your Design Ability!

Course Content

Lesson 0: UI Knowledge-System Review—Learning Path
– In this lesson, we help you build a complete UI knowledge framework, clarify the learning path and focus, taking you from zero step by step toward design mastery.

Lesson 1: iOS Design Spec—Basic Spec and Slicing
– Learn iOS design’s basic spec and slicing tricks, mastering how to achieve consistency across devices.

Lesson 2: iOS New Trend Analysis—Module Spec and Design Principles (Part 1)
– Deeply understand iOS design’s latest trends, learn modular design spec and basic design principles, raising your design thinking.

Lesson 3: iOS New Trend Analysis—Module Spec and Design Principles (Part 2)
– Continue to deeply explore iOS design principles, mastering how to integrate the latest trends into design, raising design’s modern feel.

Lesson 4: Android Design Spec (Part 1)—Material Design Language
– Master Android design’s basic spec, especially the Material Design language, letting you better understand Android apps’ design style.

Lesson 5: Android Design Spec (Part 2)—Design Spec, Slice Adaptation, MD3 Trend
– Deeply learn Android design’s slice adaptation, understand Material Design 3 trends, mastering how to make design fit modern needs.

Lesson 6: Mini-Program Design Spec—Spec and Adaptation Guide
– Understand mini-program design’s unique spec and adaptation methods, mastering how to achieve smooth user experience across platforms.

Lesson 7: Official Site and B-Side Back-Office Design Spec
– Explore B-side back-office design’s best practices, learning how to design efficient, easy-to-use back-office systems.

Lesson 8: UI-Design Fun—IP Integration, Brand Extension
– Learn how to integrate IP into UI design, expanding brand influence and raising user emotional connection.

Lesson 9: Empty-State Design—The Page’s Emotional Derivation
– Discuss empty-state design’s importance, learning how to make blank pages emotional and the user experience more considerate.

Lesson 10: Big-Tech P6 Written-Test Problem—Full B-Side Interface Redesign Thinking
\ – Analyze big-tech P6 written-test problems, learning B-side interface’s full redesign thinking, making your design more professional.

Lesson 11: Icon-Detail Strengthening (Part 1)—Basic Spec, Shape Analysis
\ – Learn icon design’s basic spec and shape-analysis tricks, making your icons more recognizable.

Lesson 12: Icon-Detail Strengthening (Part 2)—Color Analysis, Detail Handling
\ – Discuss icon design’s color tricks and detail handling, raising icons’ overall visual effect.

Lesson 13: Clash-Color Gradient Icons—Creative Process, Trick Review
\ – Learn clash-color gradient icons’ creative design tricks, mastering unique color and design thinking.

Lesson 14: Fun Xianyu-Style Icons—Color Filling Method
\ – Explore how through fun icon design and color-filling tricks make your icons more attractive.

Lesson 15: Linear Icons—Fun Broken-Point Style
\ – Understand linear icons’ design tricks, learning how to use the fun broken-point style to raise icons’ visual effect.

Lesson 16: Icon Test Flow—Usability Analysis
\ – Learn icon design’s usability-test flow, helping you evaluate design effect and ensure best user experience.

Lesson 17: Big-Tech P6 Written-Test Problem—Strong-Texture Realistic-Icon Drawing Thinking
\ – Analyze big-tech P6 written-test problems, learning how to draw strong-texture, realistic icons, raising your design level.

Lesson 18: UI Button Design—Four States, Refinement
\ – Carefully analyze UI buttons’ four-state design, mastering button design’s refinement tricks.

Lesson 19: Special Buttons—Floating Button, Diffusion Trick
\ – Learn floating-button design tricks, mastering how to use diffusion effects to make buttons more interactive.

Lesson 20: Tab Bar—Rudder-Style Button
\ – Understand the rudder-style-button style in tab-bar design, raising design’s interactivity and ease of use.

Lesson 21: Label-Design Principles in UI
\ – Learn label design’s basic principles, mastering how to design labels both beautiful and practical.

Lesson 22: Efficiency-Boosting Design—Component-Based Banners
\ – Discuss how through component-based design raise banner-design efficiency, making work more efficient.

Lesson 23: Operations-Design Ability—Image-Text Mixed Ceramic Area
\ – Learn image-text mixed layout’s design tricks, building a ceramic area both beautiful and attractive.

Lesson 24: Operations-Design Ability—Booth Empty-Feeling Ceramic Area
\ – Deeply understand the booth-empty-feeling ceramic area’s design method, raising the page’s visual impact.

Lesson 25: Operations-Design Ability—Illustration Ceramic Area
\ – Learn illustration-style ceramic-area design, building an artistic page layout.

Lesson 26: Operations-Design Ability—Image-Compositing Banners
\ – Learn how to combine images with compositing elements, designing banners with stronger visual appeal.

Lesson 27: Operations-Design Ability—Promo-Feeling Model Banner
\ – Explore how to design strongly promo-feeling model banners, raising the page’s commercial effect.

Lesson 28: Operations-Design Ability—Mouse-Drawn Illustration Banner
\ – Learn how to use mouse-drawn illustration to design banners, building unique visual effects.

Lesson 29: E-Commerce Industry UI Interface Redesign (Part 1)
\ – Learn e-commerce-industry UI interface’s redesign tricks, making your design better fit industry needs.

Lesson 30: E-Commerce Industry UI Interface Redesign (Part 2)
\n– Continue exploring e-commerce UI interface redesign thinking, optimizing user experience and raising conversion.

Lesson 31: Medical Detail-Page UI Interface Redesign (Part 1)
\n– Discuss medical-industry detail-page UI interface redesign, raising users’ convenience.

Lesson 32: Medical Detail-Page UI Interface Redesign (Part 2)
\n– Continue deepening medical-industry UI interface redesign tricks, making medical info easier to convey.

Lesson 33: Finance Industry UI Interface Redesign (Part 1)
\n– Learn finance-industry UI interface redesign tricks, raising the page’s professionalism and ease of use.

Lesson 34: Finance Industry UI Interface Redesign (Part 2)
\n– Deeply explore finance-industry UI interface redesign, optimizing the user’s operation flow.

Lesson 35: Social Industry UI Interface Redesign (Part 1)
\n– Understand social-industry UI interface redesign tricks, raising user stickiness and interactivity.

Lesson 36: Social Industry UI Interface Redesign (Part 2)
\n– Continue learning social-industry UI interface redesign methods, making social products more attractive.

Lesson 37: Music Industry UI Interface Redesign (Part 1)
\n– Explore music-industry UI interface redesign thinking, building interfaces both beautiful and practical.

Lesson 38: Music Industry UI Interface Redesign (Part 2)
\n– Continue raising music-industry UI interface redesign tricks, optimizing user experience and visual effect.

Lesson 39: B-Side Tool Product UI Interface Redesign (Part 1)
\n– Learn B-side tool products’ UI interface redesign tricks, raising tool products’ ease of use and professionalism.

Lesson 40: B-Side Tool Product UI Interface Redesign (Part 2)
\n– Continue deepening B-side tool-product UI interface redesign, optimizing function-and-interface integration.

Lesson 41: Frontline Big-Tech Written-Test Real Combat—Full Interface Redesign
\n– Learn big-tech written-test real-combat cases, mastering full-interface-redesign thinking and tricks.