모바일 앱 디자인은 웹 디자인과 다릅니다.

물론 색상 이론, 설정 유형 및 그리드 유지 관리가 있지만 장치가 변경될 때 고려해야 할 사항이 훨씬 더 많습니다.

Tomas Laurinavicius는 모바일 앱 디자인의 해야 할 일과 하지 말아야 할 일에 대해 설명하기 위해 모바일 장치를 디자인할 때 모범 사례를 제시합니다.

Tomas Laurinavicius는 프리랜서 디자이너이자 Mobile Design Book의 공동 저자입니다.

앱을 디자인하는 방법

(좋은 디자인 예제 포함)

토마스 입력:

이 기사에서는 훌륭한 모바일 앱 디자인의 몇 가지 예를 공유하고 싶습니다. 특히, 훌륭한 앱을 만들기 위해 함께 모인 요소.

앱 예제 – 시작 화면

시작 화면은 모든 단일 앱 사용자에게 표시되며 몇 초 동안 지속되지만 좋은 첫인상을 주고 일부 기대치를 설정하는 것이 중요합니다.

앱에 대한 정보를 제공하는 배경 이미지를 사용하여 깨끗하고 브랜드 이미지를 잘 나타내십시오. 로딩 시간을 줄이려면 시작 화면의 크기를 최소로 유지하십시오.

Instagram 및 Yummly의 하이퍼랩스

빈 상태

사용자가 앱을 처음 다운로드하면 볼 데이터가 없습니다. 이것을 빈 화면이라고 합니다.

이 시점에서 앱의 목적을 설명하고 앱을 처음 사용하도록 안내해야 합니다. 그렇지 않으면 그들은 혼란스러워하고 다시는 돌아오지 않을 것입니다.

에어비앤비 & 플립보드

앱 예제 – 로그인 화면

사용자 이름을 잊어버리십시오. 대신 이메일 주소를 사용하세요.

기존 플랫폼으로 로그인할 수 있는 옵션을 제공하여 로그인 프로세스를 쉽게 만듭니다. 청중에 따라 Google, Facebook 또는 LinkedIn이 될 수도 있습니다.

SoundCloud 및 Foursquare

앱 예 – 활동 피드

매력적이고 몰입감 있는 활동 피드를 디자인할 때 컨텍스트를 고려하고 게임화 원칙을 사용하세요.

해당되는 경우 날짜, 시간 및 위치와 같은 필수 데이터를 제공합니다. 게임처럼 만들려면 숫자, 행동 유도 버튼, 작은 아이콘을 사용하여 인터페이스를 더욱 매력적으로 만드십시오.

Foursquare & Behance의 Swarm

앱 예시 – 가입 화면

가입 절차가 복잡하면 사용자가 떠나게 됩니다.

최대한 단순화합니다. 필요한 정보만 포함하고 Facebook이나 Twitter와 같이 사용자 정보를 저장하는 다른 네트워크를 사용하도록 제안합니다.

스포티파이 & 서클

점검

체크아웃은 모바일 앱에서 디자인하기 까다로운 기능입니다.

많은 정보를 한 눈에 보여주고 다음 단계에 대한 지침을 제공해야 합니다. 데이터의 우선 순위를 지정하고 그룹으로 표시할 수 있는 덩어리로 나눕니다.

예를 들어 배송 주소 및 지불 정보는 가격 책정 및 할인 다른 그룹 등의 두 그룹을 구성할 수 있습니다. 고객을 압도하지 않도록 프로세스를 구성하십시오.

타겟 & 계속 쇼핑

코멘트

댓글은 커뮤니티를 구축하거나 단순히 다른 사용자에게 귀하의 앱이 가입할 가치가 있음을 보여주는 데 좋습니다.

댓글을 디자인할 때 가독성과 컨텍스트(예: 프로필 사진, 이름 및 날짜)는 "라이브" 모양의 앱 커뮤니티 생태계를 제공하는 데 가장 중요한 요소입니다.

경로 및 Tripstr

검색

검색은 사용자 생성 콘텐츠 및 기타 데이터 집약적인 앱에 필수적인 기능입니다.

