Technical Training on UI/UX - HKPC Academy
Technical Training on UI/UX
HKPC Building 78 Tat Chee Avenue Kowloon
Mr CHAN, Tel:2788 5800


UX Design of an application is a management process that can improve user experience and customer satisfaction. This course introduces UX concepts from the ground-up.

Starting by learning the practical UX design process, usability testing methodology, design tools and terminology, participants will be able to adopt them to improve application adoption, customer satisfaction and workflow productivity.

Download Full Course Detail ▼ 

Content Outline

Chapter 1 Introduction to Mobile and Web UX Design

  • (a) What is user experience (UX)
  • (b) UX vs UI
  • (c) What is usability
  • (d) Challenges without UX
  • (e) Importance of UX and usability in public and organi尸ations
  • (f) Key business driver to UX, UI
  • (g) What is the difference between UX, UI, usability

Chapter 2 Mobile-design strategy

  • (a) Mobile App, website, responsive design, adaptive design
  • (b) Device differences: Android v. iPhone v. Windows Phone 7
  • (c) Hybrid apps Vs web apps
  • (d) Implications of different platforms on design
  • (e) Advantages and disadvantages

Chapter 3 Overview of UX design workflow

  • (a) UX: Objective or Subjective?
  • (b) Working with vendor
  • (c) Defining objective and target audience
  • (d) Collection of user requirements
  • (e) Wireframing and prototyping
  • (f) Skeuomorphism and flat design

Chapter 4 Overview of usability testing

  • (a) Essential usability principles and design patterns for mobile
  • (b) UX and usability test methodology
  • (c) Identify the scope of usability
  • (d) Define test plan
  • (e) Define testing method and technique
  • (f) Review testing result and recommendation

Chapter 5 UX Design

(a) Navigation Design Patterns

  • Content-based Navigation
  • Sliders
  • Popovers
  • Slideouts, sidebars and drawers
  • Navigation and search
  • Web and app patterns
  • Hidden navigation or search
  • Carousels and horizontal navigation
  • Filters and facets
  • Location listings
  • Menus: Dropdown boxes, accordions, overlays, sliding menus, pie menus, sliding menus
  • Contextual menus, tab bars, navigation bars
  • Tab bars, navigation bars, hamburger and other navigation menus, navigation hubs

(b) Navigation Pitfall

  • How to deal with deep hierarchies on mobile
  • The Back button
  • Hidden navigation: More and action overflow

(c) Workflow and path to content

  • Button placement
  • Guiding users through “steps”

(d) Feedback

  • Errors and alerts; reporting errors in forms and elsewhere
  • Notifications
  • Modal dialogs and alerts
  • Progress indicators

(e) Lists and scrolling

  • View All, pagination, and infinite scrolling

(f) Form design

  • Registration and login forms
  • Submit buttons
  • Workflow and form steps
  • Locator tools
  • Errors in forms

(g) User Input, typing and controls

  • Flat design
  • Input-field design
  • Typing and mobile input-field design
  • Spinners, sliders, and other selectors
  • Carousels and carousel cues
  • Button and button placement

(h) Fragmenting the screen

  • Modal dialogs, split views, multipane screens, popovers

(i) Location

  • Location information, maps, locator forms

(j) Color Graphics

  • Icon and Text Choice
  • Icons and icon labels

(k) Gestures and multi-touch

  • Touch targets: size, placement, affordances or signifiers
  • Gesture affordances and familiarity
  • Progressive disclosure and gesture overload
  • Swipe/Gesture ambiguity
  • Accidental touches and the back button
  • Gestures
  • Making gestures usable
  • Usability of the horizontal swipe or horizontal navigation

(l) Content: Text, images and videos

  • Comprehension on mobile
  • Tasks that are hard on mobile
  • Text content: readability and scannability
  • Headlines and summaries
  • Related content
  • Images and videos
  • Dealing with long pages: Mini-IA and in-page tables of contents
  • Mini-Information Architecture (mini-IA) and layered content
  • Show Logo and company name

(m) Search, filter, sort

  • Scoped search
  • Presenting search results
  • Presenting and submitting filters

(n) Other Miscellaneous

  • General Layout
  • Orientation
  • Feedback
  • Content
  • Trustworthiness
  • Help
  • Social
  • Marketing

(o) Some Major Mobile Pitfalls

  • The 5 big constraints: limited data, finite battery, hand-held usage, divided user attention, and small screens

Chapter 6 Marketing UX

  • (a) Making apps findable and discoverable
  • (b) Advertising mobile apps on websites
  • (c) Icons, names, and descriptions of mobile apps
  • (d) App discoverability: Making your app findable in an app store
  • (e) Dealing with multiple apps from the same company
  • (f) What is personas
  • (g) How to create effective personas and use cases
  • (h) How to use personas and use cases to inform feature lists

Learning Takeaway

  • Understand the Concept of User Experience (UX)
  • Understand the Differences between Usability, UX and UI
  • Understand the Mobile design strategy in UX
  • Learn the UX Design Workflow and Processes
  • Learn the Usability Testing, Test Plan & Methodology
  • Understand Different UX Patterns and Designs
  • Learn Some Tools in UX

Date & Time

Date: 25-26 Sep 2023
09:30 – 17:00


Cantonese, supplemented with English terminology

Course Fee

HK$7,740 (May apply up to HK$5,160* subsidy)
* Maximum saving, with the final grant subjects to approval.

Who should attend

Project managers, business users, business analysts, process managers, system software developers and UX designers

Trainer Information

Alan LEE held a senior management role in the technology division of an investment bank, overseeing the corporate strategy, product development and production management for over 15 years. With extensive IT background, Mr Lee possesses practical project experience on sophisticated analytics and large-scale global technology project management. He also has rich training experience in the design and delivery of Big Data analytics, Fintech and Blockchain technologies and applications.