
학습목표 Apple의 **Human Interface Guidelines (HIG)**에 기반하며 아이콘에 대한 주요 가이드라인을 알아보고, 앱의 정체성을 효과적으로 전달하고 사용자 경험을 최적화하기 위한 원칙을 알아본다.1.아이콘 디자인의 기본 원칙 단순성: 아이콘은 복잡하지 않고 이해하기 쉬워야 한다. 불필요한 디테일을 제거하고 명확한 메시지를 전달해야 한다.보편성: 아이콘이 다양한 문화권과 사용 환경에서도 직관적으로 이해될 수 있어야 한다.적절성: 앱의 주요 목적이나 기능을 시각적으로 나타내야 한다.일관성: iOS 플랫폼의 다른 앱들과 조화를 이루면서도 고유성을 유지해야 한다.2. 앱 아이콘 고유하고 기억하기 쉬운 아이콘은 앱 또는 게임의 목적과 성격을 전달하고 App Store 및 기기에서 상..

학습목표- iOS 디자인 원칙 이해 - iOS UI 구성 요소 및 패턴 익히기 iOS Human Interface Guidelines의 원칙과 세부 사항을 완전히 이해하고, 이를 기반으로 사용자 친화적이며 Apple의 디자인 철학에 부합하는 앱을 설계할 수 있게 된다. https://developer.apple.com/design/human-interface-guidelines/ Human Interface Guidelines | Apple Developer DocumentationThe HIG contains guidance and best practices that can help you design a great experience for any Apple platform.developer.appl..

학습목표 : 모바일 앱 UI 구조의 이해모바일 앱의 주요 UI 구조(탭 내비게이션, 드로어 내비게이션, 스택 내비게이션 등)를 학습하여 각각의 특징과 사용 사례를 이해한다.1. 태스크 기반의 스택 내비게이션(Stack Navigation)태스크 기반 화면 설계는 특정 작업(Task)을 중심으로 화면을 구성하는 방식이다. 이 설계 방식은 사용자가 앱에서 수행해야 할 특정 작업을 중심으로 UI를 구성하기 때문에, 일반적으로 아래의 구조에 속하거나 이들과 결합하여 사용된다.첫화면을 사용자가 원하는 기능 중심으로 직관적으로 보여줌화면을 사용자가 직접 실행할 수 있는 화면으로 구성1. 스택 내비게이션(Stack Navigation)태스크 기반 설계에서 자주 사용된다. 사용자가 단계별로 작업을 수행해야 하는 경우,..

5. 타이포그래피 시스템폰트는 이미지와 유사한 역할을 한다. 그림처럼 동일한 문장이라도 어떤 폰트를 사용하느냐에 따라 그 느낌이 확연히 달라지는데이처럼 사용자는 알게 모르게 폰트에 대한 느낌을 갖게 되므로 폰트가 전달하는 감정은 아주 중요하다.그래서 기업에서는 자사 브랜드 폰트를 만들어 사용하기도 합니다.인쇄물에 사용할 때는 아무 문제가 없지만, 디지털 환경에서는 조금 다르다.자체 브랜드 폰트 또는 콘셉트에 맞는 유료 혹은 무료 폰트를 사용하기로 했더라도 디지털 환경에서는 부득이하게 시스템 폰트를 사용해야 하는 경우가 많다.원하는 폰트를 강제로 임베드Embed하는 방식으로 사용할 수도 있지만, 그렇게 하면 시스템이 무거워지고 유료 폰트의 경우 별도의 비용이 발생하므로 운영체제에서 제공하는 폰트를 그대로..

1. Z축과 그림자2. 해상도와 밀도3. 그리드4. 컬러테마5. 타이포그래피 시스템4.컬러 테마색상은 데이터를 시각화하고 상태 정보를 전달하며 시각적 연속성을 제공하는 것은 물론 사용자와의 상호작용에 대한 피드백을 제공하는 데도 도움을 준다.iOS의 노란색 노츠나, 캘린더의 상호작용 시 빨간색으로 정의해두고 다른 색상으로 대체하지 않을 것을 권장하죠컬러에 대한 기본적인 이해인간는 빛의 넓은 영역에서 380 ~ 780 nm의 아주 작은 범위 즉 가시광선 영역을 감지하는데 이 범위를 색, color 라고 합니다.프린팅 영역과 달리 디지털에서는 우리가 보는 빛과 유사하게 스스로 광을 가진 요소의 결합으로 색을 표현하는데 빛의 삼원색인 Red, Green, Blue의 조합으로 약 1600만 가지 색상을 보여준다..

