앱 디자인 UI

앱 디자인 UI : 훌륭한 사용자 경험을 제공하기위한 9 가지 팁

모바일 앱은 기업과 디자이너가 그 어느 때보 다 더 많은 사람들에게 다가 갈 수있는 기회를 제공합니다. 비즈니스 소유자는 더 이상 전화, 우편 캠페인 또는 매장을 통해 고객에게 연락하는 데 국한되지 않습니다. 오늘날 귀사는 웹 사이트와 모바일 앱을 통해 연중 무휴 24 시간 사용할 수 있으며, 어디서나 사용자와 함께 사용할 수 있습니다. 앱을 개발하면 사용자에게 푸시 알림을 보내고 특정 고객 요구 사항을 충족 할 수 있습니다.

안타깝게도 모든 앱이 제대로 작동하는 것은 아닙니다. 일부는 완전히 실망스럽고 사용자에게 거의 의미가 없습니다. 훌륭한 모바일 앱 디자인 UI 및 경험 (UX)을 만드는 것은 생각만큼 간단하지 않습니다. 연구원들은 2020 년까지 모바일 앱은 약 188.9 억 달러를 창출 할 것입니다. 수익. 여전히 성장의 여지가 충분하지만 제대로 작동하지 않는 디자인 관행도 있습니다. 모든 좋은 앱에는 실생활에서 잘 번역되지 않는 세 가지가 있습니다.

사용자는 수천 개의 앱 중에서 선택할 수 있습니다. 다른 선택의 바다에 대한 사용자의 관심을 끌려면 눈에 띄어 야합니다. 사람들이 자주 사용하는 앱을 달성하는 한 가지 방법은 사용자 경험에 초점을 맞추는 것입니다. 모든 디자이너는 앱을 만드는 방법이 다르지만 모두 공통된 요소가 있습니다. 여기로 모바일 사용자에게 최상의 경험을 제공 할 수있는 XNUMX 가지 방법입니다.

1. 시간 계획하기

단일 요소를 만들기 전에 앱 디자인 UI, 해결하는 문제와 전체 구조를 계획하는 데 시간을 투자하십시오. 앱을 다운로드 할 가능성이 가장 높은 사람들의 페르소나를 파헤쳐 서 도달하려는 잠재 고객을 파악하세요. 청중을 이해하는 것은 탐색 레이아웃에서 소프트웨어 홍보 방법에 이르기까지 개발의 모든 측면을 아우 릅니다.

일부 디자이너는 와이어 프레임을 사용하여 디자인에 대한 일종의 청사진을 만듭니다. 이를 통해 앱 제작자는 다양한 요소를 시도하고 프로그램 아키텍처에서 어떻게 작동하는지 확인할 수 있습니다. 앱에서 작동하지 않는 무언가를 코딩하는 데 시간을 소비하기 전에 문제를 일으킬 수있는 요소를 파악할 수 있으므로 시간이 절약됩니다. 사용자의 나이와 손이 얼마나 큰지 생각해보십시오. 예를 들어 여성보다 손이 큰 남성에게는 더 큰 버튼이 더 효과적입니다.

2. 장치 유형에 맞게 개발

iOS가 인기가 있지만 항상 Android를 사용하는 사람들이 있습니다. 하나 또는 둘 모두를 위해 개발하도록 선택할 수 있습니다. 시간이 허락한다면 두 시스템 모두를위한 앱을 만드십시오. Google Play보다 Apple에서 더 많은 다운로드를 받게 될 수 있지만 사용중인 운영 체제에 관계없이 모든 사용자의 요구를 충족 할 수 있습니다. 또한 Android와 iPhone의 동작은 다양하므로 각 세그먼트가 스마트 폰과 태블릿을 사용하는 방식을 고려해야합니다.

현재 고객을 조사하고 iOS 또는 Android를 소유하고 있는지 물어보십시오. 고객의 90 %가 iOS를 사용하는 경우 먼저 iOS 호환 앱을 출시하는 것이 예산 및 시간 고려 사항에 가장 적합한 선택 일 수 있습니다. 두 가지 옵션을 모두 제공하는 것이 현명하지만, 먼저 비용을 최대한 활용할 수있는 곳에 초점을 맞춘 다음 여유가있을 때 다른 플랫폼에 추가해야합니다.

