사용자 친화적 인 모바일 인터페이스를 디자인하는 방법

Sep 16, 2025

어떻게

일부 모바일 디자인은 문제가 발생합니다. 표면에서 멋지게 보일 수도 있지만 이들을 사용하기 시작하면 곧 너무 중요한 요소가 무시되었음을 알게됩니다. 인체 공학적. 인체에 맞는 디자인을 만드는 고귀한 예술 (다른 방향이 아닌)은 디자인 세계의 진정한 불결한 영웅 중 하나입니다.

인체 공학은 항상 산업 디자이너에게 매우 중요하지만 디지털 디자이너에게도 점차 중요 해지고 있습니다. 왜? 스마트 폰과 태블릿이 디지털 디자인과 상호 작용하는 방식을 변경하기 때문에. 우리는 더 이상 더 이상 번거로운 키보드와 마우스를 사용하여 디지털 친구에게해야 할 일을 알려줍니다. 이제 더 직접적이고, 육체적입니다. 우리는 우리의 장치를 잡습니다. 우리는 그들을 탭합니다. 우리는 그들을 꼬집어 라. 우리는 그들을 사랑스럽게 훈계합니다.

우리의 사랑하는 모바일 장치와 점점 더 많은 신체적 결합은 설계자가 디자인을 어떻게 보이고 느끼는지뿐만 아니라 그것을 사용하는 물리적 측면에 대해 생각할뿐만 아니라 디자이너가 사용자가 스마트 폰 및 태블릿과 개최하고 상호 작용하는 방법을 생각합니다. 어떤 화면이 편안하게 도달 할 수 있는지와 디자인이 어떻게 느끼는지에 대해서 디자이너가 모바일 디자인의 인체 공학에 대해 생각할 수 있습니다.

그렇다면 인체 공학적 인 모바일 디자인을 만드는 방법은 어떻게 사용하므로 편안하게 사용할 수 있습니까?

01. 사무실에서 나가십시오

가능한 디자인에 대해 생각하기 전에조차도 사무실에서 벗어나 사무실에서 직접 관찰을하십시오. 아침이나 오후를 보내는 곳, 언제, 어떻게 그리고 왜 사람들이 모바일 장치를 사용하고 있는지를보고 있습니다.

사람들이 자신의 장치와 개최하고 자신의 기기와 상호 작용하는 방법, 그 당시에는 그들이 할 수있는 일과 도전과 산만 함과의 산만 함과 어떻게 해당하는지에 대한 메모를 작성하십시오. 이 정보는 디자인의 인간 공학에 알리는 데 도움이 될 것이며 설계를 테스트하는 것이 실제로 실제로 실제로 발생하는 시나리오에 대해 테스트 할 수있는 디자인을 테스트 할 수 있습니다.

02. 다중 보류를위한 디자인

The three main holds used for a smartphone, and the frequency which they’re typically used — 스마트 폰에 사용되는 세 가지 메인 보유 및 일반적으로 사용되는 빈도

모바일 장치를 사용하는 사람들을 관찰하면 곧 그들이 다양한 다른 보류 ...에 사용 된 다양한 보류 및 사용자가 자신의 보류를 변경하는 빈도는 여러 가지를 염두에두고 설계하는 것이 중요합니다.

예를 들어, 한 손으로 사용하는 스마트 폰 디자인을 염두에두고 (가장 도전적이므로) 항상 각각의 편안함을 확인하기 위해 다양한 보류를 통해 항상 테스트합니다.

03. 도달 범위에 인기있는 컨트롤을 놓습니다

Green areas are easy to reach, amber takes more effort and red areas are hard to reach — 그린 지역은 쉽게 도달하기 쉽고, 앰버가 더 많은 노력을 거둘 수 있으며 빨간 지역이 도달하기가 어렵습니다.

