2021년 AI교육콘텐츠(자바스크립트와 머신러닝을 활용한 인공지능교육)

 

자료형태: PDF(교재 원고)

 

 

목차

 

 

1. 1. p5.js 코딩 준비

  1.1 p5.js 코딩 준비 

  1.2 코드 파일 구성1(기본구성)

  1.3 코드 파일 구성2(HTML 파일만 사용)

  1.4 코드 파일 구성3(여러 개의 파일로 구성)

  1.5 캔버스(canvas)

  1.6 p5.js 코딩 레퍼런스

  1.7 p5.js 라이브러리

 

 

2. 2. 평면도형(2D Primitives)

  2.1 원과 타원(circle & ellipse)

  2.2 정사각형과 직사각형(square & rect)

  2.3 점과 선(point & line)

  2.4 삼각형과 사각형(triangle & quad)

  2.5 원호(arc) 

 

 

3. 3. 입체도형(3D Primitives) 

  3.1 평판(plane) 

  3.2 상자(box)

  3.3 구체(sphere)

  3.4 원기둥(cylinder)

  3.5 원뿔(cone)

  3.6 타원체(ellipsoid)

  3.7 원환체(torus)

  3.8 3D.obj 파일 불러오기

 

 

4. 4. 이미지 처리와 애니메이션

  4.1 도형의 움직임 

  4.2 캔버스 안에서 볼 바운스 

  4.3 마우스 이벤트 

  4.4 키보드 이벤트 

  4.5 이미지파일 불러오기 

  4.6 이미지 드롭박스 

  4.7 도형의 거리와 충돌 

 

 

5. 5. 사운드와 비디오, 웹캠영상 

  5.1 MP3 플레이어 만들기 

  5.2 음악의 파형 시각화하기

  5.3 목소리 크기에 따라 커지는 원 

  5.4 VIDEO 플레이어 만들기 

  5.5 웝캠 영상 만들기 

  5.6 웝캠 영상 처리하기 

  5.7 웝캠 영상 픽셀 단위 처리하기 

  5.8 웝캠 영상 픽셀 단위 응용하기 

 

 

6. 6. 오브젝트와 클래스 

  6.1 변수와 함수를 이용한 클래식 코딩 

  6.2 오브젝트로 객체지향프로그래밍(OOP)하기

  6.3 오브젝트를 움직여보자. 

  6.4 클래스에서 오브젝트를 만들어보자.

  6.5 클래스 상속을 알아보자.

  6.6 클래스 응용해 보자.

 

 

7. 7. p5.speech 라이브러리

  7.1 p5.speech 라이브러리 설치하기

  7.2 텍스트를 한국어로 말하기

  7.3 텍스트를 일본어로 말하기

  7.4 웹폰트와 캔버스 폰트

  7.5 한국어를 캔버스에 텍스트로 받아쓰기

  7.6 중국어를 웹문서의 텍스트로 받아쓰기

  7.7 컴으로 받아쓰고 컴으로 읽어주기

 

 

8. 8. HTML과 DOM

  8.1 createDiv, createSpan, createP, createElement

  8.2 createImg, createA, createCanvas

  8.3 createSlider, createButton

  8.4 createCheckbox, crerateRadio

  8.5 createSelect, createColorPicker

  8.6 createInput, createFileInput

  8.7 createAudio, createVideo, createCapture

9.  
10.  
11. 9. 머신러닝(기계학습) 

  9.1 동물, 사물 분류하기: ImageClassifier(MobileNet)

  9.2 드래그&드롭으로 분류하기 : ImageClassifier(MobileNet)

  9.3 웹캠 영상으로 사물분류하기: ImageClassifier(MobileNet)

  9.4 신체 부위별 포인트 찾기 : PoseNet

  9.5 손의 부위별 포인트 찾기 : Handpose

  9.6 얼굴 표정의 포인트 찾기 : Facemesh

  9.7 사물 탐지기 만들기 : Object Detector

  9.8 얼굴인식 : faceApi

  9.9 소리 분류 : SoundClassification

  9.10 댓글 감정 분류 : Text Sentiment

 

 

10. 머신러닝(Teachable Machine)

  10.1 mask‧noMask Classifier 만들기

  10.2 사운드 분류 머신러닝 모델 만들기 : Teachable Machine

  10.3 포즈 분류 머신러닝 모델 만들기 : Teachable Machine