UX, UI, GUI
-
[HIG]컴포넌트_레이아웃과 이미지뷰_칼럼뷰UX, UI, GUI 2024. 6. 10. 14:59
세로단 뷰는 - 또는 브라우저라고 불리는- 사람들이 데이터 위계를 수직의 세로단을 사용함으로서 보고 찾도록 합니다. 각각의 세로단은 하나의 위계를 보여주고 수평 열에서는 데이터 아이템들을 포함하고 있습니다. 세로단과 함께, 이런 자식 계열의 아이템을 포함하고 있는 부모 아이템은 세모 아이콘으로 표시되어 있습니다. 그리고 사람들이 상위 부모를 선택할 대, 다음 세로단은 그 자식 계열을 보여줍니다. 사람들은 이런 방식으로 다음 자식 계열이 나오지 안을 때까지 찾는 것을 계속하고, 또 다른 데이터 가지들을 둘러보기 위해 위계를 다시 찾아봅니다. 명심하세요. 만약 여러분이 iPadOS나 visionOS 앱에서 위계를 가진 컨텐츠 발표를 다뤄야할 필요가 있다면, split view를 사용하는 것을 염두에 둬보세요..
-
[HIG]컴포넌트_레이아웃과 구성_콜렉션UX, UI, GUI 2024. 6. 6. 22:47
콜렉션 콘텐츠의 정돈된 구성을 관리하고, 잘 맞춰지고 시각적으로 훌륭한 레이아웃으로 콘텐츠를 보여줍니다. 일반적으로 말해서, 콜렉션은 이미지 기반의 콘텐츠를 보여주는 것에 이상적입니다.Best practices가능하다면, 기준이 되는 기둥선과 그리드 레이아웃을 사용하세요. 콜렉션은 콘텐츠를 기본적으로 수평의 기둥선이나 그리드에 보여줍니다. 왜냐하면 이는 사람들이 기대하는 효율적이고 간단한 모습이기 때문입니다. 사람들을 헷갈리게 하고, 그자체로 지나친 관심을 끌 맞춤 레이아웃을 만드는 것을 피하세요.콜렉션에 글을 쓰기 보다는 표를 넣는 것을 고려해보세요. 글 정보를 보고 소화하는게 더 간단하고 효율적일 대는 일반적으로 그것이 스크롤 가능한 리스트에 배치되어 있을 때입니다.아이템을 고를 때, 쉽게 접근해보세..
-
[HIG]컴포넌트_레이아웃과 배열_박스들UX, UI, GUI 2024. 6. 3. 16:03
박스는 논리적으로 관련된 정보들과 컴포넌트들의 시각적으로 구별된 그룹을 만듭니다. 기본적으로, 박스는 시각적인 경계와 배경색을 그것의 내용을 다른 인터페이스로부터 구볋하기 위해 사용합니다. 박스는 또한 제목을 포함시킬 수 있습니다. Best practices박스를 그것이 가지고 있는 뷰에 따라 상대적으로 비교해서 박스를 구분해 유지하는 것을 선호하세요. 박스의 상이즈가 그것이 포함된 창이나 스크린의 사이즈와 비슷해지려고 할 때, 그것은 그룹화된 내용의 구분으로 소통하는 것이 효과적이지 않을 것이고, 그리고 그것은 다른 콘텐츠를 침범할 수 있습니다.패딩과 배열을 추가적인 크룹핑을 박스에 잘 넣기 위해 유지하는 것을 선호하세요. 박스의 가장자리가 시각적인 구분 요소입니다 - 서브 그룹들을 정ㅇ의하기 위해 집..
-
[HIG]컴포넌트_콘텐츠_웹뷰UX, UI, GUI 2024. 5. 30. 10:47
웹뷰는 임베디드 HTML과 웹사이트 같은 높은 퀄리티의 웹 콘텐츠를 여러분의 앱에 바로 업로드하고 보여줍니다.예를 들면, 메일은 메세지에 있는 HTML 콘텐츠를 보여주기 위해 웹뷰를 사용합니다.Best practices적절한 때에 앞과 뒤로 이동할 수 있는 네비게이션을 지원하세요. 웹뷰는 앞 뒤로의 이동을 지원하지만, 이러한 행동은 기본적으로 가능한 것이 아니긴 합니다. 만약 사람들이 여러분의 웹뷰를 다양한 페이지를 접속하기 위해 이용한다면, 앞과 뒤로의 이동을 허용하고, 이러한 특징들이 가능하도록 하는 해당하는 조절 장치들을 제공해야합니다. 웹 브라우저를 빌딩할 때에는 웹뷰를 사용하는 것을 피하세요. 웹뷰를 사용하는 것은 사람들로 하여금 여러분의 앱을 벗어나지 않으면서 바로 웹사이트로 이동할 수 있을 ..
-
[HIG]컴포넌트_컨텐츠_텍스트뷰UX, UI, GUI 2024. 5. 23. 15:12
텍스트뷰는 멀티라인의, 스타일된 텍스트 내용을 보여줍니다. 그리고 이는 선택적으로 편집 가능합니다.텍스트 뷰는 어떤 높이든 될 수 있고, 뷰를 벗어나 더 넓게 할 때, 스크롤링을 허용할 수 있습니다. 기본적으로, 텍스트 뷰가 있는 콘텐츠는 가장자리에 배열되어 있고, 시스템 라벨 색을 사용할 수 있습니다. iOS, iPadOS, 그리고 visionOS에서 만약 텍스트 뷰가 편집 가능할 때, 키보드는 사람들이 뷰를 선택할 때 나타납니다.Best practices여러분이 길고, 편집 가능하고, 특별한 포맷으로 텍스트를 보여줄 필요가 있을 때, 텍스트 뷰를 사용하세요. 텍스트 뷰는 텍스트 필드와 라벨들과는 다릅니다. 왜냐하면, 그것들은 특화된 텍스트를 보여주거나 텍스트 인풋을 받는 대부분의 옵션들을 제공하기 때..
-
[HIG]컴포넌트_컨텐츠_이미지뷰UX, UI, GUI 2024. 5. 20. 15:33
이미지 뷰는 하나의 이미지를 - 또는 어떤 상황에서, 움직이는 이미지들을 - 투명하거나 불투명한 배경에 보여줍니다. 이미지 뷰 안에서, 여러분은 늘리기, 스케일, 사이즈에 맞추기 또는 특정 위치에 이미지를 핀하기를 할 수 있습니다. 이미지 뷰에서 대체적으로 인터랙티브하지 않습니다. Best practices뷰의 우선적인 목적이 단순히 이미지를 보여주는 것일 때, 이미지 뷰를 사용하세요. 이미지가 인터랙티브 해야하는 드문 상황에서, 시스템이 지정해주는 버튼을 이미지 뷰에 버튼 행위를 추가하는 것 대신에 이미지를 보여주기 위해 설정하세요. 만약 여러분이 인터페이스에 아이콘을 넣고 싶을 때, 심볼과 인터페이스 아이콘을 이미지 뷰 대신에 사용하는 것을 고려하세요. SF Symbols 는 현대적이고, 벡터 기반의..
-
[HIG] 컴포넌트_차트들(charts)UX, UI, GUI 2024. 5. 17. 00:55
차트들명료하고 눈에 띄게 정보를 전달하기 위해서 데이터를 차트에 정리하세요.효과적인 차트는 몇 가지 중요한 데이터셋을 강조합니다. 그리고 사람들이 인사이트를 얻고 어떤 결정을 할 수 있도록 돕습니다. 예를 들어, 사람들은 차트를:다가올 날씨 조건이 어떻게 자신들의 일정에 영향을 미칠지 배울 수 있습니다. 과거의 성장 결과를 이해하고 트렌드를 발견하기 위해 주식 시장을 분석할 수 있습니다. 피트니스 데이터를 그들의 진행과정을 돌아보고, 새로운 목표를 세우기 위해 복습할 수 있습니다.당신의 경험을 강화하기 위한 차트들을 디자인하는 것을 배우기 위해서, Charting data라는 페이지를 보십시오; 개발자를 위한 가이드, 또는 Creating a chart using Swift Charts를 보십시오.분석차..
-
[HIG] Platforms_IOS를 위한 디자인UX, UI, GUI 2024. 4. 18. 15:28
*오역이 있다면 댓글로 알려주세요! IOS를 위한 디자인 사람들은 아이폰에 의지하여, 사람들과 연결되고, 게임을 즐기고, 미디어를 시청하고, 과제를 수행하며, 어딘가 이동 중이거나 어느 곳에 있든지 개인적인 데이터를 추적하여 그들을 도울 수 있도록 합니다. 여러분이 IOS를 위한 앱이나 게임을 디자인 하고자 한ㄷ다면, IOS만이 가진 차별화된 기본적인 디바이스의 특징들이나 패턴들을 이해하는 것부터 시작하시길 바랍니다. 여러분의 디자인 의사결정들을 전달할 이러한 특징들이나 패턴들은 여러분들이 사용자가 만족할만한 앱이나 게임을 제공할 수 있도록 도와줄 수 있을 것입니다. 디스플레이(Display) 아이폰은 중간 사이즈의 높은 해상도를 가집니다. 인체공학적 특징(Erogonomics) 사람들은 아이폰을 한 손..