NCS

훈련일 2017. 06. 19(월)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인) 기본
능력단위명 디지털디자인 프로젝트 기획
능력단위요소 프로젝트 파악하기
이름 최보윤

제안 요청서(REP : Request For Proposal)

프로젝트를 제안하기를 요청하기 위하여 클라이언트가 작성하는 최초의 요구 사항 정의서이다. 프로젝트의 취지, 목적, 범위, 기능적 요구, 개발 환경, 일정, 예산, 업무 요건 등 전반적으로 프로젝트를 파악할 수 있는 내용을 기본으로 하며, 제안 내용에서 클라이언트가 특별히 기대하고 원하는 내용과 방향에 관한 요구 사항이 포함된 문서이다.


프로젝트 브리프(Brief)

프로젝트 최종목표 및 성격을 정하고 문제, 목표, 방향을 규명하기 위해 간략하게 정리한 문서를 말한다.





훈련일 2017. 06. 20(화)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인) 기본
능력단위명 디지털디자인 프로젝트 기획
능력단위요소 프로젝트 파악하기
이름 최보윤

정성(Qualitative)조사 방법

사용자의 믿음이나 감정, 동기요인 등 사용자의 심리적인 부분에 대한 답을 얻는 것으로 사회적 문화적 맥락에서 사용자의 잠재된 니즈를 찾아내는 데 유용하다. 대표적인 방법으로 인터뷰가 있다.


정량(Quantitative) 조사 방법

정량조사는 동일한 특성을 지닌 표본 집단을 대상으로 사용자의 인식과 반응을 파악할 수 있도록 사회 통계적 증명을 통해 답을 얻어내는 방법이다. 대표적인 방법으로 설문 조사가 있다.


디자인 플래닝

사용자의 드러나 있지 않은 소비 욕구와 필요성, 즉 니즈를 찾아내어 그 니즈에 대응하는 디자인의 전략적 접근 과정을 계획하는 것이다. 사용자의 잠재된 니즈를 찾아내는 데에는 여러 가지 방법이 사용되는데, 정성 조사와 정량 조사의 결과를 기존 활동의 성과 파악과 새로운 디자인 전략 수립의 방향성 및 설정에 활용할 수 있다.






훈련일 2017. 06. 21(수)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인) 기본
능력단위명 디지털디자인 프로젝트 기획
능력단위요소 프로젝트 제안하기
이름 최보윤

프로젝트 제안 필수 항목

  • 클라이언트 :회사, 브랜드, 서비스 소개 및 관련 수행 부서
  • 프로젝트 개요 : 현황 및 추진 개요, 목적, 대상, 개발 범위
  • 제안 요구 사항 : 콘텐츠, 기능, 마케팅, 관리, 기타 등 요구 사항 분류
  • 핵심 요구 사항 : 제안 요구 사항 중 가장 중요한 핵심 파악
  • 조사 방향 수립 : 요구 사항 해결 방안을 위한 조사 방향 및 항목 정리
  • 개발 환경, 요건 : H/W, S/W, OS, Data Base 시스템 개발 환경, 준수 사항
  • 수행 조직 : 프로젝트 매니저, 업무별 프로젝트 리더, 투입 인력
  • 일정 및 예산 : 개발 일정 및 예상네 따른 견적




훈련일 2017. 06. 22(목)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인) 기본
능력단위명 디지털디자인 프로젝트 기획
능력단위요소 프로젝트 제안하기
이름 최보윤

제안서 내용구성 및 목차 설정

  • 귀납적 접근 : 제안 개요 및 배경으로부터 일반적이고 보편적인 내용을 토대로 제안 방향과 전략을 유도하여 요구 사항 해결 방안의 근거와 대안을 제시하는 방법
    1. 프로젝트 개요
    2. 시장 및 환경 분석
    3. 벤치마킹 및 분석
    4. 구축 전략 및 핵심 과제
    5. 요구 사항 해결 방안
    6. 왜 우리여야 하는가?
  • 연역적 접근 : 제기하는 문제 또는 핵심적인 명제를 먼저 부각시키고 해결 방안을 이끌어 내어 대안으로 제시하는 방법.




훈련일 2017. 06. 23(금)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인) 기본
능력단위명 디지털디자인 프로젝트 기획
능력단위요소 프로젝트 제안하기
이름 최보윤

커뮤니케이션의 EOB 법칙

  • E(Example) : 예화로 이야기를 시작한다. 특히, 본인의 이야기나 최근 이슈가 되고 있는 이야기를 바탕으로 근거 있는 실례가 좋다.
  • O(Outline) : 전달하고 자하는 핵심 내용을 간략히 정리한다.
  • B(Benefit) : 전달하고자 하는 내용이 상대방에게 어떤 이익을 주는가에 초점을 맞추어 설명한다.




훈련일 2017. 06. 26(월)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인) 기본
능력단위명 디지털디자인 프로젝트 기획
능력단위요소 프로젝트 계약하기(0802010401_13v1.3)
이름 최보윤

계약에 대한 법리적 기본 지식

  • 계약서는 개발사와 클라이언트의 권리와 의무를 규정하며, 기업과 기업 간의 신의를 바탕으로 하는 공문서
  • 프로젝트 수행 기간 중 분쟁이 발생하였을 때에는 이 계약서를 기준으로 법률적 해석을 하게 된다.

클라이언트의 권리와 의무

  • 클리어언트가 지정하는 자는 사업 수행에 참여하여 구체적인 사업수행 방향 제시, 문제점 개선, 대책 강구 등의 조치를 취할 수 있으며, 수행자는 이에 성실히 응하여야 한다.
  • 부적당하거나 자격 미달일 경우 교체를 요구할 수 있으며, 수행자는 특별한 사유가 없는 한 이에 응하여야 한다.
  • 수행자가 계약 내용을 위반하였을 경우에는 보완 요청을 하고, 이를 시행하지 않을 시 보상 없이 계약을 해지할 수 있다.

수행자의 권리와 의무

  • 수행자는 계약을 수행함에 있어 신의, 성실의 원칙에 입각하여 필요한 지식과 기술을 활용해야 한다.
  • 용역 계약 밑 등의 규정된 사항을 충실히 준수하여야 하며, 클라이언트가 제시하는 조치상황에 따라야 한다.
  • 클라이언트의 귀책사유로 계약이 해지되었을 경우 해지 전일까지 용역 수행에 소요된 비용을 클라이언트가 수행자에게 지급해야 한다.
  • 수행자는 클라이언트의 사전 서면 승인이 없는 한 비밀 정보를 목적 사업 외의 다른 목적이나 용도로 사용할 수 없으며, 임의로 복제, 저장, 번형 또는 분석하는 등의 행위를 할 수 없다.




훈련일 2017. 06. 27(화)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인) 기본
능력단위명 요구사항 분석 사용자 정의하기(0802010402_13v1)
능력단위요소 프로젝트 계약하기(0802010401_13v1.3)
이름 최보윤

요구사항 정의서(Project Profiler)

  • 프로젝트의 개요, 목표, 예산, 업무 흐름, 시스템 필수 요소, 기능적 요구 등 클라이언트의 요구 사항과 프로젝트의 범위를 규정하기 위해 클라이언트가 작성하게 되는 문서

문서 정리 문장 구성

  • 정보 전달 능력을 극대화하기 위해서 누가 봐도 이해하기 쉽게 작성하는 것이 기본
  • 도출된 내용을 요약하여 간격한 문자응로 일목요연하게 작성하도록 한다.
  • Who :누가 행하는가? (행위의 주체, 투입 인력 또는 상품이나 서비스)
  • What : 무엇을 말하는가? (문서의 핵심 부분으로 사실의 대상)
  • When :언제 시행되는가? (작성 일자, 문서와 관련된 시간)
  • Where: 어디에서 시행되는가? (장소)
  • Why :목적, 왜, 이유나 원인으로 결론에 근거하는 요소, 기대 효과 등
  • How :어떻게 진행, 수행하는가? (젛누 진행 상황 설명)




훈련일 2017. 06. 28(수)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인) 제작
능력단위명 디자인 구성요소 제작
능력단위요소 매체성 구성요소 제작하기
이름 최보윤

페르소나 모형 (Persona Model)

  • 페르소나는 디자인 프로젝트 상에서 실제 사용자를 대표하는 가상의 인물
  • 핵심 사용자층에 속하는 대표적인 사용자의 행동 패턴 및 라이프 스타일 등 사용자의 경험을 예측하는 게 목적으로, 가상의 인물일지라도 구체적이고 자세하게 정의되어야 한다.




훈련일 2017. 06. 29(목)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인) 제작
능력단위명 디지털디자인 프로젝트 분석 설계
능력단위요소 시장환경 조사하기(080201042_13v1.2)
이름 최보윤

정보 수집

  • 개발 방향을 설정하기 위해 정보를 수집할 때에는 수집되는 정보를 바탕으로 섣부른 결론을 내리지 않기 위해 현견을 갖지 말아야 하고, 정보가 누락되는 걸 막기 위하여 많은 정보를 수집
  • 온라인 매체를 이용하는 정보수집 방법:인터넷 검색, 소셜 네트워크 서비스 분석, 통계, 학술 자료, 설문 조사 등
  • 오프라인 매체를 이용하는 방법: 관찰, 인터뷰, 포커스 그룹 인터뷰(FocusGroup Interview), 신문, 비즈니스 트렌드 잡지 및 도서 등
    1. 필요성 : 무엇을 알고자 하는가
    2. 수집 범위 : 어디까지 수집할 것인가
    3. 출처 : 어디에서 수집할 것인가
    4. 정확성 : 출처 확인
    5. 보안성 : 비밀 유지
    6. 신선도 : 최대한 최신 정보 수집
    7. 정보망 : 정보 제공자 다수 확보

거시 환경 분석

  • 사회적 환경, 기술적 환경, 경제적 환경, 생태학적 환경, 정치적 환경의 5가지 요소로 기업의 활동에 영향을 주는 외부적 요인을 파악하는 방법
  • 5가지 요소의 영문 첫 글자를 조합하여 STEEP 분석법이라고 한다.
    1. 사회적 환경 : 인구 통계, 출생률, 사망률, 평균 수명, 교육 수준, 사회 계층 간 임금 격차, 사회 각 영역의 인구 비율, 여성의 사회 진출, 문화적 태도, 문맹률, 관심, 믿음, 가치, 라이프 스타일, 사용자 생활 양식 등/li>
    2. 기술적 환경 : 보유 특허, 특허 보호제도, RD예산, 신기술정보 기술, 기술 변화 속도, 기술 클러스터 존재여부, 서비스 혁신 속도, 기술 혁신 및 확산, 산업 경제의 디지털화, 인터넷 기반 기술 등
    3. 경제적 환경 : GDP 성장률, 외환 보유고, 인플레이션율, 수입 배분 수준과 범위, 금융 재정 정책, 구조 조정, 실업률, 임금 수준, 소비 성향 등
    4. 생태학적 환경 : 공기와 수질, 재활용 시설 규모, 에너지원, 서비스 수명 주기 발전 단계, 원자재 대체성, 환경 규제 수준 등
    5. 정치학적 환경 : 개혁 정책, 규제 기관의 활동, 재산권 보호법 존재 여부, 정치적 의사 결정에 대한 영향력, 여론, 정책 결정 구조의 성격, 지원 정책, 규제 합리화, 민영화, 특허 등

미시 환경 분석

  • 기업의 내부적 환경과 공급자, 클라이언트, 경쟁자들, 관계자들의 상황과 동향 등을 파악하는 방법
  • 대표적인 방법으로 소비자, 경쟁사, 자사를 분석하는 3Cs 분석법이 있다
    1. 소비자 분석 : 목표 소비자, 이용 동기, 이용 경로, 소비자 영향력, 시장 규모, 시장 성장률 등
    2. 경쟁자 분석 : 현재의 경쟁사, 잠재적 경쟁사, 경쟁사의 시장 내 성과, 시장 내 강점 및 약점, 경쟁사의 마케팅 전략 등
    3. 자사 분석 : 인적 물적 기술적 자원, 기업의 문화, 기업의 이미지, 재무 자원, 생산 설비, 입지, 기업 내 타 부서의 영향을 받는 요인 등

SWOT 분석

    SWOT분석은 프로젝트 전략 수립의 필수 기법으로, 분석하고자 하는 대상 기업의 내부 요인 상황과 경쟁자와 비교한 강점, 약점, 그리고 자사를 제외한 외부 환경인 기회, 위협의 네가지를 분석한다.
    1. SO : 기존 시장 장악은 물론 신규 시장 진출에 용이
    2. ST : 기존 시장 침투 및 확장이 장점과 단점을 각각 가지고 있다
    3. WO : 핵심 역량 강화 / 시장을 선도하고 있는 서비스와 제휴를 통해 발전의 여지가 있는 전략
    4. WT : 내, 외부 모두의 각각의 위험이 도사리고 있으므로 시장 철수를 어느 시점에 어떤 방식으로 진행할지 분석하는 전략




훈련일 2017. 06. 30(금)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인) 제작
능력단위명 디지털디자인 프로젝트 분석 설계
능력단위요소 시장환경 조사하기(080201042_13v1.2)
이름 최보윤




훈련일 2017. 07. 03(월)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 디자인)제작
능력단위명 디지털디자인 프로젝트 분석 설계
능력단위요소 디지털 방향성 정의하기(080201042_13v1.3)
이름 최보윤

디자인 요구 사항 분석

디자인의 방향성과 관련하여 사용자 성향과 클라이언트의 요구사항을 분석, 정의하여 이를 바탕으로 디자인 콘셉트 수립의 근거를 준비한다.
  • 클라이언트 요구 사항 : 마케팅 지향점, 브랜드 이미지, 경쟁 브랜드의 차별화 전략 등
  • 사용자 성향 : 주 사용자의 연령, 성별, 기호, 심리, 행동 패턴 등
  • 기능적 요구 사항 : 서비스 환경, 필수 요소 등
  • 디자인 제약 조건 : 기억 CI 사용 규정, 기업 선호 색상·디자인 콘셉트 등
  • 업무 흐름 : 의시 결정권자 및 프로젝트 매니저의 디자인 성향 등




훈련일 2017. 07. 04(화)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 디자인)제작
능력단위명 디지털디자인 프로젝트 분석 설계
능력단위요소 디지털 방향성 정의하기(080201042_13v1.3)
이름 최보윤

콘셉트 시각화 디자인 요소

컬러, 이미지, 타입, 레이아웃 등의 콘셉트를 시각화 할 수 있는 디자인 요소
  • Color : 해당 상품의 이미지를 키워드로 설정하고, 컬러 맵에 의해 키워드에 맞는 단일색, 배학색 등으로 표현한다.
  • Image : 해당 상품의 이미지를 키워드로 설정하고, 사진, 그림, 동영상 등의 시각적인 형태로 표현
  • Type : 본문과 기능성 메뉴 버튼 등은 가독성 중심으로 표현하고, 타이틀과 배경 등은 시각적 이미지를 고려하여 표현한다.
  • Layout : 사용성을 중심으로 다양한 형태를 표현