앱 디자인 UI

MindMeister 브레인 스토밍 및 프로젝트 공동 작업에 잘 작동하는 마인드 매핑 도구입니다. MindMeister는 온라인 및 모바일 장치에서 사용할 수 있으며 iOS 및 Android에서 모두 사용할 수 있습니다. 이 특정 앱의 장점 중 하나는 여러 장치 유형에 걸쳐 통합된다는 것입니다. Android 태블릿과 iPhone을 소유하고 있다면 두 항목 모두에서 다른 버전의 앱을 끊김없이 원활하게 사용할 수 있습니다.

3. 큰 작업을 하위 작업으로 나누기

사람들이 스마트 폰을 사용하는 방식에 대해 생각해보십시오. 일반적인 사용자는 대기실에 있거나 지하철을 타고 직장을 오가는 동안 휴대 전화를 듭니다. 큰 작업을 완료하는 데 한 시간이 없을 수도 있지만 큰 기능을 작은 기능으로 분리하면 시간이 허락하는대로 작업을 수행 할 수 있습니다. 사용자는 또한 무한 스크롤을 좋아하지 않을 수 있으므로 한 번에 한 화면에 맞게 작업을 세분화하면 전반적인 UX가 향상됩니다.

바쁜 사람들을 위해 큰 작업을 수행 할 수 있는지 확인하는 한 가지 방법은 시스템을 테스트하는 것입니다. 타이머를 30 초로 설정하고 그 시간 내에 작업을 완료 할 수 있는지 확인합니다. 그렇지 않다면 어떻게 더 세분화하여 30 초 안에 일부가 완료됩니까? 또한 사용자가 프로세스를 잠시 떠났다가 돌아와야하는 경우 사용자가 중단 한 부분을 다시 선택하도록 앱을 만들고 싶을 것입니다.

4. 풍부한 경험 만들기

단순하게 유지하라는 조언을 들었지만 그렇다고 앱이 지루해야한다는 의미는 아닙니다. 최신 스마트 폰은 화면 해상도가 높고 이미지와 동영상을 고화질로 제공합니다. 앱 내에서 리치 미디어와 속도 사이의 균형을 찾는 것이 중요합니다. 빠르게로드하려면 그래픽을 최적화해야하지만 여전히 대담하고 선명해야 사용자가 시각적으로 만족할 수 있습니다.

사용자는 다른 선택권이 있으며 대신 앱을 사용하기로 결정했습니다. 그들을 즐겁게하고 몰입하게하지 않으면 경쟁사의 앱에서 잃을 위험이 있습니다. 당신의 것은 시각적으로 즐겁고 유용해야합니다.

앱 디자인 UI : 베스트 9 팁 모바일 앱을위한 최고의 사용자 경험

호텔 오늘 사용자가 앱을 통해 방을 예약 할 수있는 다른 위치로 여행하고 싶어하는 생생한 이미지를 사용합니다. 기능의 초점은 기능이지만 앱은 디자인의 미학을 무시하지 않고 이미지와 요소의 멋진 조합을 만듭니다. 클릭 유도 문안은 종종 배경 이미지 위에 있습니다.

앱을 만들면 브랜드가 더 빨리 성장할 수 있습니다. 구글 검색 내 근처의 앱 개발 현지인을 찾고 있다면.

문의하기 앱 개발 서비스에 대해 자세히 알아보십시오.

5. 명확한 단계 진행 생성

여정의 다양한 부분을 통해 사용자를 이동시킬 때 다음 단계가 무엇인지 명확히합니다. 사용자가 실행 가능한 버튼을 클릭하면 즉시 화면을 다음 단계로 이동합니다. 1 단계, 2 단계 등과 같은 번호 매기기와 같은 요소를 사용할 수도 있습니다.

또 다른 아이디어는 화살표와 같은 아이콘을 사용하여 사용자에게 다음에 가야 할 위치를 표시하는 것입니다. "아래로 스크롤"또는 "왼쪽으로 스 와이프"와 같은 간단한 단어는 사람들에게 명확한 방향을 제시하고 초보자도 앱을 간단하게 만듭니다.

