NCS

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

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

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

프로젝트 브리프

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




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

정성 조사 방법

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

정량 조사 방법

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

디자인 플래닝

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




훈련일 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 법칙

  1. E(exemple)

    예화로 이야기를 시작한다. 특히, 본인의 이야기나 최근 이슈가 되고 있는 이야기를 바탕으로 근거 있는 실례가 좋다.

  2. O(Outline)

    전달하고자 하는 핵심 내용을 간략히 정리한다.

  3. B(Benefit)

    전달하고자 하는 내용이 상대방에게 어떤 이익을 주는 가에 초점을 맞추어 설명한다.




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

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

개발사와 클라이언트의 권리와 의무를 규정하는 계약서는 기업과 기업간의 신의를 바탕으로 하는 공문서이기 때문에, 프로젝트 수행 기간 중 분쟁이 발생하였을 때에는 이 계약서를 기준으로 법률적 해석을 하게 된다. 분쟁이 발생하면 기본적으로 상호 협의를 하여 우호적으로 해결하도록 하며, 만약 합의가 이루어지지 않을 경우에는 소송 관할 법원은 클라이언트의 소재지 관할 법원으로 한다.

클라이언트의 권리와 의무

사업의 효율적인 추진을 위하여 클라이언트가 지정하는 자는 사업 수행에 참여하여 구체적인 사업수행 방향 제시, 문제점 개선, 대책 강구 등의 조치를 취할 수 있으며, 수행자는 이에 성실히 응하여야 한다. 또한 수행자의 종업원이 사업 수행에 부적당하다고 판단되거나 자격 미달인 경우에 교체를 요구할 수가 있으며, 수행자는 특별한 사유가 없는 한 이에 응하여야 한다. 수행자의 용역 수행 내용 및 품질에 중대한 하자가 있거나, 수행자가 계약 내용을 위반하였을 경우에는 지정된 기일까지 보완 요청을 하고, 이를 이행하지 않았을 경우 보상없이 계약을 해지할 수 있다.

수행자의 권리와 의무

수행자는 계약을 수행함에 있어 신의 성실의 원칙에 입각하여 필요한 모든 지식과 기술을 활용해야 하며, 용역 계약 일반 조건 및 특수 조건, 과업 내용서 및 산출 내역서 등에 규정된 사항을 충실히 준수해야 한다. 또한, 계약 수행상 발생하는 문제점은 클라이언트가 제시하는 조치사항에 따라야 하며, 클라이언트가 수행자에게 사업 진행 상황에 대한 보고를 요청 시 수행자는 성실하게 응해야 한다. 클라이언트의 귀책사유로 인하여 불가피하게 계약이 해지되었을 경우에는 해지전일까지 용역 수행에 소요된 비용을 클라이언트가 수행자에게 지급해야 한다. 수행자는 클라이언트의 사전 서면 승인이 없는 한 비밀정보를 목적 사업 이외에 사용할 수 없으며, 목적 사업과 직접적으로 관련된 업무 수행의 범위를 초과하여 비밀 정보를 임의로 복제, 수정, 저장, 변형 또는 분석하는 등의 행위를 할 수 없다.


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

요구 사항 정의서(Project profiler)

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

  • 요구 사항 정의서 구성 요소
    1. 기업 일반 사항:회사명, 인원, 해당 산업군, 주요 서비스 등
    2. 프로젝트 개요:구축 목적, 구축 배경, 기대 효과, 예산, 일정 등
    3. 기능적 요구 사항:H/W, S/W, OS, Data Base, 서비스 환경, 필수 요소 등
    4. 디자인 제약 조건:기업 CI 사용 규정, 기업 선호 색상, 디자인 콘셉트 등
    5. 업무 흐름:의사 결정권자 및 프로젝트 매니저, 업무 흐름도 등

문서 정리 문장 구성

회의록 등의 문서는 정보 전달 능력을 극대화하기 위해서 누가 봐도 이해하기 쉽게 작성하는 것이 기본이며, 서술형으로 작성하기 보다는 도출된 내용을 요약하여 간결한 문장으로 일목요연하게 작성하도록 한다.

  • 문서 작성 방법
    1. Who:누가 행하는가?(행위의 주체, 투입 인력 또는 상품이나 서비스)
    2. What:무엇을 말하는가?(문서의 핵심 부분으로 사실의 대상)
    3. When:언제 시행되는가?(작성 일자, 문서와 관련된 시간)
    4. Where:어디에서 시행되는가?(장소)
    5. Why:목적, 왜, 이유나 원인으로 결론에 근거하는 요소, 기대 효과 등
    6. How:어떻게 진행, 수행하는가?(전후 진행 상황 설명)



훈련일 2017. 06. 28(수)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털디자인) 기본
능력단위명 디지털디자인 프로젝트 분석 설계
능력단위요소 요구사항 분석 사용자 정의하기(0802010401_13v1)
이름 백초희

페르소나 모형(Persona Model)

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




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

정보 수집

개발 방향을 설정하기 위해 정보를 수집할 때에는 수집되는 정보를 바탕으로 섣부른 결론을 내리지 않기 위해 편견을 갖지 않도록 하여야 하고, 정보고 누락되는 것을 방지하여 되도록이면 많은 정보를 수지하도록 한다. 정보 수집 방법은 크게 인터넷 검색, 소셜 네트워크 서비스 분석, 통계, 학술 자료, 설문 조사 등 온라인 매체를 이용하는 방법과 관찰, 인터뷰, 포커스 그룹 인터뷰(Focus Group Interview), 신문, 비지니스 트렌드 잡지 및 도서 등 오프라인 매체를 이용하는 방법으로 구분할 수 있다.

  • 정보 수집의 원칙과 습관
    1. 필요성 : 무엇을 알고자 하는가
    2. 수집 범위 : 어디까지 수집할 것인가
    3. 출처 : 어디에서 수집할 것 인가
    4. 정확성 : 출처 확인
    5. 보안성 : 비밀 유지
    6. 신선도 : 최대한 최신 정보 수집
    7. 정보망 : 정보 제공자 다수 확보
    8. 현장 중시 : 직접 찾아다니며 정보를 얻는다.
    9. 메모 : 정보는 반드시 기록
    10. 정보 유도 : 질문 역량 강화
    11. 판단력 : 정보를 이해하는 능력
    12. 수신기 : 다양한 견해를 경청
    13. 정보 장비 : 웹, e-mail, 전화 등 다양한 매체의 활용
    14. 적극성 : 정보를 찾고자 하는 열의
    15. 대인 관계 : 정보 수집에는 타인의 협조가 필수
    16. 종합력 : 부분적인 것도 추구
    17. 객관성 : 숫자에 현혹되지 말 것
    18. 도전성 : 수집 불가능한 정보가 더 중요
    19. 정직성 : 정보를 왜곡하지 말 것
    20. 생산성 : 효율적인 정보 수집 방법 강구

거시 환경(STEEP) 분석

거시 환경(STEEP) 분석은 사회적(Social) 환경, 기술적(Technological) 환경, 경제적(Economic) 환경, 생태학적(Ecological) 환경, 정치적(Political) 환경의 5가지 요소로 기업의 활동에 영향을 주는 외부적 요인을 파악하는 방법을 말한다. 5가지 요소의 영문 첫 글자를 조합하여 STEEP 분석법이라고도 한다.

(1) 사획적(Social) 환경

인구 통계, 출생률, 사망률, 평균 수며으, 교육 수준, 사회 계층 간 임금 격차, 사회 각 영역의 인구 비율, 여성의 사회 진출, 문화적 태도, 문맹률, 관심, 믿음, 가치, 라이프 스타일, 사용자 생활 양식 등

(2) 기술적(Technological) 환경

보유 특허, 특허 보호 제도, R&D 예산, 신기술 · 정보 기술, 기술 변화 속도, 기술 클러스터 존재 여부, 서비스 혁신 속도, 기술 혁신 및 확산, 산업 · 경제의 디지털화, 인터넷 기반 기술 등

(3) 경제적(Economic) 환경

GDP 성장률, 외환 보유고, 인플레션유르 수입 배분 수준과 범위, 금융 · 재정 정책, 구조 조정, 실업률, 임금 수준, 소비 성향, 시장 경쟁 구조 등

(4) 생태학적(Ecological) 환경

공기 · 수질, 재활용 시설 규모, 에너지원, 서비스 수명 주기 발전 단계, 원자재 대체성, 환경 규제 수준 등

(5) 정치적(Political) 환경

개혁 정책, 규제 기관의 활동, 재산권 보호법 존재 여부, 정치적 의사 결정에 대한 영향력, 여론, 정책 결정 구조의 성격, 지원 정책, 규제 합리화, 민영화, 특허 등

미시 환경 분석

미시 환경 분석은 기업의 내부적 환경과 공급자, 클라이언트, 경쟁자들, 관계자들의 상황과 동향 등을 파악하는 방법을 말한다. 대표적인 방법으로 소비자(Customer), 경쟁사(Competitor), 자사(Company)를 분석하는 3Cs 분석법이 있다.

(1) 소비자(Customer)

목표 소비자, 이용 동기, 이용 경로, 소비자 영향력, 시장 규모, 시장 성장률 등

(2) 경쟁사(Competitor)

현재의 경쟁사, 잠재적 경쟁사, 경쟁사의 시장 내 성과, 시장 내 강점 및 약점, 경쟁사의 마케팅 전략 등

(3) 자사(Company)

인적 · 물적 · 기술적 자원, 기업의 문화, 기업의 이미지, 재무 자원, 생산 설비, 입지, 기업 내 타 부서의 영향을 받는 요인 등

SWOT 분석

SWOT분석은 프로젝트 전략 수립의 필수 기법으로, 분석하고자 하는 대상 기업의 내부 요인 상황과 경쟁자와 비교한 강점(Strength), 약점(Wekness), 그리고 자사를 제외한 외부 환경인 기회(Opportunity), 위협(Threat)의 네 가지를 분석한다.

(1) SO(Strength, Opportunity)

내부도 강하지만 외부의 기회에도 강한 SO분석법은 기존 시장 장악은 물론 신규 시장 진출에 용이하다.

(2) ST(Strength, Threat)

내부는 강하지만 외부의 위협이 도사리고 있는 ST분석법은 기존 시장 침투 및 확장의 장점과 단점을 각각 가지고 있다.

(3) WO(Wekness, Opportunity)

내부는 약하지만 외부의 기회가 있는 WO분석법은 핵심 역량 강화라는 장점과 시장을 선도하고 있는 서비스와의 제휴를 통해 발저느이 여지가 있는 전략이다.

(4) WT(Wekness, Threat)

내부가 약할뿐더러 외부의 위협도 존재하는 WT분석법은 내, 외부 모든 각각으 ㅣ위험이 도사리고 있으므로 시장 철수를 어느 시점에 어떠한 방식으로 진행할지를 분석하는 전략이다.




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



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

디자인 요구 사항 분석

디자인의 방향성과 관련하여 사용자 성향과 클라이언트의요구 사항을 분석하여 정의하고, 이를 바탕으로 디자인 콘셉트를 수립하기 위한 근거를 준비한다.

  • 클라이언트 요구 사항 : 마케팅 지향점, 브랜드 이미지, 경쟁 브랜드의 차별화 전략 등
  • 사용자 성향 : 주 사용자의 연령, 성별, 기호, 심리, 행동 패턴 등
  • 기능적 요구 사항 : 서비스 환경, 필수 요소 등
  • 디자인 제약 조건 : 기업 CI 사용 규정, 기업 선호 색상 · 디자인 콘셉트 등
  • 업무 흐름 : 의사 결정권자 및 프로젝트 매니저의 디자인 성향 등



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