톤 & 매너 (Tone & Manner)

  • 디자인의 기획단계에서 다루는 시각적인 분위기 : 작업물의 색상 분위기나 방향성, 그리고 표현 방법에 괗난 전반적인 것
  • Tone & Manner가 결정되면 그에 맞춰 세부적인 커럴, 이미지, 표현 방법, 타입, 레이아웃 등의 디자인 요소가 일관되게 진행




훈련일 2017. 07. 05(수)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 디자인)제작
능력단위명 정보구조 설계 시나리오 작성하기
능력단위요소 정보구조 설계 시나리오 작성하기(080201042_13v1.4)
이름 최보윤

시나리오 기획 프로세스 방법

  1. 자료 수잡 계획
    • 자료 수집 목표, 조사 대상자 확정, 인터뷰 유형 결정, 조사 상황결정, 조사팀 구성
  2. 자료 준비
    • 선정 기준표 작성, 소개글 작성, 참가 동의서 작성, 사전 및 사후 설문지 작성, 비밀 보장 각서 작성, 답례품 준비
  3. 인터뷰 준비
    • 인터뷰 역할 분담, 인터뷰 일정 확인, 인터뷰 준비물 확인
  4. 인터뷰 진행
    • 소개, 변환, 현장 인터뷰 진행

에스노그래피 조사 (Ethnogoraphy Research)

  • 현지 조사 방법의 하나, 실제 환경에서 대화, 질문 등을 통해 조사 대상자와 상호 작용을 하면서 그의 행동, 신념, 선호 등을 자세하고 깊이 있게 관찰하며 조사
  • 조사 대상자의 의식주 양식 뿐만 아니라 일하고 여가를 즐기는 모든 방식을 보다 정확하게 파악할 수 있다.

정보 구조와 유형

사용자의 목적을 잘 수행하 룻 있도록 컨텐츠의 구성과 흐름 등 구조를 설계하는 것으로 시스템고 ㅏ사용자 사이엥서 커뮤니케이션을 수행하는 중요한 과정

  1. 계층 구조
    • 각 상위 메뉴에서 하위 메뉴로 Top-Down 방식으로 이동할 수 있는 구조
  2. 계열 구조
    • 정보를 한 페이지씩 나열하여 보여주는 구조
  3. 그리드 구조
    • 수평과 수직 형태로 연결되어 있는 구조
  4. 네트워크 구조
    • 비 선형적으로 배열되어 특정 페이지로의 이동이 자유로운 구조

네비게이션 유형

  1. 글로벌 내비게이션(Global Navigation)
    • 정보 구조 중 가장 상위에 위치. 모든 페이지에서 접근이 가능
    • 웹사이트의 경우 대체로 상단에 위치한 제너럴 네비게이션 바(GNB:General Navigation Bar)를 지칭
  2. 로컬 내비게이션(Local Navigation)
    • 글로벌 내비게이션의 하위 내비게이션으로 통칭 서브메뉴를 지칭
    • 글로벌 내비게이션의 바로 아래 또는 화면 구조에 따라 왼쪽, 오른쪽에 위치
  3. 콘텍스추얼 내비게이션 (Contextual Navigation)
    • 정보의 맥락상 유사한 정보로의 이동이 용이하도록 특정 이미지 및 단어에 관련 페이지를 연결하는 방식




훈련일 2017. 07. 06(목)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 디자인)제작
능력단위명 프로토타입 제작
능력단위요소 기초데이타 수집하기
이름 최보윤

아이디어 발상법

  • 브레인스토밍법 : 참여자 모두가 아이디어를 사전 조율 없이 그대로 내놓는 방법. 양적으로 축적된 아이디어를 목록별로 정리하고, 발전시켜 최종 산출물을 얻는다.
  • 체크 리스트 기법 :생각할 때 누락되는 것이 없도록 하나씩 체크해 가기 위한 일람표. 제품 발상에 적합한 아이디어 발상 기법이다.
  • 마인드맵핑법 : 생각하고 있는 간단한 그림과 기호, 상징을 색깔로 강조하며 짧은 낱말로 나뭇가지와 같은 가지를 그려서 그 위에 빠르게 표현하는 시각적인 도식
  • 시네틱스 : 발상한 사물과 본질적으로 비슷한 것이 무엇인가를 찾아내서 그것을 힌트로 하여 아이디어를 생각하는 것. 기본적인 집단적 발상 기법. 제품 개발등의 분야에 적합
  • 강제 결부법 : 일상적인 것을 뛰어넘는 새로운 아이디어가 필요할 때, 다양한 시각에서 아이디어를 생성해 보고 싶을 때 사용.
  • 형태 분석법 : 해결해야 할 문제들을 차트화 하여 분석하는 방법. 3차원 도표의 변수로 보고 다시 세분화하여 각각의 항목들이 만나는 부분을 해결해가는 방법
  • 육색모 사고법 : 하양, 빨강, 검정, 노랑, 초록, 파랑의 6가지 색상에 각기 다른 독특한 관점을 정의해 두고, 참ㅇ여자들이 각자 다른 색깔의 관점에서 정해진 색상 순서로 역할을 분담해 생각을 전개해가는 방법.

데이터의 종류

  • 매체 성격에 따른 분류
    1. 외부 데이터 : 인터넷 외부에서 얻어지는 모든 데이터. 시장 정보, 주식 정보 등. 사용자에게 제공되던 정보를 인터넷 데이터로 전환시킨 것
    2. 내부 데이터 : 인터넷에 관련된 정보를 제공하는 콘텐츠. 검색 엔진에서 많이 활용되는 데이터나, 비디오, MP3파일과 같은 데이터
  • 데이터 생성에 따른 분류
    1. 프로듀서 데이터 : 사이트 제작자가 일방적으로 제공하는 콘텐츠 / 인터넷 초장기에 주류를 이룸
    2. 컨슈머 데이터 : 사이트의 사용자들이 만들어서 제공하는 데이터 / UCC(user Created Contents), PCC(Proteur Created Contents)
  • 데이터 이용에 따른 분류
    1. 유료 데이터 : 시간당 또는 건당으로 사용자에게 요금을 받는 콘텐츠
    2. 무료 데이터 : 사용자가 인터넷에 접속하면 별도의 비용없이 이용할 수 있는 콘텐츠
  • 프로슈머적 데이터 : 자신의 사용이나 만족을 위해 제품, 서비스, 경험을 생상하는 사람을 지칭, 사이트에 직접 참여한다는 의식이 사이트에 대한 참여도를 가질 수 있게 함 / 게시판이나 블로그의 형태

데이터의 검색에 유용한 사이트 목록





훈련일 2017. 07. 07 (금)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 디자인)제작
능력단위명 프로토타입 제작
능력단위요소 기초데이타 수집하기
이름 최보윤

데이터의 유형

  • 사실(Fact) : 객관적이고 구체적인 자료. 정보의 양은 적은 편이나 구체성이 높고, 데이터 자체의 난이도는 낮은 특징. 주로 텍스트 중심이나 최근 추가적인 이미지나 동영상이 제공되기도 한다.
  • 개념(Concept) : 특정 대상에 대한 이해를 돕기 위해 사용 되는 정의 / 특정 아이템이 어떤 개념과 효능을 지녔는지에 대한 정보 / 현실적으로 서비스의 기능이나 용도 또는 특징에 대한 설명 등의 경우
  • 절차(Procedure) : 시스템을 사용하기 위해 사용자가 수행해야 하는 순차적인 행위를 지정해 주는 자료. 최근 동영상으로 보여 중므로써 사용자의 이해를 높이고자 하는 추세
  • 원리(Principle) : 특정 아이템의 구체적 작동 원리 및 진행 과정에 대한 자료를 의미
  • 원칙(Rule) : 시스템이 사용자에게 제시하는 일종의 가이드라인의 개념. 사용자가 준수할 행동 요령에 대한 내용 등. 직접 요구하는 형식 혹은 간접적인 형식(성공사례등을 제공)
  • 이야기(Story): 실제 있었거나 만들어 낸 특정 경험을 의미. 공개되는 블로그나 개인 홈페이지와 같은 유형의 자료는 비공식적이며 무료로 제공, 생산주체와 소비 주체가 같다는 특징을 가진다.
  • 의견(Opinion):어떤 대상이나 사안에 대해 사용자가 가지고 있는 개인적인 생각. 인터넷을 통해 양방향성이 증가하면서 확산된 자료의 유형
  • 묘사(Description) : 특정 대상의 현재 상태를 여러 방식으로 표현하는 자료. 사용자의 감성과 개인적인 취향, 주관적인 선호도에 자료의 가치가 좌우
  • 예측(Forecast) : 기초 데이터를 수집하여 확률이나 통계와 같은 추가적인 분석을 거쳐 향후 추세를 예상하는 자료. 부가 정보
  • 메타데이터(Meta-Data) : 구조화된 데이터로 다른 데이터를 설명해주는 데이터. 정보의 위치와 내용, 작성자에 대한 정보르 ㄹ담고 있으며, 주로 정보를 표현하기 위한 목적과 빨리 찾기 위한 목적으로 사용.

저작권

  • 소설, 시, 음악, 미술 작품과 같은 저작물을 창작한 저작자의 권리
  • 저작자의 허락 없이 다른 사람이 저작물을 이용할 수 없게 하는 배타적 권리
  • 사실을 그대로 기록한 것은 저작원의 보호를 받지 못한다.
  • 독창적이라 하더라도 글이나 그림, 음악 등으로 표현된 사상이나 감정만 저작권의 보호를 받을 수 있다.

좋은 디자인 조건

대다수의 사람들이 동의하는 가장 기본적인 디자인의 요건은 기능에 충실하게 만을어져 소비자의 필요와 미학적 요구를 동시에 충족시키는 것이다

  1. 좋은 디자인은 혁신적이다.
  2. 좋은 디자인은 제품을 유용하게 만든다.
  3. 좋은 디자인은 심미적이다.
  4. 좋은 디자인은 제품을 이해될 수 있게 만든다.
  5. 좋은 디자인은 요란하지 않는다.
  6. 좋은 디자인은 정직하다.
  7. 좋은 디자인은 오랜 삶을 가지고 있다.
  8. 좋은 디자인은 마지막 디테일까지 철저하다.
  9. 좋은 디자인은 환경 친화적이다.
  10. 좋은 디자인은 가능한 최소한의 디자인이다.








훈련일 2017. 07. 10 (월)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 디자인)제작
능력단위명 프로토타입 제작
능력단위요소 기초데이타 수집하기
이름 최보윤




훈련일 2017. 07. 11 (화)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 디자인)제작
능력단위명 프로토타입 제작
능력단위요소 아이디어 스케치하기(0802010403_13v1.2)
이름 최보윤

시각화의 정의

일반적으론 '대뇌에서 시각적 이미지를 만드는 것'의 의미로 사용되나, 정보 사회에서는 '정보의 구성 요소인 데이터나 콘셉트의 그래픽적 표현'이라는 의미를 갖는다. '설계하는 이미지가 아닌, 의사 결정을 돕기 위한 외부적 인공물'로 범위 확대

  1. 시각화는 거대한 양의 데이터를 이해하기 쉽게 하는 능력이 있다
  2. 시각화는 예측되지 못한 갑작스러운 속성의 인지를 가능하게 해준다.
  3. 데이터 자체가 가지고 있는 결함 등을 빠르고 분명하게 나타내 준다
  4. 시각화하는 큰 크기의 데이터 특징을 이해할 수 있도록 돕는다.
  5. 시각화는 가설을 형성하는데 도움을 주낟.

시각화의 단계

  • 1단계 : 에스키스(Esquisse)- 자신의 구을 간략하고 빠르게 그리는 단계. 개념산의 문제 검토 후 최종그림의 토대를 세움
    1. 최선의 해결책에 접근할 수 있을 때까지 많은 그림을 그릴 수 있다.
    2. 수시로 자신의 아이디어를 검토
    3. 최종 그림의 결과를 어느 정도 예측 가능
    4. 중요도에 따라 순서 정렬가능
  • 2단계 : 덮어놓고 그리기 - 1단계 그림을 정리해 나가는 과정.
    잘못된 그림을 수정하는 단계. 1단계로 다시 피드백을 할 수도 있다
  • 3단계: 정리 - 보는 사람의 입장을 고려하는 단계. 고안된 디자인이 클라이언트의 입장을 충분히 반영되어야 한다.
  • 4단계 완성 - 명암, 반영, 채색 등을 통하여 아이디어 표현을 극대화

레이아웃 형식화 디자인 과정 4가지

  1. 형태적 요소 : 레이아웃의 척추를 만드는 일. 대칭적 균형, 비대칭적 균형, 원심적 균형, 결정 구조적 균형 등 네 가지로 나뉜다.
  2. 초점선 : 레이아웃의 균형을 바탕으로 선들을 그어, 의도적으로 초점과 강조를 결정하고, 지원 초점들을 따라 시각 방향을 연구한다.
  3. 구성 막대 : 초점과 지원 초점을 연결하는 시각 방향에 맞추어 구성 막대를 사용한 레이아웃에 대한 시각적 감성을 결정. 구성 막대의 좌측 끝에는 '조용함', 우측 끝에는 '활기참' 등. 구성 막대에 의한 조건에 대한가치는 모양, 굵기, 여백, 각도로 표현 가능
  4. 시각 계층 막대 : 시각적인 요소의 중요성을 지시 대상과 함축 대상을 중심으로 진행. 한 개 이상 만들 수 있으며 막대마다 시각적 요소를 구분한다. 시각 계측 망대는 수직으로 표현. 막대의 위쪽은 지시 대상을 표현하고 아래부분은 함축 대상을 표현한다.




훈련일 2017. 07. 12 (수)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 디자인)제작
능력단위명 프로토타입 제작
능력단위요소 아이디어 스케치하기(0802010403_13v1.2)
이름 최보윤

그리드 시스템 개념

페이지를 구성하는 정보를 의미있고 논리적으로 일관성있게 구성하는 것을 중요시하는 그래픽 디자이너에게 도움을 주는 정밀한 프레임워크(구조, 체제)

그래픽 소프트웨어의 종류와 특징

  • 페인팅과 드로잉 : 일러스트레이터, 코렐 페인터, 하버드 그래픽스
  • 이미지 편집 : 포토샵, 코럴 포토페인트, 페인트샵
  • 사운드 편집 : 골드웨이브, 오디션
  • 3D 그래픽 소프트웨어 : 3D 맥스, 트루 스페이스, 소프트이미지 3D, 마야
  • MIDI 소프트 웨어 : cakewalk, Nuendo, Sonar
  • 애니메이션 편집 : 3Ds max, 플래쉬, 마야
  • 비디오 영화 제작 : 프리미어, 파이널컷, 베가스, 윈도우무비메이커, 에프터 이펙트