6. 색상으로 클릭 유도 문안 강조

모바일 앱을위한 훌륭한 사용자 경험 제공대조되는 색상의 폭발은 클릭 유도 문안 (CTA)에 대한 관심을 끌고 사용자가 앱을 사용하기 위해해야 ​​할 일을 명확하게 보여줍니다. 사용자가 누구인지 알게되면 사용자의주의를 끌고 앱의 기능을 통해 앞으로 나아가도록 유도하는 데 가장 적합한 색상 버튼이 무엇인지 더 잘 알 수 있습니다. 또한 분할 테스트를 수행하여 특정 청중에게 가장 적합한 색상과 버튼 크기를 확인할 수 있습니다.

일부 전문가들은 CTA의 색상에 대한 다양한 연구가 가장 효과적이라고 생각하지만 다른 연구는 결과와 모순됩니다. 요점은 다양한 색상, 모양 및 배치가 다양한 유형의 청중에게 가장 적합하므로 원하는 결과에 가장 적합한 조합을 찾아야한다는 것입니다.

모바일 앱 UX : 색상으로 클릭 유도 문안 강조

Hwy 55 버거, 쉐이크 & 프라이 앱은 파스텔 배경에 터지는 빨간색과 분홍색 버튼을 사용합니다. 사용자의 시선은 버튼을 추적하며 영수증 스캔 또는 보상보기와 같이 나열된 작업 중 하나를 수행해야한다는 것을 알고 있습니다. 색상은 회사 웹 사이트 및 레스토랑의 팔레트와 일치하며 1950 년대의 가장 좋아하는 색조를 사용하고 역사에서 재미있는 시간을 설정합니다.

7. 스타일 가이드 만들기

앱 디자인 UI가 잠시 나오면 업데이트 및 추가 기능을 제공하고 싶을 것입니다. 앱을 출시하고 사용성을 테스트했으면 자세한 스타일 가이드를 만드세요. 사용자가 앱에 대해 좋아하는 점을 이해하고 매뉴얼에 세부 정보를 추가 할 수 있으며, 향후 모든 업데이트를 위해 따라야합니다.

사용자가 베이비 붐 세대이기 때문에 더 큰 버튼을 좋아하고 작은 버튼에 작은 텍스트가 표시되지 않는 경우 스타일 가이드에이를 표시해야합니다. 반면에 청중이 밀레 니얼 세대이고 훑어 볼 수있는 자료를 선호하는 경우 설명을 짧게 또는 이미지 기반으로 유지하는 것에 대한 세부 정보를 가이드에 추가합니다.

스타일 가이드에는 색상 팔레트, 버튼 스타일, 언어 기본 설정 (XNUMX 인칭, XNUMX 인칭, XNUMX 인칭) 및 특히 잘 작동하는 기타 기능에 대한 세부 정보가 포함되어야합니다. 일관성을 유지하기 위해 피해야 할 선호하는 방법과 요소를 나타냅니다.

8. 깔끔한 정리

시간이 지남에 따라 앱에 기능을 추가 할 것입니다. 그러나 화면이 어수선해질 수도 있습니다. 20 가지 옵션과 시작 위치에 대한 불확실성만큼 사용자에게 혼란스러운 것은 없습니다. 진정으로 사용자 친화적 인 앱을 만들려면 혼란을 줄이고 중요한 요소 만 다듬어야합니다. 모든 추가 기능은 케이크를 장식하고 있으며 기본 사항을 마스터 한 후에 추가해야합니다.

앱의 주요 목적에 대해 생각하는 것부터 시작하십시오. 사용자가 이번 주에 상점에 어떤 새 항목이 도착했는지 확인할 수 있도록 하시겠습니까? 앱이 건강 식품을 추적하기위한 것입니까? 사용자는 단일 버튼을 클릭하고 검색 창에 항목을 입력하여 자신이 먹은 음식을 추가 할 수 있어야합니다. 일을 간단하고 요점으로 유지하면 UX가 자동으로 향상됩니다.