콘셉트 시각화 디자인 요소

콘셉트를 시각화할 수 있는 디자인 요소에는 컬러(Color), 이미지(Image), 타입(Type), 레이아웃(Layout)등이 있는데, 컬러는 사용자에게 해당 상품에 대한 첫 인상으로서 연상 작용을 일으키는 매우 중요한 요소이다. 이미지는 해당 상푸멩 대한 키워드를 시각적으로 구체화시키는 요소로서 사진, 그림, 동영상 등으로 표현된다. 타입은 가독성을 중심으로 본문 내용에서 주로 다루어지는 요소이나, 시각적 이미지로 사용되기도 한다. 레이아웃은 앞 3가지 요소의 조화에 의한 결과로, 디지털 디자인 분야에서는 주로 사용성을 중심으로 이루어지는 요소이나 때로는 실험적인 시도도 가능하다.

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

톤&매너(Tone&Manner)

톤&매너(Tone&Manner)는 모든 디자인 분야에서 작업물의 색상 분위기난 방향성, 그리고 표현 방법에 관한 전반적인 것을 말하는 것으로 디자인의 기획 단계에서 다루는 시각적인 분위기를 말한다. Tone&Manner가 결정이 되면 그에 맞춰 세부적인 컬러, 이미지, 표현 방법, 타입, 레이아웃 등의 디자인 요소가 일관된 형태로 진행한다.




훈련일 2017. 07. 05(수)
훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
교과목명 스마트기기 UX/UI 디자인(디지털디자인) 기본
능력단위명 디지털디자인 프로젝트 분석 설계
능력단위요소 정보구조 설계 시나리오 작성하기(0802010402_13v1)
이름 백초희

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

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

에스노그레피 조사(Ethnography Research)

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

정보 구조와 유형(Information Architecture)

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

네비게이션(Navigation) 유형

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



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

아이디어 발상법

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

데이터의 종류

  1. 매체 성격에 따른 분류 : 외부 데이터와 내부 데이터

    외부 데이터는 인터넷 외부에서 얻어지는 모든 데이터를 의미한다. 시장 정보나 주식 정보 등과 같이 인터넷이 등장하기 이전에 데이터화되어 사용자에게 제공되던 정보를 인터넷 데이터로 전환 시킨 것이다.
    내부 데이터는 인터넷에 관련된 정보를 제공하는 콘텐츠이다. '어떤 정보를 어디서 얻을 수 있는 지'등의 데이터로, 검색 엔진에서 많이 활용되는 데이터나 비디오 클립, MP3 파일과 같은 데이터를 뜻한다.

  2. 데이터 생성에 따른 분류 : 프로듀서 데이터, 컨슈머 데이터

    프로듀서 데이터는 인터넷 초창기에 주류를 이루었던 것으로, 사이트 제작자가 일방적으로 제공하는 콘텐츠를 뜻한다.
    컨슈머 데이터는 사이트의 사용자들이 만들어서 제공하는 데이터를 뜻한다. 비슷한 개념으로 사용자가 상업적인 의도가 없이 제작한 콘텐츠를 온라인 상으로 나타낸 UCC(User Created Contents)가 있다. 최근에는 프로페셔널(Professional)과 아마추어(Amateur)의 합성어인 프로추어(Proteur)들이 자신의 블로그 등을 통해 제공하는 콘텐츠인 PCC(Proteur Created Contents)도 생겼다.

  3. 데이터 사용에 따른 분류 : 유료 데이터, 무료 데이터

    유료 데이터는 시간당 또는 건당으로 사용자에게 요금을 받는 콘텐츠를 뜻한다.
    무료 데이터는 사용자가 인터넷에 접속하면 언제든지 별도의비용 없이 이용할 수 있는 콘텐츠를 뜻한다.

  4. 프로슈머적 데이터

    프로슈머(Prosumer)는 판매나 교환을 위해서라기보다는 자신의 사용이나 만족을 위해 제품, 서비스, 경험을 생산하는 사람을 말한다. 사용자들의 콘텐츠를 사이트에서 직접 받아들이는 방식으로 게시판이나 블로그 형태가 있다. 사용자 입장에서는 사이트에 직접 참여한다는 의식이 사이트에 대한 차며도(royalty)를 가질 수 있게 한다. 엘빈 토플러(Alvin Toffler) 가 "제3의 물결"에서 '앞으로는 소비자가 신제품 개발에 직간접적으로 참여하게 될 것' 이라고 예견하면서 도입된 개념이다.

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




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

데이터의 유형

  1. 사실(Fact)

    누구나 이해할 수 있는 객관적이고 구체적인 자료이다. 이 데이터는 정보의 양은 적은 편이나, 구체성으 높고, 데이터 자체의 난이도는 낮은 특징을 보인다. '사실'과 관련된 자료는 주로 텍스트 중심으로 제공되지만, 최근 들어 사용자의 직관적인 이해를 돕기 위해 추가적인 이미지나 동영상지 제공되지도 한다.

  2. 개념(Concept)

    특정 대상에 대한 이해를 돕기 위해 사용하는 정의 또는 특정 아이템이 어던 개념과 효능을 지녔는지에 대한 정보를 말한다. 웹 사이트에서 제시하는 정보 이외에도 현실적으로 서비스의 기능이나 용도 도는 특징에 대한 설명을 '개념' 이라는 방법으로 제시하는 경우도 많다. 멀티미디어 콘텐츠가 일반화되면서 간단한 그림이나 동영상을 함께 사용하는 경우도 많아지고 있다.

  3. 절차(Procedure)

    사용자가 수행해야 하는 순간적인 행위를 지정해 주는 자료로, 시스템을 사용하기 위해 사용자가 어떤 작업을 어던 순서에 따라 수행해야 하는지를 알려 준다. 과거에는 텍스트와 그림 중심으로 표현되었지만, 단계별로 시스템의 상태와 사용자의 동작을 동영상으로 보여 줌으로써 사용자의 이해를 높이고자 하는 추세를 보이고 있다.

  4. 원리(Principle)

    특정 아이템의 구체적 작동 원리 및 진행 과정에 대한 자료를 의미한다.

  5. 원칙(Rule)

    시스템의 사용자에게 제시하는 일종의 가이드라인의 개념으로, 시스템 이용 시 사용자가 준수할 행동 요령에 대한 내용이다. '원칙'은 사용자에게 준수하도록 직접 요구하는 형식을 취할 수 있고, 성공 사례 등을 제공하는 것처럼 간접적인 형식을 취할 수도 있다.

  6. 이야기(Story)

    실제 있었거나 만들어낸 특정 경험을 의미한다. 블로그나 개인 홈페이지를 통해 공개되는 유혀으이 자료는 대부분 비공식적이며 무료로 제공되고, 생산 주체와 소비 주체가 같다는 특징을 가진다. '이야기'는 주로 텍스트 형태나 웹툰처럼 만화 형식으로 전달된다.

  7. 의견(Opinion)

    어떤 대상이나 사안에 대해 사용자가 가지고 있는 개인적인 생각을 의미한다. '의견'은 인터넷을 통해 양방향성이 증가하면서 호가산되기 시작한 자료의 유형이다.

  8. 묘사(Description)

    특정 대상의 현재 상태를 여러 방식으로 표현하는 자료이다. 이미지와 멀티미디어적 자료는 사용자의 감성에 영향을 주며 개인적인 취향과 관련이 있는 자료 유형으로, 사용자의 주관적인 선호도에 자료의 가치가 좌우된다.

  9. 예측(Forecast)

    이미 있는 기초데이터를 수집하여 그것을 확률이나 통계와 같은 추가적인 분석을 거쳐 향후 추세를 예상하는 자료이다. 따라서 기존의 사실이나 원리 등의 자료를 기반으로 추가적인 작업을 통해 발생하는 부가 정보라고 할 수 있다.

  10. 메타데이터(Meta-Data)

    데이터에 관한 구조화된 데이터로, 다른 데이터를 설명해 주는 데이터이다. 일반적으로 정보의 위치와 내용, 작성자에 대한 정보를 담고 있으며, 주로 정보를 표현하기 위한 목적과 빨리 찾기 위한 목적으로 사용되고 있다.

저작권

  1. 저작권(Copyright)

    소설, 시, 음악, 미술 작품과 같은 저작물을 창작한 저작의 권리를 말하며, 저작자의 허락 없이 다른 사람이 저작물을 이용할 수 없게 하는 배타적 권리이다. 저작물은 인간의 사상 또는 감정을 표현한 창작물을 뜻하므로, 사실을 그대로 기록한 것은 저작원의 보호를 받지 못한다. 다라서 전화번호부의 성명과 전화번호를 단순히 가나다순으로 정리한 것은 저작권의 보호를 받을 수 없다. 또한 독창적이라 하더라도 글이나, 그림, 음악 등으로 표현된 사상이나 감정만 저작권의 보호를 받을 수 있다. 저작권으로 보호되는 것은 사상이나 감정의 독창적 표현이지 사상이나 감정 자체가 아니기 때문이다.

  2. 저작물의 종류
    • 소설, 시, 논문, 강연, 연설, 각본, 그 밖의 어문 저작물
    • 음악 저작물
    • 연극 및 무용, 무언극, 그 밖의 연극 저작물
    • 회화, 서예, 조각, 판화, 공예, 응용 미술 저작물, 그 밖의 미술 저작물
    • 건축물, 건축을 위한 모형 및 설계 도서, 그 밖의 건축 저작물
    • 사진 저작물(이와 유사한 방법으로 제작된 것을 포함한다.)
    • 영상 저작물
    • 지도, 도표, 설계도, 약도, 모형, 그 밖의 도형 저작물
    • 컴퓨터 프로그램 저작물
    • 2차적 저작물(원저작물을 번역 · 편곡 · 변형 · 각색 · 영상 제작, 그 밖의 방법으로 작성한 창작물)

좋은 디자인 조건

시대와 사회에 따라 디자인의 의미가 변하고, 많은 사람들의 다양한 생각과 개성만큼 디자인의 다양한 의미가 전개되었다. 대다수의 사람들이 동의하는 가장 기본적 인 디자인의 요건은 기능에 충실하게 만들어져 소비자의 필요한 미학적 요구를 동시에 충족시키는 것이다. 디터 람스(Dieter Rams. 1961-1995)의 좋은 디자인 십계명은 다음과 같다.

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



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



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

시각화의 정의

일반적으로 시각화라는 용어는 '대뇌에서 시작적 이미지를 만드는 것'의 의미로 쓰이지만, 정보 사회에 접어들어 보다 체계적이고 수용자가 중심이 되는 정보가 필요해짐에 따라 '정보의 구성 요소인 데이터나 콘셉트의 그래픽적 표현' 이라는 의미를 가지게 되었다. 즉, 시곽화의 정의는 '설계하는 이미지가 아닌, 의사 결정을 돕기 위한 외부적 인공물'로 그 범위가 확대었다.

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

