Designing Seamless UI for HarmonyOS 2‑in‑1 Devices: Key Guidelines and Best Practices

Huawei recently released a HarmonyOS application design guide for 2‑in‑1 devices, detailing UI presentation for the HarmonyOS PC edition.

1. Interface Design Highlights

Efficiency‑oriented and immersive UI: the PC version balances productivity and immersion with multiple visual styles.

Application examples: weather app, file explorer and other apps feature clean, intuitive interfaces that resemble traditional PC interactions.

2. Window Framework

A window serves as the container for each application, consisting of a container layer (showing brand and window controls) and a content layer (displaying and interacting with content).

Window controls: optional window name/app icon, mandatory minimize, maximize, and close buttons.

Window size adjustment: supports a default size and can be stretched to any dimension, offering flexible window management.

When an app lacks adaptation, the window provides a default title area background, app icon, app name, and control buttons.

3. Size Specifications: Adapting to Different Devices

Default size: 67% of the screen, ensuring appropriate display area on launch.

Minimum size: 360 × 240 vp, guaranteeing good visual quality even on small screens.

4. Column Structure

The content layer is the space for displaying information; developers should focus on column layout, multi‑modal interaction based on keyboard/mouse, and widget specifications.

Three window forms exist on 2‑in‑1 devices; choose the appropriate form according to business needs.

5. Responsive Rules

Leverage the large screen of 2‑in‑1 devices with responsive layouts that dynamically adapt to size changes, ensuring optimal content presentation.

In September last year, Dr. Wang Chenglu, CEO of Shenzhen Kaihong Digital Industry Development Co., confirmed on Weibo that a HarmonyOS PC version is expected in 2024, suggesting a possible market release this year.

Reference: Huawei HarmonyOS 2‑in‑1 Design Guide