웹 디자인에서의 컬러 활용 방법

216웹 안전색(216 Web Safety color)은 환경이 달라지더라도 변하지 않는 안전한 색으로 이루어진 팔레트.

  • 단색 이미지 공간 : 색상(Hue) 보다는 색조(Tone) /
    1. 선명한 색조 : 부드럽고 동적인 이미지
    2. 어두운 톤 : 딱딱한 이미지
    3. 수수한 톤 : 동적이고 딱딱한 이미지
    4. 부드러운 톤 : 부드럽고 정적인 이미지
  • 배색 이미지 공간 : 은은하고 부드러운 느낌의 배색 : 부드럽고 정적인 이미지에 위치. 밝고 선명한 느낌의 배색 : 부드럽고 동적인 이미지
  • 배색




훈련일 2017. 07. 13 (목)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 디자인)제작
능력단위명 프로토타입 제작
능력단위요소 아이디어 스케치하기(0802010403_13v1.2)
이름 최보윤

그리드 시스템 샘플 이미지

배색



훈련일 2017. 07. 14 (금)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 디자인)제작
능력단위명 프로토타입 제작
능력단위요소 아이디어 스케치하기(0802010403_13v1.2)
이름 최보윤

그리드 시스템을 이용한 디자인 작업

배색



훈련일 2017. 07. 17(월)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인) 제작
능력단위명 프로토타입 제작
능력단위요소 프로토타입 제작하기
이름 최보윤

레이아웃 연습

이미지의 형식과 종류 정리

  • psd : 포토샵의 기본 포맷 방식. 이미지의 레이어, 채널, 패스, 등으로 작업한 정보를 저장. 수정, 보완 재사용이 가능. 용량이 커지는 단점
  • bmp: 비트맵 이미지의 대표적 파일 형식. 입출력 속도는 빠르지만 압축하지 않은 상태로 저장
  • gif : 웹으 표준 그래픽 포맷. 8비트의 256색상까지 표현. 투명한 배경, 동영상 이미지 제작 가능
  • eps : 인쇄 등 출력을 위한 포맷 방식. 포스트 스크립트 언어 기반
  • pdf : 포스트 스크립트의 한 변형. 문서를 이미지로 보여주는 파일 형식. 용량이 적고 호환성이 뛰어남
  • png : gif나 jpg보다 압축률이 좋음, 투명한 배경 저장 가능
  • tiff : 대부분의 이미지 모드 지원, 윈도 및 맥 환경에서 공통으로 사용할 수 있는 호환성
  • jpeg: 웹페이지를 제작할 때 많이 사용하는 이미지 파일 형식. 24비트 색상 지원. 이미지 손실 소.
이미지 표현 방식 비트맵 이미지(레스터) 벡터 이미지(포스트 스크립트)
파일포맷 jpeg, bmp, tiff, gif, png ai, pict, cdr
프로그램 포토샵, 페인트샵 프로 일러스트레이터, 코렐드로

영상 파일의 종류 정리

  • mpeg : 'moving picture exports group'의 약자. 국제 표준 영상 파일. .mpg확장자로 표시. 일반적인 동영상 파일을 고압축하여 파일의 크기를 획기적으로 줄여 놓은 것. 화질도 높다.
  • avi : 소리와 영상이 번갈아 기록된다는 뜻. 압축률이 높지 않아 파일 크기가 크다. 압축 코덱으로 파일크기를 줄일 수 있다.
  • mov : 맥의 표준으로 사용되는 동영상 파일
  • asf : 통신망에서 실시간으로 멀티미디어 서비스를 받는데 최적화. 소리 파일로도 쓰일 수 있다. 영상, 소리, 그림, url, 응용프로그램까지 가능
  • divx : MS사가 스트리밍용으로 만든 것. 영상을 줄이고 mp3를 써서 소리트랙을 줄였으나, 화질이나 소리는 mpeg4와 같음.

소리 파일의 종류 정리

  • wav : 원도 운영 체제의 기본 소리 파일 형식. 파일 크기가 매우 커서 효과음, 편집, 음악 CD 제작에 쓰임
  • mp3 : 사람이 들을 수 있는 신호만 모아서 압축하여 약 1/60크기로 줄였으며, 스테레오 음악용.
  • ogg : mp3의 유료화에 밪ㄴ대하여 만들어진 공개되 ㄴ소리 파일 형식. 가변 비트 레이트를 써서 크기를 줄이고, 중저음을 살림
  • ra : 인터넷에서 처음으로 스트리밍 기술을 활용한 소리 파일 형식
  • au : 선마이크로시스템즈 사에서 표준으로 채택한 파일 형식. 유닉스 운영 체제 환경과 자바 프로그래밍 언어에서 사용
  • midi : 컴퓨터 전자 악기, 전자 악기 사이의 정보 교환을 위한 규격. 소리를 내게 하는 명령이 들어 있다. 파일 크기가 매우 작으나, 사운드 카드와 스키퍼 수준에 따른 음질의 차이가 있음.




훈련일 2017. 07. 18(화)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인) 제작
능력단위명 프로토타입 제작
능력단위요소 프로토타입 제작하기
이름 최보윤

UI(User Interface)

  • 사람이 사용자가 되어 어떠한 사물이나 기계 장치, 컴퓨터 프로그램 등과 의사소통을 하려는 목적으로 만들어진 물리적 또는 가상적 매개체
  • 사용자가 사물을 조작하는 입력 시스템 / 사용자의 입력에 반응하여 결과를 보여주는 출력 시스템
  • 목표 : 효율적으로 입력하여 효과적으로 출력을 얻어 내는 것

UX(User Experience)

  • 사용자의 경험 : 제품을 사용하면서 내재화되는 모든 것을 의미. 경험. 느낌. 기억, 만족감 등
  • 사용자경험 디자인 : 사용자가 어떤 시스템, 제품, 서비스를 직.간접적으로 이요하면서 느끼고 생각하게 되는 총체적 경험
  • 단순한 기능 + 절차상의 만족 + 전반적인 지각 / 사용자가 참여, 사용, 관찰, 상호 교감을 통해서 알 수 있는 가치있는 경험
  • 개인이 마음속에 가지고 있는 주관적인 경험을 바탕, 제품과 사용자가 인터랙션을 하는 과정에서 발생.




훈련일 2017. 07. 19(화)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인) 제작
능력단위명 프로토타입 제작
능력단위요소 프로토타입 제작하기
이름 최보윤

프로토타이핑의 개념 및 목적

  1. 개념
    • 개발자들과 사용자의 의아소통상의 효과를 증진시키기 위하여 취하는 시스템 개발 기법
    • 개발자와 사용자 간의 상호 이해 및 지식 교환을 위한 작업으로 의사소통 도구
  2. 목적
    • 폐기 처분용 프로토 타입 : 오직 사용자의 요구 분석이 목적인 경우
    • quick and dirty 프로토타입 : 가급적 빨리 개발해야하는 경우. 4GL
    • 시험용 프로토 타입 : 상세 설계와 구현까지 마친 다음 대량 생산에 앞서 시험용으로 개발
    • 입출력의 사례를 보여줄 뿐 실제 데이터도 없고 절차 논리도 구현되지 않는 프로토 타입
    • 진화형 프로토 타입: 개발된 프로토타입을 계소 ㄱ진화시켜 최종적인 시스템으로 발전




훈련일 2017. 07. 20(수)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인) 제작
능력단위명 프로토타입 제작
능력단위요소 프로토타입 제작하기
이름 최보윤

웹 사이트 사용성 테스트의 개념

  • 사용자와 사용 환경을 고려하여 좀 더 쓰기 쉬운 제품 또는 웹사이트를 만들고자 연구하는 HSCI, UCD, MMI 등 다양한 연구 분야와 연관
  • 디자인이 잘못되거나 필수적인 기능이 결여되는 웹사이트들이 생겨나고 웹 사이트를 통해 업무 및 거래를 하게 되면서 인지적 문제를 해소하기 위한 연구가 진행.
  • 피실험자의 수해엵을 측정, 피실험자의 멘탈 모델 조사, 전문가가 적절한 척도를 사용해 사용성 관련 문제점을 발견하는 등 웹사이트의인지적 문제점을 발견하고 개선하는 방복적인 과정.

사용자 조사 방법론의 구분

통계적인 조사, 직접 인터뷰 수행, 그룹을 모아 토론을 진행 등

  • 사용자의 행동을 측정하는 방법: 다양한 측정장비를 통해 이루어진다. 마우스의 이동과 클릭 상황, 페이지에 머무른 시간 등을 측정. 혹은 시선 추적 장치를 이용하여 사용자의 시선 이동을 측정. 혹은 사이트의 로그를 기록하여 다수의 사용자에 대한 특성을 파악하고 그들의 행동패턴을 분석할 수있다.
    1. 정석적 방법 : 사용자들의 행둉을 내용에 대해서 질적으로 분석하는 방법

      가설 정보를 확보하고, 그것을 이용하여 정량 조사를 실시할 수 있다.

    2. 정량적인 방법: 그들의 행동 수치를 이용하여 양적으로 분석하는 방법

      구조화된 설문을 이용하여 조사를 진행한다.

  • 사용자의 태도를 이용하는 방법 : 그들에게 질문을 해고 대답을 듣기 위해 설문조사와 포커스 그룹등의 조사방법을 사용. 주로 마케팅 부서에서 익숙한 방법론.

사용자 조사 방법론의 종류

  1. 1사분면 : 정량적 조사 방법. 사용자 행동에 대해 간접적으로 분석하는 방법론. 웹 로그 분석과 A/B테스트, 사용자 패널에 대한 조사 등.
  2. 2사분면 : 사용자의 행동을 직접 조사하는 방법. 유저빌리티 테스트, 아이트래킹, 유저빌리티 벤치마킹 등으로 사용자의 행동을 분석하고 그것의 의미를 파악
  3. 3사분면 : 사용자의 태도르 ㄹ직접 조사한느 방법. 사용자 인터뷰와 포커스 그룹을 비록하여 참여 디자인, 그룹 작업 조사, 요구 사항 조사, 다이어리 카메라 조사 등
  4. 4사분면 : 사용자의 태도를 간접적으로 조사하는 방법. 사용자 설문과 고객지원 자료 분석 등
  5. 2,3사분면과 3,4 사분면 : 혼합 형태. 사용자의 태도와행동을 직접 조사하는 방법. 필드스터디 등이 있다. 3,4분면의 혼합형태로 사용자의 태도에 대한 전반적인 조사를 수행하는 방법으로는 카드 소팅이 있다.




훈련일 2017. 07.21(금)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)기본
능력단위명 프로토 타입 제작
능력단위요소 사용성 테스트하기 (0802010403_13v1.4)
이름 최보윤

목표 사용자에 대한 이해도를 높이기 위한 방법

  1. 네티즌 이해 : 보편적인 네티즌의 경향성에 대해 이해. 수치로 드러난 조사 자료를 바탕으로 사이트의 목표 대상이 될 사용자에 대해 특성을 정리할 수 있다.
  2. 트렌드 : 디지털 문화, 온라인 공간, 웹사이트, 소비자 라이프 스타일 등의 트랜드의 정보
  3. 소비자 심리 : 웹 사이트를 이용할 때 기본적인 이용 경험이나 요구 사항이 충족되어야만 그 다음 욕구 단계로 이동한다. 따라서 소비자의 경험 욕구를 다루는 이론이나 최근 소비자 동향 조사 자료 등을 살펴보는 것이 도움.
  4. 벤치마킹 : 목표 대상이 비슷한 사이트들에서 사용자 분석과 이해의 단서를 서치. 타사이트에서는 어떻게 접근하고 어떤 효과를 얻었는지에 대한 정보,
  5. 포커스 그룹 인터뷰 : 만들고자 하는 사이트의 모굪 사용자를 명확하게 정리. 구체적인 이미지를 가진 실체들을 먼저 가려내고, 그들에게 무엇을 어떻게 물어볼 것인지 정리.




훈련일 2017. 07.24(월)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)기본
능력단위명 디자인 구성요소 제작
능력단위요소 스토리보드 제작하기(0802010403_13v1.4)
이름 최보윤

정보의 설계

  • 기획 공학, 접오 디자인, 유저 인터페이스, 그래픽 디자인, 컴퓨터 그래픽 운영 등 필요 지식을 기반으로 정보를 계층화하고 설계해야 한다.
    1. 웹 사이트의 정보 구조 이해
    2. 정보 내비게이션 구조의 이해 및 분석 능력
    3. 웹 사이트 구축에 대한 제반 기능의 이해와 사용 툴의 운용 능력 보유
  • 정보 성계란, 웹 사이트 및 디지털 디바이스 기반의 사용자에게 정보를 정확하고 원활하게 제공하기 위해 정보 체계를 세우고 설계
    1. 정보 체계와 정보의 구조화 (웹 사이트의 정보 구조화와 메뉴 구조화)
    2. 내비게이션
    3. 레이블링, 정보 색인, 검색 등




훈련일 2017. 07.25(화)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)기본
능력단위명 디자인 구성요소 제작
능력단위요소 스토리보드 제작하기(0802010403_13v1.4)
이름 최보윤

와이어 프레임

  • 프레임이란 최종적으로 화면에 표시될 구성, 정보 체계, 기능, 콘텐츠를 요약하여 보여 주는 것
  • 색상, 타이포 그래피, 이미지 등의 정보를 최소화하여 도식, 청사진, 프로토 타입의 형식으로 보여주는 것을 의미
  • 자신의 생각을 시각화하여 보여주게 된다.
  • 그래픽 요소나 시각적 요소의 표현보다는 계층 요소의 구현을 중심으로 표현




훈련일 2017. 07.26(수)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)기본
능력단위명 디자인 구성요소 제작
능력단위요소 스토리보드 제작하기(0802010403_13v1.4)
이름 최보윤

스토리보드의 구성

  • 화면의 구성에 대한 아이디어 스케치
  • 화면에 대한 정의, 기능 정의, 서비스 흐름도의 역할
  • 웹 제작 전체의 프레르상에서 실제 제작의 전 단계. 요구 분석, IA작성, 서비스 흐름도 작성 후 최종 문서가 된다.
  1. 표지, 개정 이력, 화면 설계, 서비스 흐름도의 구성
  2. 프레임의 사용 여부와 메뉴의 구성 위치, 콘텐츠의 위치 등 전체적인 화면 구성을 보여주어야 하며, 디자인 요소 중 페이지 구성이 아주 중요한 부분을 차지한다.
  3. 페이지 정보를 요약. 저장할 디렉터리, 파일 이름, 페이지명 등을 메모하며 작성
  4. 링크 정보를 정리하여 작성.
  5. 프로그램 요소를 기재. 스크립트 기능, ASP나 PHP등의 프로그램과 그 기능을 작성.