시각화 단계

  • 1단계 : 에스키스(Esquisse)

    자신의 구상을 간략하면서도 빠른 속도로 그리는 단계로, 이 단계에서 개념상의 문제를 검토하고, 최종 그림의 토대를 세운다.

    1. 간략하고 빠른 속도로 그리는 그림이므로, 최선의 해결책에 접근할 수 있을 때까지 많은 그림을 그려 볼 수 있다.
    2. 많은 그림을 그리므로 수시로 자신의 아이디어를 검토해 볼 수 있다.
    3. 최종 그림의 결과를 어느 정도 예측해 볼 수 있다.
    4. 많은 그림을 중요도에 따라 순서를 정할 수 있다.
  • 2단계 : 덮어놓고 그리기

    1단계에서 검토한 그림을 정리해 나가는 과정으로, 에스키스한 그림 위에 트레이싱 페이퍼를 얹고, 잘못된 부분을 수정하는 단계이다. 1단계에서 체크하지 못한 부분이 있거나새로운 아이디어가 나타난 경우에는 1단계로 다시 피드백한다.

  • 3단계 : 정리

    자신의 아이디어를 제대로 전달하기 위해 보는 사람의 입장을 충분히 고려한다. 이 단계에서 디자이너가 염두해 두어야 할 사항은 고안된 디자이느이 클라이언트의 입장을 충분히 반영하여야 한다는 것이다.

  • 4단계 : 완성

    명암, 반영, 채색 등을 통하여 아이디어의 표현을 극대화한다.

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

  1. 형태적 요소

    레이아웃 형식화 과정의 첫 단계로 레이아웃의 척추를 만드는 일이다. 형태적 요소로는 레이아웃의 균형을 만드는 데 있어 크게 네 가지로 대칭적 균형, 비대칭적 균형, 원심적 균형, 결정 구조적 균형으로 나뉜다.

  2. 초점선

    형태적 요소는 결정한 레이아웃의 균형을 바탕으로 시각 운동을 표현하는 선들을 그어, 선들이 겹치는 부분들에 의도적으로 처점과 강조를 결정하고, 지원 초점들을 따라 시각 방향으로 연구한다.

  3. 구성 막대

    초점과 지원 초점을 연결하는 시각 방향에 맞추어 구성 막대를 사용하여 레이아웃의 구성에 대한 시각적 감성을 결정한다. 시각적 감성을 조절할 수 있는 구성 막대는 좌측과 우측에 서로 반대되는 형용사를 사용한다. 구성 막대의 좌축 끝에는 '조용함'이 있고, 우측 끝에는 '활기참'이 있다. 이 두 조건의 가치 사이를 조정할 수 있는데, '조용함'에 가까울 수도 있고, '활기참'에 가까울 수도 있다. 구성 막대에 의한 조건에 대한 가치는 모양, 굵기, 여백, 각도로 표현 할 수 있다.

  4. 시각 계층 막대

    시각적인 요소의 중요성을 지시 대상과 함축 대상을 중심으로 진행한다. 시각 계층 막대는 한 개 이상을 만들 수 잇는데, 막대마다 시각적 요소를 구분한다. 시각 계층 막대는 수직으로 표현되어 막대의 우쪽 부분은 지시 대상을 표현하고, 아래 부분은 함축 대상을 표현한다.




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

그리드 시스템 개념

195년경 스위스에 계발, 처음 사용되었으며, 40년대 후반에 그리드 시스템에 입각하여 디자인된 첫번째 인쇄물 견본이 나왔다. 이 새로운 추세의 특징은 엄격한 원리에 입각한 본문과 일러스트레이션의 배치, 모든 페이지 레이아웃의 통일성, 그리고 주제 표현의 객관성을 나타내고 있는 것이다. 즉, 눈을 통해 받아 들이는 각종 정보를 보다 신속하게 그리고 오랫동안 기억할 수 있도록 심리적인 측면을 고려한 시각 디자인의 원리이다.이러한 그리드 시스템을 일반적인 감각적 디자인과 비교 할 때 다음과 같은 차이점을 나타내고 있다.

  1. 디자인의 질서를 나타내고 있다.
  2. 디자인의 명확한 논리성을 제시하고 있다.
  3. 주제의 객관적 파악을 손쉽게 해주고 있다
  4. 디자이너의 창의력을 무한히 발전시킬 수 있다.
  5. 오랫동안 기억하도록 해준다.
  6. 어떠한 시각 디자인에서도 모두 정확한 적용이 가능하다.

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

  1. 포토샵

    미국의 어도비사가 1990년에 발표한 그래픽 소프트웨어로서 이미지 합성기능,문자디자인 기능 등을 기반으로 한 홍보 포스터,책 표지 등의 편집 디자인 등 다양한 그래픽 젼집 기능을 지원한다. 또한 웹 그래픽 제작을 위해 이미지레디 프로그램이 포함되어 있다.

  2. 페인터

    페인터는 잘 정비된 아티스트의 스튜디오와 같다. 텍스쳐 표면, 브러시와 도구로 분필,파스텔,그림물감,유화문감,크레용,연필,펠트펜,잉크 등으로 그리는 효과를 낼수있다. 게다가 이미지 호스, 패턴 펜, 복제기능, 특수효과와 같은 많은 비정통적인 도구를 제공한다.

  3. 페인트샵 프로

    복잡한 기능을 필요로 하지 않는 편집에서 가장 간편하게 사용할수 있는 편집 소프트웨어이다. 다양한 비트맵과 벡터 그래픽 형식을 지원하며 스캐너와 같은 외부 입력장치로분터 직접 연결하여 이미지 스캔 결화를 바로 편집할 수 있으며 윈도우 캡쳐 기능이 있어서 화면에 보이는 이미지를 바로 캡쳐해서 이미지를 편집할 수 있다.

  4. 코렐 드로우

    코렐사에서 개발한 드로잉 계열의 프로그램이다. 다양한 형태의 이미지 변형,다른 그래픽 파일과의 호환성, 다양한 폰트 등을 지원하는 그래픽 도구로써 2차원, 3차원 이미지를 손쉽게 제작할수 있다.

  5. 일러스트레이터

    어도비사에서 페이지 디자인,각종 로고 디자인,패턴 디자인 등 다양한 종류의 그래픽 디자인 제작을 위한 개발한 프로그램이다.현재 디자인 작품제작에 많이 사용하고 있으며 독자적인 테이터 형식인 EPS파일 형식 파일도 지원하기 때문에 다른 페인팅 계열의 프로그램과의 호환성도 우수하다.

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

웹에서 보이는 컬러는 동일한 컬러일지라도 모니터, 운영 체제, 비트 심도, 웹 브라우저의 종류에 따라 다르게 나타난다. 216 웹 안전색(216 web Safety coloor)은 이러한 호나경이 달라지더라도 변하지 않는 안전한 색으로 이루어진 팔레트이다. 웹 안전색은 호환성을 위핸 16,777,216가지나 되는 색의 가짓수를 대폭 줄여서 표준으로 설정한 색을 말한다. 웹 안전 색상의 색값은 모두 51의 배수로 이루어져 있는데, 이는 최대값인 255를 5로 나눈 것이다. 재현되는 색의 조합으로 210가지의 유채색과 6가지의 무채색으로 표현 가능한 가짓수는 모두 216가지이다.

  1. 단색 이미지 공간

    색채 이미지는 색상(Hue)보다는 색조(Tone)에 의해 판단되는 경우가 많다. 선명한 색조는 부드럽고 동적인 이미지에 가까우며, 어두운 톤은 딱따한 이미지에 가깝다. 수수한 톤은 정적이고 딱딱한 이미지에, 부드러운 톤은 부드럽고 정적인 이미지에 치우쳐 있다. 이것은 색상보다는 색조가 이미지를 변화시키는 데 더 중요한 변수임을 보여 준다

  2. 배색 이미지 공간

    색을 디자인에 적용할 때에 한 가지 색만 사용하는 경우는 거의 없다. 배색 이미지 공간에서 은은하고 부드러운 느낌의 배색은 부드럽고 정적인 이미지에 위치하며, 밝고 선명한 느낌의 배색은 부드럽고 동적인 이미지에 위치한다.




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

그리드 시스템 샘플 이미지

디자인 작업1 디자인 작업2 디자인 작업3


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

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

  1. 유닛 (UNITS)

    유닛은 페이지에서 가장 작은 수직적 구분으로, 대개 어떤 의미 있는 콘텐츠를 수용하기에는 작지만 그리드를 구축하기 위한 가장 기본적인 그리드입니다. 유닛 (UNITS)


  2. 칼럼, 열 (COLUMNS)

    칼럼은 그룹으로 묶인 유닛의 집합입니다. 예를 들어, 기본 12개 유닛의 그리드 시스템에서 6개 씩 2열로 묶거나 4개 씩 3열, 또는 2개 씩 6열로 묶어 나눌 수 있습니다. 칼럼의 크기가 작을수록 다양한 측정이 가능합니다. 칼럼, 열 (COLUMNS)


  3. 영역 (REGIONS)

    영역은 페이지 레이아웃의 기초를 형성하는 칼럼의 그룹입니다. 예를 들어, 8개의 칼럼으로 구분된 16 유닛 그리드 시스템은 6개의 칼럼과 2개의 칼럼, 두 영역으로 나눌 수 있습니다. 이렇게 하여 본문과 사이드 영역이 있는 기본적인 페이지 레이아웃을 구성할 수 있습니다. 영역 (REGIONS)


  4. 베이스 라인 (BASELINE)

    베이스 라인은 서체가 놓이는 수평선을 가리키는 타이포그래피 시스템입니다. 콘텐츠에 수직 방향의 리듬감을 주며, 그리드에 포함되는 유용한 도구입니다. 베이스 라인 (BASELINE)


  5. 필드 (FIELDS)

    필드는 페이지를 수평으로 분할한 것입니다. 요소를 수직적으로 배치하고 섹션을 동일하게 분할하는 기준으로 베이스 라인 그리드를 사용합니다. 필드 (FIELDS)





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

이미지의 형식과 종류 정리

이미지 파일은 일정한 규약에 의해 디지털 정보로 저장되며, 데이터 파일로 포맷이 이루어진다.

  1. psd

    포토샾의 기본 포맷 방식이다. 이미지의 레이어, 채널, 패스 등으로 작업한 정보를 저장할 수 있으며, 수정, 보완, 재사용이 가능하도록 다양한 작업 정보를 갖지만, 용량이 커지는 단점이 있다.

  2. bmp

    비트맵 이미지의 대표적 파일 형식으로, 입출력 속도는 바르지만 압축하지 않은 상태로 저장한다

  3. gif

    웹의 표준 그래픽 포맷으로 널리 쓰인다. 8비트의 256색상까지 표현할 수 있고, 투명한 배경의 이미지나 여러 장의 이미지를 연결하여 동영상 이미지를 만들 수도 있다.

  4. eps

    인쇄 등 출력을 위한 포맷 방식으로, 포스트스크립트 언어를 기반으로 한다.

  5. pdf

    포스트스크립트의 한 변형으로, 문서를 이미지 형태로 보여 주는 파일 형식이다. 용량이 적고 호환성이 뛰어나다.

  6. png

    gif나 jpg보다 압축률이 좋으며, 투명한 배경을 저장할 수 있다.

  7. tiff

    대부분의 이미지 모드를 지원하며, 윈도 및 맥 환경에서 곧통으로 사용할 수 잇는 호환성을 가지고 있다.

  8. jpg

    웹페이지를 제작할 때 많이 사용하는 이미지 파일 형식으로, 24비트 색상을 지원하여 이미지 손실이 적고 원하는 이미지의 품질을 지정할 수 있다.

  • 파일 포맷
    • 비트맵 이미지(레스터 방식) : jpg, bmp, tiff,gif, png
    • 벡터이미지(포스트스크립트 방식) : aim pict, cdr
  • 프로그램
    • 비트맵 이미지(레스터 방식) : 포토샵, 페인트샵, 프로
    • 벡터이미지(포스트스크립트 방식) : 일러스트레이터, 코렐드로

