WeChat Mini 프로그램 디자인 사양 (3) 편리하고 우아함

3. 편리함과 우아함

PC 시대의 물리적 키보드와 마우스부터 모바일 시대의 손가락까지, 입력 장치는 대폭 단순화되었지만 손가락 조작의 정확성은 키보드와 마우스에 비해 훨씬 떨어집니다. 이러한 변화에 적응하기 위해 개발자는 설계 과정에서 휴대폰 기능을 최대한 활용하여 사용자에게 편리하고 우아한 제어 인터페이스를 제공해야 합니다.

1. 입력을 줄입니다

휴대폰 키보드 영역이 작고 빽빽하기 때문에 입력이 어렵고 입력 오류가 발생하기 쉽습니다. 따라서 미니 프로그램 페이지를 디자인할 때는 사용자 입력을 최소화하기 위해 기존 인터페이스나 다른 것을 사용합니다. 조작하기 쉬운 옵션을 통해 사용자 입력 경험을 향상할 수 있습니다.

입력을 줄이고 인터페이스를 능숙하게 사용하세요

예를 들어 아래 그림에서는 은행 카드를 추가할 때 카메라 인식 SDK 인터페이스를 사용하여 사용자 입력을 돕습니다. 또한 WeChat 팀은 지리적 위치 인터페이스와 같은 다양한 SDK 인터페이스도 공개했습니다(자세한 내용은 WeChat JS-SDK 참조). 이러한 인터페이스를 최대한 활용하면 사용자 입력의 효율성과 정확성이 크게 향상되어 경험이 최적화됩니다. .

인터페이스를 사용하는 것 외에도 사용자가 수동으로 입력해야 하는 경우 키보드 입력 대신 사용자가 선택할 수 있도록 노력해야 합니다. 한편으로, 회상은 기억하기 쉽고 일반적으로 사용자가 메모리 입력에만 의존하는 것보다 제한된 옵션 중에서 선택하는 것이 더 쉽습니다. 반면에 모바일에서는 여전히 조밀한 단일 키 입력으로 간주됩니다. 전화 키보드는 쉽게 입력 오류를 일으킬 수 있습니다. 예를 들어, 그림에서 사용자가 검색할 때 검색 기록 바로가기 옵션을 제공하면 사용자가 빠르게 검색하고 불필요한 키보드 입력을 줄이거 나 피하는 데 도움이 됩니다.

2. 오작동 방지

휴대폰에서는 인터페이스를 제어하기 위해 손가락으로 화면을 터치하므로 손가락 클릭의 정확도는 마우스보다 훨씬 낮습니다. 페이지에서 클릭하려면 충분한 고려가 필요합니다. 핫존 영역은 클릭 가능한 영역이 너무 작거나 너무 조밀하여 발생하는 오작동을 방지합니다. 원래 컴퓨터 화면에서 사용하던 인터페이스를 별다른 개조 없이 단순히 휴대폰에 그대로 이식하면 이런 문제가 발생하기 쉬운 경우가 많다. 휴대폰의 화면 해상도가 다르기 때문에 최적의 클릭 픽셀 크기가 완전히 일정하지는 않지만 물리적 크기로 환산하면 대략 7mm~9mm 사이입니다. WeChat에서 제공하는 표준 컨트롤 라이브러리에서는 다양한 컨트롤이 페이지 클릭 효과와 다양한 화면에 대한 적응을 고려했습니다. 따라서 디자인을 위해 표준 컨트롤 크기를 사용하거나 모방하는 것이 다시 권장됩니다.

3. 인터페이스를 사용하여 성능 향상

WeChat 디자인 센터는 스케치 디자인 제어 라이브러리와 WeUI 재구성 코드 라이브러리를 포함한 일련의 웹 표준 제어 라이브러리를 출시했습니다. 모바일 페이지의 사용성 및 운영 성능, WeChat 웹 개발 팀은 WeChat JS-SDK 인터페이스를 지속적으로 개선 및 확장하고 있으며 이러한 리소스를 사용하면 사용자에게 더 빠른 서비스를 제공할 수 있을 뿐만 아니라 페이지도 개선할 수 있습니다. 성능 향상은 큰 효과를 가지며 눈에 보이지 않게 사용자 경험을 향상시킵니다.