훈련일 2017. 07.27(목)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)기본
능력단위명 디자인 구성요소 제작
능력단위요소 스토리보드 제작하기(0802010403_13v1.4)
이름 최보윤

스토리 보드의 화면 설계

  • 제작자의 의도가 정확하게 전달될 수 있도록 자세하게 설계하는 것이 중요
  • 페이지에 노출되는 정보 등 주요한 구성 요소가 표현
  • 각 페이지의 구성 요소에 대해 설명해야 하며, 다양한 기능 및 콘텐츠 등의 상세한 정보야, 자세한 설명을 위해 별도의 서비스 프로세스 페이지가 필요.




훈련일 2017. 07.28(금)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)기본
능력단위명 디자인 구성요소 제작
능력단위요소 스토리보드 제작하기(0802010403_13v1.4)
이름 최보윤

프로토타입





훈련일 2017. 07.31(월)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)기본
능력단위명 디자인 구성요소 제작
능력단위요소 스토리보드 제작하기(0802010403_13v1.4)
이름 최보윤

웹 디자인 심미적 요소와 구성요소

인간은 시각에 의존하여 정보를 인식, 사고하며 행동한다. 따라서 정보의 구성에 시각 요소를 도입하는 것은 중요한 작업이다.

  1. 시각화
    • 정보의 의미와 상호 관계를 그래프, 이미지, 일러스트레이션, 색채, 타이포 그래피등의 그래픽 요소로 나타내는 것
    • 사용자들이 정보르 쉽게 찾고 이해하도록 시선을 안내하고 유도하는 작업
  2. 아이덴티티 디자인(Identity Design)
    • 인식이라는 관념적인 대상을 시각화하여 다양한 방식으로 표현해 이를 사용자에게 전달하는 종합적인 수단
    • 사용자가 기억하기 쉽고, 차별화되고, 영속성과 유연성을 포함시켜야 한다.
    • 기업이나 발주자가 추구하는 의미와 가치를 전달해야 한다.
    • 심벌마크, 로고, 컬러 등의 구성 요소를 갖는다

그리드 시스템 작업 이미지





훈련일 2017. 08.01(화)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)기본
능력단위명 디자인 구성요소 제작
능력단위요소 심미성 구성요소 제작하기(0802010403_13v1.4)
이름 최보윤

비주얼 콘셉트(visual Concept)

사용자에게 가치잇는 것이며 효용을 제공하는 것. 근보는 사용자의 니즈이며 콘텐츠의 창출은 서비스나 상품을 사고 싶다고 생각하게 하는 힘을 만드는 것. 또한 컨셉트를 도출하기 전에 사이트를 위한 정의를 한다.

  1. 웹 사이트의 성격(쇼핑몰, 커뮤니티, 동호회, 홍보 등)을 분류
  2. 웹 사이트의 사용자 분류 및 분석: 웹 사이트의 성공적인 완성을 위해 실제 사용장의 붕만자 분석을 통해 개발 전략을 수립하고 전개
    • 사이트 방문자의 성별, 연령별 비율을 통해 주요 이용자 성향 파악
    • 콘텐츠 이욜양에 따른 활성 콘텐츠와 비활성 콘텐츠 파악
    • 경쟁사 사이트의 콘텐츠 이용률을 파악하여 경쟁 우위 활성 콘텐츠와 비활성 우위 콘텐츠 상품 개발
    • 사이트 방문자의 연령 및 성별 분포를 파악하여 사용자 맞춤 마케팅 전개
  3. 웹 사이트 레이아웃 콘셉트




훈련일 2017. 08.02(수)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)기본
능력단위명 디자인 구성요소 제작
능력단위요소 사용성 구성요소 제작하기(0802010403_13v1.4)
이름 최보윤





훈련일 2017. 08.03(목)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)기본
능력단위명 디자인 구성요소 제작
능력단위요소 사용성 구성요소 제작하기(0802010403_13v1.4)
이름 최보윤

UI (user Interface)

  • UI란 사람이 사용자가 되어 어떠한 사물이나 기계 장치, 컴퓨터 프로그램 등과 의사소통 하려는 목적으로 만들어진 물리적 또는 가상적 매개체
  • 입력시스템(사용자가 사물을 조작) / 출력 시스템(사물ㅇ ㅣ사용자의 입력에 반응하여 결과를 보여줌)
  • 효율적으로 입력하여 효과적으로 출력을 얻어 내는 것이 목표

UI 구조화를 위한 원칙

  1. 메타포(metaphor): 메타포는 UI에서 사용자가 시스템이 어떻게 작용하는지 파악하고 동작할 수 있도록 하며, 시스템을 통해 사용자 학습의 양을 최소화하는 데 사용되는 유추적 모형
  2. 사용자 조정(User in Control): 사용자가 시스템을 따라가는 것이 아니라 스스로 시스템을 조정하는 것처럼 느끼도록 구성
  3. 직접 조작(Direct manipulation): 사용자가 동작을 진행하고, 동작에 대한 결과를 느낄 수 있도록 구성. 사용자에게 직접 조작의 인터페이스를 제공하면서 조작에 대한 피드백을 바로 제공하는 것
  4. 일관성(Consistency): UI의 일관성은 사용자가 습득할 지식을 더 빠르게 배울 수 있도록 해준다.사용할 때의 실수와 오동작을 최소화하며, 인터페이스를 친숙하게 한다.
  5. 피드백(Feedback): 사용자가 수행한 동작에 대한 시스템의 피드백을 통해 사용자와 시스템의 상호 작용을 형성하는 것. 일반적으로 시스템 응답 시간(Reaction time)은 시스템 성능의 중요한 요소
  6. 멘탈 모델(Mental Model): 사용자가 처음 보는 시스템을 접했을 때 기존의 작업과 비교, 유추하여 사용 가능하게 한다
  7. 내비게이션(Navigation): 콘텐츠, 메뉴 등의 사이 간의 이동, 버튼 간의 이동 편의를 제공.
  8. 외양: 사용된 폰트의 크기와 유형, 혹은 전체적인 느낌 등.




훈련일 2017. 08.04(금)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)기본
능력단위명 디자인 구성요소 제작
능력단위요소 사용성 구성요소 제작하기(0802010403_13v1.4)
이름 최보윤

콘텐츠 시각화의 목적

콘텐츠 시각화의 목적은 그림이나 도형, 사진 등 다양한 시각적 형상을 이용하여 정보를 사용자에게 명확하고 효과적으로 전달하는 것. 콘텐츠를 시각화할 때에는 다양한 아이디어를 미적 형태와 기능성을 고려하면서 직관적이고 효율적으로 표현해야 한다

콘텐츠 시각화의 단계

  1. 데이터의 수집 : 실제 사이트 내에 구성되어야 하는 다양한 데이터를 수집하여 종류별로 정리, 분석
  2. 연결 고리의 구성 : 나열되어 있는 다양한 정보들을 계층적으로 또는 평면적으로 구성, 이를 기준에 따라 연결할 연결 고리를 만든다.
  3. 사이트의 콘셉트와 주제 만들기: 데이터 내에 핵심 주제와 내용, 스토리텔링으로 내러티브를 제공하기 위한 주제를 만든다.
  4. 문제점의 파악 : 기술적 요소와 그래픽적 요소의 문제점을 파악하고, 이를 해결하기 위한 툴을 선택
  5. 포맷의 선택 : 각 그래픽 요소의 시각화를 위한 포맷을 선택. 이때 효율성을 극대화하기 위한 다양한 그래픽 소스의 포맷과 툴이 결정.
  6. 시각적 접근 방법의 선택 : 콘텐츠를 시각화하는 방법은 크게 데이터를 차트나 그래프의 형태로 제작하는 방법과 일러스트와 메타포를 이용하여 표현하는 방법으로 나뉜다.
  7. 정제(Filtering)와 테스트(Test) : 작업 과정의 중복과 과잉 표현, 무거운 실행 파일 등 원래의목적에 부합하지 않는 결과물의 도출을 피하기 위해 정제 과정을 통해 정리, 이를 테스트하여 결과에 근접하는 모형을 만든다. 이 과정을 지속적으로 반복하고 검증하여 완성도를 높인다.

UX(user Experience)

  • 제품을 사용하면서 내재화되는 모든 것을 의미. 경험, 느낌, 기억, 만족감 등
  • 사용자 경험을 디자인하는 사용자 경험 디자인이란, 사용자가 어떤 시스템, 제품, 서비스를 직·간접적으로 이용하면서 느끼고 생각하게 되는 총체적 경험
  • 사용자가 참여, 사용, 관찰하고, 상호 교감을 통해서 알 수 있는 가치 있는 경험
  • 관련 키워드
    1. 리서치(Research)
    2. 사용성(Usability)
    3. 정보 설계(Information Architecture)
    4. 인터렉션 디자인(Interaction Design)
    5. 비주얼 디자인(Visual Design)
    6. 콘텐츠 (Content)

UX 분석을 위한 FGI

  1. FGI(Focus Group Interview) : FGI는 정성적 조사의 대표적 방법 중 하나, 집단 심층 면접 조사 또는 표적 집단 면접 조사라 한다. 다. FGI는 특정 목적을 위해서 준비한 주제로 그 목적에 따라 모인 소수(5-8인) 그룹을 인터뷰하여 집단 반응과 개인 반응 등을 통합해 분석하여 가설을 추출하고 검증하는 등 목적에 따라서 대상을 관찰하고 분석하는 방법
  2. FGI의 목적 : FGI의 목적은 포커스 그룹의 인터뷰 과정에서 조사 목적과 관련된 유용한 정보를 얻거나 공식적인 설문 조사에서 기대하지 못한 결과를 발견하는 것
  3. FGI의 장점: FGI의 장점은 통제되고 있는 집단을 설정하여 집단적 토론 방식의 결과를 도출함으로써 다양한 의견과 심화된 내용을 만들어 낼 수 있고, 표적 집단의 동질성으로 편안하게 의견을 개진할 수 있다는 것
  4. FGI의 단점 : FGI의 단점은 여러 사람을 모아서 진행하기 때문에 사람들이 상식적인 방향으로만 의견을 말하는 경향이 있어, 개인의 성격이나 사회적 통념에 부합하지 않는 내용은 믿을 만한 결과를 도출하기 어렵다는 것. 사회자의 원활한 진행 기술이 필요하기 때문에, 결과가 사회자의 능력에 따라 달라질 수 있어 결과의 체계적인 분석과 해석이 어려운 것도 FGI의 단점 중 하나




훈련일 2017. 08. 07(월)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인) 제작
능력단위명 디자인 구성요소 제작
능력단위요소 매체성 구성요소 제작하기(0802010404_13v1.4)
이름 최보윤

매체별 특성 분석

  1. 웹(web) : 하나의 사이트와 다른 사이트의 관계가 거미집처럼 복잡하게 얽혀 있기 때문에 붙여진 이름. 월드 와이드 웹(www)을 지칭하며, HTTP 통신 프로토콜 을 사용하여 전송과 수신을 한다.
    • 문자, 소리, 그림, 동영상을 통해 정보를 전달
    • 하이퍼 링크: 관련된 정보를 서로 연결
    • 웹 문서를 구성하는 기본 언어는 HTTP(Hypertext markup language)
  2. 모바일(Mobile) : 이동성이 있는 IT 기기들을 총칭/ 휴대용 정보 단말기 자체를 모바일이라 고 하기도 한다.
    • 폰(Phone): 스마트폰을 통한 모바일성이 크게 확대되고 있어 콘텐츠의 활용이 급증. 운영 체제에 따라 IOS 기반의 iPhone과 Android 기반의 폰 계열로 나눌 수 있다.
      상시성, All in One 디바이스, 즉시 접속성, 실시간 성 등의 특징이 있다.
    • 태블릿(Tablet)PC: 모바일폰과 노트북 및 컴퓨터의 중간 단계의 기기로 통신과 인터넷 검색이 가능한 대형 PDA로 볼 수 있으며 스마트 패드(Smart Pad)라고도 한다. 물류나 POS, 기업 Network 등 다양한 분야에 적용 가능한 장비
      휴대가 용이 / 입력 장치 없이 쉽게 조작/상시 전원상태 / 화면이 크다 / 대용량 데이터 처리가능 / 직관적인 인터페이스 등
  3. 키오스크(KIOSK) : 옥외에 설치된 대형 천막이나 현관을 의미하는 터키 어에서 유래. 공공장소에 설치된 무인 단말기를 의미하기도 한다. 멀티미디어 스테이션(Multimedia Station), 셀프서비스 스테이션(Self Service Station)의 역할을 하며, 터치스크린과 키보드 입력 장치를 가지고 있다

웹 표준

웹 표준의 ‘웹’은‘월드 와이드 웹(www: World Wide Web)’의 줄임말

월드 와이드 웹은 데이터와 정보를 표시하고 연결하며 공유, 교환하는 방법

일반적 의미로 웹 표준은 W3C(World Web Consortium), ECMA(European Computer Manufacturers Association) International, IETF(The Internet Engineering Task Force), OASIS(Organization for the Advancement of Structured Information Standard)와 같은 표준화 기구에서 승인한 개방형 인터넷 표준을 말한다.

주요 웹 브라우저 특징

  1. 인터넷 익스플로러(Internet Explorer : IE)
    • 인터넷 익스플로러는 마이크로소프트사 에서 개발한 웹 브라우저로, 1995년에 마이크로소프트 윈도 운영 체제에 이 소프트웨어를 기본으로 포함하기 시작하면서, 사용자가 급격히 증가
    • 우리나라에서는 인터넷 익스플로러의 의존도가 상대적으로 높다. 이는 온라인 뱅킹 호환성 문제와 더불어 우리나라의 웹 사이트 개발자 대다수가 여러 웹 브라우저와 운영 체제들의 호환성을 고려하지 않고 현재 마이크로소프트사도 사용을 권장하고 있지 않는 ActiveX를 무리하게 채용하고 있기 때문
  2. 모질라(Mozilla) 계열 파이어폭스 :모질라 파이어폭스(Mozilla Firefox)는 모질라 재단과 모질라 코퍼레이션이 개발한 자유 소프트웨어 웹 브라우저로 윈도, 리눅스, 맥 OS X, 그리고 안드로이드에서 실행 가능
  3. 오페라
    • 오페라는 노르웨이의 오페라 소프트웨어가 개발하고 있으며, 핵심 레이아웃 엔진("프레스토”)은 어도비 같은 협력 사업자들에게서 라이선스를 받았고, 어도비 크리에이티브 스위트에 통합되어 있다
    • 오페라는 스마트폰과 PDA를 위한 브라우저 분야에서 그들의 스몰 스크린 렌더링(Small Screen Rendering) 기술로 시장을 선도
    • 다양한 기능을 기본적으로탑재하고 있으면서도 같은 종류의 다른 소프트웨어에 비해 작고 가벼우며, 페이지의 렌더링 속도가 빠르다
  4. 사파리(Safari)
    • 사파리는 애플사가 개발한 웹 브라우저
    • 아이튠즈와 유사한 북마크 관리 체계를 가지고 있고, 애플의 퀵타임 멀티미디어 기술과 통합되어 있으며, 탭 브라우징 인터페이스
  5. 크롬(Chrome)
    • 구글(Google)의 크롬(Chrome)은 웹키트 레이아웃 엔진을 이용하여 개발 중인 프리웨어 웹 브라우저
    • 단하고 효율적인 사용자 인터페이스를 제공하며, 현존하는 다른 웹 브라우저들에 비해 향상된 안정성과 속도, 그리고 보안성을 갖는 것을 목표




훈련일 2017. 08. 08(화)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인) 제작
능력단위명 디자인 구성요소 제작
능력단위요소 매체성 구성요소 제작하기(0802010404_13v1.4)
이름 최보윤