영상 파일의 종류 정리

  1. mpeg

    "moving picture exports group"의 약자로 국제 표준 영상 파일이며, PC에서는 주로 .mpg확장자로 표시한다. mpeg는 일반적인 동영상 파일을 고압축하여 파일의 크기를 획기적으로 줄여 놓은 것으로 화질 면에서도 뒤어나다.

  2. avi

    소리와 영상이 번갈아 기록된다는 뜻을 갖고 있으며, 압축률이 높지 앟아 파일 크기가 크지만 제작 시에 여러 가지 압축 코덱을 사용하여 파일 크기를 줄일 수 있다.

  3. mov

    맥의 표준으로 사용되는 동영상 파일이다.

  4. asf

    통신망에서 실시간으로 멀티미디어 서비스를 받는 데 최적화되어 있다. 또한 소리 파일로 쓰일 수 있어서 mp3와 비슷하면서도 파일 크기가 더 작다. 영상, 소리, 그림, URL, 응용 프로그램까지 들어 있다.

  5. divx

    MS 사가 스트리밍용으로 mpeg4를 수정하여 만든 것으로, 영상을 줄이고 mp3를 써서 소리트랙을 줄였으나 화질이나 소리는 mpeg4와 거의 같다.

소리 파일의 종류 정리

  1. wav

    윈도 운영 체제의 기본 소리 파일 형식으로, 다른 저장 방식에 비패 파일 크기가 매우 커서 효과음, 편집, 음악 CD 제작에 쓰인다.

  2. mp3

    사람이 들을 수 있는 신호만 모아서 압축(청각 심리 모델)하여 웨이브 파일의 약 1/50로 크기를 줄였으며, 스테레오 음악용으로 많이 쓰인다.

  3. ogg

    mp3의 유료화에 반대하여 만들어진 공개된 소리 파일 형식이다. 가변 비트 레이트를 써서 크기를 줄이고 중저음을 잘 살려서 음질도 손색이 없다.

  4. ra

    인터넷에서 처음으로 스트리밍 기술을 활용한 소리 파일 형식이다.

  5. au

    선마이크로시스템즈 사에서 표준으로 채택한 파일 형식으로, 유닉스 운영 체제 환경과 자바 프로그래밍 언어에서 쓰인다.

  6. midi

    미디는 컴퓨터 전자 악기, 전자 악기 사이의 정보 교환을 위한 규격이다. 디지털 소리 신호가 들어 있는 것이 아니라 소리를 내게 하는 명령이 들어 있다. 파일 크기가 매우 작다는 장점이 있으나, 사운드 카드와 스피커 수준에 따라 음질의 차이가 있다.