최고의 UX 모바일 앱 팁

내 친구 찾기 사람들이 자신의 지역에서 가족과 친구를 찾고 방문을 위해 얼마나 멀리 도착했는지 확인할 수있는 Apple의 앱입니다. 또한 십대 자녀와 같은 가족 구성원을 추적합니다. 앱에 처음 로그인하면 이미 연결되어있는 사람을 찾거나 친구를 추가 할 수 있습니다. 옵션은 간단하고 요점입니다.

이 초기 페이지의 유일한 요소는 보거나 추가 할 수있는 버튼입니다. 더 자세한 정보를 얻으려면지도에서 특정 이름이나 위치로 이동해야합니다. 이 앱은 파티를 열거 나 손님이 얼마나 멀리 떨어져 있는지 확인하려는 사람에게 완벽하게 작동합니다.

9. 손가락 배치 고려

특정 장치에서 잘 작동하는 디자인을 만들려면 제품 유형에 익숙해야합니다. 대부분의 사람들이 휴대 전화에서 탐색하는 방식을 생각해보세요. 엄지 손가락은 화면 하단 근처에 있습니다. 탐색 요소를 추가하여 도달 할 필요가 없도록하고 가능한 한 자연스럽게 만들어야합니다.

올바른 배치를 만드는 유일한 방법은 디자이너로서 직접 테스트하는 것입니다. 예를 들어, 액세스하기 가장 쉬운 위치에 버튼을 배치 한 다음 위치를 베타 테스트하여 더 쉽게 액세스 할 수 있는지 또는 조정이 필요한지 확인합니다. 일부 사람들은 다른 사람들과 다른 휴대 전화를 가지고 있기 때문에 추가 베타 테스터를 끌어들이는 것도 좋은 생각입니다. 모든 탐색 요소와 실행 가능한 버튼은 가능한 한 사용하기 쉬워야합니다.

이 주제에 대해 여러 UX 전문가를 인터뷰했습니다. 다음은 우리의 질문에 대한 응답입니다.

Michael Prestonise의 글로벌 앱 테스트 말한다;

UX 전략을 어떻게 계획합니까?

우리의 UX 전략은 기술적으로 실현 가능한 방식으로 고객에게 가치를 제공하고 비즈니스가 목표를 달성하는 데 도움이되는 것을 목표로 신중하게 계획됩니다. 이 전략을 수립하려면 고객 인터뷰, 정량적 데이터 분석, 시장 분석, 고객 세분화를 포함한 다양한 연구 방법론의 결과를 집계하는 것이 포함됩니다. 그런 다음 집계 된 결과를 평가하고 우선 순위를 지정하여 주요 기회 영역을 식별합니다.

UI / UX 디자인에 어떤 도구를 사용하며 그 이유는 무엇입니까?

UI 디자인에는 Figma를 사용합니다. 이것은 기여가 필요한 모든 사람과 작업 및 디자인을 쉽게 공유 할 수 있기 때문에 협업을 간소화하는 완전한 웹 기반 플랫폼입니다. Google 문서와 마찬가지로 개발자에게 필요한 모든 것을 원격으로 간단하게 공유 할 수 있습니다. UX 디자인 측면에서 우리가 사용하는 도구에는 노트북 및 펜 (!), 화이트 보드 및 Miro 및 Whimsical과 같은 공동 작업 도구가 포함됩니다. Miro는 원격 개발자를위한 훌륭한 도구입니다. 회고 적 워크숍을 수행하여 잘 된 부분과 실패한 부분을 묻고 팀 내에서 논의 할 주제에 투표 할 수 있습니다.

스타일 가이드를 만드시나요? 그렇다면 어떤 도구를 사용하고 그 이유는 무엇입니까?

다양한 플랫폼 (마케팅 웹 사이트, 고객 용 애플리케이션, 테스터 용 애플리케이션 등)에서 일관된 시각적 경험을 생성하는 데 도움이되는 디자인 시스템을 보유하고 있습니다. 디자인 시스템에서 스타일을 파생하는 UI 구성 요소가 원자화되었습니다. 디자이너가 프로세스 전반에 걸쳐이를 사용할 수 있도록합니다.