웹 표준 사이트

웹 표준 지침서

  1. 인식의 용이성(Perceivable)
    • 적절한 대체 텍스트 제공
    • 멀티미디어 대체 수단 : 자막을 제공한다
    • 명료성 : 색에 무관한 콘텐츠, 명확한 지시사용, 텍스트 콘텐츠의 명도대비, 자동 재생 금지, 콘텐츠 간의 구분 등
  2. 운용이 용이성(Operable)
    • 입력장치 접근성 : 키보드 사용 보장, 초점 이동, 사용자의 조작 가능 등
    • 충분한 시간 제공 : 응답시간 조절, 정지 기능 제공
    • 광과민성 발작 예방 : 초당 3~50주기로 번쩍이는 콘텐츠를 제공하지 말아야 한다
    • 쉬운 네비게이션 : 반복 영역 건너 뛰기, 제목 제공, 적절한 링크 사용 등
  3. 이해의 용이성(Understandable)
    • 가독성 : 기본 언어 명시
    • 예측가능성 : 사용자 요구에 따른 실행
    • 콘텐츠의 논리성 : 콘텐츠의 선형 구조-논리적인 순서로 제공, 표의 구성-이해하기 쉽게 구성- 등
    • 입력 도움 : 레이블 제공, 오류 정정 등
  4. 견고성(Robust)
    • 문법 준수 : 마크업 오류 방지
    • 웹 애플리케이션 접근성 : 접근성 준수




훈련일 2017. 08. 09(수)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인) 프로젝트 제작
능력단위명 구현
능력단위요소 콘텐츠 구성하기(0802010405_13v1.1)
이름 최보윤

멀티미디어 개요 및 특성

  1. 개요
    • 텍스트(문자), 그래픽(이미지), 애니메이션(만화, 게임), 사운드(음향, 음성, 효과음) 등의 다양한 매체를 두 가지 이상 복합적으로 사용하여 제작된 디지털 콘텐츠
    • 시간과 공간의 제약 없이 사용자가 특정 시스템을 통해서 상호 작용하면서 정보를 얻을 수 있다.
  2. 특성
    • 디지털화(Digitalization): 컴퓨터 시스템으로 제작되고 사용된다.
    • 상호 작용(Interaction): 사용자와 대화할 수 있다.
    • 비선형성(Non-Linear): 어느 시점이든 접근 가능하
    • 통합성(Composition): 미디어를 통합할 수 있다.

멀티미디어 콘텐츠 개요 및 특성

  1. 콘텐츠 개요
    • 아날로그 미디어 대비 신개념 뉴미디어의 개념
    • 사이버 공간에서의 상호 작용을 활성화 하기 위해 정보를 실시간으로 교류하는 장
    • - 표현의 가능성과 상호 작용
    • - 복합적 미디어의 표현으로 구체적인 정보를 제공
    • - 내용과 거래, 서비스가 내재된 신개념 콘텐츠
  2. 특성
    • 정보 수용자의 개념 변화
    • 선형 패러다임의 변화
    • 정보 확장의 전환
    • 시․공간 경계의 전환
    • 개별 미디어 통합의 전환




훈련일 2017. 08. 10(수)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인) 프로젝트 제작
능력단위명 구현
능력단위요소 콘텐츠 구성하기(0802010405_13v1.1)
이름 최보윤

스토리보드 작성 규칙 및 예시

프로젝트 명 사이트명 또는 사이트 URL
작성자 해당 페이지 스토리보드 작성자의 소속 부서와 성명
페이지 번호 스토리보드의 분실을 막고, 화면 전환 표시로 사용
화면 ID 화면을 저장할 파일명
화면 주제 화면의 내용, 용도를 쉽게 알 수 있도록 이름 기입
화면 경로 홈 화면에서부터 현재 위치를 나타내는 경로
화면 구성 화면의 내용과 구성을 시각적으로 쉽게 이해하도록 스케치
화면 설명 상호 작용 구성 요소를 구체적으로 설명
- 기능, 내비게이션 버튼, 멀티미디어 효과, 사운드 효과
F/C와 Logic 업데이트 및 수정 가능하게 폴더 경로를 자세하게 표시
첨부 사항 내용이 많은 텍스트는 출력하여 첨부




훈련일 2017. 08. 16(수)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인) 프로젝트 제작
능력단위명 구현
능력단위요소 기능요소 구성하기(0802010405_13v1.1)
이름 최보윤

멀티미디어 제작 프로세서 및 저작도구

제작 프로세서

멀티미디어 저작은 문자, 그림, 소리, 동영상 등의 파일을 각각 제작한 후에 이들을 하나의 완성된 내용물로 결합하는 것. 멀티미디어 저작을 하기 위해서는 전체를 구성하는 저작 도구와 멀티미디어 내용물 재생에 필요한 재생 도구, 내용물을 제작할 수 있는 소프트웨어가 필요

  1. 웹 콘텐츠를 생성하기 위한 명시적인 용도와 목적을 지닌 편집 도구: HTML과 XML 편집기
  2. 웹 형식으로 내용을 저장할 수 있는 옵션을 제공하는 도구: 워드 프로세서나 탁상 출판 패키지
  3. 문서를 웹 형식으로 변환하는 도구 : 탁상 출판 패키지의 고유 형식으로 저장된 문서를 HTML로 변환하는 필터
  4. 멀티미디어 제작 도구, 특히 웹에서 사용하는 멀티미디어를 저작하는 도구 : 동영상 제작 및 편집 도구 모음, SMIL 저작 패키지

멀티미디어 저작 소프트웨어의 종류

  1. 저작 도구의 형식에 따른 분류
    • 통합 저작 도구 : 저작 도구 내에서 타이틀에 포함되는 다양한 미디어 데이터들 간의 상호 작용 설정과 미디어 데이터 자체의 제작을 가능하게 하는 저작 도구이다. 플래시, 다빈치애니메이터 등
    • 개별 저작 도구 : 전문성 있는 각각의 미디어 편집 소프트웨어를 이용해 미디어 데이터를 제작하고, 이를 통합할 수 있는 저작 도구를 이용하여 만드는 형식으로 오소웨어, 툴북, 앙코르등
  2. 저장 방식에 따른 분류(저작 도구의 메타포)
    • 흐름도 방식(Icon-based 또는 Flowchart형): 각 미디어를 제어할 수 있는 다양한 기능의 아이콘 팔레트와 미디어가 동작하는 순서를 의미하는 아이콘들을 연결하는 흐름선을 이용해 각 아이콘에 파라미터를 지정하여 내용을 추가해 나가는 방식으로 프로그램을 작성하는 방식. 스크립트 언어를 사용하지 않아 작업 시간 단축에 효과적, 제한된 제어 구조 때문에 하이퍼미디어 형태에는 적합하지 않음. 제품 소개를 위한 슬라이드 쇼나 프레젠테이션 등에 적합. 오소웨어, 아이콘오소, 아트웨어 등이 있다.
    • 시간선 방식(Time-based 또는 Score형) : 각 미디어 요소와 이벤트들을 시간 축에 순차적으로 배치하여 시간의 흐름에 따라 미디어를 재생하는 방식. 미디어 간의 동기화 관계를 직관적으로 기술할 수 있어 상호 대화 방식의 동적인 시나리오 표현이 수월. 프레젠테이션이나 신제품 발표 타이틀 제작에 적합. 액션, 애니메이션 워크, 인터랙티브, 시네레이션, 미디어 빌츠, 프로듀서 등
    • 책 방식(Page-based 또는 Script형) : 저작 단위를 페이지 또는 카드와 같은 단위 요소로 구성하 여 링크를 사용하여 구현하는 방식. 스크립트 언어를 사용하며 제어와 내비게이션을 한다. 스크립트 언어 사용으로 방법적인 면에서 쉽지 않지만, 강력한 기능과 유연한 확장 제어 구조 제공
    • 웹 페이지 저작 도구로는 드림위버(Dreamweaver), 플래시(Flash), 고라이브(GoLive), 워드프레 스(Wordpress), 크로스에디터(CrossEditor), 엠비즈메이커(m-Bizmaker) 등이 있다.




훈련일 2017. 08. 17(목)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인) 프로젝트 제작
능력단위명 구현
능력단위요소 개발요소 협업하기(0802010405_13v1.3)
이름 최보윤

애니메이션 기법

디지털 애니메이션은 스크립트와 스토리보드를 통해 줄거리를 만들고, 이를 컴퓨터를 사용하여 배경과 등장인물을 제작한 후 합성하는 과정이다. 대부분 전통적 애니메이션의 원리를 컴퓨터에 적용하여 제작.

  1. 플립북 원리를 이용한 프레임 바이 프레임(Frame by frame) 기법 : 연속된 동작을 보여 주는 애니메이션으로, 단순한 애니메이션이나 2차원 게임에서 캐릭터의 움직임을 보여 줄 경우 사용
  2. 셀 애니메이션의 원리를 이용한 스프라이트(Sprite) 기법: 배경과 캐릭터를 별도의 레이어로 작업하는 방식으로, 디지털 애니메이션에서는 특히 캐릭터에 해당하는 용어가 스프라이트이다.
  3. 키 프레임 원리를 적용시킨 키 프레임 애니메이션:2개의 키 프레임(시간) 사이에 필요한 움직임이 자동으로 생성되는 트위닝(Tweening) 기법을 이용한 애니메이션
  4. 모핑(Morphing) 기법 :서로 다른 2개의 이미지를 특정 모습으로 서서히 변화시키는 기법이다.

동영상 파일 종류 및 정의

  • AVI(Audio Video Interleaved):오디오 데이터와 비디오 데이터가 내부적으로 번갈아 기록된다는 의미. 윈도에 포함되는 미디어 플레이어를 비롯하여 모든 동영상 플레이어에서 기본적으로 지원되는 대표적인 동영상 포맷
  • MPEG:영상과 오디오 압축에 관한 국제표준화기구(ISO)에서 제정한 형식
  • ASF(Advenced Streaming Format):다운로드와 동시에 재생이 가능한 방식으로 인터넷 방송, 동영상 강좌 등에 사용
  • WMV(Window Media Video):ASF 와 동일한 용도이나, MPEG4 v7 코덱을 사용하여 mp3와 음질이 비슷하지만 mp3보다 적은 용량이 사용
  • MOV:매킨토시의 퀵타임 무비에서 사용
  • MP4:MPEG 파일 규격의 한 종류로, 최근 휴대용 제품에서 자주 사용된다. 고화질을 유지하면서도 압축률이 큰 장점




훈련일 2017. 08. 18(금)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인) 프로젝트 제작
능력단위명 구현
능력단위요소 개발요소 협업하기(0802010405_13v1.3)
이름 최보윤

객체 지향 언어

하드웨어 기술의 발달에 비해 소프트웨어 기술의 발달이 미미하여 모든 애플리케이션의 성능이 저하되는 소프트웨어의 생산성 위기 때문에 생성. 위기에서 벗어나기 위한 자구책으로 코드의 재사용이라는 개념

  • 객체 지향의 기본 요소:객체와 클래스, 연산과 메소드(Operation & Method), 메시지(Message)
  • 객체 지향의 특성:상속성(Inheritance), 자료 추상화(Data Abstraction), 캡슐화(Encapsulation),다형성(Polymorphism), 관계성(Relationship)

멀티미디어 프로그램

  • MPC의 MME:‘Microsoft Multimedia Extensions’의 약자. MS-Windows를 위한 소프트웨어 성분과 서비스를 제공. 멀티미디어 개발자를 위한 API(Application Program Interface)를 지원하며, 다양한 미디어 타입에 대한 명세를 제공한다. MME의 멀티미디어 관련 파일로는 텍스트 파일, 이미지 파일, 오디오 파일, 비디오 파일, 구조화된 멀티미디어를 위한 파일
  • Visual C++: Microsoft사의 윈도 프로그래밍이 용이한 윈도 응용 개발 환경이라고 할 수 있다. 기존의 C와 Windows API를 이용한 윈도 프로그램에 비해 프로그램 개발 과정이 단순하고 시간도 짧아졌다.
  • Visual Basic:MicroSoft사가 개발한 프로그래밍 언어이자 그래픽 프로그래밍 환경을 제공하는 최초의 프로그램. 프로그래머가 대화상자나 버튼을 클릭함으로써 작업을 수행할 수 있으며, 점차 다른 프로그램의 표준이 되어 가고 있는 추세.
  • JAVA:Sun Microsystemsd의 고스링 팀이 개발한 객체 지향 프로그래밍 언어로, 다양한 장치 및 환경에서의 응용 프로그램 개발에 사용. 자바 언어는 단순하며 객체 지향적이고, 정적타입, 컴파일 방식, 하드웨어 플랫폼에서 독립적, 다중 스레드 방식, 소형 언어 등의 특징
  • ActionScript:타임라인을 이용한 애니메이션 무비에 상호 작용이 포함된 멀티미디어 애니메이션을 제작할 수 있도록 도와주는 언어, 마우스나 키보드를 누르는 등의 이벤트를 발생시키면 무비에 지정한 액션에 의해 실행되도록 지정
  • 웹 기반 멀티미디어 프로그래밍 서버 측 스크립트 언어 : CGI, ASP, ASP.NET, PHP, JSP, Python, Ruby 등 / 클라이언트 측 스크립트 언어: Javascript, VBScript, HTML, CSS, DHTML, SGML, XML, VRML,ActiveX




훈련일 2017. 08. 21(월)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인) 프로젝트 제작
능력단위명 구현
능력단위요소 개발요소 협업하기 (0802010405_13v1.3)
이름 최보윤




훈련일 2017. 08. 21(월)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인) 프로젝트 제작
능력단위명 수정보완
능력단위요소 심미적 디자인 요소 수정 보완하기 (0802010406_13v1.1)
이름 최보윤

협업과 정의와 구분