레이아웃 연습

  • 레이아웃1 바로가기
  • 레이아웃2 바로가기
  • 레이아웃3 바로가기
  • 레이아웃4 바로가기
  • 레이아웃5 바로가기
  • 레이아웃6 바로가기



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

    UI(User Interface)

    UI란 사람이 사용자가 되어 어떠한 사물이나 기계 장치, 컴퓨터 프로그램 등과 의사소통을 하려는 목적으로 만들어진 물리적 또는 가상적 매개체를 뜻한다. UI는 사용자가 사물을 조작하는 입력 시스템과 사물이 사용자의 입력에 반응하여 결과를 보여 주는 출력 시스템으로 나뉜다. UI를 평가 할 때의 사용성의 정의는 '인터페이스를 사용함에 있어서 사용자가 생리학적, 심리적인 측면에서 지각하는 효과성과 효율성의 정도' 라고 할 수 있다. 효율적으로 입력하여 효과적으로 출력을 얻어 내는 것이 UI가 지향해야 할 목표라고 할 수 있다.

    UX(User Experience)

    UX, 즉 사용자 경험이란 제품을 사용하면서 내재화되는 모든 것을 의미하여 여기에는 경험을 비록하여 느낌, 기억, 만족감 등도 포함된다. 이런 사용자 경험을 디자인하는 사용자 경험 디자인이란, 사용자가 어떤 시스템, 제품, 서비스를 직 간접적으로 이용하면서 느끼고 생각하게 되는 총체적 경험을 말한다. 이는 단순히 기능이나 절차상의 만족분 아니라 전반적인 지각 가능한 모든 면에서 사용자가 참여, 사용, 관찰하고, 상호 교감을 통해서 알 수 있는 가치 있는 경험이다. 그러므로 사용자 경험은 우리가 만드는 것이 아니라, 개인이 마음 속에 가지고 있는 주관적인 경험을 바탕으로 하며, 제품과 사용자가 인터렉션을 하는 과정에서 발생한다.




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

    프로타이핑의 개념 및 목적

    1. 프로토타이핑의 개념

      개발자들과 사용자들의 의사소통상의 효과를 증진시키기 위하여 취하는 시스템 개발 기법이다. 프로토타이핑 기법을 수행 할 때 중요한 점은 개발자와 사용자 간의 상호 이해 및 지식 교환을 위한 작업이라는 점을 명심하는 것이다. 일반적인 분석 방법을 취할 경우 양자 간에 서로 다른 이해를 가져올 수 있으므로, 프로토타입이라는 의사소통 도구를 만들자는 것이다.

    2. 프로토타이핑의 목적

      먼저, 오직 사용자의 요구 분석이 목적인 경우 폐기 처분용 프로토타입을 만들 수 있고, 둘재 가급적 빨리 개발해야 하는 경우 4GL 등을 써서 개발하는 Quick and dirty 프로토타입이 있다. 셋째 상세 설계와 구현까지 마친 다음 대량 생산에 앞서 시험용으로 개발된 프로토타입이 있을 수 있다. 넷재로, 입출력의사례를 보여줄 뿐 실제 데이터도 없고 절차 논리도 구현되지 않는 프로토타입이 있으며, 마지막으로 개발된 프로토타입을 계속 진화시켜 나감으로써 최종적인 시스템으로 발전시키는 진화형 프로토타입이 있다.




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

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

    웹 사이트 사용성 테스트는 사용자와 사용 환경을 고려하여 좀 더 쓰기 쉬운 제품 또는 웹 사이트를 만들고자 연구하는 HSCI, UCD, MMI 등 다양한 연구 분야와 밀접하게 연관되어 있다. 1990년대에 웹이 바른 속도로 전파됨에 따라 디자인이 잘못되었거나 필수적인 기능이 결여되어 본연의 역활을 하지 못하는 웹 사이트들이 생겨났고, 또한 웹 사이트를 통해 사람들이 업무 및 거래를 하게 되면서 웹 사이트 내에서 발생하는 인지적 문제를 해소하기 위한 본격적인 연구가 진행되기 시작했다.

    사용자 조사 방법론의 구분

    사용자 조사를 수행하기 위해서는 다양한 방법을 사용할 수 있다. 통계적인 조사를 할 수도 있고, 직접 인터뷰를 수행할 수도 있고, 그룹을 모아 토론을 진행할 수도 있다. 사용자 조사를 위해서 자료를 얻는 방법에는 크게 두 가지가 있다. 하나는 사용자의 행동을 축정하는 방법이고, 다른 하나는 사용자의 태도를 이용하는 방법이다. 사용자 행동에 대한 측정은 주로 다양한 측정 장비를 통해 이루어진다. 장비를 통해 사용자의 마우스 이동과 클릭 상황, 페이지에 머루른 시간 등을 측정할 수 있으며, 시선 추적 장치를 이용하면 사용자 시선의 이동을 측정할 수도 있다. 사이트의 로그를 기록하고 있었다면 이것을 분석하여 다수의 사용자에 대한 특성을 파악하고, 그들의 행동 패턴을 분석할 수도 있다.
    사용자들의 태도를 분석하면 그들이 왜, 어떤 이유로 행동하는지 알 수 있다. 사용자의 태도를 팍악하기 위해서는 그들에게 질문을 하고, 대답을 들어야 하는데, 설문 조사와 포커스 그룹 등이 이에 해당하는 조사 방법이다. 사용자의 태도를 파악하는 이런 방법들은 고전적인 마케팅 조사에서 사용되던 것들이어서 마케팅 부서에서 익숙한 방법론들이다. 사내에서 이와 같은 조사를 진행 하는 경우 마케팅 부서와 함게 진행하는 것이 수월하고, 효과적인 방법이 될 수 있다. 사용자 조사 방법론은 조사를 접근하는 방법에 다라서 두 가지로 나눌 수 있다. 사용자들의 행동을 내용에 대해서 질적으로 분석하는 정성적 방법과, 그들의 행동을 수치를 이용하여 양적으로 부석하는 정량적인 방법이다. 이 조사 방법들은 각각 다른 특성을 가지므로, 원하는 결과에 따라 적당한 방법론을 사용해야 한다. 정량 조사는 구조화된 설문을 이용하여 조사를 진행하는데, 조사를 위한 기초 자료가 충분하지 않은 경우에는 의미 있는 설문을 작성할 수 없는 경우가 많다. 이런 경우 우선 정성 조사를 통해 가설 정보를 확보하고, 그것을 이용하여 정량 조사를 실시 할 수 있다.


    정성적 조사

    • 질적인 조사, 내용에 대한 분석
    • 사용자를 한 개인으로 이해
    • 적은 수의 표본 이용
    • 직접적인 사용자 자소(인터뷰 등)
    • 비 구조적이고 유동적인 진행 추가 질문, 질문 내용 변경 가능
    • 이해, 발견, 진단, 동찰
    • 응답과 대응 중심적-왜(why)에 관심
    • 장점 : 추가 질문 등 유동적 진행 가능
    • 단점 : 분석이 어렵고 객관적이지 못함

    정량적 조사

    • 양적인 조사, 수치에 대한 분석
    • 사용자를 전체 사용자의 일부로 이해
    • 많은 수의 표본 이용
    • 간접적인 사용자 조사(로그 분석 등)
    • 미리 정의되고 구조화된 설문 이용 조사 방식 변경 불가
    • 측정, 감시, 추정, 예측
    • 질문 중심적-무엇을(what), 언제(when), 어떻게(how)에 관심
    • 장점 : 빠른 분석 가능
    • 단점 : 사용자 응답의 이유를 알기 어려움

    사용자 조사 방법론의 종류

    사용자 조사 방법론은 크게 정량적인 방법과 정성적인 방법으로 나누고, 그것을 다시 사용자 행동과 사용자 태도로 나눈다. 이렇게 할 경우 4개의 사분면이 만들어지는데, 각각의 사분면에 속하는 방법론들은 해당 영역의 특징을 주로 가는 것들이다. 그리고 하나의 영역에 속하지 않고 여러개의 사분면에 걸쳐 있는 방법론들도 있다.
    1. 1사분면

      사용자 행동에 대해 간접적으로 분석하는 방법론들이 위치한다. 웹 로그 분석과 A/B 테스트, 사용자 패널에 대한 조사는 사용자의 행동을 정량적으로 조사하는 방법들이다.

    2. 2사분면

      사용자의 행동을 직접 조사하는 방법들이 위치한다. 유저빌리티 테스트, 아이트래킹, 유저빌리티 벤치바킹이 이 영역에 속하며, 이 방법들을 이용하여 사용자의 행동을 분석하고, 그것의 의미를 파악 할 수 있다.

    3. 3사분면

      사용자의 태도를 직접 조사하는 방법들이 위치한다. 대표적인 기법인 사용자 인터뷰와 포커스 그룹을 비롯하여 참여 디자인, 그룹 작업 조사, 요구 사항 조사, 다이어리, 카메라 조사 등이 여기에 속한다.

    4. 4사분면

      사용자의 태도를 간접적으로 조사하는 방법들이 나열되어 있다. 사용자 설문과 고객 지원 자료 분석이 이 영역에 속한다.

    5. 2,3사분면과 3,4사분면

      혼합 형태로 사용자의 태도와 행동을 직접 조사하는 방법으로는 필드 스터디가 있고, 3,4분면의 혼합 형태로 사용자의 태도에 대한 전반적인 조사를 수행한느 방법으로는 카드 소팅이 있다.
      각각의 박법론에는 여러 가지 변형이 있을 수 있다. 사용자 인터뷰의 경우 대면 인터뷰가 널리 알려져 있지만, 전화나 채팅 등을 이용한 비대면 인터뷰도 진행할 수 있다. 카드 소팅의 경우에도 일대일로 진행하는 카드 소팅이 기본이지만, 시간을 줄이기 위해서 참석자를 한꺼번에 모아 동시에 카드 소팅을 진행할 수도 있다. 이와 같이 다양한 방법론을 자신의 상황에 맞게 잘 응용하는 것이 중요하다. 넓은 의미에서 사용자 조사는 방법론 그림의 전체 영역을 이야기 한다. 하지만 로그 분석과 같은 정량적인 방법들은 사용자를 직접 만나서 조사를 수행하는 것이 아니므로, 사용자 조사라는 용어를 사요할 때 포함시키지 않고 통계의 영역으로 보는 경우도 있다.




    훈련일 2017. 07. 21(금)
    훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
    교과목명 스마트기기 UX/UI 디자인(디지털디자인) 제작
    능력단위명 프로토타입 제작
    능력단위요소 사용성 테스트하기
    이름 백초희

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

    1. 네티즌 이해

      보편적인 네티즌의 경향성에 대하여 이해한다. 수치로 드러난 조사 자료를 바탕으로 사이트의 목표 대상이 될 사용자에 대해 다소 추상적이더라도 그들만의 특성을 정리할 수 있다.

    2. 트렌드

      디지털 문화의 트렌드, 온라인 공간의 트렌드, 웹 사이트의 트렌드, 소비자 라이프 스타일 트렌드 등의 정보를 꾸준히 살펴보는 것이 필요하다.

    3. 소비자 심리

      웹 사이트의 사용자는 웹 사이트를 이용할 때 기본적인 이용 경험이나 요구 사항이 충족되어야만 그 다음 욕구 단계로 이동한다. 즉, 기본적인 요구 사항에 대한 충족이 이루어지지 않으면 그 다음 단계로 진행하지 않고 바로 해당 웹 사이트를 나가버릴 수 있다. 소비자의 경험욕구를 다루는 이론이나 최근 소비자 동향 조사 자료를 살펴 보는 것이 도움이 된다.

    4. 벤치마킹

      목표 대상이 비슷한 사이트들에서 사용자 분석과 이해의 단서를 찾는다. 동일한 목표 사용자를 가진 타 사이트에서는 어떻게 접근했는지, 어떤 효과를 얻었는지에 대한 벤치마킹도 필요하다.

    5. 포커스 그룹 인터뷰(Focus Group Interview)

      만들고자 하는 사이트의 목표 사용자를 명확하게 가려내야 한다. 추상적인 누군가가 아니라, 구체 적인 이미를 가진 실체들을 먼저 가려내고, 그들에게 무엇을 어떻게 물어볼 것인지를 정한다.




    훈련일 2017. 07. 24(월)
    훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
    교과목명 스마트기기 UX/UI 디자인(디지털디자인) 제작
    능력단위명 다지인 구성요소 제작
    능력단위요소 스토리보드 제작하기(0802010404_13v1)
    이름 백초희

    정보의 설계

    기획 공학(Planning Sciencce), 정보 디자인(Information Design), 유저 인터페이스 (User Interface), 그래픽 디자인(Graphic Design), 컴퓨터 그래픽(Computer Graphic) 운영 등 필요 지식을 기반으로 정보를 계층화하고 설계해야 한다.

    1. 웹 사이트의 정보 구조 이해
    2. 정보 내비게이션 구조의 이해 및 분석 능력
    3. 웹 사이트 구축에 대한 제반 기능의 이해와 사용 툴의 운용 능력 보유

    정보설계란, 웹 사이트 및 디지털디바이스 기반의 사용자에게 정보를 정확하고 원활하게 제공하기 위해 정보 체계를 세우고 설계하는 것을 의미한다.

    1. 정보 체계와 정보의 구조화(웹 사이트의 정보 구조화와 메뉴 구조화)
    2. 내비게이션
    3. 레이블링, 정보 색인, 검색 등이 포함



    훈련일 2017. 07. 25(화)
    훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
    교과목명 스마트기기 UX/UI 디자인(디지털디자인) 제작
    능력단위명 다지인 구성요소 제작
    능력단위요소 스토리보드 제작하기(0802010404_13v1)
    이름 백초희

    와이어 프레임

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




    훈련일 2017. 07. 26(수)
    훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
    교과목명 스마트기기 UX/UI 디자인(디지털디자인) 제작
    능력단위명 다지인 구성요소 제작
    능력단위요소 스토리보드 제작하기(0802010404_13v1)
    이름 백초희

    스토리보드의 구성

    스토리보드란 화면의 구성에 대한 아이디어 스케치이다. 즉, 화면 구성에서 각 화면에 대한 저으이, 기능 저으이, 서비스 흐름도의 역활을 하게 된다. 웹 제작 전체의 프로세스상에서 실제 제작의 전 단계이며, 요구 분석, IA작성, 서비스 흐름도 작성 후 최조으이 문서가 되는 것이다.

    1. 스토리보드는 표지, 개정 이력, 화면 설계, 서비스 흐름도의 구성을 갖는다.
    2. 스토리보드는 첫 번째로 프레임의 사용 여부와 메뉴의 구성 위치, 콘텐츠의 위치 등 전체적인 화면 구성을 보여 주어야 한다. 메뉴 구성을 포함한 페이지의 구성은 디자인 요소 중 아주 중요한 부분을 차지하게 된다.
    3. 두 번째로 그 페이지의 정보를 요약하여 보여 준다. 저장될 디렉토리, 파일 이름, 페이지 title등을 메모하듯이 작성한다.
    4. 세 번째로 링크 정보를 정리하여 작성한다. 링크는 다양한 방법으로 후반 작업에 유리하도록 작성한다.
    5. 네 번재로 프로그램 요소를 기재한다. 스크립트 기능, ASP나 PHP 등의 프로그램 등을 표시하고, 그 기능을 적는다.



    훈련일 2017. 07. 27(목)
    훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
    교과목명 스마트기기 UX/UI 디자인(디지털디자인) 제작
    능력단위명 다지인 구성요소 제작
    능력단위요소 스토리보드 제작하기(0802010404_13v1)
    이름 백초희

    스토리보드의 화면 설계

    제작자의 의도가 정확하게 전달될 수 있도록 자세하게 설계하는 것이 중요하다. 스토리보드의 화면을 설계할 때에는 디자인적 요소의 표현이 아닌, 페이지에 노출되는 정보, 즉 중요한 구성 요소가 표현되록 한다. 스토리보드는 화면 설계와 함께 화면 설명이 매주 중요하다. 즉, 실질적인 페이지 디자인 작업을 수행하기 위해 각 페이지의 구성 요소에 대해 설명하여야 한다. 스토리보드는 다양한 기능 및 콘텐츠 등 최대한 상세한 정보를 나타내야 하며, 화면 설명으로만 부족할 때에는 보다 자세한 설명을 위하여 별도의 서비스 프로세스 페이지가 필요하다.

    이미지 이미지 이미지


    훈련일 2017. 07. 28(금)
    훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
    교과목명 스마트기기 UX/UI 디자인(디지털디자인) 제작
    능력단위명 다지인 구성요소 제작
    능력단위요소 스토리보드 제작하기(0802010404_13v1)
    이름 백초희
    이미지


    훈련일 2017. 07. 31(월)
    훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
    교과목명 스마트기기 UX/UI 디자인(디지털디자인) 제작
    능력단위명 다지인 구성요소 제작
    능력단위요소 심미성 구성요소 제작하기0802010404_13v1)
    이름 백초희

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

    인간은 시각에 의존하여 정보를 인식하고 사고하며 행동한다. 한 연구에 따르면 인간의 전체 감각 중 80%를 시각이 차지한다고 한다. 특히, 인간은 주변의 데이터나 언어 등의 정보를 시각 요소의 정보로 변환하여 생각하는 특징을 가지고 있다. 따라서 정보의 구성에 시각 요소를 도입하는 것은 주용한 작업이라 할 수 있다.

    1. 시각화

      시각화란, 정보의 의미와 상호 관계를 그래프, 이미지, 일러스트레이션, 색채, 타이포그래피 등의 그래픽 요소로 나타내서 사용자들이 정보를 쉽게 찾고 이해하도록 시선을 안내하고 유도하는 것을 말한다.

    2. 아이텐티티 디자인(Identity Design)

      아이텐티티 디자인(Identity Design)이란, 인식이라는 관념적인 대상을 시각화하여 다양한 방식으로 표현해 이를 사용자에 전달하는 종합적 수단이다.

      • 아이텐티티 디자인은 사용자가 기억하기 쉽고, 차별화되고, 영속성과 유연성을 포함하여야 한다.
      • 기업이나 발주자가 추구하는 의미와 가치를 전달하여야 한다.
      • 심벌마크, 로고, 컬러 등의 구성 요소를 갖는다.

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

    • 페이지 레이아웃의 균형 : 페이지 그리드 시스템의 적용에 따른 안정적 균형감
    • 웹 페이의 대비 : 타이포그래피, 모양, 컬러, 크기, 명암 등 디자인 요소의 대비를 통한 다양한 페이지의 목적에 맞도록 구성
    • 웹 페이지의 강조 : 웹 페이지의 디자인 핵심 콘셉트를 타이포그래피, 모양, 컬러, 크기, 명암 등 디자인 요소를 통해 구현
    • 웹 페이지의 리듬 : 각 페이지의 일관성 및 차별화를 달성하기 위한 디자인 요소를 반복, 규칙성 등의 리듬 요소를 통해 구현

    그리드 시스템 작업 이미지




    훈련일 2017. 08. 01(화)
    훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
    교과목명 스마트기기 UX/UI 디자인(디지털디자인) 제작
    능력단위명 디자인 구성요소 제작
    능력단위요소 심미성 구성요소 제작하기0802010404_13v1)
    이름 백초희

    비주얼 콘셉트(Visual Concept)

    비주얼 콘셉트는 사용자에게 가치 있는 것이며 효용을 제공한다. 그 근본은 사용자으 ㅣ니즈이며, 콘셉트의 창출은 서비스나 상품을 사고 싶다고 생각하게 하는 힘을 만드는 것이다. 또한 콘셉트를 도출하기 전에 사이트를 위한 정의를 한다.

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



    훈련일 2017. 08. 02(수)
    훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
    교과목명 스마트기기 UX/UI 디자인(디지털디자인) 제작
    능력단위명 디자인 구성요소 제작
    능력단위요소 사용성 구겅요소 제작하기(0802010404_13v1.3)
    이름 백초희

    디자인 작업 했던 이미지


    디자인페이지 바로가기




    훈련일 2017. 08. 03(목)
    훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
    교과목명 스마트기기 UX/UI 디자인(디지털디자인) 제작
    능력단위명 디자인 구성요소 제작
    능력단위요소 사용성 구겅요소 제작하기(0802010404_13v1.3)
    이름 백초희

    UI(User Interface)

    UI는 사용자와 사물 또는 시스템 사이에서 의사소통을 가능하게 하는 일시적 혹은 영구적인 접근을 목적으로 만들어진 물리적, 가상적 매개체를 의미한다. UI는 물리적인 하드웨어와 논리적인 소프트웨어 요소를 포함하고 있다. 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 디자인(디지털디자인) 제작
    능력단위명 디자인 구성요소 제작
    능력단위요소 사용성 구겅요소 제작하기(0802010404_13v1.3)
    이름 백초희

    콘텐츠 시각화의 목적

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

    콘텐츠 시각화 단계

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

    UX(User Experience)

    UX는 사용자가 시스템, 제품, 서비스를 직 관접적으로 이용하면서 느끼고 생각하게 되는 총체적인 경험을 말한다. 여기서의 경험은 단순한 지각의 경험이 아니라, 지각 전반에 걸친 사용자가 참여하여 사용하고, 관찰하며 상호 교감을 통해 누적하게 되는 가치 있는 경험이다. 또한 사용자의 입장에서 경험 요소를 최대한 예층 가능하도록 디자인하는 것이다. UX와 관련한 키워드는 아래와 같다.

    1. 리서치(Research)
    2. 사용성(Usability)
    3. 정보 설계(Information Architecture)
    4. 인터랙션 디자인(Interaction Design)
    5. 비주얼 디자인(Visyal Design)
    6. 콘텐츠(Content)

    UX 분석을 위한 FGI

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



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

    매체별 특성 분석

    1. 웹(web) : 원래의 의미는 거미집으로, 하나의 사이트와 다른 사이트의 관계가 거미집처럼 복잡하게 얽혀 있기 때문에 붙여진 이름이다. 이러한 웹은 월드 와이드 웹(www)을 지칭하며, HTTP 통신 프로토콜을 사용하여 전송과 수신을 하게 된다
      • 웹은 문자, 소리, 그림, 동영상을 통해 정보를 전달한다.
      • 웹은 관련된 정보를 서로 연결한다. 이를 하이퍼링크(Hyperlink)라 한다.
      • 웹 문서를 구성하는 기본 언어는 HTTP(Hypertext markup language)라 한다.
    2. 모바일(Mobile) : 이동성이 있는 IT 기기들을 총칭한다. 최근에는 휴대용 정보 단말기가 인터넷선이나 전화선 등을 활용하여 정보를 주고받는 기기를 대표하고 있기 때문에, 휴대용 정보 단말기 자체를 모바일이라고 하기도 한다.
      • 폰(Phone) : 최근에는 스마트폰을 통한 모바일성이 크게 확대되고 있어 콘텐츠의 활용이 급증하는 계기가 되고 있는데, 운영 체제에 따라 IOS 기반의 iPhone과 Android 기반의 폰 계열로 나눌 수 있다.
        • 모바일(Mobile)은 상시성을 갖는다.
        • 모바일(Mobile)은 All in One 디바이스이며, 즉시 접속성을 갖는다.
        • 모바일(Mobile)은 실시간성을 지니며 인간과 24시간 커뮤니케이션하고 있다.
      • 태블릿(Tablet)PC : 태블릿은 모바일폰과 노트북 및 컴퓨터의 중간 단계의 기기로 통신과 인터넷 검색이 가능한 대형 PDA로 볼 수 있으며 스마트 패드(Smart Pad)라고도 한다. 모바일의 장점과 개인용 컴퓨터의 장점을 모두 가지고 있기 때문에 물류나 POS, 기업 Network 등 다양한 분야에 적용 가능한 장비이다.
        • 태블릿 PC는 휴대가 용이하다.
        • 태블릿 PC는 마우스나 키보드 등의 입력 장치 없이 쉽게 조작 가능하다.
        • 태블릿 PC는 사용 시마다 부팅되는 것이 아니라 상시 전원 상태로 쉽게 접근할 수 있다.
        • 태블릿 PC는 스마트폰보다 화면이 크고, 대용량 데이터 처리가 가능하다.
        • 태블릿 PC는 직관적인 인터페이스를 가지고 있어 누구나 사용 가능하다.
    3. 키오스크(KIOSK) : 옥외에 설치된 대형 천막이나 현관을 의미하는 터키 어에서 유래되었으며, 최근에는 기술 발전에 따라 공공장소에 설치된 무인 단말기를 의미하기도 한다. 특히 멀티미디어 스테이션(MultimediaStation), 셀프서비스 스테이션(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년에 마이크로소프트 윈도 운영 체제에 이 소프트웨어를 기본으로 포함하기 시작하면서, 사용자가 급격히 증가했다. 1999년 이후에 세계에서 가장 널리 쓰이는 웹 브라우저가 되었지만, 모질라, 파이어폭스 등 대체 브라우저가 개발되면서 인터넷 익스플로러 7의 출시에도 불구하고 하락세가 계속되고 있는데, 우리나라에서는 인터넷 익스플로러의 의존도가 상대적으로 높다. 이는 온라인 뱅킹 호환성 문제와 더불어 우리나라의 웹 사이트 개발자 대다수가 여러 웹 브라우저와 운영 체제들의 호환성을 고려하 지 않고 현재 마이크로소프트사도 사용을 권장하고 있지 않는 ActiveX를 무리하게 채용하고 있기때문이다.

    2. 모질라(Mozilla) 계열 파이어폭스

      모질라 파이어폭스(Mozilla Firefox)는 모질라 재단과 모질라 코퍼레이션이 개발한 자유 소프트웨어 웹 브라우저로 윈도, 리눅스, 맥 OS X, 그리고 안드로이드에서 실행 가능하다.

    3. 오페라

      오페라는 노르웨이의 오페라 소프트웨어가 개발하고 있으며, 핵심 레이아웃 엔진("프레스토”)은 어도비 같은 협력 사업자들에게서 라이선스를 받았고, 어도비 크리에이티브 스위트에 통합되어있다. 오페라는 스마트폰과 PDA를 위한 브라우저 분야에서 그들의 스몰 스크린 렌더링(SmallScreen Rendering) 기술로 시장을 선도하고 있다. 오페라의 특징은 다양한 기능을 기본적으로 탑재하고 있으면서도 같은 종류의 다른 소프트웨어에 비해 작고 가벼우며, 페이지의 렌더링 속도가 빠르다는 것이다.

    4. 사파리(Safari)

      사파리는 애플사가 개발한 웹 브라우저이다. 사파리는 아이튠즈와 유사한 북마크 관리 체계를 가지고 있고, 애플의 퀵타임 멀티미디어 기술과 통합되어 있으며, 탭 브라우징 인터페이스를 사용한다. 구글 검색 상자는 사파리 인터페이스의 기본 요소이며, 웹 주소 자동 완성과 웹 페이지 텍스트 영역의 맞춤법 검사를 지원한다.

    5. 크롬(Chrome)

      구글(Google)의 크롬(Chrome)은 웹키트 레이아웃 엔진을 이용하여 개발 중인 프리웨어 웹 브라우저이다. 크롬은 간단하고 효율적인 사용자 인터페이스를 제공하며, 현존하는 다른 웹 브라우저들에 비해 향상된 안정성과 속도, 그리고 보안성을 갖는 것을 목표하고 있다. 2008년 9월 3일 마이크로소프트 윈도용 베타 버전이 나왔으며, 2008년 12월 11일 첫 안정화 버전이 출시되었다.




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

    웹 표준 사이트

    web web

    한국형 웹 콘텐츠 접근성 지침


    1. 인식의 용이성(Perceivable)

    • 텍스트 아닌 콘텐츠에는 대체 텍스트를 제공해야 한다.
      - 텍스트 아닌 콘텐츠는 그 의미나 용도를 이해할 수 있도록 대체 텍스트를 제공해야 한다.
    • 동영상, 음성 등 멀티미디어 콘텐츠를 이해할 수 있도록 대체 수단을 제공해야 한다.
      - 멀티미디어 콘텐츠에는 자막, 대본 또는 수화를 제공해야 한다.
    • 콘텐츠는 명확하게 전달되어야 한다.
      - 콘텐츠는 색에 관계없이 인식될 수 있어야 한다.
      - 지시 사항은 모양, 크기, 위치, 방향, 색, 소리 등에 관계없이 인식될 수 있어야 한다.
      - 텍스트 콘텐츠와 배경 간의 명도 대비는 4.5대 1 이상이어야 한다.
      - 자동으로 소리가 재생되지 않아야 한다.
      - 이웃한 콘텐츠는 구별될 수 있어야 한다.

    2. 운용의 용이성(Operable)

    • 콘텐츠는 키보드로 접근할 수 있어야 한다.
      - 모든 기능은 키보드만으로 사용할 수 있어야 한다.
      - 키보드에 의한 초점은 논리적으로 이동해야 하며 시각적으로 구별할 수 있어야 한다.
      - 사용자 입력 및 컨트롤은 조작 가능하도록 제공되어야 한다.
    • 콘텐츠를 읽고 사용하는 데 충분한 시간을 제공해야 한다.
      - 시간제한이 있는 콘텐츠는 응답시간을 조절할 수 있어야 한다.
      - 자동으로 변경되는 콘텐츠는 움직임을 제어할 수 있어야 한다.
    • 광과민성 발작을 일으킬 수 있는 콘텐츠를 제공하지 않아야 한다.
      - 초당 3~50회 주기로 깜빡이거나 번쩍이는 콘텐츠를 제공하지 않아야 한다.
    • 콘텐츠는 쉽게 내비게이션 할 수 있어야 한다.
    • 태그 등을 부여하여 제목과 본문을 구분할 수 있도록 제공하는 것이 좋다.
      - 콘텐츠의 반복되는 영역은 건너뛸 수 있어야 한다.
      - 페이지, 프레임, 콘텐츠 블록에는 적절한 제목을 제공해야한다.
      - 링크 텍스트는 용도나 목적을 이해할 수 있도록 제공해야 한다.

    3. 이해의 용이성(Understandable)

    • 콘텐츠는 읽고 이해하기 쉬워야 한다.
      - 주로 사용하는 언어를 명시해야 한다
    • 콘텐츠의 기능과 실행결과는 예측 가능해야 한다.
      - 사용자가 의도하지 않은 기능(새 창, 초점에 의한 맥락 변화 등)은 실행되지 않아야 한다.
    • 콘텐츠는 논리적으로 구성해야 한다.
      - 콘텐츠는 논리적인 순서로 제공해야 한다.
      - 표는 이해하기 쉽게 구성해야 한다.
    • 입력 오류를 방지하거나 정정할 수 있어야 한다.
      - 입력 서식에는 대응하는 레이블을 제공해야 한다.
      - 입력 오류를 정정할 수 있는 방법을 제공해야 한다.

    4.견고성(Robust)

    • 웹 콘텐츠는 마크업 언어의 문법을 준수해야 한다.
      - 마크업 언어의 요소는 열고 닫음, 중첩 관계 및 속성 선언에 오류가 없어야 한다.
    • 웹 콘텐츠는 마크업 언어의 문법을 준수해야 한다.
      - 콘텐츠에 포함된 웹애플리케이션은 접근성이 있어야 한다.



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

    멀티미디어 개요 및 특성

    텍스트(문자), 그래픽(이미지), 애니메이션(만화, 게임), 사운드(음향, 음성, 효과음) 등의 다양한 매체를 두 가지 이상 복합적으로 사용하여 제작된 디지털 콘텐츠이다. 시간과 공간의 제약 없이 사용자가 특정 시스템을 통해서 상호 작용하면서 정보를 얻을 수 있다.

    멀티미디어의 특성

    멀티미디어의 특성은 네 가지로 나눌 수 있으며, 간략한 내용은 아래와 같다.
    1. 디지털화(Digitalization): 컴퓨터 시스템으로 제작되고 사용된다.
    2. 상호 작용(Interaction): 사용자와 대화할 수 있다.
    3. 비선형성(Non-Linear): 어느 시점이든 접근 가능하다.
    4. 통합성(Composition): 미디어를 통합할 수 있다.

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

    아날로그 미디어 대비 신개념 뉴미디어의 개념에 속한다. 사이버 공간에서의 상호 작용을 활성화 하기 위해 정보를 실시간으로 교류하는 장으로, 디지털 마인드에 따라 디지털 데이터로 가공된정보를 말한다.
    멀티미디어 콘텐츠는 다음과 같이 정의할 수 있다
    • 표현의 가능성과 상호 작용
    • 복합적 미디어의 표현으로 구체적인 정보를 제공
    • 내용과 거래, 서비스가 내재된 신개념 콘텐츠

    멀티미디어 콘텐츠의 특성

    1. 정보 수용자의 개념 변화
    2. 선형 패러다임의 변화
    3. 정보 확장의 전환
    4. 시 공간 경계의 전환
    5. 개별 미디어 통합의 전환



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

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

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



    훈련일 2017. 08. 14(월)
    훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
    교과목명 스마트기기 UX/UI 디자인(디지털디자인) 제작
    능력단위명 구현(0802010405_13v1)
    능력단위요소 기능요소 구현하기
    이름 백초희



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

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

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

    1. 페인팅과 드로잉 소프트웨어

      일러스트레이터(Adobe Illustator), 코렐 페인터(Corel Painter), 하버드 그래픽스(Harvard Graphics), 맥드로우(MacDraw Pro), 맥페인터(MacPaint), 픽셀페인터(PixelPaint Pro), 윈도즈 드로우(WindowsDraw) 등

    2. 이미지 편집 소프트웨어

      포토숍(Adobe Photoshop), 코렐 포토페인트(Corel Photo-Paint), 페인트숍(Jasc Paintshop), Ulead Photo Impact

    3. 사운드 편집 소프트웨어

      골드웨이브(Goldwave), 오디션(Adobe Audition)

    4. 3D 그래픽 소프트웨어

      3D 스튜디오 맥스(Studio Max), 트루 스페이스(True Space), 소프트이미지 3D(SoftImage 3D), 마야(MAYA)

    5. MIDI 소프트웨어

      Cakewalk, Nuendo, Sonar

    6. 애니메이션 편집 소프트웨어

      3Ds MAX, Adobe Flash, MAYA

    7. 비디오 영화 제작 소프트웨어

      Adobe Premiere, Avid Xpress, Final Cut Pro, Pinacle Studio, Sony Vegas, Windows Movie Maker, Adebe Effects 등




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

    애니메이션 기법

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

    1. 플립북 원리를 이용한 프레임 바이 프레임(Frame by frame) 기법

      연속된 동작을 보여 주는 애니메이션으로, 단순한 애니메이션이나 2차원 게임에서 캐릭터의 움직임을 보여 줄 경우 사용된다.

    2. 셀 애니메이션의 원리를 이용한 스프라이트(Sprite) 기법

      배경과 캐릭터를 별도의 레이어로 작업하는 방식으로, 디지털 애니메이션에서는 특히 캐릭터에 해당하는 용어가 스프라이트이다.

    3. 키 프레임 원리를 적용시킨 키 프레임 애니메이션

      2개의 키 프레임(시간) 사이에 필요한 움직임이 자동으로 생성되는 트위닝(Tweening) 기법을 이용한 애니메이션이다.

    4. 모핑(Morphing) 기법

      서로 다른 2개의 이미지를 특정 모습으로 서서히 변화시키는 기법이다

    동영상 파일 종류 및 정의

    1. AVI

      오디오 데이터와 비디오 데이터가 내부적으로 번갈아 기록된다는 의미를 갖고 있는‘Audio Video Interleaved’의 약자로, 윈도에 포함되는 미디어 플레이어를 비롯하여 모든 동영상 플레이어에서 기본적으로 지원되는 대표적인 동영상 포맷이다

    2. MPEG

      영상과 오디오 압축에 관한 국제표준화기구(ISO)에서 제정한 형식으로, 해상도 및 용도에 따라 다음과 같이 구분한다.

      • MPEG-1: 320×240 저해상도 디지털 저장 매체
      • MPEG-2: 720×480 방송, 통신, DVD 영상
      • MPEG-4: 720×480 고압축, 저노이즈 기술로 웹용
      • MPEG-7: 720×480 영상 검색
    3. ASF(Advanced Streaming Format)

      다운로드와 동시에 재생이 가능한 방식으로 인터넷 방송, 동영상 강좌 등에 사용한다.

    4. WMV(Windows Media Video)

      ASF 와 동일한 용도이나, MPEG4 v7 코덱을 사용하여 mp3와 음질이 비슷하지만 mp3보다 적은용량이 사용된다

    5. MOV

      매킨토시의 퀵타임 무비에서 사용한다.

    6. MP4

      MPEG 파일 규격의 한 종류로, 최근 휴대용 제품에서 자주 사용된다. 고화질을 유지하면서도 압축률이 큰 장점을 갖고 있다.




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

    객체 지향 언어

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

    1. 객체 지향의 기본 요소: 객체와 클래스, 연산과 메소드(Operation & Method), 메시지(Message)
    2. 객체 지향의 특성: 상속성(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)
    능력단위요소 개발요소 협업하기
    이름 백초희

    협업의 정의와 구분

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




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

    디자인 산출물과 리뷰

    디자인 산출물

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

    리뷰(reviews)

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




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

    수정보완 작업의 우선순위

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

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

    이 등급은 다른 항목과 비교한 해당 항목에 대한 주관적인 등급이므로, 높은 값(상)이 주어진 수정․보완 항목을 낮은 값(하)이 주어진 수정․보완 항목보다 먼저 작업하여야 한다.




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

    배색

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

    색상 요소

    (1)기조색(Base Color)

    일반적으로 배색 대상이 되는 색으로, 가장 큰 면적을 차지하는 색이다. 바탕색으로 많이 사용하기 때문에, 튀는 색보다는 무난한 색을 주로 쓴다.

    (2) 주조색(Dominant Color)

    기조색 다음으로 면적 비율이 큰 색으로, 보통 기조색을 보조하는 역할을 한다. 기조색과 동일, 유사, 대비, 보색 등의 관계를 나타내는데, 부차적 컬러라고도 한다.

    (3) 강조색(Accent Color)

    배색 중에서 가장 작은 면적을 차지하지만 눈에 제일 띄는 포인트 컬러로, 전체 색조를 마무리하거나 집중시키는 효과를 낸다.

    색상에 의한 배색

    (1) 동일 색상 배색

    같은 색상이라도 명도나 채도 차이를 둔 배색이다. 이는 명도나 채도의 변화를 주어 조화시켜야 하는데, 통일감과 완성감을 느낄 수 있다(세련미, 친근감).

    (2) 유사 색상 배색

    색상환에서 색상의 차이가 근접하거나 유사한 배색을 말한다. 예를 들면, 빨강과 노랑․주황, 파랑과 남색과 같은 배색이다. 이는 친근하고 즐거운 느낌을 주며, 협조적이고 온화함, 상냥함을 느낄 수 있다. 유사 색상 배색도 동일 색상 배색과 마찬가지로 명도나 채도의 변화를 통해서 조화시켜야한다. 보통 주조색에 의한 배색에 많이 활용된다. 그러나 색의 차이가 너무 작을 경우 오히려 조화롭지 못한 배색이 되기도 한다.

    (3) 반대 색상 배식

    빨강과 청록, 노랑과 남색 등과 같이 색상환에서 거리가 멀거나 보색 관계에 있는 배색을 말한다. 반대 색상의 배색은 화려하고 강한 느낌을 줌과 동시에 자극적이고 동적인 생동감을 느낄 수 있다. 이 배색도 역시 채도와 면적의 변화를 통해 색을 조화시켜야 하며, 활동성이 높은 분야의 배색에 적합하다. 그러나 너무 지나치면 혼란스럽거나 복잡해 보일 수 있다.

    명도에 의한 배색

    (1) 고명도 배색

    순색에 하양을 섞은 파스텔톤 색상의 배색을 말한다. 고명도 배색은 밝고 귀여운 느낌을 주며, 여성스럽고 부드러운 이미지를 전달한다.

    (2) 중명도 배색

    회색과 같은 중간 명도를 가진 색, 즉 Dull톤 색들의 배색을 말한다. 중명도 색끼리의 배색은 무난하지만, 그 경계가 불분명하고 모호한 느낌을 준다.

    (3) 저명도 배색

    순색에 검정을 섞은 Dark톤 색상의 배색을 말한다. 저명도 색끼리의 배색은 어두우며 음침한 느낌을 준다.

    (4) 명도 차가 큰 배색

    고명도 색과 저명도 색의 배색을 말한다. 명도 차가 크면 색들의 관계가 뚜렷하고 명쾌한 느낌을 준다

    채도에 의한 배색

    (1) 고채도 배색

    채도가 높은 Vivid톤 색들의 배색을 말한다. 고채도 배색은 매우 화려하고 자극적이지만, 자칫 산만한 느낌을 줄 수 있다. 그럴 때 중성색이나 무채색을 사용하면 색의 반발성이나 산만함을 줄일 수 있다.

    (2) 저채도 배색

    채도가 낮은 저채도 색들의 배색은 부드럽고 온화한 느낌을 준다. 하지만, 저채도 – 저명도의 배색은 침울하고 어두운 느낌을 준다.

    (3) 채도차가 큰 배색

    고채도와 저채도의 배색으로, 채도 차이가 큰 배색은 활기 있어 보이고 명쾌한 이미지를 준다. 또 채도 차가 클수록 확실한 배색이 된다.




    훈련일 2017. 08. 25(금)
    훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
    교과목명 스마트기기 UX/UI 디자인(디지털디자인) 제작
    능력단위명 수정보완(0802010406_13v1)
    능력단위요소 콘텐츠 사용성 수정 보완하기
    이름 백초희

    디지털 콘텐츠의 특징

    (1) 비파괴성(항상성)

    디지털 자료는 아날로그 자료같이 세월이 흘러도 변하지 않고, 항상 똑같은 품질을 갖는다.

    (2) 변형 가능성

    파괴적 의미의 변형이 아니라, 항상 디지털화되어 있기 때문에 별도의 비용을 추가하지 않아도 자유롭게 정보의 추가, 삭제, 수정이 가능하다.

    (3) 보관의 편리성

    보관 비용이 저렴하고, 공간적인 낭비가 거의 없다

    (4) 결합성

    채여러 종류의 디지털 콘텐츠끼리 쉽게 결합하여 더 좋은 콘텐츠를 만들 수 있다

    (5) 재생산성

    한번 생산된 디지털 콘텐츠는 무한 반복 재생산이 가능하다. 디지털화 된 음악, 동영상, 애니메이션등은 데이터베이스에 저장되어 사용자의 요구에 따라 언제든지 재생산이 가능하다.

    (6) 상호 작용성

    정보 이용자가 동시에 정보 제공자가 되는 상호 작용이 가능하다.

    (7) 편집성

    디지털 콘텐츠는 새로운 내용의 추가와 수정이 용이하다. 따라서 텍스트, 음악, 그림, 동영상, 애니메이션 등의 각종 미디어가 통합된 형태로 가공되어 새로운 멀티미디어를 창출할 수 있다.

    (8) 비소멸성

    디지털 콘텐츠는 한번 생산되면 형태나 품질을 반영구적으로 유지할 수 있다. 따라서 필요에 따라 언제든지 원하는 형태로 사용이 가능하며, 수많은 사용자가 동시에 사용하더라도 디지털 콘텐츠 자체는 감소되지 않기 때문에 디지털 경제 발전의 원동력이 되고 있다.




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

    반응형 웹 디자인(RWD: Responsive Web Design)

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

    적응형 웹 디자인(AWD: Adaptive Web Design)

    몇 개의 해상도를 정의하여 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란?(캐스케이딩 스타일 시트 : Cascading Style Sheets)

    CSS는 W3C의 표준이며, 레이아웃과 스타일을 정의할 때의 자유도가 높다. CSS는 여러 수준과 프로파일을 가지고 있는데, 각 수준의 CSS는 일반적으로 새로운 기능을 담고 있으며, 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을 표준으로 만들고 있다. W3C의 CSS 3 로드맵은 요약과 도입부를 제공하고 있다. 전체가 모듈화되어 사용자 에이전트가 모듈에 대한 모든 모듈을 지원하지 않거나 자유롭게 선택할 수 있도록 하고 있으며, 다른 세로 글쓰기와 HTML 이외의 규격에까지 관여하는 내용으로 되어 있다. 현재 어떤 모듈도 권고안까지 이른 것은 없다.

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

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

    웹 접근성이란?(Web Accessibility)4

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

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



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

    쿠기와 세션

    쿠키

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

    세션(Session)

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




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

    자바스크립와 제이쿼리

    자바스크립트(JavaScript)

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

    jQuery

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




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

    데이터베이스

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

    SQL

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

    웹 서버

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




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

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

    • 프로젝트의 성격에 따라 작업의 체계가 다르게 형성되며, 이에 따라 산출물의 가치도 변화한다.
    • 작업 분류 체계에 기록된 산출물을 기초로 하여 실제 산출물이 어느 단계에 적합한 가치를 갖는지 판단한다

    개발 프로세스

    폭포수 모델(waterfall model)

    단계별 승인을 거쳐, 순차적-하향식으로 개발이 진행되는 고전적 생명 주기 모델이며, 간략한 특징은 아래와 같다.

    • 장점 : 이해하기 쉽고, 단계별 검토․승인과 체계적 관리 용이
    • 단점 : 요구 사항 도출이 어렵고, 상위 단계의 작업이 지연되면 하위 단계의 작업이 계속 누적 지연될 가능성이 있으며, 개발 중후반 문제점 발견 시 대처가 곤란

    프로토타입 모델(prototype model)

    사용자의 의견(feedback)이 중요한 모델이며, 핵심적 기능을 샘플로 만들어 평가한 후 본 개발을 진행하는 점진적 개발 방법으로 정의할 수 있다. 간략한 특징은 아래와 같다

    • 장점 : 요구 사항 도출 용이, 의사소통 향상
    • 단점 : 사용자의 오해(완제품), 폐기 시 비용 손해

    점증적 개발 모델(incremental model)

    • 장점 : 점진적 개발로 실패 위험 감소, 테스트가 용이함
    • 단점 : 기능적 분해의 난이도 증가. 선제적인 명확한 요구사항 선결

    점증적(기능별로 릴리스 하기), 반복적(릴리스 할 때마다 기능완성도 높이기)방법으로 운영


    나선형 모델(spiral model)

    위험 관리를 중요시하는 모델이며, 간략한 특징은 아래와 같다.

    • 증분(Incremental) : 시스템을 분할하여 병행․순차 개발
    • 진화(Evolutional) : 프로토타입을 재사용 또는 진화시켜 개발

    V모델

    테스트와 검증을 강조하는 모델이며, 간략한 특징은 아래와 같다.

    • 장점 : 모든 단계에 검증과 확인 과정이 있어서 오류를 줄일 수 있음
    • 단점 : 생명 주기의 반복을 허용하지 않아 변경하기가 쉽지 않음

    일정 중심 설계 모델(design to schedule model)

    출시 일정을 정확히 맞추기 위한 모델이며, 간략한 특징은 아래와 같다.

    • 장점 : 초기 단계에서 중요한 기능들을 설계하고 구현한 후, 상대적으로 덜 중요한 기능은 나중에 구현함으로써 일정조절이 가능함
    • 단점 : 우선순위가 낮아 출시에 포함되지 않을 기능의 분석과 설계 등에 시간 낭비 발생




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

    분류의 기본 원칙

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

    산출물 체계화

    산출물은 다양한 디지털 형태로 축적되어 빠른 검색을 거쳐 선택, 가공, 분석할 수 있어야 한다.‘산출물의 체계화’라고 부르는 일련의 과정을 통해 의미 있는 내용으로 전환하여 의사 결정을 지원하는 중요한 영업 활동으로서의 의미를 갖게 된다.

    • 산출물을 보면 관련 문서의 흐름대로 시간과 인력 등의 측정이 가능해진다.
    • 원가(Cost) 개념을 적용하여 불필요한 문서 작업을 제거해 나간다.
    • 코드 관리나 미디어 관리를 위한 자료를 클라이언트를 위한 산출물로 이해한다.

    물리적인 산출물 체계화

    • ‘중앙화’또는‘공유 가치화’를 위해 관리의 표준화와 외부 유출 예방, 협업과 공용을 위한 업무 표준화, 모바일 서비스, 원격 근무, 문서의 Life Cycle 관리, 지속적 정리 정돈, TCO 절감, 정보 수집 지원 개방 등의 업무 프로세스를 가시화하는 데 기여한다.
    • 산출물의 체계화를 통해 프로젝트 완료 보고서와 디자인 가이드를 작성하면, 작업자와 클라이언트 모두에게 효율성을 제공하게 된다.
    • 콘텐츠 유지 보수 및 관리를 위한 최종 작업 산출물은 디자인 가이드에 포함하여 체계화한다.



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

    산출물의 선택과 가치 분석

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



    훈련일 2017. 09. 06(수)
    훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
    교과목명 스마트기기 UX/UI 디자인(디지털디자인) 제작
    능력단위명 디지털디자인 사후관리(0802010408_13v)
    능력단위요소 오류 수정하기
    이름 백초희

    업그레이드와 유지 보수

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



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

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

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

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



    훈련일 2017. 09. 11(월)
    훈련과정명 스마트기기 UX/UI 디자인(디지털 웹표준 디자인)
    교과목명 스마트기기 UX/UI 디자인(디지털디자인) 제작
    능력단위명 프로젝트 완료(0802010407_13v1)
    능력단위요소 오류 수정하기
    이름 백초희

    프로젝트 최종보고

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

    프레젠테이션 작성 프로세스

    기획력 향상을 위한 조건

    • 발상의 전환, 아이디어 창출(Logical Thinking), 정보 수집과 가공 능력, 효과적인 도구 활용,프레젠테이션 스킬, 발표력

    프레젠테이션의 절차

    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 디자인(디지털디자인) 제작
    능력단위명 프로젝트 완료(0802010407_13v1)
    능력단위요소 클라이언트 요청사항 반영하기
    이름 백초희

    모니터링 대상요소

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

    데이터베이스

    콘텐츠 개발에 사용되는 데이터베이스는 크게 유닉스(UNIX) 계열과 윈도즈(Windows) 계열로 나뉜다. 개발된 콘텐츠가 어떤 브라우저와 어떤 운영 체제(OS)를 사용하느냐에 따라 사용하는 데이터베이스도 영향을 받게 된다




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

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

    1. 전화예절
    2. 인사 태도와 표현
    3. 공손한 어법 및 표준어 사용
    4. 내용 요약 및 메모
    5. 단정한 몸차림
    6. 정확한 자기표현과 내용 전달
    7. 대화 내용 파악과 정리

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

    디자인을 무조건 바꾸어 달라고 할 때

    • 클라이언트의 요구 사항과 유사한 동종 업계의 사이트를 분석(차별화, 트렌드 파악) 하여 제시한다.
    • 타깃 고객층의 특성을 고려한 목표 성향을 분석하여, 메인 메뉴와 서브 메뉴를 결정한다.
    • 목표 고객층에 맞는 색상과 디자인을 제안한다.
    • 클라이언트와 협상한 내용을 토대로 스토리보드 및 화면을 설계하여 클라이언트와 재협상한다
    • 스토리보드와 화면 설계가 확정된 후, 포토숍 작업을 수행한다.

    클라이언트의 요구가 자주 바뀔 때

    • 클라이언트와 요구 협상을 할 때, 회의록을 작성하여 클라이언트의 사인을 받는다.
    • 프로젝트 초반에 확실하게 클라이언트의 요구를 확인하고 도장을 받은 후, 프로젝트 구현을 시작한다.

    시안이 확정되지 않을 때

    • 제시한 시안을 정해진 기일 안에 결정하도록 일정을 알린다.
    • 다양한 결정 방법(이사진에서 결정, 인트라넷과 사내 게시판을 통한 시일 내 결정 등)을 제안한다.

    클라이언트가 계속해서 수정과 추가 작업을 요구할 때

    • 유상과 무상의 업무에 대해 설명하고, 계약서와 요구 사항 명세서 등을 통해 필요하면 추가견적을 제시하고, 이러한 상황을 예상하고 필요한 자료들을 준비하여 제시하고 협상한다.



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

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

    계획

    소프트웨어는 시스템의 일부분이므로 사용자의 문제를 정의(problem definition) 하고, 전체 시스템이 갖추어야 할 기본 기능과 성능 요건을 파악하여, 이를 개발하고자 하는 소프트웨어의 기본요구로 전환시켜야 한다. 타당성 분석(feasibility study)도 이 단계에서 이루어지는데, 그 결과는시스템 정의서(system definition)로 문서화되어야 하며, 개발 계획서(project plan)에 포함될 수 있다.

    분석

    사용자의 문제를 구체적으로 이해(understand)하고, 소프트웨어가 담당해야 하는 정보 영역(information domain)을 정의한다. 사용자의 기능, 성능, 신뢰도 등에 대한 요구는 요구 사양서설계 (requirements specifications)로 문서화된다. 의사소통 기술이 필수적이다.

    설계

    소프트웨어의 구조(architecture)와 그 성분을 명확하게 밝혀 구현을 준비하는 단계이다. 외부 시스템 및 사용자와의 인터페이스를 중시하는 외부 설계(external design)와 시스템 내부를 설계하는 내부 설계(internal design)로 분류되기도 하고, 전체적 구조와 데이터 알고리즘을 설계하는 단계를 분리해 기본 설계(architecture design)와 상세 설계(detailed design)로 분류되기도 한다. 설계 단계 에서의 결과는 설계 사양서(design specifications)로 산출되어야 한다. 이 산출물과 요구 사양서를 토대로 사용자 지침서(user's manual)와 시험 계획서(test plan)가 작성된다.

    구현

    프로그래밍을 하는 단계이다. 각 모듈의 코딩과 디버깅이 이루어지고, 그 결과를 검증하는 단위 시험(unit test) 혹은 모듈 시험(module test)을 실시한다.

    시험

    개발된 모듈들을 통합시키며 시험하는 통합 시험(integration test), 완성된 시스템으로서 요구 사항을 완벽히 관철시켰는가를 알아보는 시스템 시험(system test), 그리고 사용자가 직접 자신의 사용 현장에서 검증해 보는 인수 시험(acceptance test) 등이 있다.

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

    지원형

    템플릿, 모범 사례, 교육, 그리고 다른 프로젝트에서 습득한 교훈과 가용 정보를 제공하여 프로젝트를 지원한다.

    통제형

    1. 다양한 수단을 통해 지원을 제공하고 준수 사항을 요구한다.
    2. 이 준수 사항에는 프로젝트 관리 기본 구조 또는 방법론을 적용하고, 특정 템플릿과 양식, 도구를 사용하며 거버넌스에 따르도록 하는 것이 포함될 수 있다.

    지시형

    1. 프로젝트를 직접 관리하면서 프로젝트 통제를 지휘한다.
    2. PMO는 기업의 전략적 프로젝트로부터 도출된 데이터와 정보를 통합하여 프로젝트 목표의성취도 현황을 평가한다.
    3. PMO는 조직의 포트폴리오, 프로그램, 프로젝트, 기업 측정 시스템(예: BSC) 간 연락 창구 성격을 가진다.



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

    데이터베이스 관리 시스템

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

    데이터 백업의 종류

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