UI(user Interface) Design
3D 컨텐츠를 위한 UI디자인
list1시간
UI 디자인의 정의
UX디자인의 정의
3D컨텐츠의 이해
2시간
구성
배치
상호 연결성
3시간
좋은 디자인의 정의
컨텐츠 의 구성과 이해
사례
4시간
ui와 UX의 혼합
좋은 구성을 위해 고려해야할 사항
컨텐츠의 주체
5시간
경험을 디자인해보기
실제 사례
6시간
미디어 발전과 UI
1교시
UI & UX디자인
UI디자인의 정의
• UI디자인이란 쉽게 말하자면 핸드폰, 내비게이션, 스마트TV, 플래시 기반 웹사이트 등 각종 기기들의 인
터페이스를 사용자가 사용하기 편하게 디자인 하는 일을 말합니다.
• UX디자인은 사람들의 경험을 바탕으로 사람들이 사용하기 편하게 디자인하는 업무이며, UX디자인이 UI
디자인에 비해 조금 더 광범위한 개념입니다.
• UI(User Interface)의 정의 :
UI디자인이란, 사용자가 취하는 액션에 따라, 전자기기가 반응할 수 있도록 시스템 골격을 만드는 일입
니다.
• 예를 들어 아이폰의 홈화면의 디자인부터, 아이콘을 터치하면 그 어플이 실행이 되고, 가운데 홈버튼을
누르면 앱이 종료되며 홈화면으로 나오게 만드는 인터페이스의 메커니즘을 디자인하는 일입니다.
[출처] UI디자인과 UX디자인이란?|작성자 khwjdqh
•
• UI란, 말그대로 '유저 인터페이스’, 사용자가 사용하는 인터페이스를 말합니다.
[출처] UI디자인과 UX디자인이란?|작성자 khwjdqh
UX(User Experience)디자인의 정의
유저의 경험에 의한 디자인(User /사용자 Experience /경험)
[출처] UI디자인과 UX디자인이란?|작성자 khwjdqh
UI는 인터페이스를 만드는 디자인 기술 자체와 실현해서 사용하는 실물을 의미하며, UX는 UI를 사용하거나, 혹은 그동안
사람의 행동을 통해 축적되는 경험들을 기반으로 인터페이스를 구축하는 작업을 의미합니다.
예를 들어, 재생버튼을 눌러 음악이 실행되고, 일시정지를 누르면 음악이 멈춘다는 경험을, 아이튠즈에서 새로운 터치패드
식 UI를 개발할 때 참고하여 제작하는 과정이 UX디자인 과정이라고 말할 수 있습니다. 이렇듯 기존의 경험을 토대로 이용
해 만드는 것이 UX디자인의 한 종류입니다.
다른 종류는 기존에 없던 것들을 새로 창조해내는 것입니다.
일례로 아이폰(특히, 아이팟터치)이 나오기 전에 핸드폰의 부가기능을 출고될 때 나오는 소프트웨어만 이용하는게 가능했
다면, 이제는 소프트웨어도 사용자가 직접 제작하여 사고 팔게 만들 수 있도록 시스템을 구축하는 것 자체가 새로운 UX, 즉,
USER EXPERIENCE(경험 기반 디자인)을 창조하게 된 혁신적인 UX디자인입니다.
또 애플사의 I Phone, I Pad, I Pod, Mac, Macbook 등은 다들 비슷한 인터페이스로 이들 중 한두가지를 사용해본 사람은 다
른 애플사의 제품을 무리없이 사용할 수 있는 것 자체가 UX입니다. 이를 이용해 UI를 디자인하는 것이죠. 이렇듯 미세한 차
이가 있지만, 서로 상호보완적 공생관계를 유지하고 있습니다.
[출처] UI디자인과 UX디자인이란?|작성자 khwjdqh
3D컨텐츠의 이해
게임 IPTV 가상
현실
증강
현실
건축
시뮬레이션
출판 공연 영화 드론&로봇
우리가 경험하는 모든 것
현재 보여지는 상황
2교시
UI 상호 작용
구성
인트로
• 로그인
• 서버채널
• 공지
선택
• 상점(결제)
• 조합
• 이벤트
컨텐츠 이용
• 메인 화면
• 종료
설정
• 그래픽, 사운드, 언어, 비율, 자막, 재설정
전략
RPG
1인칭 슈팅
3인칭 슈팅
3인칭 액션
UI발전 단계
https://m.blog.naver.com/PostView.nhn?blogId=runarse
a&logNo=150039440677&proxyReferer=https%3A%2F
%2Fwww.google.co.kr%2F
배치
각 매체의 화면비율과 경험을 통한 편의성
키보드와 마우스 터치 동작인식 제스쳐
상호연결성
• 네트웍상 플레이어와의 접속
• 협력관계 적대 관계의 정보 공개
• 상호 교류와 커뮤니케이션
• 화면에서의 처리
3교시
좋은 디자인이란?
게슈탈트 심리학 + 링크
핵심
• 1.근접성
-구성요소는 구성요소 사이가 가까울 수록 함께 묶이려는 경향이 있다.
• 2.유사성
-몇몇 면에서 유사한 항목들은 함께 묶이려는 경향이 있다.
• 3.폐쇄성
-구성요소들이 일부 개체를 완성하려는 경향이 있으면 항목들은 함께 묶여진다.(*주4 중요. 폐쇄성의 법칙)
• 4.단순성
-항목들은 대칭성, 규칙성, 그리고 평활성(smoothness)에 따라서 단순한 형태로 조직될 것이다.
• http://circuitshower.com/%EC%A2%8B%EC%9D%80%EB%94%94%EC%9E%90%EC%9D%B8%EC%9D%B4%EB%
9E%80-%EB%AC%B4%EC%97%87%EC%9D%B8%EA%B0%80/
컨텐츠의 구성과 이해
1인칭 2인칭 3인칭
정보를 어떻게 전달할 것인가?
사례
4교시
좋은 구성을 위해 고려해야 될 사항
컨텐츠의 주체는 누구인가?
10대
20대
30대
40대
각세대별 취향과 경험이 다르기
때문에 해당 컨텐츠는 주 대상과 내용
취향을 반영하여야 성공할 수 있다.
컨텐츠의 주체에게 정보를 쉽게 전달하기 위
하여
시각적인 부분과 경험을 고려해야한다.
5교시
우리의 경험을 디자인 해봅시다 !
우리 생활의 사례
욕구를 UX디자인 측면에서의 경험
적 사례
6교시 – 미디어 발전과 UI(최종 정리)
2d도서(일반적 정보
전달)
3d(입체적 시각의
정보전달)
4d(소리,동작,인터랙
티브)
경험을 어떻게 공유하여 전달할 것인가?
상호작용의 시각적 전달