협업이란‘함께 일하는’또는‘협력하여 일하는 것’이라는 의미로 공동으로 작업을 수행하는 것을 가리키는 말. 디지털콘텐츠서비스를 위한 구현 단계에서 협업은, 콘텐츠 구성하기에 따라 개발진 간 작업 진행방식을 공유하며 분담과 공동 작업의 범위와 개발 방법을 정하여 구현을 수행하는 것을 말한다.





훈련일 2017. 08. 22(화)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인) 프로젝트 제작
능력단위명 수정보완
능력단위요소 심미적 디자인 요소 수정 보완하기 (0802010406_13v1.1)
이름 최보윤

디지털 산출물과 리뷰

프로젝트 수행 과정에서 팀원들 간의 원활한 커뮤니케이션, 의사 결정 및 기록 등을 통해 만들어지 는 결과물을 디자인 산출물이라 하며, 콘셉트, 내비게이션, 페이지 레이아웃, 아이콘 디자인, 폰트, 컬러, UI 구조 등의 디자인 구성 요소를 모두 포함한다

리뷰

리뷰는 결함(defects)을 찾는 작업, 대부분 목적한 작업을 통해 제작된 산출물을 시험하고, 그에 대한 논평을 하는 것
소프트웨어의 리뷰는 소프트웨어 작업 산출물(코드를 포함해서)을 테스트하는 방법. 요구 사항 문서, 디자인 명세, 테스트 케이스, 테스트 스크립트, 사용자 가이드, 웹 페이지를 포함한 모든 소프트웨어 작업 산출물이 대상이 될 수 있다. 리뷰는 전적으로 인력을 요하는 활동이지만, 도구를 이용하는 것 역시 가능하다. 초기에 리뷰를 통해 발견된 결함들 이 나중에 발견된 결함들보다 제거하는 비용이 적게 든다. 리뷰의 혜택은 초기의 결점 발견과 정정, 개발 생산성 향상, 개발 시간과 비용 절약, 테스팅 비용과 시간 절약, 결함의 감소와 커뮤니케이션의 증가를 포함한다.





훈련일 2017. 08. 23(수)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인) 프로젝트 제작
능력단위명 수정보완
능력단위요소 심미적 디자인 요소 수정 보완하기 (0802010406_13v1.1)
이름 최보윤

수정보완 작업의 우선순위

수정․보완 작업을 수행할 때 적용할 주관적인 등급을 말한다. 수정․보완 작업의 우선순위 등급은 일반적으로 아래와 같이 정한다.

  • 해당 항목을 해결하지 않으면 제품을 출시할 수 없으므로, 가능한 한 빨리 처리해야 한다.
  • 해당 항목을 해결하지 않으면 제품을 출시할 수 없지만, 즉시 처리하지 않아도 된다
  • 리소스, 시간 및 위험 정도를 기반으로 해당 항목의 작업 수행 시기를 선택적으로 결정할 수 있다




훈련일 2017. 08. 24(목)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인) 프로젝트 제작
능력단위명 수정보완
능력단위요소 심미적 디자인 요소 수정 보완하기 (0802010406_13v1.1)
이름 최보윤

배색

  • 두 가지 이상의 색상을 잘 어울리도록 배치하는 일로 이를 평가하는 기준은 사람마다 다를 수 있다
  • 색채 조화라는 개념이 정립되면서 보편적 원리나 법칙이 있을 것이라는 주장 아래, 그것을 밝히려는 연구가 진행되고 있다. 배색은 웹 디자인, 제품 디자인, 환경 디자인, 인테리어, 광고․포스터 등 다양한 분야에서 활용. 배색에 따라 그 느낌이 다양하게 나타난다.
  • 색채마다고유의 이미지나 성격을 지니고 있는데, 예를 들어 빨강은 정열, 열정, 화 등을 나타낸다. 하지만, 각 색이 지닌 이미지는 배색에 따라 온화하거나 여성스러운 느낌 혹은 무겁고 중후한 느낌 등 다양하게 변화할 수 있다.

색상 요소

  • 기조색(Base Color)일반적으로 배색 대상이 되는 색으로, 가장 큰 면적을 차지하는 색. 바탕색으로 많이 사용, 튀는 색보다는 무난한 색을 주로 쓴다.
  • 주조색(Dominant Color)기조색 다음으로 면적 비율이 큰 색으로, 보통 기조색을 보조하는 역할. 기조색과 동일, 유사, 대비, 보색 등의 관계를 나타내는데, 부차적 컬러라고도 한다
  • 강조색(Accent Color)배색 중에서 가장 작은 면적을 차지하지만 눈에 제일 띄는 포인트 컬러, 전체 색조를 마무리하거나 집중시키는 효과를 낸다.

색상에 의한 배색

  • 동일 색상 배색같은 색상이라도 명도나 채도 차이를 둔 배색. 명도나 채도의 변화를 주어 조화시켜야 통일감과 완성감을 느낄 수 있다(세련미, 친근감). 색의 차이가 너무 작을 경우 오히려 조화롭지 못한 배색이 되기도 한다
  • 유사 색상 배색색상환에서 색상의 차이가 근접하거나 유사한 배색.
    예를 들면, 빨강과 노랑․주황, 파랑과 남색과 같은 배색. 이는 친근하고 즐거운 느낌을 주며, 협조적이고 온화함, 상냥함을 느낄 수 있다.
    유사 색상 배색도 동일 색상 배색과 마찬가지로 명도나 채도의 변화를 통해서 조화시켜야한다. 보통 주조색에 의한 배색에 많이 활용.
  • 반대 색상 배식빨강과 청록, 노랑과 남색 등과 같이 색상환에서 거리가 멀거나 보색 관계에 있는 배색. 반대 색상의 배색은 화려하고 강한 느낌을 줌과 동시에 자극적이고 동적인 생동감을 느낄 수 있다. 채도와 면적의 변화를 통해 색을 조화시켜야 하며, 활동성이 높은 분야의 배색에 적합하다. 너무 지나치면 혼란스럽거나 복잡해 보일 수 있다.

명도에 의한 배색

  • 고명도 배색순색에 하양을 섞은 파스텔톤 색상의 배색. 고명도 배색은 밝고 귀여운 느낌을 주며, 여성스럽고 부드러운 이미지를 전달.
  • 중명도 배색회색과 같은 중간 명도를 가진 색, 즉 Dull톤 색들의 배색. 중명도 색끼리의 배색은 무난하 지만, 그 경계가 불분명하고 모호한 느낌.
  • 저명도 배색순색에 검정을 섞은 Dark톤 색상의 배색을 말한다. 저명도 색끼리의 배색은 어두우며 음침한 느낌
  • 명도 차가 큰 배색고명도 색과 저명도 색의 배색을 말한다. 명도 차가 크면 색들의 관계가 뚜렷하고 명쾌한 느낌

채도에 의한 배색

  • 고채도 배색채도가 높은 Vivid톤 색들의 배색. 고채도 배색은 매우 화려하고 자극적이지만, 자칫 산만한 느낌을 줄 수 있다. 그럴 때 중성색이나 무채색을 사용하면 색의 반발성이나 산만함을 줄일 수 있다.
  • 저채도 배색채도가 낮은 저채도 색들의 배색은 부드럽고 온화한 느낌. 하지만, 저채도 – 저명도의 배색은 침울하고 어두운 느낌을 준다.
  • 채도차가 큰 배색고채도와 저채도의 배색으로, 채도 차이가 큰 배색은 활기 있어 보이고 명쾌한 이미지. 또 채도 차가 클수록 확실한 배색이 된다.




훈련일 2017. 08. 25(금)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인) 프로젝트 제작
능력단위명 수정보완
능력단위요소 심미적 디자인 요소 수정 보완하기 (0802010406_13v1.1)
이름 최보윤
디지털 콘텐츠의 특징
  • 비파괴성(항상성) 디지털 자료는 아날로그 자료같이 세월이 흘러도 변하지 않고, 항상 똑같은 품질을 갖는다.
  • 변형 가능성파괴적 의미의 변형이 아니라, 항상 디지털화되어 있기 때문에 별도의 비용을 추가하지 않아도 자유롭게 정보의 추가, 삭제, 수정이 가능하다.
  • 보관의 편리성 보관 비용이 저렴하고, 공간적인 낭비가 거의 없다
  • 결합성 여러 종류의 디지털 콘텐츠끼리 쉽게 결합하여 더 좋은 콘텐츠를 만들 수 있다
  • 재생산성 한번 생산된 디지털 콘텐츠는 무한 반복 재생산이 가능하다. 디지털화 된 음악, 동영상, 애니메이션 등은 데이터베이스에 저장되어 사용자의 요구에 따라 언제든지 재생산이 가능하다.
  • 상호 작용성 정보 이용자가 동시에 정보 제공자가 되는 상호 작용이 가능하다
  • 편집성 디지털 콘텐츠는 새로운 내용의 추가와 수정이 용이하다. 따라서 텍스트, 음악, 그림, 동영상, 애니메이션 등의 각종 미디어가 통합된 형태로 가공되어 새로운 멀티미디어를 창출할 수 있다.
  • 비소멸성 디지털 콘텐츠는 한번 생산되면 형태나 품질을 반영구적으로 유지할 수 있다. 따라서 필요에 따라 언제든지 원하는 형태로 사용이 가능하며, 수많은 사용자가 동시에 사용하더라도 디지털 콘텐츠 자체는 감소되지 않기 때문에 디지털 경제 발전의 원동력이 되고 있다.




훈련일 2017. 08. 28(월)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털디자인) 프로젝트 제작
능력단위명 수정보완
능력단위요소 콘텐츠 사용성 수정 보완하기(0802010406_13v1.2)
이름 최보윤

반응형 웹 디자인

  • 사용자의 환경과 행동 패턴에 유기적으로 적절하게 반응하는 웹 요소들에 대한 총체적 디자인
  • Screen Size, Resolution, Orientation 등 사용 단말 환경에 반응하여 웹 페이지를 제공하는 것이라고 정의
  • 면 너비에 따라 유동적으로 변하는 유동형 레이아웃(fluid layout)과 유연한 이미지(flexible image), 그리고 미디어 쿼리(media queries)가 어우러져서 특정 환경에 ‘최적화’된 방법이 아니라, 환경에 반응하여 스스로 적응하는 방법
  • 반응형 웹은 %단위를 사용하여 각 디자인의 폭에 유동적으로 반응하여 콘텐츠의 크기가 줄거나커지고, 오브젝트 배열이 달라지기도 한다.

적응형 웹 디자인

  • 몇 개의 해상도를 정의하여 CSS 코딩 시 브라우저가 범위 사이즈에 속하면 그에 따라 정의된 스타일로 표현
  • 적응형 웹은 PX단위를 사용하여 정해진 해상도에 적응된 형태로 화면에 그려 지기 때문
  • 반응형 웹과 적응형 웹 모두 공통적으로 미디어 쿼리를 사용

HTML5이란?

  • HTML 5는 HTML 4.01, XHTML 1.0, DOM Level 2 HTML에 대한 차기 표준 제안 버전으로, 월드 와이드 웹의 마크업 언어
  • 최신 멀티미디어 콘텐츠를 브라우저에서 쉽고 용이하게 볼 수 있게 하는 것을 목적으로 한다.
  • 2004년 6월부터 Web Hypertext Application Technology Working Group(WHATWG)에서 웹 애플리케이션 1.0이라는 이름으로 세부 명세 작업을 시작하여 2014년 2월 현재에도 개발 중

CSS란?

  • 캐스케이딩 스타일 시트(CSS: Cascading Style Sheets)로 W3C의 표준이며, 레이아웃과 스타일을 정의할 때의 자유도가 높다. CSS 1, CSS2, CSS 3으로 나뉜다.
  • 프로파일들은 일반적으로 특정한 장치나 사용자 인터페이스를 위해 만들어진 하나 이상 수준의 CSS의 하부 집합으로 현재 휴대용 장치, 프린터, 텔레비전 수상기를 위한 프로파 일들이 있다.
  • 1996년에 도입된 CSS 1은 공식 W3C 권고안이 되어 CSS의 바탕이 되었다. CSS 2는 W3C가 개발하였 으며, 1998년 5월에 권고안으로 발표되었다. CSS 2.1은 CSS의 표준으로, 이전 버전에 비하여 새로운 기능과 도구가 추가되었다.
  • 대다수의 웹 브라우저는 CSS 2.1을 잘 지원한다(인터넷 익스플로러의 경우, 버전 7이 되면서 CSS 2.1을 지원한다). CSS 3은 2005년 12월 5일 이후 개발 중에 있는데, 현재 W3C에서는 CSS 3을 표준으로 만들고 있다
  • 전체가 모듈화되어 사용자 에이전트가 모듈에 대한 모든 모듈을 지원하지 않거나 자유롭게 선택할 수 있도록 하고 있으며, 다른 세로 글쓰기와 HTML 이외의 규격에까지 관여하는 내용으로 되어 있다.

사용자 경험 디자인(UX design: User Experience Design)이란?

  • 사용자가 콘텐츠를 사용하거나 체험할 때, 지각하는 것이 가능한 조직적 상호 교감적인 모델을 창조하고 개발하는 디자인의 한 분야
  • 사용자 중심 디자인의 원리에기반하고 있어 인간 공학, 인간과 컴퓨터 상호 작용, 정보 아키텍처, 휴먼 팩터스, 사용자 인터페이스 디자인, 사용성 공학(Usability Engineering) 분야와 많은 공통된 요소를 가지고 있다. 또한 다학제적인 성격을 가지고 있어 심리학, 인류학, 컴퓨터 공학, 마케팅, 그래픽 디자인 및 산업 디자인 분야와 깊은 관련을 맺고 있다.
  • UX 디자인은 매체에 국한하지 않은 매체 독립적이며, 또한 여러 매체를 아우르는 경험을 만들어 낸다.
  • 좁게는 어떤 콘텐츠를 사용할 때 일어나는 경험의 효율성과 디자인의 합목적성을 이루기 위한 디자인을 말하는데, 예를 들면 쉽게 검색할 수 있는 웹 사이트를 만드는 일이다.
  • 사이트 내의 콘텐츠들이 전달하고자 하는 목적과 내용에 따라 보다 쉽고 편하게 제작되어 사용자에게 제공되도록 하는 것이 중요하다

웹 접근성이란?

장애를 가진 사람과 장애를 가지지 않은 사람 모두가 웹 사이트를 이용할 수 있게 하는 방식. 웹 사이트가 올바르게 설계되어 개발되고 편집되어 있을 때 모든 사용자들이 정보와 기능에 동등하게 접근할 수 있다. 웹 접근성에는 다음의 사항들을 고려하여야 한다.

  • ① 시각 : 실명, 색각 이상, 다양한 형태의 저시력을 포함한 시각 장애
  • ② 이동성 : 파킨슨병, 근육병, 뇌성 마비, 뇌졸중과 같은 조건으로 인한 근육 속도 저하, 근육제어 손실로 말미암아 손을 쓰기 어렵거나 쓸 수 없는 상태
  • ③ 청각 : 청각 장애
  • ④ 발작 : 깜박이는 효과나 시각적인 스트로보스코프를 통해 일어나는 간질성 발작
  • ⑤ 인지 : 문제 해결과 논리 능력, 집중력, 기억력에 문제가 있는 정신 지체 및 발달 장애, 학습장애(난독증, 난산증 등)






