[디자인부트캠프] DAY 21 | UI 디자인 실전_2

 

UI 디자인 실전_2

 

목차

• UI 디자인 프로세스 개요
• 서비스 기획 및 아이디어 발상
• 디자인 시스템의 이해와 구축
• 와이어프레임 작성 및 레이아웃 설계
• 화면 디자인 및 프로토타이핑
• 피드백 및 개선 방안 논의
  
  

1. UI와 UX의 관계
   • 사용자 인터페이스(UI)와 사용자 경험(UX)의 상호작용을 중시하며, UI는 UX를 보완하고 그 경험을 쉽게 사용할 수 있도록 돕는 역할을 한다.
   • UI 디자인은 서비스를 구조화하고, 내용을 전달하며, 사용자와의 상호작용을 디자인한다.
   • 사용자 경험(UX: User Experience)이란 사용자가 기업, 서비스, 기업의 제품과 상호작용하면서 얻는 모든 측면의 경험을 의미한다.정말 훌륭한 사용자 경험을 제공하려면 고객이 직접 필요하다고 말하는 것 이상을 제공해야 하며, 체크리스트에 나열된 기능을 제공하는 수준을 넘어서야 한다. 훌륭한 사용자 경험을 제공하려는 기업은 공학, 마케팅, 그래픽 디자인과 제품 디자인, 인터페이스 디자인 같은 다양한 분야의 서비스를 매끄럽게 통합해야 한다.닐슨 노먼 그룹에서는 훌륭한 사용자 경험을 만들기 위한 제품 디자인의 요소로 사용자 만족, 단순함, 우아함을 꼽고 있다. 여기서 단순함은 제품의 사용성(Usability)과 관련이 있다. 좋은 제품은 우선 사용하기 쉽고 배우기 쉬우며 원하는 작업을 효율적으로 처리할 수 있어야 한다. 우아함은 사용자의 감성 요소와 관련이 있다. 제품의 매력적인 외형, 좋은 촉감, 세련되고 우아한 피드백 효과 같은 것이 우아함과 관련된 요소다.
     닐슨 노먼 그룹의 UX에 대한 정의를 보면 우선 제품, 서비스와 함께 기업을 언급하는 것이 제일 먼저 눈에 띈다. 일반적으로 제품을 디자인할 때는 제품 그 자체에 대해서만 디자인 팀과 논의를 진행하는데, 좀 더 확장된 개념으로 생각할 때는 서비스와 제품을 함께 이야기하기도 한다. 어떤 제품을 사용자 경험(UX)을 고민한 제품이라고 이야기하려면 디자인할 때 제품의 성능과 기능을 고민하는 외에도 최고의 경험을 제공하는 관점에서 제품의 기능과 관련 서비스를 잘 통합해야 한다. 더 크게 보자면 제품을 디자인할 때 제품과 함께 사용자에게 전달되는 기업의 이미지, 고객 지원 방식, 광고와 마케팅 문구 같은 유무형의 메시지를 함께 고민해야 전체적으로 사용자 경험을 고려한 제품이라고 할 수 있다.

     

   • 훌륭한 사용자 경험을 만드는 첫 번째 조건은 고객의 요구를 정확하게 만족시키는 것이다. 하지만 고객의 만족을 위해서 그들을 귀찮게 하거나 혼란스럽게 해서는 안 된다. 그다음으로 중요한 것은 단순함(simplicity)과 우아함(elegance)인데, 이런 특징은 사람들이 가지고 싶고 사용하고 싶어하는 제품을 만드는 바탕이 된다.
2. UI 디자인의 중요성
   • 사용자 만족도를 높이며, 재방문율을 증가시키고, 긍정적인 고객 피드백을 얻는 데 중요한 역할을 한다.
   • 고객의 만족도를 높이고, 브랜드 신뢰도를 향상시키며, 제품의 성공적인 출시를 돕는다.

 

3. UI 디자인 프로세스 단계

• 기획: 디자인 시스템을 구축하고, 와이어프레임을 작성한다.
• 디자인: 화면 디자인을 통해 콘텐츠를 배치하고, UI 요소를 디자인한다.
• 프로토타이핑: 기능을 시뮬레이션하며 사용자가 상호작용할 수 있는 모델을 만든다.
• 테스트 및 피드백: 실제 사용자 테스트를 통해 디자인을 개선한다.

4. 디자인 시스템

• 디자인 일관성 유지, 커뮤니케이션 효율성 증대, 협업 시 효율성을 높일 수 있도록 돕는 디자인 시스템의 중요성.

 

1. 아이디어 발상 방법
   • 브레인스토밍, 마인드 맵, 경쟁사 분석 등을 통한 창의적인 아이디어 도출 방법.
2. 서비스 기획의 중요성
   • UX 목표 설정과 타겟 사용자 니즈 파악을 위한 명확한 기획이 중요하다. 목표를 정확히 설정하고, 사용자 피드백을 통해 문제를 해결하는 것이 중요하다.
3. 와이어프레임의 역할
   • 와이어프레임은 화면의 기본 구조를 정의하고, 콘텐츠의 우선순위를 설정하는 중요한 단계이다.

---

 

 

1. 레이아웃 설계 원칙 (Layout Design Principles):
   • 그리드 시스템 활용: 콘텐츠의 일관성과 균형을 위해 그리드 시스템을 사용하여 배치를 설계.
   • 시각적 계층 구조 설정: 디자인 요소들이 중요한 정보부터 덜 중요한 정보까지 효과적으로 시각적으로 구분되도록 설정.
   • 일관성 있는 간격과 정렬: 디자인의 통일감을 위해 간격과 정렬을 일정하게 유지.
2. 화면 디자인 (Screen Design):
   • 디자인 시스템을 활용한 시각적 요소 적용: 색상, 타이포그래피, 아이콘 등 디자인 시스템을 기반으로 화면을 구성하여 일관성 있게 디자인.
   • 각종 UI 요소의 시각적 적용: 버튼, 카드, 리스트 등 다양한 UI 요소들이 디자인 시스템에 맞게 정확하게 적용됨.
3. 프로토타이핑 (Prototyping):
   • 인터랙션과 애니메이션 추가: 디자인된 화면에 인터랙션과 애니메이션을 추가하여 사용자 흐름을 직관적으로 보여줌.
   • 사용자 흐름 시뮬레이션: 사용자가 앱이나 웹에서 어떻게 상호작용할 것인지를 보여주는 프로토타입을 제작하여 실제 환경에서의 사용감을 미리 경험.
4. 피드백 수집 방법 (Feedback Collection Methods):
   • 사용자 테스트: 직접 사용자에게 테스트를 진행하여 피드백을 수집.
   • 팀 내 리뷰: 팀원들과 함께 디자인을 리뷰하며 개선사항을 찾아내고 창의적인 의견을 반영.
5. 개선 방안 도출 (Deriving Improvement Plans):
   • 피드백 분석을 통한 문제점 파악: 수집된 피드백을 분석하여 개선해야 할 문제점을 명확히 정의.
   • 우선순위에 따른 개선 계획 수립: 가장 중요한 문제부터 해결할 수 있도록 개선 작업을 계획.

 

클론 디자인 실습을 진행하였다.