손가락이나 엄지 손가락으로 쉽게 도달 할 수있는 버튼과 링크와 같은 자주 사용되는 컨트롤을 놓습니다. 화면의 중간과 하단은 사용하기에 좋은 영역이지만, 바닥 모서리가 한 손에만 개최되는 경우 탭하는 것이 까다로울 수 있습니다 (자세히보기 여기 짐마자

화면 상단에 메뉴를 배치하는 것은 여전히 협약입니다. 그러나 이것은 단단한 영역이 될 수 있으므로 메뉴를 불러 일으키는 스 와이프 조치를 지원하는 것이 좋습니다.

04. 컨트롤 위의 내용을 배치합니다

The BBC iPlayer iPad app places controls in easy to reach areas and below content — BBC iPlayer iPad 앱은 지역에 도달하기 쉽고 내용 아래에서 컨트롤을 수행합니다.

누군가의 손가락이나 엄지 손가락이 화면을 탭하면서 콘텐츠를 가려 버리지 않으므로 컨트롤을 위의 콘텐츠를 놓습니다. 또한 핵심 정보가 스마트 폰이 한 손으로 유지 될 때 자주 덮여있는 밑면 모서리와 같은 손가락이나 엄지 손가락으로 쉽게 쉽게 가려 질 수있는 화면의 영역에없는 화면 영역에 있지 않은지 확인하십시오.

05. 초상화 모드를 염두에두고 디자인

사용 된 보류가 변경 될 수 있지만 스마트 폰과 태블릿 모두에 훨씬 더 일관되게하는 한 가지는 사람들이 대부분의 시간 동안 수직으로 유지하는 경향입니다. 수평 홀드는 비디오 또는 사진을 보는 것과 같은 특정 작업에 종종 사용되지만 표준이 아닌 예외입니다.

물론 모바일 디자인은 세로 (수직)와 가로 (수평) 모드를 이상적으로 지원해야하지만 비디오 또는 사진 무거운 사이트 또는 응용 프로그램을 디자인하지 않는 한 세로 모드를 염두에두고 디자인하십시오.

06. 엄지 손가락을위한 디자인

The Spotify app is designed to be thumb-friendly, with large tap targets — Spotify 앱은 엄지 손가락 친화적이며 대형 탭 타겟으로 설계되었습니다.

엄지 손가락은 모든 스마트 폰 상호 작용의 대부분을 운전합니다. 이것은 엄지 손가락이 한 손으로 모바일이 붙어 있고 두 손으로 유지 될 때 많이 사용될 때 독점적으로 사용되기 때문입니다.

엄지 손가락은 손가락보다 약간 큽니다. 따라서 더 큰 탭 타겟이 필요합니다. 이러한 탭 대상을 최소한 44 x 44 포인트 (16 x 16mm)로 만들려고 노력하십시오. 더 큰 탭 타겟은 항상 더 좋으며 확실히 44 x 30 포인트 (16 x 11mm)보다 작게 가야합니다.

태블릿을 설계해도 엄지 손가락을위한 아직도 디자인이 가능하기 때문에 디자인이 덜어 져야 할 덜 정확한 터치 방법을 지원해야합니다. 큰 탭 대상은 엄지 손가락에 좋지 않습니다. 손가락에도 훌륭합니다.

07. 큰 제스처를위한 디자인

너무 큰 탭 타겟이 더 좋습니다. 전체 화면보다 큰 탭 대상이 무엇입니까? 사용자가 스 와이프하여 사진 갤러리에서 앞으로 또는 뒤로 움직이거나 메뉴를 불러 일으킬 수있는 것과 같이 큰 제스처를 염두에 두십시오.

사용자가 제스처가 지원되는 것을 알지 못할 수도 있음을 기억하므로 다음 사진을 가져 오기 위해 화살표 아이콘을 두드리는 것과 같이 무언가를 수행하는 데 필요한 보조 방법을 제공하는 것이 좋습니다.

08. 도전의 상승

인체 공학적으로 때로는 2.5th에서 97.5 백분위 수의 사용자의 편안한 디자인을 만들어 사용자의 적어도 95 %에 맞게 설계에 대한 설계에 대한 이야기를들을 수 있습니다. 우리 모두가 항상 모든 사람을 기쁘게 할 수없는 것을 알고있는 것에 따라 항상 수용 할 수있는 극단적 인 사용자가있을 것입니다. 사이에있는 사람들.

이것이 사용자와 시나리오를 염두에두고 디자인하는 것이 좋은 생각입니다. 예를 들어, 바쁜 통근자가 한 손에 커피와 다른 손에 휴대 전화 또는 관절염이있는 사람을 걷고 있습니다.

09. 상호 작용을 최소한으로 유지하십시오

가장 편안한 모바일 장치 상호 작용이 어느 것을 알고 있습니까? 탭 또는 스 와이프 또는 프레스가 아닙니다. 그것은 전혀 상호 작용이 아닙니다. 모바일 디자인에 필요한 상호 작용이 적을수록 인체 공학에 대해 걱정해야합니다. 나는 항상 최소한의 상호 작용을 유지하려고 노력합니다. 무자비하게 모바일 양식을 줄이고, 자동 권총을 사용하고, 사용자가 실제로 통보 받아야하는 것에 대해서만 알림을 제한하십시오.

10. 프로토 타입 디자인

당신은 당신이 손에 물리적으로 그것을 잡고 다른 그립을 시도 할 수있을 때까지 모바일 디자인의 인체 공학을 판단 할 수는 없습니다. 이것이 내가 가능한 한 빨리 디자인을 프로토 타입 할 것입니다. 우리는 좋아한다 축전 ,하지만 다른 많은 것들이 있습니다 훌륭한 프로토 타이핑 도구 ...에

빠른 재판을 위해 간단한 용지 프로토 타입으로 기본 사용자 테스트를 실행할 수도 있습니다. 모바일 장치에 붙어있는 스케치 또는 종이 인쇄물은 인체 공학에 대해 놀라운 금액을 알려줍니다.

11. 테스트, 테스트, 그런 다음 좀 더 테스트합니다

인체 공학적 모바일 디자인을 만드는 보장 된 방법을 알고 싶습니까? 그것은 디자인을 테스트 한 다음 반복 및 테스트, 반복 및 테스트하고 다른 장치의 무리를 덮고있는 모든 사람들이 사용하기 쉽고 다른 장치를 다루는 모든 사람들을 다루기 전까지를 계속합니다. 그게 간단합니다.

모바일 장치는 물론 '모바일'으로 설계되어 있으므로 환경에서 디자인을 테스트하기 위해 사무실에서 나와 있습니다. 커피 숍은 항상 테스트 할 수있는 좋은 장소입니다. 가능한 한 많은 사람들 (적어도 5 ~ 6 개)이며 스마트 폰을 한 손으로 사용하는 것과 같은 더 어려운 시나리오에 중점을 둡니다. 사용자의 상호 작용이 더 구분되면 디자인이 잘 작동하면 나머지 시간을 탁 킵니다. 주로 진정한 인체 공학적 디자인을 만들 수 있다는 것을 지속적으로 테스트하고 반복하는 것입니다.

이 기사는 원래 순 잡지에 나타났습니다. 여기를 구독하십시오.

관련 기사:

16 ux / ui Instagram 계정에 따라야합니다
20 베스트 와이어 프레임 도구
2018 년 가장 큰 UX 디자인 트렌드 5 개

사용자 친화적 인 모바일 인터페이스를 디자인하는 방법

01. 사무실에서 나가십시오

02. 다중 보류를위한 디자인

03. 도달 범위에 인기있는 컨트롤을 놓습니다

04. 컨트롤 위의 내용을 배치합니다

05. 초상화 모드를 염두에두고 디자인

06. 엄지 손가락을위한 디자인

07. 큰 제스처를위한 디자인

08. 도전의 상승

09. 상호 작용을 최소한으로 유지하십시오

10. 프로토 타입 디자인

11. 테스트, 테스트, 그런 다음 좀 더 테스트합니다

어떻게 - 가장 인기있는 기사

Adobe Illustrator에서의 관점 만들기

Photoshop에서 스마트 레이어를 사용하는 방법

동물의 눈을 설명하는 방법

단순한 색상 차트 만들기

X 입자로 단풍을 재배하는 법을 배웁니다

모피 애완 동물 초상화 페인트

Photoshop에서 감각적 인 일몰 만들기

만화 커버를 만드는 전통 및 디지털 기술을 결합하십시오

카테고리