Ui(user inter face) design

  • 1.
    UI(user Interface) Design 3D컨텐츠를 위한 UI디자인
  • 2.
    list1시간 UI 디자인의 정의 UX디자인의정의 3D컨텐츠의 이해 2시간 구성 배치 상호 연결성 3시간 좋은 디자인의 정의 컨텐츠 의 구성과 이해 사례 4시간 ui와 UX의 혼합 좋은 구성을 위해 고려해야할 사항 컨텐츠의 주체 5시간 경험을 디자인해보기 실제 사례 6시간 미디어 발전과 UI
  • 3.
  • 4.
    UI디자인의 정의 • UI디자인이란쉽게 말하자면 핸드폰, 내비게이션, 스마트TV, 플래시 기반 웹사이트 등 각종 기기들의 인 터페이스를 사용자가 사용하기 편하게 디자인 하는 일을 말합니다. • UX디자인은 사람들의 경험을 바탕으로 사람들이 사용하기 편하게 디자인하는 업무이며, UX디자인이 UI 디자인에 비해 조금 더 광범위한 개념입니다. • UI(User Interface)의 정의 : UI디자인이란, 사용자가 취하는 액션에 따라, 전자기기가 반응할 수 있도록 시스템 골격을 만드는 일입 니다. • 예를 들어 아이폰의 홈화면의 디자인부터, 아이콘을 터치하면 그 어플이 실행이 되고, 가운데 홈버튼을 누르면 앱이 종료되며 홈화면으로 나오게 만드는 인터페이스의 메커니즘을 디자인하는 일입니다. [출처] UI디자인과 UX디자인이란?|작성자 khwjdqh • • UI란, 말그대로 '유저 인터페이스’, 사용자가 사용하는 인터페이스를 말합니다. [출처] UI디자인과 UX디자인이란?|작성자 khwjdqh
  • 5.
    UX(User Experience)디자인의 정의 유저의경험에 의한 디자인(User /사용자 Experience /경험) [출처] UI디자인과 UX디자인이란?|작성자 khwjdqh UI는 인터페이스를 만드는 디자인 기술 자체와 실현해서 사용하는 실물을 의미하며, UX는 UI를 사용하거나, 혹은 그동안 사람의 행동을 통해 축적되는 경험들을 기반으로 인터페이스를 구축하는 작업을 의미합니다. 예를 들어, 재생버튼을 눌러 음악이 실행되고, 일시정지를 누르면 음악이 멈춘다는 경험을, 아이튠즈에서 새로운 터치패드 식 UI를 개발할 때 참고하여 제작하는 과정이 UX디자인 과정이라고 말할 수 있습니다. 이렇듯 기존의 경험을 토대로 이용 해 만드는 것이 UX디자인의 한 종류입니다. 다른 종류는 기존에 없던 것들을 새로 창조해내는 것입니다. 일례로 아이폰(특히, 아이팟터치)이 나오기 전에 핸드폰의 부가기능을 출고될 때 나오는 소프트웨어만 이용하는게 가능했 다면, 이제는 소프트웨어도 사용자가 직접 제작하여 사고 팔게 만들 수 있도록 시스템을 구축하는 것 자체가 새로운 UX, 즉, USER EXPERIENCE(경험 기반 디자인)을 창조하게 된 혁신적인 UX디자인입니다. 또 애플사의 I Phone, I Pad, I Pod, Mac, Macbook 등은 다들 비슷한 인터페이스로 이들 중 한두가지를 사용해본 사람은 다 른 애플사의 제품을 무리없이 사용할 수 있는 것 자체가 UX입니다. 이를 이용해 UI를 디자인하는 것이죠. 이렇듯 미세한 차 이가 있지만, 서로 상호보완적 공생관계를 유지하고 있습니다. [출처] UI디자인과 UX디자인이란?|작성자 khwjdqh
  • 6.
    3D컨텐츠의 이해 게임 IPTV가상 현실 증강 현실 건축 시뮬레이션 출판 공연 영화 드론&로봇 우리가 경험하는 모든 것 현재 보여지는 상황
  • 7.
  • 8.
    구성 인트로 • 로그인 • 서버채널 •공지 선택 • 상점(결제) • 조합 • 이벤트 컨텐츠 이용 • 메인 화면 • 종료 설정 • 그래픽, 사운드, 언어, 비율, 자막, 재설정 전략 RPG 1인칭 슈팅 3인칭 슈팅 3인칭 액션
  • 9.
  • 10.
    배치 각 매체의 화면비율과경험을 통한 편의성 키보드와 마우스 터치 동작인식 제스쳐
  • 11.
    상호연결성 • 네트웍상 플레이어와의접속 • 협력관계 적대 관계의 정보 공개 • 상호 교류와 커뮤니케이션 • 화면에서의 처리
  • 12.
  • 13.
    게슈탈트 심리학 +링크 핵심 • 1.근접성 -구성요소는 구성요소 사이가 가까울 수록 함께 묶이려는 경향이 있다. • 2.유사성 -몇몇 면에서 유사한 항목들은 함께 묶이려는 경향이 있다. • 3.폐쇄성 -구성요소들이 일부 개체를 완성하려는 경향이 있으면 항목들은 함께 묶여진다.(*주4 중요. 폐쇄성의 법칙) • 4.단순성 -항목들은 대칭성, 규칙성, 그리고 평활성(smoothness)에 따라서 단순한 형태로 조직될 것이다. • http://circuitshower.com/%EC%A2%8B%EC%9D%80%EB%94%94%EC%9E%90%EC%9D%B8%EC%9D%B4%EB% 9E%80-%EB%AC%B4%EC%97%87%EC%9D%B8%EA%B0%80/
  • 14.
    컨텐츠의 구성과 이해 1인칭2인칭 3인칭 정보를 어떻게 전달할 것인가?
  • 15.
  • 16.
    4교시 좋은 구성을 위해고려해야 될 사항
  • 17.
    컨텐츠의 주체는 누구인가? 10대 20대 30대 40대 각세대별취향과 경험이 다르기 때문에 해당 컨텐츠는 주 대상과 내용 취향을 반영하여야 성공할 수 있다.
  • 18.
    컨텐츠의 주체에게 정보를쉽게 전달하기 위 하여 시각적인 부분과 경험을 고려해야한다.
  • 19.
    5교시 우리의 경험을 디자인해봅시다 ! 우리 생활의 사례
  • 20.
  • 21.
    6교시 – 미디어발전과 UI(최종 정리) 2d도서(일반적 정보 전달) 3d(입체적 시각의 정보전달) 4d(소리,동작,인터랙 티브) 경험을 어떻게 공유하여 전달할 것인가? 상호작용의 시각적 전달