JD 조던 맥스미디어 언급;

UX 전략을 어떻게 계획합니까?

우리는 더 전통적인 브랜딩 및 그래픽 디자인 프로젝트와 같은 색다른 UX 프로젝트의 경우에도 항상 발견 및 추천 단계부터 시작합니다. UX 리더 중 한 명이 사용자 및 이해 관계자 인터뷰, 경쟁 및 비교 분석, 가능한 경우 현재 상태 감사에 참여합니다. 이 연구를 통해 솔루션이 채우기에 가장 큰 영향을 미칠 수있는 격차를 식별 할 것입니다. 종종 이것은 개선 된 솔루션을 설계하고보다 영향력있는 인식을 창출하는 조합입니다. 이 프로세스는 또한 종종 UX, UI, 프런트 엔드, 콘텐츠 및 마케팅을 결합하는 로드맵 (한 프로젝트 또는 여러 프로젝트)을 제안합니다.

우리의 솔루션은 고객이 있기 때문에 항상 독특합니다. 우리는 공감에 대해 많이 생각합니다. 첫째, 사용자가 어떻게 느끼고 필요한지 아는 것이 우리를 더 나은 디자이너로 만들기 때문입니다. 이것이 기본적인 사용자 중심 디자인입니다. 그러나 고객에게 중요한 것에 대한 공감은 또한 우리를 더 나은 파트너로 만듭니다. 우리는 우리 자신을위한 솔루션을 설계하는 것이 아니며, 모바일 설계에서 기억하는 것이 가장 중요 할 수 있습니다. 이러한 장치와 긴밀한 관계를 맺고 있기 때문입니다. 공감은 누구나 할 수있는 가장 인간적인 일이며 우리는 그 일에 대한 대가를받을만큼 운이 좋다.

Ui / UX 디자인에 어떤 도구를 사용하며 그 이유는 무엇입니까?

우리는 도구에 구애받지 않고 선호하는 UI / UX 디자인 프로세스를 개선했습니다. 우리는 저 충실도 IA 및 와이어 프레임으로 이동하기 전에 항상 아주 잠깐이라도 펜과 종이 (또는 펜과 마커 보드)로 시작합니다. 우리 팀 중 일부는 Axure를 사용하여 와이어 프레임을 구성합니다. 그 이유는 도구 세트가 구성 및 프로토 타이핑을 위해 더 일찍 저 충실도 작업을 수행하기 때문입니다. 또는 대부분의 팀이 Sketch로 바로 이동하여 단일 파일 내에서 작업을 저 충실도에서 고화질로 전환 할 수 있습니다. Sketch는 InVision과 잘 통합되고 자산 수집, 준비 및 프런트 엔드 개발로의 핸드 오프에 사용되는 Zeplin과 완벽하게 통합되기 때문에 가치가 있습니다.

고객 중 한 명이 Adobe XD를 선호하지만 이는 정상적인 프로세스가 아닙니다. 그리고 우리는 발사믹을 사용하지 않습니다. 손으로 그린 ​​것처럼 보이게하려면 손으로 그립니다.

스타일 가이드를 만드시나요? 그렇다면 어떤 도구를 사용하고 그 이유는 무엇입니까?

항상 — 내부 용 일지라도. 이는 다양한 형태를 취합니다.

메시지 및 브랜드 표준은 Keynote 또는 Word와 같은 프레젠테이션 또는 문서 도구를 사용하여 만들 수 있습니다. 우리는 이러한 문서를 가능한 한 많이 유지하려고 노력하며 스타일 가이드 자료가 시간이 지남에 따라 발전 할 수 있도록 기본 WordPress 웹 사이트와 같은 온라인 형식을 매우 선호합니다. 간단한 PDF는 전송되는 순간 날짜가 표시되며 필요한 자료에 대한 링크는 거의 없습니다.