훈련일 2017. 08. 29(화)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털디자인) 프로젝트 제작
능력단위명 수정보완
능력단위요소 매체 기능적 수정 보완하기(0802010406_13v1.3)
이름 최보윤

쿠키와 세션

쿠키

  • 하이퍼텍스트의 기록서(HTTP)의 일종, 인터넷 사용자가 어떤 웹 사이트를 방문할 경우에 그 사이트가 사용하고 있는 서버에서 인터넷 사용자의 컴퓨터에 설치하는 작은 기록 정보 파일
  • 기록 파일에 담긴 정보는 인터넷 사용자가 같은 웹 사이트를 방문할 때마다 읽히고 수시로 새로운 정보로 바뀐다. 넷스케이프의 프로그램 개발자였던 루 몬툴리(Lou Montulli)가 고안
  • 많은 서버 및 웹 사이트들이 브라우저의 신속성을 위해 즐겨 쓰고 있다
  • 바이러스를 옮길 수도 없고, 악성코드를 설치할 수도 없다. 스파이웨어를 통해 사용자의 브라우징 행동을 추적하는 데에 사용될 수 있고, 누군가의 쿠키를 훔쳐서 해당 사용자의 웹 계정 접근 권한을 획득할 수도 있다

세션(Session)

  • 라이언트와 서버 간의 상태를 유지하기 위한 일반적인 방법으로 세션이라는 개념을 이용
  • 클라이언트가 처음 접속했을 때 클라이언트에게 유일한 세션 ID를 부여하게 되고, 클라이언트는 이 ID를 자동으로 쿠키에 임시 저장하거나, 쿠키가 지원되지 않을 경우에 URL 끝에 붙여 가지고 다니게 된다. 따라서 이 세션 ID는 클라이언트가 재접속하였을 때 해당 클라이언트를 구분할 수 있는 수단이 된다.






훈련일 2017. 08. 30(수)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털디자인) 프로젝트 제작
능력단위명 수정보완
능력단위요소 매체 기능적 수정 보완하기(0802010406_13v1.3)
이름 최보윤

자바스크립와 제이쿼리

자바스크립트(JavaScript)

  • 객체 기반의 스크립트 프로그래밍 언어. 웹 사이트에서 많이 사용하며, 다른 응용 프로그램의 내장 객체에도 접근할 수 있는 기능을 가지고 있다
  • 본래 넷스케이프 커뮤니케이션즈 코퍼레이션의 브렌던 아이크(Brendan Eich)가 처음에는 모카(Mocha)라는 이름으 로, 나중에는 라이브스크립트(LiveScript)라는 이름으로 개발하였으며, 최종적으로 자바스크립트 가 되었다.
  • 자바스크립트가 썬마이크로시스템즈의 자바와 구문(syntax)이 유사한 점도 있는데, 이는 사실 두 언어 모두 C 언어의 기본 구문을 바탕으로 하였기 때문이고, 자바와 자바스크립트는 직접적인 관련성이 없다.
  • 자바보다 셀프와 유사성이 많다.

jQuery

  • 브라우저 호환성이 있는 HTML 속 자바스크립트 라이브러리, 클라이언트 사이드 스크립트 언어를 단순화할 수 있도록 설계
  • 존 레식이 2006년 뉴욕 시 바캠프(Barcamp NYC)에서 공식적으로 소개
  • 오늘날 가장 인기 있는 자바스크립트 라이브러리 중 하나로 MIT 라이선스와 GNU 일반 공중 사용 허가서 v2의 듀얼 라이선스를 가진 자유 오픈 소프트웨어
  • jQuery의 문법은 코드 보기, 문서 객체 모델 찾기, 애니메이션 만들기, 이벤트 제어, Ajax 개발을 쉽게 할 수 있도록 디자인되었다. 또한 jQuery는 개발자가 플러그인을 개발할 수 있는 기능을 제공






훈련일 2017. 08. 31(목)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털디자인) 프로젝트 제작
능력단위명 수정보완
능력단위요소 매체 기능적 수정 보완하기(0802010406_13v1.3)
이름 최보윤

데이터베이스

  • 여러 응용 시스템들의 통합된 정보들을 저장하여 운영할 수 있는 공용 데이터들의 묶음, 여러 사람들이 공유하고 사용할 목적으로 통합․관리되는 정보의 집합
  • 논리적으로 연관된 하나 이상의 자료의 모음으로 그 내용을 구조화함으로써 검색과 갱신의 효율화를 위한 것
  • 몇 개의 자료 파일을 조직적으로 통합하여 자료 항목의 중복을 없애고 자료를 구조화하여 기억시켜 놓은 자료의 집합체라고 할 수 있다

SQL(Structured Query Language, SEQUEL: Structured English Query Language)

  • 데이터베이스를 지원하기 위해 1974년에 IBM 연구소에서 창안, 수학적 관계 대수와 관계 논리(relational calculus)에 기반
  • 데이터 모델은 데이터를 조작하기 위한 연산 집합을 가져야 한다. 왜냐하면 그것은 데이터베이스 구조와 제약 조건을 정의하기 때문, , 관계 데이터 모델 연산 집합(a set of operations)은 관계 대수로 표현되고, 그 연산은 사용자에게 여러 질의를 가능하게 한다

웹 서버

  • 웹 브라우저 클라이언트로부터 HTTP 요청을 받아들이고, HTML 문서와 같은 웹 페이지에서 흔히 찾아볼 수 있는 자료 콘텐츠에 따라 HTTP에 반응하는 컴퓨터 프로그램
  • 웹 서버의 주된 기능은 웹 페이지를 클라이언트에게 전달하는 것. 이는 HTML 문서뿐 아니라 문서에 들어갈 수 있는 기타 부가 내용, 이를테면 그림, 스타일 시트, 자바스크립트의 전달을 말한다.
  • 웹 브라우저 또는 웹 크롤러로 부르는 클라이언트는 HTTP를 사용하여 특정 리소스 요청을 하며 통신을 시작하고, 서버는 해당 리소스의 콘텐츠를 가져다주며 응답. 만약, 이를 수행할 수 없으면 오류 메시지로 응답
  • 웹 서버의 주된 기능이 콘텐츠를 전달하는 것이지만, 클라이언트 로부터 콘텐츠를 받는 것 자체도 해당 기능에 속한다. 이러한 기능은 파일의 업로드를 포함하며 웹 폼 제출에 쓰인다






훈련일 2017. 09. 1(금)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털디자인) 프로젝트 제작
능력단위명 프로젝트 완료
능력단위요소 산출물 정리하기(0802010407_13v1.1)
이름 최보윤

프로젝트 매니저의 작업 분류 체계(WBS : work breakdown structure)

  1. 프로젝트 수행 활동 작업을 계층화 및 상세화하여 프로젝트의 범위를 정의하는 방법
    • 직무 위주의 활동 가계도(Family Tree)라고도 한다. ,“프로젝트 요소인 산출물 중심의 분류 체계로 프로젝트의 전체 범위를 구성하고 정하는 것”으로 정의
    • 체 업무를 분류하여 구성 요소 로 만든 후, 각 요소를 평가하고 일정을 계획하며, 그것을 완수할 수 있는 사람에게 할당해 주는 역할
    • 대적인 프로젝트 관리에서 주춧돌과 같은 역할을 하며,‘단계(Phase) - 활동(Activity) - 작업(Work) - 절차(Step) - 패키지(Work Package)’의 계층을 갖는다
  2. 패키지를 중심으로 담당자와 일정이 관리되므로, 3~4레벨 단위로 구체화되는 코드 체계(Code of Accounts)로 단계가 구분되어 산출물의 체계적 관리 기준이 만들어진다. 를 통해 공통 작업 항목을 계획 및 통제가 가능한 수준으로 분해하여 구체적 중간 산출물 및 전체 산출물에 적용
  3. 작업 분류 체계에 따른 산출물 수집 목적은 아래와 같다
    • 프로젝트 단계를 분할하고 정의하는 과정에서 프로젝트에 대한 이해 개선
    • 일정 및 산출물의 예측 정확도 개선
    • 세분화된 작업 기준으로 산출물 수집 작업을 할당할 수 있어 효과적 관리 가능
    • 표준화된 프로젝트 절차 활용에 의한 의사소통 개선
    • 작업의 논리 관계 파악과 진행 중인 산출물의 효율적 통제 가능
    • 전사적 자료 축적 및 효율적 관리
  4. 프로젝트 관리 계획
    • 상향식(bottom-up) 방법 : 프로젝트에 수행될 작업을 작은 단위로 나누고 각 작업에 소요될 기간이나 노력을 예측, 독립된 작업 사이에 병행하여 수행할 경우 단축되는 기간을 계산. 전체 소요 기간이나 노력을 구한다. 작은 단위 작업에서 출발하여 전체 프로젝트의 기간을 예측하고, 프로젝트를 위한 소작업에 소요되는 기간을 구하고, 여기에 투입되어야 할 인력과 투입 인력의 참여도를 곱하여 최종 인건비를 계산. (WBS, CPM 네트워크, 갠트 차트)
    • 하향식(top-down) 방법: 프로그램의 크기와 노력 사이의 관계를 나타내는 수학적 모델을 사용하여 시스템의 규모를 과거의 경험이나 구현 언어, 재사용 비율 등을 고려하여 예측,이를 비용 모델(cost model)에 대입하여 노력이나 기간을 산출한다. 전체 규모로부터 기간을 예측하여 정하고, 소단위 작업의 노력을 추정하고, 프로그램의 규모를 예측하고 과거 경험을 바탕으로 예측한 규모에 대한 소요 인력과 기간을 추정한다(FP, LOC, Man-Month, COCOMO).

개발 프로세스

프로젝트에서 이루어져야 할 중심 프로세스, 수행할 개발 및 품질 보증 작업 일체

  1. 폭포수 모델(waterfall model):단계별 승인을 거쳐, 순차적-하향식으로 개발이 진행되는 고전적 생명 주기 모델
    • 장점 : 이해하기 쉽고, 단계별 검토․승인과 체계적 관리 용이
    • 단점 : 요구 사항 도출이 어렵고, 상위 단계의 작업이 지연되면 하위 단계의 작업이 계속 누적 지연될 가능성이 있으며, 개발 중후반 문제점 발견 시 대처가 곤란
  2. 프로토타입 모델(prototype model):사용자의 의견(feedback)이 중요한 모델이며, 핵심적 기능을 샘플로 만들어 평가한 후 본 개발을 진행하는 점진적 개발 방법으로 정의
    • 장점 : 요구 사항 도출 용이, 의사소통 향상
    • 단점 : 사용자의 오해(완제품), 폐기 시 비용 손해
  3. 점증적 개발 모델(incremental model)
    • 장점 : 점진적 개발로 실패 위험 감소, 테스트가 용이함
    • 단점 : 기능적 분해의 난이도 증가. 선제적인 명확한 요구사항 선결
  4. 나선형 모델(spiral model):위험 관리를 중요시하는 모델
    • 증분(Incremental) : 시스템을 분할하여 병행․순차 개발
    • 진화(Evolutional) : 프로토타입을 재사용 또는 진화시켜 개발
  5. V모델:테스트와 검증을 강조하는 모델
    • 장점 : 모든 단계에 검증과 확인 과정이 있어서 오류를 줄일 수 있음
    • 단점 : 생명 주기의 반복을 허용하지 않아 변경하기가 쉽지 않음
  6. 일정 중심 설계 모델(design to schedule model):출시 일정을 정확히 맞추기 위한 모델이며, 간략한 특징은 아래와 같다. ① 장점 : 초기 단계에서 중요한 기능들을 설계하고 구현한 후, 상대적으로 덜 중요한 기능은 나중에 구현함으로써 일정조절이 가능
    • 장점 : 초기 단계에서 중요한 기능들을 설계하고 구현한 후, 상대적으로 덜 중요한 기능은 나중에 구현함으로써 일정조절이 가능함
    • 우선순위가 낮아 출시에 포함되지 않을 기능의 분석과 설계 등에 시간 낭비 발생






훈련일 2017. 09. 4(월)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털디자인) 프로젝트 제작
능력단위명 프로젝트 완료
능력단위요소 산출물 정리하기(0802010407_13v1.1)
이름 최보윤

분류의 기본 원칙

  1. Inventory 개념의 문서 Life Cycle 관리를 통해 표준화, 디지털화.
  2. 안전행정부 산하 한국정보화진흥원 공지‘표준산출물가이드(2012. 12. 15)’참조
  3. 각 산출물은 산출물의 제작 흐름에 따른 ID를 부여하여, 이전 단계 산출물 관련 ID로 산출물 간의 연관성을 추적하기 쉽도록 구성

산출물 체계화

  1. 산출물은 다양한 디지털 형태로 축적되어 빠른 검색을 거쳐 선택, 가공, 분석할 수 있어야 한다. 산출물의 체계화’라고 부르는 일련의 과정을 통해 의미 있는 내용으로 전환하여 의사 결정을 지원하는 중요한 영업 활동으로서의 의미
    • 산출물을 보면 관련 문서의 흐름대로 시간과 인력 등의 측정이 가능
    • 원가(Cost) 개념을 적용하여 불필요한 문서 작업을 제거
    • 코드 관리나 미디어 관리를 위한 자료를 클라이언트를 위한 산출물로 이해
  2. 물리적인 산출물 체계화
    • 중앙화’또는‘공유 가치화’를 위해 관리의 표준화와 외부 유출 예방, 협업과 공용을 위한 업무 표준화, 모바일 서비스, 원격 근무, 문서의 Life Cycle 관리, 지속적 정리 정돈, TCO 절감, 정보 수집 지원 개방 등의 업무 프로세스를 가시화하는 데 기여
    • 출물의 체계화를 통해 프로젝트 완료 보고서와 디자인 가이드를 작성하면, 작업자와 클라이 언트 모두에게 효율성을 제공
    • 콘텐츠 유지 보수 및 관리를 위한 최종 작업 산출물은 디자인 가이드에 포함하여 체계화






훈련일 2017. 09. 05(화)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털디자인) 프로젝트 제작
능력단위명 프로젝트 완료
능력단위요소 프로젝트 결과 보고서 작성하기(0802010407_13v1.2)
이름 최보윤