1. Z축과 그림자2. 해상도와 밀도3. 그리드4. 컬러테마5. 타이포그래피 시스템 3. 그리드앱 디자인 시 기준과 규칙은 매우 중요합니다. 각 화면별로 통일 된 레이아웃과 정돈된 화면을 디자인 할 때 바로 그리드 시스템을 사용합니다. 그리드(Grid): ‘격자’를 의미하는 용어로 디자인에서는 디자인 영역을 일정하게 구획 하는 것을 의미.일관성을 부여 - 사진, 그림, 문자, 여백 등의 시각적 효과를 고려해 배열하고 구성하는데 유용 - 정보에 질서와 구조를 부여함으로써 사용자가 보고 이해하기 쉽게 일관성을 부여그리드를 구성하고 있는 요소는 컬럼(Column), 거터(Gutter), 마진(Margin)이다 그리스 시스템 제작 그리드 간의 간격을 띄우는 기준선 필요간격을 띄우는 방법으로는 비율, 컨테이너,..

학습목표해상도와 밀도의 개념을 이해하고, UI 디자인 시 고려해야 할 사항을 알아본다. 해상도란? [resolution]- DPI(dot per inch)해상도는 화면이 얼마나 많은 픽셀로 이루어져 있는지를 나타내는 지표이다. DPI(Dots Per Inch) 또는 PPI(Pixels Per Inch)로 표기되며, 인치당 몇 개의 도트(픽셀)가 포함되어 있는지로 표현한다.DPI (Dots Per Inch): 인쇄물의 해상도를 측정할 때 사용되는 단위로, 인치당 도트의 개수를 뜻한다. DPI가 높을수록 더 정밀한 인쇄가 가능하다.PPI (Pixels Per Inch): 화면 해상도를 측정할 때 사용하는 단위로, 모니터나 스마트폰 화면의 인치당 픽셀 수를 의미한다. 높은 PPI는 더 선명하고 고해상도의 이미..

학습목표UI디자인에 필요한 스타일가이드 요소 중 z축과 그림자에 관하여 학습한다.Z축과 그림자는 UI 요소의 깊이와 계층 구조를 시각적으로 표현하는 방법을 이해한다.Z축과 그림자는 UI 요소의 깊이와 계층 구조를 시각적으로 표현하는 중요한 방법 iOS의 디자인 변화:iOS는 iOS 7부터 플랫 디자인을 사용했지만, 최근에는 머티리얼 디자인 요소를 도입하였다. 이는 사용자 인터페이스에 좀 더 현실적인 깊이감을 주기 위해 디자인 철학에 변화를 준 것이다.Z축과 깊이감:Z축의 개념: 화면의 X축(수평)과 Y축(수직)에 더해, Z축(깊이)을 추가함으로써 UI 요소들이 서로 다른 레이어에 위치해 있는 것처럼 보이게 한다. Z축은 화면에서 요소가 떠 있는 높이를 나타내며, 이를 통해 사용자는 어떤 요소가 앞쪽에 있..

학습목표- UI구조에대하여알아보자- 모바일운영체제에따른UI 컴포넌트을알아보자.- 모바일환경에따른UI 디자인특징을알아보자. UI 구조웹사이트구조 : 가로형과세로형가로구조형: header, contents, footer area세로구조형: left:header, right_top:contents, right_bottom:footer 모바일사이트구조Top : navigationBottom: tab_bar – 핵심메뉴, 기능 등 표시 모바일UI 디자인패턴모바일애플리케이션이나 시스템을 설계하는 과정에서 자주발생하는 공통적인 문제의 해결책이며, 이때 사용 할 수 있는 최상의 가이드 또는 템플릿이다.앱의 구조와명칭, 주의사항과 역할에 대해 운영체제별로 잘 파악하고 있어야한다. UI Component란?사용자를 위한..

학습목표•UI/UX디자인 프로세스의 필요성과 디자인의 시각적 기준과 근거가 되는 스타일 가이드를 알아보고 무드 보드를 제작 해 보자.* 무드보드 제작 방법을 대하여 알아보자.디자인 프로세스의 필요성논리적인 디자인 흐름을 만들려면 디자인 프로세스가 필요하다.목표를 설정했다면 그 목표를 시각적으로 잘 전달할 수 있는 색상, 이미지, 폰트 등 을 설정하는 과정이 필요디자인 프로세스는 리서치 결과를 바탕으로 먼저 디자인의 목표와 정의를 세운 후에 디자인하 고 개발해 배포하는 프로세스를 거치는 것이 좋다.1.디자인의 목표와 정의 수립•골든 서클을 이용해 목표를 설정하는 과정①WHY : 이 프로젝트를 통해 궁극적으로 전하려는 바가 무엇인지 목표를 설정한다.②HOW : 그 가치를 어떻게 전달할 것인지 판단한다.③WH..
- Total
- Today
- Yesterday