본문 바로가기

iOS - 실무관련/HIG(Human Interface Guidelines)12

Bars - Tab Bars Tab Bars 탭바는 앱화면 아래 나타나 앱의 다른 섹션으로 빠르게 이동할 수 있게 도와준다. 탭바는 기본적으로 투명하나 배경 색상값을 가질 수도 있으며, 화면의 어떤 모드(가로/세로)에도 동일한 높이를 유지하고, 키보드가 나왔을 땐 가려진다. 탭바는 어떤 수의 탭도 포함할 수 있긴 하지만, 탭은 기기 크기나 모드에 따라 보여지는 탭의 개수가 달라진다. TIP💡 둘 다 앱화면의 아래에 나오기 때문에 탭바와 툴바의 차이를 알아두는 것이 좋다. 탭바는 앱의 다른 섹션으로 이동할 수 있게 한다. 반면 툴바는 현재 맥락과 관련된 액션을 수행하기 위한 버튼을 포함한다. 아이템을 삭제하거나 만들고, 주석을 추가하거나 사진을 찍는 것이다. 탭바와 툴바는 절대 같은 화면에서 함께 나오지 않는다. 탭바는 앱 수준에서의.. 2022. 5. 25.
Bars - Navigation Bars Navigation Bars 네비게이션 바는 앱 화면의 최 상단, 상태 바의 아래에 위치한다. 새로운 화면이 나오면 뒤로가기 버튼이 네비게이션 왼쪽에 보이게된다. 해당 버튼에는 이전 화면 라벨이 달려있다. (예를 들어 1번 화면에서 2번 화면으로 갔을 때 '< 1번화면' 이런 식으로) 또한 때때로 네비게이션의 오른쪽 부분에는 수정, 완료와 같은 컨트롤이 포함되어 있으며, 이를 통해 현재 보고있는 화면의 컨텐츠를 관리할 수 있다. 네비게이션 바는 반투명하고 배경 색상값을 조정할 수 있으며 키보드가 화면에 뜨거나 제스처 발생시, 혹은 뷰의 크키가 조정되었을 때 숨김처리 될 수 있다. 더 몰입감 높은 경험을 위해 일시적으로 네비게이션 숨겨보자. 예를 들어, 사진 앱에서 풀스크린 사진 뷰에서 네비게이션 바와 다.. 2022. 5. 25.
User Interaction - 3D Touch 3D Touch 지원되는 디바이스에서 사람들은 터치스크린에 여러 단계의 압력을 주어 추가적인 기능에 접근할 수 있다. 앱은 Context menu (또는 peek and pop)에서 터치한 아이템에 사용할 수 있는 액션을 보여줌으로서 사용자에게 반응할 수 있다. iOS 13와 그 이후 버전의 기기에서 3D 터치 지원여부와 관계없이 사용자는 터치후 홀드 제스처를 사용하여 Context menu를 열 수 있다. 3D 터치를 지원하는 기기에서는 위 기능을 사용하면 Context menu가 더 빠르게 보여진다. Home Screen Interaction iOS 13과 그 이후 버전에서 홈스크린의 앱 아이콘을 터치 후 홀드하면 앱에선 Context menu를 보여줄 수 있다. (3D 터치 지원 기기에선 메뉴를 보.. 2022. 4. 11.
App Architecture - Settings 몇몇 앱은 환경 설정 선택을 할 수 있는 방법을 제공해줘야 하지만, 대부분의 앱은 이를 피하거나 미룰 수 있다. 성공적인 앱들은 경험을 조정할 수 있는 몇몇 방법을 제공하면서, 대부분의 사용자에 잘 맞게 바로 작동할 수 있습니다. 당신이 시스템에서 어떤걸 얻을 수 있을지 추측해보자. 만약 사용자나 기기, 혹은 환경에 대한 정보가 필요하다면, 사용자에게 묻는 대신 시스템에서 찾아봐라. 예를 들어, 현재 위치를 표시하기 위해 사용자에게 우편번호를 입력하라고 요구하는 대신 현재 위치 정보를 사용하도록 허가를 요구해라. 앱 내에서의 환경 설정 옵션을 우선적으로 처리해라. 앱의 메인 화면은 꼭 필요하거나 자주 바뀌는 옵션을 표시하기 좋은 장소이다. 2차적인 화면엔 종종 바뀌는 옵션을 표시하는 것이 좋다. '설정'.. 2022. 3. 31.
App Architecture - Accessing User Data 사용자 개인 정보가 가장 중요하다. 사람들이 앱을 신뢰할 수 있도록 하려면 필요한 개인정보 보호 관련 데이터와 리소스, 사용 방법을 투명하게 공개하는 것이 중요하다. 다음과 같은 데이터들은 액세스 권한 요청이 필요하다. 위치, 건강, 재정, 연락처 및 기타 개인 식별 정보를 포함한 개인 데이터 이메일, 메시지, 캘린더 데이터, 연락처, 게임 플레이 정보, Apple Music 활동, HomeKit 데이터, 오디오, 비디오 및 사진 콘텐츠와 같은 사용자 생성 콘텐츠 Bluetooth 주변 장치, 홈 자동화 기능, Wi-Fi 연결 및 로컬 네트워크와 같은 보호된 리소스 카메라 및 마이크와 같은 장치 기능 iOS 14.5 및 iPadOS 14.5부터 사용자를 추적하거나 기기의 광고 식별자에 액세스 하려면 Ap.. 2022. 3. 31.
App Architecture - Navigation 사용자들은 앱의 네비게이션이 기대에 부응만 잘 한다면, 그 존재에 대해 잘 눈치채지 못한다. 당신은 네비게이션 바가 그 자체로 주의를 끌지 않으면서, 앱의 목적과 구조를 잘 지지하도록 해야한다. 자연스럽고 친숙하게 느껴져야 하되 화면에 가장 중요한 특징이 되거나, 내용으로부터 시선을 뺏도록 하지 말아야 한다. iOS에는 다음의 세가지 주된 스타일의 네비게이션이 있다. 위계 질서형 네비게이션(Hierarchical Navigation) 목적지 (화면)에 도달하기 위해 단 하나의 선택지를 만든다. 다른 목적지로 가기 위해선, 이전 단계를 되짚어 가야하거나 처음부터 다시 시작해 다른 선택을 해야만 한다. 설정(Settings)이나 메일에서 이 스타일의 네비게이션을 사용한다. 플랫(평면) 네비게이션(Flat N.. 2022. 3. 31.
App architecture - Modality Modality은 디자인 기술로, 사용자가 현재 접하는 내용(화면) 분리돈 모드에서 내용을 보여주며 이를 나가기 위해 확실한 동작을 요구한다. 내용을 Modality로 보여주면 다음과 같은 효과를 얻을 수 있다. 1. 사람들이 독립적인 작업이나 밀접하게 관련된 옵션들에 집중할 수 있게 해준다. 2. 사용자에게 매우 중요한 정보를 확실히 주고, 필요한 경우 바로 동작하도록 할 수 있게 한다. iOS는 앱 내 특정 상황에 사용할 수 있도록 alerts, activity views(share sheets) 와 action sheets를 제공한다. 앱에서 사용자 지정 모달 콘텐츠를 표시하려면 다음 Presentation 스타일 중 하나를 사용할 수 있다. 1. Automatic : 기본적인 프레젠테이션 스타일을.. 2022. 3. 30.
App architecture - Loading 콘텐츠가 로딩되고 있을 때, 빈 화면 혹은 정지 화면을 보여준다면 앱이 멈춘것 처럼 보일 수 있으며, 혼란스럽고 좌절감을 낳을 것이고, 잠재적으로 사용자들이 앱을 떠나버릴 수 있다. 현재 로딩 진행 중임을 확실히 하자. 최소한, 무언가 일어나고 있다는 것을 알리는 움직이는 스피너를 보여주자. 얼마나 기다려야 하는지 판단할 수 있는 확실한 진행 상황을 알려주면 더 좋다. 내용을 최대한 빨리 보여주자. 사용자들이 기대하는 화면을 보여주기 전에, 내용을 로딩하는데 기다리게 하지 말자. 즉시 화면을 보여주고, 내용(콘텐츠)가 아직 사용가능하지 않다는 것을 보여주기 위해 문자 입력창, 그래픽 혹은 애니메이션을 사용하도록하자 . 이 요소들은 내용의 로딩이 완료되면 교체된다. 가능하다면, 애니메이션이 재생되는 동안이.. 2022. 3. 29.
App architecture - Onboarding 온보딩이란? 유저들에게 새로운 인터페이스에 대해서 단계적으로 가르치거나 아주 간단한 인트로를 만들어 사용자가 지속적으로 서비스를 이용할 수 있도록 돕는 장치 또는 전략이다. 온보딩은 새로운 사용자들을 환영하고, 다시 돌아온 사용자들과 재 연결할 수 있게 한다. 빠르고 재밌으며, 교육적인 선택적 온보딩 경험은 사용자가 직접 경험하지 않고도 앱의 전반을 이해하는데 도움을 줍니다. 단순히 환경설정하는게 아닌, 앱을 즐길 수 있는 온보딩 화면을 제공하자. 사용자는 당신의 앱을 더 아는 기회에 감사할 수 있지만, 한편으론 그냥 작동하길 기대할 수도 있다. 세팅이나 동의 세부내역 등을 온보딩 경험에 포함시키지 말자. 빠르게 사용할 수 있도록 하자. 시스템이 시작화면을 앱의 첫 화면으로 바꾼 뒤에는, 사용자가 바로 .. 2022. 3. 29.
App architecture - Launching 앱을 시작하는 순간은 사람들이 앱에 대해 느끼는 방식에 상당한 영향을 미칩니다. 사람들이 사용하는 기기나 앱을 마지막으로 연 이후 시간에 관계없이 앱을 시작하는 경험은 빠르고 원활해야 합니다. 아래 지침은 즐거운 출시 경험을 디자인하는 데 도움이 될 수 있다. Responding to the Launch of Your App 시작 화면을 제공한다. 시스템은 앱이 시작되는 순간 시작 화면을 표시하고 앱의 첫 번째 화면으로 빠르게 교체한다. 시작 화면의 기능은 사람들에게 앱이 빠르고 반응적이라는 인상을 주는 동시에 초기 콘텐츠가 로드 되도록 하는 것이다. 시작 화면에서 매끄럽게 전환되도록 하려면 첫 번째 앱 화면과 유사하고 그 자체로 주의를 끌지 않는 일반 화면을 디자인하자. Launch Screen 적절한.. 2022. 3. 29.
iOS - Interface Essentials [Interface Essentials] 대부분의 iOS 앱은 UIKit라는 공동 인터페이스 요소들을 규정하는 개발 프레임워크를 사용해 설계된다. 이 프레임워크(UIKit)는 시스템 전체에 변함없는 모습을 달설하는 동시에, 높은 수준의 커스텀을 가능하게 한다. UIKit요소는 유연하면서 친숙하다. 또 적응 가능하며, 어떤 iOS기기에서 멋지게 보이는 앱을 디자인할 수 있고, 시스템의 형태가 변경될 때마다 자동적으로 업데이트를 한다. UIKit에서 제공하는 인터페이스 요소는 세가지 주요 범주로 나뉜다. Bar - 사용자에게 앱 내 위치를 알리고 탐색을 제공하며 작업을 시작하고 정보를 전달하기 위한 버튼 또는 기타 요소를 포함할 수 있다. View - 텍스트, 크래픽, 애니메이션, 대화형 요소와 같이 사람들.. 2022. 3. 29.
iOS - Themes [iOS Design Themes] 명확성 문자는 각각의 크기마다 읽기 쉬우며, 아이콘은 정확하고 뚜렷하게, 장식은 섬세하며 적절하고, 기능에 명확히 집중해 디자인에 동기부여를 한다. 네거티브 스페이스, 색, 서체, 그래픽 그리고 인터페이스의 요소들은 중요한 내용을 미묘하게 강조하고, 상호작용성을 전달한다. 차이 유연한 움직임과 아름다운 인터페이스는 사람들이 하지 않고 내용을 이해하고, 상호작용하는데 도움을 준다. 내용(컨텐츠)는 대부분 화면의 전체를 채우거나, 반투명과 블러 처리는 뭔가 더 있음을 암시한다. 베젤, 그라디언트와 드롭섀도우(그림자)사용을 최소화함으로서 인터페이스를 가볍게 만들고 내용을 무엇보다 중요하게 만든다. 깊이 뚜렷하게 구분되는 시각 레이어와 사실적인 모션은 위계를 전달하고, 활기를.. 2022. 3. 29.

티스토리툴바