메뉴

70

for 3 classes

GET rect(): p5.js를 사용한 대화형 그래픽

9 명의 학생이 수업을 완료함

연령대: 10-15 세

실시간 그룹 수업

p5.js 웹 편집기를 사용하여 대화형 그래픽을 만듭니다. https://get-ret-creations.tumblr.com/

Evan Rushton

평균 평점:

5.0

수강 후기 수:

(2 수강 후기)

실시간 화상 수업

3주 동안 주당 1회

3-10 수업 정원

60분

아웃스쿨 소개 학습 개요 선생님 리뷰

무엇이 포함됩니까?

3개의 라이브 미팅

수업 3 시간

보고계신 지문은 자동 번역 되었습니다

수업 소개

Students will be able to draw and color shapes on a canvas using a javascript library called p5.js. Additionally, participants will learn how to make their graphics interactive! They will learn through activities where they get to use their own creativity to design digital sketches. 

In the first activity, learners will choose a famous work of art or their own inspirational image, and create a digital sketch of it with p5. 

In the second activity, learners will an create animated gif of their sketch and upload it to the class Tumblr page: https://get-rect-creations.tumblr.com/.

In the third activity, learners will use a tensorflow library called poseNet, to create Instagram-like filters on their own webcam video. This activity is not supported on Internet Explorer or Microsoft Edge browsers.

As long as learners are able to type in a web browser and see images on the screen, they will be successful with this course. Progress is evaluated by the learners sharing their sketches via hyperlink. The instructor will ask students to share their screen in order to help them debug their code.

Students are expected to create a login for the p5.js web editor before the first session. If they are unable to complete an activity during class time, they are expected to complete it for homework. Please install Chrome or Firefox if you usually use Internet Explorer or Edge as your browser.

학습 목표

Students will learn the foundations of drawing with picture elements (pixels) on a 2D canvas. These include but are not limited to: RGB values, x-y coordinates, points, lines, rectangles, ovals, stroke, fill, interaction and animation.

Students will learn some of the fundamentals of the javascript coding language including variables, functions, scope, loops, data structures, conditional statements and control logic.

그 외 세부 사항

수업 자료

Course materials are free and will be shared via google docs and hyperlinks. Please create a login for the p5.js web editor before the first session.

Outschool 외 필요 앱/웹사이트

이 수업에서는 아웃스쿨 교실 외에도 다음의 툴을 사용합니다:

선생님을 만나보세요

Evan Rushton

가입일: December, 2018

5.0

2수강 후기

프로필

교사 전문성 및 자격증

I coach math teachers and support them to bring technology tools into their classrooms. I am inspired by the prospect of opening learners' eyes to the possibilities of online learning environments. My goal is to introduce learners to affinity groups where they can continue to pursue their interests freely online. This course in particular is an introduction to Dan Shiffman and his youtube channel, "The Coding Train". 

 I studied CS at Stanford: https://evanrushton.wixsite.com/learndesigntech/technology

I am an active Data Scientist: https://www.evanrushton.com/

리뷰

다른 인기 수업

70

GET rect(): p5.js를 사용한 대화형 그래픽

연령대: 10-15 세

실시간 그룹 수업

Evan Rushton

무엇이 포함됩니까?

3개의 라이브 미팅

수업 소개

학습 목표

그 외 세부 사항

수업 자료

Outschool 외 필요 앱/웹사이트

선생님을 만나보세요

Evan Rushton

교사 전문성 및 자격증

리뷰

다른 인기 수업

Javascript / P5.Js 컴퓨터 과학 코딩 동아리: 게임, 애니메이션 등

Javascript/P5.Js 크리에이티브 코딩: 게임, 애니메이션 등을 만들어 보세요!

자바스크립트 1

초보자를 위한 그래픽 디자인

학기 코딩 캠프: 어린이를 위한 자바스크립트 모험!

그래픽 디자인의 기초와 Canva

Canva로 그래픽 디자인 탐구하기

Javascript 아바타 빌더: 디지털 캐릭터 디자인 및 코딩

프로젝트 기반 자바스크립트 코딩(레벨 1)

여름 캠프: 어린이를 위한 프로젝트 기반 자바스크립트(2단계)

여름 캠프: Javascript 코딩 4 키즈(소개)

자바스크립트 학기: 기본부터 핵심 아이디어까지!

프로젝트 기반 자바스크립트 코딩(레벨 2)

초보자를 위한 그래픽 디자인: 1:1

그래픽 디자인 101 - 캠프

초보자를 위한 그래픽 디자인(십대 에디션)

더 자세히 살펴보세요

아웃스쿨 소개

학습하기

선생님 메뉴

고객 지원

재정 지원

아웃스쿨 홈페이지

일대일 과외

더 많은 수업 보기

나이별 수업

학년별 수업

앱 다운로드