UI 패턴 및 자산 스타일 가이드는 일반적으로 Sketch와 Zeplin의 조합을 사용하여 작성됩니다. 전자의 기호 사용은 특히 후자의 코드 중심 사용자에게 잘 전달됩니다. 그리고 다시 말하지만,이 조합은 정적 스타일 가이드에 의해 생성되는 설계 및 개발 부채를 최소화하기 위해 시간이 지남에 따라 (예 : 스프린트 및 연속적인 프로젝트) 살아 나고 진화합니다.

UX / UI 팀 아이 큐어 씁니다;

UX 전략을 어떻게 계획합니까?

모든 UX 디자인 작업에 적용 할 수있는 하나의 전략은 없지만 다음 요소에 대한 민감도는 필수입니다.
– 타겟 고객을 파악하고 그들의 요구와 문제점을 이해합니다.
– 어떤 문제가 해결되고 있는지.
– 디자인 솔루션의 가치는 무엇입니까?

피드백은 유용성 및 접근성 테스트를 통해 제품 프로토 타입, 테스트 및 학습입니다.

Ui / UX 디자인에 어떤 도구를 사용하며 그 이유는 무엇입니까?

우리는 주로 Sketch를 사용합니다. 빠른 반복이 가능하고 가볍고 프로토 타이핑 및 전달 도구와 잘 통합되어 있기 때문입니다. 또한 전체 디자인 프로세스를 더 쉽게 만들어주는 네이티브 또는 타사 플러그인이 많이 있습니다.

스타일 가이드를 만드시나요? 그렇다면 어떤 도구를 사용하고 그 이유는 무엇입니까?

예, 대부분 디자인 시스템의 일부로 통합되는 스타일 가이드를 만듭니다. 디자인 시스템을 사용하면 100 % 일관성을 유지하고 모듈 식 디자인을 적용 할 수있어 반응 형 디자인에서 여러 폼 팩터를 처리 할 수있을뿐만 아니라 확장 또는 축소 할 수 있습니다.

Ui / UX 디자인에 어떤 도구를 사용하며 그 이유는 무엇입니까?

일러스트 레이터 및 스케치, 벡터 기반 소프트웨어, RGB 또는 CMYK의 뛰어난 색상 관리.

 

앱 디자인 UI : UX가 전부입니다

사람들이 다운로드하고 정기적으로 여는 앱을 만들 때 유용성이 가장 중요합니다. 훌륭하게 들리지만 실제 응용 프로그램에서 사용하기 어려웠던 앱을 다운로드 한 적이 있습니까? 당신은 아마 당신의 전화에서 그것을 삭제하고 그것에 대해 모두 잊어 버렸습니다. 앱은 사용자의 기대를 충족해야하므로 앱 없이는 살 수 없다고 생각합니다.

앱은 사용자의 요구를 충족 한 다음 사용자의 삶을 더 편하고 더 좋게 만드는 무언가를 만들어야합니다. 소비자의 입장에서 생각하고 이러한 요구를 충족할수록 디자인은 더욱 성공적이됩니다. 이 XNUMX 가지 팁을 통해 사용자와보다 쉽게 ​​소통하고 경험을 향상시킬 수 있으므로 앱이 삶의 중요한 부분으로 간주됩니다.

 

작성자 바이오

Lexie는 그래픽 디자이너이자 UX 전략가입니다. 그녀의 작품은 Manta, Marketo, Website Magazine, Creative Bloq 및 Sunlight Media에 실 렸습니다.

그녀의 디자인 블로그 인 Design Roast를 확인하고 Twitter @lexieludesigner에서 팔로우하세요.

2 코멘트

  • 니 하리 카 카푸어 15 년 11 월 2019, 2 : 12의 오후

    좋은 게시물입니다. 온라인 음식 배달 앱은 레스토랑 비즈니스의 성장을 돕고 고객이 온라인으로 음식을 쉽게 주문할 수 있도록합니다.

    • 안젤로 프리시나 16 년 11 월 2019, 2 : 14 오전

      고마워 Niharika. 네 확실합니다. 앱 개발은 일반적으로 비즈니스 마케팅에 중요한 구성 요소입니다.

코멘트를 게시

댓글이 검토됩니다. 귀하의 이메일은 비공개로 유지됩니다. 필요 입력 사항은 표시되어 있습니다 *