컨텍스트와 스마트 제안을 제공하여 사용자 경험을 개선하고 사용자를 즐겁게 합니다. 관련 필터링 옵션을 추가하면 검색 프로세스를 크게 개선하고 고객 만족도를 높일 수 있습니다.

Inbox by Gmail 및 Lovely

나누는

공유는 사용자가 제품에 대한 소문을 퍼뜨릴 수 있도록 하므로 모든 앱에서 중요한 기능입니다.

명확한 공유 아이콘을 추가하고 다양한 네트워크에서 빠르게 공유할 수 있도록 하여 앱이나 앱의 콘텐츠를 쉽게 공유할 수 있습니다.

봄과 쥬클리

가독성

작은 장치에서는 가독성이 까다롭습니다. 글자를 너무 크거나 작게 만드는 것은 쉽습니다.

대비, 유형 크기 및 줄 높이에 중점을 둡니다. 유형이 최적의 크기이고 쉽게 읽을 수 있는지 확인하십시오. 흰색 바탕에 검은색 글씨가 좋습니다.

가독성 및 Feedly

항해

탐색은 모든 종류의 앱에서 매우 중요합니다.

청중의 다양한 세그먼트에 대해 쉽고 이해하기 쉽게 만드십시오. 사용자가 다른 앱의 탐색 전문 용어에 익숙해지도록 단순 복사를 사용합니다. 아이콘과 네거티브 공간을 활용하여 탐색에 대한 컨텍스트를 제공하고 필요한 링크만 포함합니다.

Facebook 및 LinkedIn 연결됨

설정

설정 화면은 흥미롭지 않기 때문에 종종 간과되지만 가장 많이 사용하는 화면 중 하나가 될 것입니다.

아이콘을 사용하고, 구분선이나 네거티브 공간으로 다른 설정 그룹을 구분하고, 사용자가 다음에 무엇을 할지 결정하기 위해 빠르게 탐색하도록 돕습니다. 또한 사용자가 탭을 저장할 수 있도록 기본 토글 버튼을 사용하여 빠른 옵션을 제공합니다.

체크 표시 2 및 YPlan

알림

알림은 사용자가 앱을 계속 찾는 이유입니다.

이러한 알림을 명확하게 하되 너무 성가시게 하지 마십시오. 사람들은 무슨 일이 일어나고 있는지 알아야 하지만 압도당하고 싶지는 않습니다. 새로운 것을 표현하기 위해 미묘한 색상 표시기와 숫자를 제공합니다.

고고봇 & 하이라이트

메시지

메시징 또는 채팅 기능도 공통 기능입니다. 메시징 시스템을 설계할 때 모든 것은 커뮤니케이션과 컨텍스트에 관한 것입니다.

사용자가 더 긴 메시지를 읽고 날짜, 게시 시간, 위치 및 기타 관련 정보를 포함할 수 있도록 유형 크기를 최적화합니다.

메시징은 오늘날 멀티미디어에 관한 모든 것입니다. 사용자에게 사진, 비디오, 사운드, 스마일리 및 오래된 학교 텍스트를 추가하여 의사 소통할 수 있는 옵션을 제공합니다.

페이스북 메신저 & 패스톡

프로필

많은 앱에서 사용자가 계정을 만들고 해당 프로필에 대한 이야기나 활동을 저장할 수 있습니다.

소셜 미디어, 쇼핑 또는 기타 앱이든 프로필 페이지를 명확하고 사용자의 관심을 끄는 것이 중요합니다.

사용자 프로필 사진과 이름을 강조합니다. 또한 사람들이 사용자가 얼마나 활동적이거나 존경받는지 알 수 있도록 관련 정보와 통계를 제공하세요.

프론트백 & 쿼라

결론

내가 나열한 모든 앱에서 볼 수 있듯이 성공적인 앱을 디자인할 때 고려하고 숙달해야 할 사항이 많이 있습니다.

누구나 앱을 디자인할 수 있지만 현장 경험이 있고 모든 지식과 모범 사례를 적용할 수 있는 디자이너를 고용하는 것이 중요합니다.

작은 것들이 앱을 만들거나 망가뜨릴 수 있습니다. 멋진 앱 디자인의 복잡성을 이해하지 못하는 사람을 고용하여 시간과 돈을 위험에 빠뜨리지 마십시오.