산출물의 선택과 가치 분석

  1. 디자인 직무수행에 유의미한 데이터의 추출이 가능한 산출물은 프로젝트 전 과정에서 다양하게 생길 수 있는데, 고객의 요구에 대한 객관적인 증거로서 효력을 갖는 자료를 잘 선택하고 단순 나열보다는 가공성에 중점을 둔 시각으로 정리한다.
  2. 유의미한 산출물의 분석 프로젝트 전 과정에서 발생한 산출물의 내용을 살펴, 보고서에 포함할 지 여부를 판단한다.
  3. 중간 단계에서 이미 사용된 데이터는 향후 업데이트와 완료까지의 변화된 사항을 중심으로 통합적 데이터로 정리한다






훈련일 2017. 09. 06(수)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털디자인) 프로젝트 제작
능력단위명 프로젝트 완료
능력단위요소 프로젝트 결과 보고서 작성하기(0802010407_13v1.2)
이름 최보윤

업그레이드와 유지 보수

  1. 디자인 측면 : 클라이언트의 요구가 가장 많은 부분으로, 부분 이미지 교체나 페이지 추가, 계절 분위기 조정, 콘텐츠 변경과 교체, 팝업 등이 해당한다. 디자인팀 영역이다. ② 프로그램 측면 : 사이트 운영 관련 부분 개정, 흐름 조정, 간단한 기능 추가 등이 해당한다. 개발팀 영역이다. ③ 필요성 : 사용자에게 변화를 통한 신선함과 관심을 증폭시켜 사이트의 발전을 꾀하거나 관리자 의 편의를 위한 기능 개선을 위해 필요하다
  2. 프로그램 측면 : 사이트 운영 관련 부분 개정, 흐름 조정, 간단한 기능 추가 등이 해당한다. 개발팀 영역이다
  3. 필요성 : 사용자에게 변화를 통한 신선함과 관심을 증폭시켜 사이트의 발전을 꾀하거나 관리자 의 편의를 위한 기능 개선을 위해 필요하다






훈련일 2017. 09. 07(목)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털디자인) 프로젝트 제작
능력단위명 프로젝트 완료
능력단위요소 프로젝트 결과 보고서 작성하기(0802010407_13v1.2)
이름 최보윤

프로젝트 보고서 작성에 따른 필요 사항

프로젝트의 유지 보수 작업에 필요한 산출물 관리와 달리, 작업을 마친 후 클라이언트에게 보고하 는 최종 보고서를 만드는 과정이다

  1. 작업의 전체 과정을 문서로 정리하되, 디지털 디자인은 선형적 작업의 특성을 갖고 있으므로, 순서에 맞춰 정리하는 것이 중요하다.
  2. 작업을 완료한 후 관련된 것들을 정리하고, 다음 작업을 준비할 수 있도록 하는 데 그 의의가 있다. 산출물과 작업 내용을 정리한 Work Table을 만들면 유용하게 사용할 수 있다






훈련일 2017. 09. 11(월)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털디자인) 프로젝트 제작
능력단위명 프로젝트 완료
능력단위요소 클라이언트 최종 보고하기(0802010407_13v1.2)
이름 최보윤

프로젝트 최종보고

완료된 프로젝트의 기획과 수행 과정은 물론, 완료된 제품의 사후 관리까지의 내용을 체계적으로 구성하여 설명과 설득의 방법으로 클라이언트에게 보고하는 것으로, 클라이언트와 보고자의 쌍방 향 커뮤니케이션으로 이루어진다.

프레젠테이션의 절차

  1. 기획
    프레젠테이션의 방향 설정, 목표 기술, 자료 및 정보 수집, 목차 설정, 핵심 항목 선정 및 논리 구조화, 세부 콘텐츠(내용) 레이아웃 등이 포함된다.
  2. 준비
    사전 점검 사항 확인(목적 구체화, 청중 분석, 장소 확인, 시간 확인), 효과적인 전달 매체 선정, 자료 작성(파워포인트 등 이용), 자료 시각화(비주얼 자료 만들기) 등이 있다.
  3. 실시
    서론(도입), 본론(전개), 결론(맺음), 질의응답 등으로 이루어진다.
  4. 평가
    결과에 대한 자체 평가, 개선안 도출, 상대방(청중 또는 상대 회사)으로부터의 피드백이 실시된다.

전략 이이디어 도출 기법

  1. 표적 집단 면접(Focus Group Interview)
    • 자유로운 발언 분위기 조성이 필요하므로, 진행자가 중요하다. 명확한 주제를 제시하여 5~8명의 전문가 그룹으로 진행한다.
  2. 브레인스토밍(brainstorming)
    • 양적으로 많은 아이디어를 창출하는 데 유리하다. 다른 사람의 의견에 대한 비판을 금해야 하며, 다른 사람의 아이디어를 확대․개선․표절하는 것이 가능하고, 적극적 참여자 확보가 필수적이다.
  3. 의사 결정 권리 도구
    • 권고, 승인, 실행, 투입, 결정의 역할 중 한 가지씩을 개인에게 각각 부여하여 진행하며, 질 높은 의사 결정과 신속한 성과 창출에 유리하다.
  4. 스노카드(snow card)
    • 집단 의사 결정 기법으로, 참여자들이 포스트잇에 기록한 1개씩의 아이디어를 그룹화하여 우선순 위를 설정하거나 그룹화를 반복하여 합의점을 도출한다.
  5. PINC(positive, intriguing, negative, concerning) 여과기 모형
    • 힘의 장 분석 기법의 확대 형식이며, 긍정, 호기심 유발, 부정, 걱정 끼치는 것을 의미한다. 브레인스 토밍 등과 함께 사용할 수 있다.
  6. 힘의 장 분석(force field analysis)
    • 찬성과 반대의 모든 힘을 명확히 하여 의사 결정을 지원한다. 사실, 자료, 브레인스토밍, 설문 조사 등의 결과를 근거로 추출하거나 힘의 강도를 결정할 수 있다.
  7. 스캠퍼(scamper)
    • 체크 리스트법 기반의 문제 해결법이다. SCAMPER는 대체, 결합, 변경, 수정, 다른 용도로 사용, 제거, 거꾸로 힘의 첫 글자를 연결한 것이다.
  8. 시네틱스(synetics)
    • 친숙하지 않은 것을 친숙한 것으로 전환해 보는 유추 활동으로, 사물에 대한 새로운 관점의 이해와 다양한 아이디어를 찾아낸다.
  9. 상징 유추(symbolic analogy)
    • 서로 모순이 되는 것처럼 보이는 두 단어 속에서 비논리적 사고를 사용하는 아이디어 발상법이다.
  10. CAF(consider all factors)
    • 주어진 문제 상황에서 모든 요인들을 고려하여 생각하도록 돕는 사고 기법으로, 사고 과정에서 놓친 것들을 재고려하도록 하여 생각의 범위를 넓혀 준다.
  11. PMI(Plus, Minus, Interest)
    • 제안된 아이디어를 다각적 측면에서 분석하고 평가하여 새롭고 개선된 아이디어를 생성하는 방법 이다. 한 측면을 평가할 경우, 다른 측면에 대해서는 생각하지 않도록 한다.
  12. TRIZ
    • 기술 모순의 문제 분석에서 시작하여 모델 분석, 물리적 모순 기술, 자원 활용, 지식 기반, 문제 재구성, 모순 제거 원리 검토, 해법의 가능성 검토, 문제 해결 경로 분석의 9단계를 거치는 구조적 기법이다.






훈련일 2017. 09. 12(화)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털디자인) 프로젝트 제작
능력단위명 디지털디자인 사후관리
능력단위요소 오류수정하기(0802010408_13v1.1)
이름 최보윤

모니터링 대상요소

  1. 콘텐츠 스타일
  2. 표준 & 유효성
  3. 검색 엔진 노출, 검색 엔진 최적화, 지표
  4. 기능
  5. 보안 / 위험
  6. 성능
  7. 기타

데이터베이스

  • 콘텐츠 개발에 사용되는 데이터베이스는 크게 유닉스(UNIX) 계열과 윈도즈(Windows) 계열로 나뉜 다.
  • 개발된 콘텐츠가 어떤 브라우저와 어떤 운영 체제(OS)를 사용하느냐에 따라 사용하는 데이터베 이스도 영향
유닉스, 리눅스 계열 윈도즈 계열
Oracle, MySQL, Aybase, PostgreSQL, ODBC 등 Oracle, MS-SQL






훈련일 2017. 09. 13(수)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털디자인) 프로젝트 제작
능력단위명 디지털디자인 사후관리
능력단위요소 클라이언트 요청사항 반영하기(0802010408_13v1.2)
이름 최보윤

클라이언트와의 커뮤니케이션에 필요한 내용

클라이언트의 요구에 대한 대처 방법







훈련일 2017. 09. 14(목)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털디자인) 프로젝트 제작
능력단위명 디지털디자인 사후관리
능력단위요소 프로젝트 내부 공유 리뷰하기(0802010408_13v1.3)

프로젝트 개발 5단계 중요사항

  1. 계획
    • 소프트웨어는 시스템의 일부분이므로 사용자의 문제를 정의, 전체 시스템 이 갖추어야 할 기본 기능과 성능 요건을 파악, 이를 개발하고자 하는 소프트웨어의 기본 요구로 전환시킨다.
    • 이 단계에서 타당성 분석(feasibility study)도 이뤄지며, 그 결과는 시스템 정의서(system definition)로 문서화되어야 하며, 개발 계획서(project plan)에 포함된다.
  2. 분석
    • 사용자의 문제를 구체적으로 이해(understand)하고, 소프트웨어가 담당해야 하는 정보 영역 (information domain)을 정의
    • 사용자의 기능, 성능, 신뢰도 등에 대한 요구는 요구 사양서 (requirements specifications)로 문서화
    • 의사소통 기술이 필수적
  3. 설계
    • 소프트웨어의 구조(architecture)와 그 성분을 명확하게 밝혀 구현을 준비하는 단계
    • 외부 시스템 및 사용자와의 인터페이스를 중시하는 외부 설계(external design)와 시스템 내부를 설계하는 내부 설계(internal design)로 분류
    • 전체적 구조와 데이터 알고리즘을 설계하는 단계를 분리해 기본 설계(architecture design)와 상세 설계(detailed design)로 분류
    • 설계 단계 에서의 결과는 설계 사양서(design specifications)로 산출되어야 한다. 이 산출물과 요구 사양서를 토대로 사용자 지침서(user's manual)와 시험 계획서(test plan)가 작성
  4. 구현
    • 프로그래밍을 하는 단계
    • 각 모듈의 코딩과 디버깅이 이루어지고, 그 결과를 검증하는 단위 시험(unit test) 혹은 모듈 시험(module test)을 실시
  5. 시험
    • 개발된 모듈들을 통합시키며 시험하는 통합 시험(integration test), 완성된 시스템으로서 요구 사항 을 완벽히 관철시켰는가를 알아보는 시스템 시험(system test)
    • 장에서 검증해 보는 인수 시험(acceptance test) 등
  6. 운용 및 유지 보수
    • 소프트웨어를 직접 이용하고 이용상에 나타나는 문제점을 수정하거나 새로운 기능을 추가해 보다 유용한 소프트웨어로 발전시키는 단계

프로젝트 진행과 관리를 위한 PMO 유형

  1. 지원형템플릿, 모범 사례, 교육, 그리고 다른 프로젝트에서 습득한 교훈과 가용 정보를 제공하여 프로젝트 를 지원
  2. 통제형다양한 수단을 통해 지원을 제공하고 준수 사항을 요구,프로젝트 관리 기본 구조 또는 방법론을 적용하고, 특정 템플릿과 양식, 도구를 사용하며 거버넌스에 따르도록 하는 것이 포함
  3. 지시형프로젝트를 직접 관리하면서 프로젝트 통제를 지휘, PMO는 기업의 전략적 프로젝트로부터 도출된 데이터와 정보를 통합하여 프로젝트 목표의 성취도 현황을 평가, PMO는 조직의 포트폴리오, 프로그램, 프로젝트, 기업 측정 시스템(예: BSC) 간 연락 창구 성격 을 가진다.






훈련일 2017. 09. 15(금)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털디자인) 프로젝트 제작
능력단위명 디지털디자인 사후관리
능력단위요소 데이터베이스 관리하기(0802010408_13v1.4)

데이터베이스 관리 시스템(DBMS : database management system)

  • 데이터베이스 관리 시스템은 다수의 컴퓨터 사용자들이 데이터베이스 안에 데이터를 기록하거나 접근할 수 있도록 해 주는 프로그램
  • DBMS는 사용자 요구 사항들이나 다른 프로그램의 요구 사항들을 관리함으로써, 사용자들이나 다른 프로그램들이 실제로 그 데이터가 저장 매체의 어느 곳에 저장되어 있는지를 이해하지 않고서도, 다중 사용자 환경의 모든 사람이 데이터를 이용할 수 있도록 해 준다
  • 사용자 요구 사항들을 처리함에 있어, DBMS는 데이터의 무결성(데이터베이스가 계속해서 접근이 가능하며, 의도한 대로 조직화되어 있다는 사실을 확인해 주는 것)과 허가된 사용자들만이 데이터에 접근할 수 있게 하는 보안성을 보장
  • DBMS가 관계형 데이터베이스 관리 시스템으로 데이터베이스 내의 데이터를 관리하는 파일 관리자
  • 개인용 컴퓨터에서는 마이크로 소프트 액세스가 단일 사용자 및 소규모 사용자용 DBMS의 대표적. SQL Server는 다중 사용자 들의 데이터베이스 요구를 지원하는 DBMS이고, IBM의 DB2, 인포믹스, 오라클 등의 DBMS 등이 있다.

데이터 백업의 종류

  • 핫 백업(Hot backup) : 데이터베이스를 셧다운하지 않고 백업하는 방식으로, 일반적인 경우는 적용되지 않고 자신의 데이터베이스를 Archive Mode로 운영하는 경우에만 가능하다.
  • 콜드 백업(Cold backup) : 데이터베이스의 운영 상태가 close 상태에서 수행하는 백업으로, 데이터파일, Redo log 파일, 컨트롤 파일을 백업할 수 있다.
  • 물리적 백업(Physical backup) : 파일을 한 위치에서 다른 위치로 복사하는 물리적인 복제이다.
  • 풀 백업(Full backup) : 매일 데이터 전체를 백업한다.
  • 증분 백업(Incremental backup) : 변경된 부분만을 백업하다가 일정 기간이 지나면 풀 백업하는 것으로, 일요일 기준으로 월요일에서 토요일까지 변경된 부분만 백업하고, 일요일에 풀 백업한다.
  • 변경 백업(Differential backup) : 이전 백업 내용과 변경된 부분을 모두 백업하는 방식으로, 화요일에 백업한다면 월요일과 화요일에 변한 데이터를 모두 백업하고, 토요일에 백업한다. 월, 화, 수, 목, 금요일까지 5일간 변경된 데이터를 백업한다.
  • 합성 백업(Synthetic backup) : 풀 백업 + 증분 백업