Downloaded 17 times
![1. 프로그래밍 해보기
# 넥스트 사용 규칙
1) 첫 줄에는 무조건 [시작]을 적고, 마지막 명령
다음 줄에는 무조건 [끝]을 적는다.
2014-11-09 디자이너를 위한 SW원리 이해 48](https://image.slidesharecdn.com/sw-141109030012-conversion-gate02/85/Sw-48-320.jpg)
Uploaded bySangsu Song
디자이너를 위한 Sw원리 워크샵
[메일 주소 변경되었습니다.] 송상수 sssong@swedunet.org / https://www.facebook.com/gi.sik.in / swedunet.org 소프트웨어 교육 연구소에서 만든 디자이너를 위한 SW원리 이해 워크샵1주차 입니다. NHN NEXT에서 진행되었습니다. 1주차는 컴퓨터 동작 원리를 언플러그드로 체험하며 배우는 내용입니다^^
![[소프트웨어교육] 알고리즘 교사 연수 자료](https://cdn.slidesharecdn.com/ss_thumbnails/random-141108091351-conversion-gate02-thumbnail.jpg?width=640&height=640&fit=bounds)
![[D2대학생세미나]lovely algrorithm](https://cdn.slidesharecdn.com/ss_thumbnails/d2lovelyalgrorithm-140827015148-phpapp02-thumbnail.jpg?width=640&height=640&fit=bounds)
![[아이티캐너스] 체인지온닷 - 이철혁이 비영리에 전하는 이야기](https://cdn.slidesharecdn.com/ss_thumbnails/random-150730081653-lva1-app6892-thumbnail.jpg?width=640&height=640&fit=bounds)
![[강연] 학생에서 현업 개발자로의 성공적인 변신을 위하여](https://cdn.slidesharecdn.com/ss_thumbnails/random-130329101221-phpapp01-thumbnail.jpg?width=640&height=640&fit=bounds)
디자이너를 위한 Sw원리 워크샵
- 1. 멀티미디어 개론-2013년2학기-서경진 NHNNEXT 디자이너를 위한 SW 원리 이해
- 2. 1주차 첫 시간 2014-11-09 디자이너를 위한 SW원리 이해 2
- 3. 1. 강사소개 강사소개페이지는 만들어 주세요^^ http://demonocracy.info/infographics/usa/world_debt/world_debt.html 2014-11-09 디자이너를 위한 SW원리 이해 3
- 4. 2. 릴레이 소개 2분의 시간을 드립니다. - 앞에 있는 종이에 자신을 나타내는 ‘명사’ 또는 ‘형용사’를 적습니다. - 30초 동안 자신을 소개할 내용을 생각합 니다. - 2분뒤에 30초 릴레이 발표 시작! 2014-11-09 디자이너를 위한 SW원리 이해 4
- 5. 3. 무엇을 할것인가 • 오리엔테이션 • 디자이너와SW • 컴퓨터동작원리 • 정보과학적사고 • 알고리즘 • 알고리즘 경험 • 마크업 언어 • DOM Tree • 자바스크립트 • 서버실 견학 • 블로그 만들기 2014-11-09 디자이너를 위한 SW원리 이해 5
- 6. 4. 기대하기 기대해도좋습니다 큰일날 소리 - 컴퓨터가 어떤 식으로 돌 아가는지 대충은 안다. - 개발자들이 어떤 식으로 생각하는지 조금은 안다. - 마크업 언어의 원리에 대 해서 조금 안다. - 클라이언트와 서버의 관 계를 이해한다. - 나도 이제 개발자!!! - HTML/CSS 마스터 - 자바스크립트 마스터 2014-11-09 디자이너를 위한 SW원리 이해 6
- 7. 5. 디자이너와 SW 1) 왜 SW를 알아야 하는가? 2014-11-09 디자이너를 위한 SW원리 이해 7
- 8. 5. 디자이너와 SW 1) 왜 SW를 알아야 하는가? 2014-11-09 디자이너를 위한 SW원리 이해 8
- 9. 5. 디자이너와 SW 1) 왜 SW를 알아야 하는가? 2014-11-09 디자이너를 위한 SW원리 이해 9
- 10. 5. 디자이너와 SW 1) 왜 SW를 알아야 하는가? 2014-11-09 디자이너를 위한 SW원리 이해 10
- 11. 5. 디자이너와 SW 1) 왜 SW를 알아야 하는가? 2014-11-09 디자이너를 위한 SW원리 이해 11
- 12. 5. 디자이너와 SW 1) 왜 SW를 알아야 하는가? 개발자와의 소통을 위해 2014-11-09 디자이너를 위한 SW원리 이해 12
- 13. 5. 디자이너와 SW 1) 왜 SW를 알아야 하는가? 2014-11-09 디자이너를 위한 SW원리 이해 13
- 14. 5. 디자이너와 SW 1) 왜 SW를 알아야 하는가? 2014-11-09 디자이너를 위한 SW원리 이해 14
- 15. 1주차 첫 시간 2014-11-09 디자이너를 위한 SW원리 이해 15
- 16. 1. 미션 수행하기 1) 각 팀에게 미션지가 주어집니다. 2) 주어진 미션을 가장 먼저 해결해 보세요! 3) 몇 가지 규칙! - 책들은 오직! 각 팀의 책상 위에서만 올려놓고 펴서 볼 수 있습니다. - 각 팀의 책상에는 최대 4권의 책이 동시에 올라갈 수 있습니다. - 다 본 책은 반납함에 넣어주세요! 4) 모르는것이 있다면 도우미 선생님께 손을~! 2014-11-09 디자이너를 위한 SW원리 이해 16
- 17. 1. 미션 수행하기 각 팀의 미션 확인 1) 고사성어 찾기 2) 동물이름 찾기 3) 식물이름 찾기 4) 한국의 도시 이름 찾기 5) 외국의 도시 이름 찾기 2014-11-09 디자이너를 위한 SW원리 이해 17
- 18. 1. 미션 수행하기 각 팀의 미션 확인 1) 고사성어 찾기 – 낭중지추, 각골난망 2) 동물이름 찾기 – 재규어, 병아리 3) 식물이름 찾기 – 고사리, 갈대 4) 한국의 도시 이름 찾기 – 속초, 천안 5) 외국의 도시 이름 찾기 – 아테네, 로마 2014-11-09 디자이너를 위한 SW원리 이해 18
- 19. 1. 미션 수행하기 그런데.. 2014-11-09 디자이너를 위한 SW원리 이해 19
- 20. 2. 컴퓨터의 동작원리 컴퓨터 동작 원리 2014-11-09 디자이너를 위한 SW원리 이해 20
- 21. 2. 컴퓨터의 동작원리 미션지 배부 = 프로그램 실행 미션지 배부 : 사용자가 마우스로 아이콘을 더블클 릭 : 프로그램을 실행시키는 행위 2014-11-09 디자이너를 위한 SW원리 이해 21
- 22. 2. 컴퓨터의 동작원리 도서관 = 하드디스크 도서관 : 컴퓨터 속에 자성으로 정보를 기록 해 놓은 보조 기억장치 : 프로그램, 파일들이 여기에 저장되어 있어요 2014-11-09 디자이너를 위한 SW원리 이해 22
- 23. 2. 컴퓨터의 동작원리 책 찾는 행위 = 하드디스크에 있는 파일을 찾는 행 책을 찾아라 위 : 사용자가 실행시킨 프로그램을 하드디스크에서 찾는중.. 2014-11-09 디자이너를 위한 SW원리 이해 23
- 24. 2. 컴퓨터의 동작원리 책상 = 메모리(RAM) 책상 : 읽고 쓰는 것이 가능한 기억장치 : 전원 공급이 중단되면 내용이 사라짐 : 작업대 1. 미션 라고 수행하기 보면 됩니다. 2014-11-09 디자이너를 위한 SW원리 이해 24
- 25. 2. 컴퓨터의 동작원리 책.책.펴 책상 위에 = 책을 올려놓고 하드디스크에 있는 내용을 메모리 에 올려 놓은 것 펴보는것 1. 미션 수행하기 : 작업대에 작업내용들을 올려놓은것 2014-11-09 디자이너를 위한 SW원리 이해 25
- 26. 2. 컴퓨터의 동작원리 수행자 = CPU 책에 있는 내용을 수행하는 사람들 : 실제로 명령들을 읽고 계산하는 장 치 : 다른 1. 장치들에게 미션 수행하기 지시를 하기도 함 2014-11-09 디자이너를 위한 SW원리 이해 26
- 27. 2. 컴퓨터의 동작원리 간단하게 말하면.. 컴퓨터 동작 원리 사람들이 프로그램을 실행하면 하드디스크에서 그 파일을 찾아서 메모리에 그 내용을 올려놓고 그 내용을 CPU가 수행하는것 2014-11-09 디자이너를 위한 SW원리 이해 27
- 28. 우리가 자주쓰는 프로그램들 이 모든 것들이 다 0과 1로 구현이 된다? 2014-11-09 디자이너를 위한 SW원리 이해 28
- 29. 2014-11-09 디자이너를 위한SW원리 이해 29
- 30. 2. 컴퓨터의 동작원리 조금 있어 보이게 말하면.. - 폰 노이만 구조 2014-11-09 디자이너를 위한 SW원리 이해 30
- 31. 2. 컴퓨터의 동작원리 조금 더 자세히 2014-11-09 디자이너를 위한 SW원리 이해 31
- 32. 2. 컴퓨터의 동작원리 메모리를 자세히 - 정보저장 2014-11-09 디자이너를 위한 SW원리 이해 32
- 33. 2. 컴퓨터의 동작원리 메모리를 자세히 - 정보저장 2014-11-09 디자이너를 위한 SW원리 이해 33
- 34. 2. 컴퓨터의 동작원리 메모리를 자세히 – 영역 2014-11-09 디자이너를 위한 SW원리 이해 34
- 35. 2. 컴퓨터의 동작원리 메모리를 자세히 – 영역 2014-11-09 디자이너를 위한 SW원리 이해 35
- 36. 2. 컴퓨터의 동작원리 CPU를 자세히 2014-11-09 디자이너를 위한 SW원리 이해 36
- 37. 2. 컴퓨터의 동작원리 CPU를 자세히 2014-11-09 디자이너를 위한 SW원리 이해 37
- 38. 2. 컴퓨터의 동작원리 CPU를 자세히 2014-11-09 디자이너를 위한 SW원리 이해 38
- 39. 2. 컴퓨터의 동작원리 CPU를 자세히 2014-11-09 디자이너를 위한 SW원리 이해 39
- 40. 2. 컴퓨터의 동작원리 처음 본 그림. 다시 정리하자. 2014-11-09 디자이너를 위한 SW원리 이해 40
- 41. 1주차 첫 시간 2014-11-09 디자이너를 위한 SW원리 이해 41
- 42. 1. 프로그래밍 해보기 프로그래밍 = 컴퓨터가 알아들을 수 있는 말로 명령들을 내리는것 = 프로그래밍 언어를 사용하여 명령을 내리면 됨. 2014-11-09 디자이너를 위한 SW원리 이해 42
- 43. 1. 프로그래밍 해보기 프로그래밍 언어로 프로그램을 만들면 컴파일러가 0과 1의 신호로 바꿔줌 2014-11-09 디자이너를 위한 SW원리 이해 43
- 44. 1. 프로그래밍 해보기 # 프로그래밍 언어 : 넥스트 이 프로그래밍 언어를 사용하여 ‘숫자 + 숫자’ , ‘숫자 x 숫자’결과 값을 모니터에 출력할 수 있다. 2014-11-09 디자이너를 위한 SW원리 이해 44
- 45. 1. 프로그래밍 해보기 이렇게 생긴 종이에 명령어들을 쓰면 됨. 2014-11-09 디자이너를 위한 SW원리 이해 45
- 46. 1. 프로그래밍 해보기 단, (숫자)는 0~15중 하나를 (연산)은 ‘더하기, 곱하기’만 할 수 있 다. (공간)은 A,B,C 3개를 사용할 수 있다. 2014-11-09 디자이너를 위한 SW원리 이해 46
- 47. 1. 프로그래밍 해보기 사용할 수 있는 명령어 - (공간A/B/C)에 (숫자) 넣기 - (공간A/B/C)에 (공간A/B/C) 값 넣기 - (공간A/B/C)값과 (공간A/B/C)값 (연산)한 것을 남은 공간에 넣기 - 모니터에 (공간A/B/C)를 출력하기 2014-11-09 디자이너를 위한 SW원리 이해 47
- 48. 1. 프로그래밍 해보기 # 넥스트 사용 규칙 1) 첫 줄에는 무조건 [시작]을 적고, 마지막 명령 다음 줄에는 무조건 [끝]을 적는다. 2014-11-09 디자이너를 위한 SW원리 이해 48
- 49. 1. 프로그래밍 해보기 # 넥스트 사용 규칙 2) 한줄에 하나의 명령만 쓸 수 있다. Ps) 컴퓨터가 명령은 위에서 아래로 순서대로 읽 는다. 2014-11-09 디자이너를 위한 SW원리 이해 49
- 50. 1. 프로그래밍 해보기 # 프로그래밍 예제 1) 3+4를 해서 모니터에 결과값을 보여주는 프로그램 2014-11-09 디자이너를 위한 SW원리 이해 50
- 51. 1. 프로그래밍 해보기 2명이서 짝이 되어 주어진 명령어로 프 로그램을 만들어 보세요. (인간컴퓨터 로 실행해볼 예정!) A팀 B팀을 나누어서 상대팀이 준 프로 그램을 가장 빨리 처리하는 팀이 승리! 2014-11-09 디자이너를 위한 SW원리 이해 51
- 52. 비트박스 2의7승 =128 2의6승 = 64 2의5승 = 32 2의4승 = 16 2의3승 = 8 2의2승 = 4 2의1승 = 2 2의0승 = 1 2014-11-09 디자이너를 위한 SW원리 이해 52
- 53. 비트박스 0 00 0 0 1 0 1 2의7승 = 128 2의6승 = 64 2의5승 = 32 2의4승 = 16 2의3승 = 8 2의2승 = 4 2의1승 = 2 2의0승 = 1 0 0 0 0 1 1 0 1 2의7승 = 128 2의6승 = 64 2의5승 = 32 2의4승 = 16 2의3승 = 8 2의2승 = 4 2의1승 = 2 2의0승 = 1 0 1 0 0 0 1 0 1 2의7승 = 128 2의6승 = 64 2의5승 = 32 2의4승 = 16 2의3승 = 8 2의2승 = 4 2의1승 = 2 2의0승 = 1 1 0 0 0 0 0 0 1 2의7승 = 128 2의6승 = 64 2의5승 = 32 2의4승 = 16 2의3승 = 8 2의2승 = 4 2의1승 = 2 2의0승 = 1 1+4 = 5 1+4+8 = 13 64+4+1= 69 128+1 = 129 2014-11-09 디자이너를 위한 SW원리 이해 53
- 54. 조금다른 비트박스 명령구분 부분 2의3승 = 8 2의2승 = 4 2의1승 = 2 2의0승 = 1 2014-11-09 디자이너를 위한 SW원리 이해 54
- 55. 조금다른 비트박스 00 0 1 0 1 0 1 0001 = 더하기 0111 = 곱하기 0011 = 빼기 1111 = 나누기 2의3승 = 8 2의2승 = 4 2의1승 = 2 2의0승 = 1 0 0 1 1 1 1 0 1 0001 = 더하기 0111 = 곱하기 0011 = 빼기 1111 = 나누기 2의3승 = 8 2의2승 = 4 2의1승 = 2 2의0승 = 1 0 1 1 1 0 1 0 1 0001 = 더하기 0111 = 곱하기 0011 = 빼기 1111 = 나누기 2의3승 = 8 2의2승 = 4 2의1승 = 2 2의0승 = 1 1 1 1 1 0 0 0 1 0001 = 더하기 0111 = 곱하기 0011 = 빼기 1111 = 나누기 2의3승 = 8 2의2승 = 4 2의1승 = 2 2의0승 = 1 5 더하기 13 빼기 5 곱하기 1 나누기 2014-11-09 디자이너를 위한 SW원리 이해 55
- 56. 메모리 - 하드디스크에있는 모든 내용 이 다 들어오면 두 손을 듦. 하드디스크 - 0,1로 바뀐 프로그램을 메모리에게 전달해줌 (가져다 주는것이 아니라 복사) 컴파일러 - 상대가 만든 프로그램을 0,1 로 바꿔주고 하드디스크에 넘겨 줌 상대팀(사용자) - 자신이 만든 프로그램을 컴파 일하고 실행함 운영체제 - 메모리가 손을 들면 호루라기 를 붐 CPU @ 명령 가지고 오는 사람 - 호루라기 소리를 들으면 메모 리에서 명령 한 줄을 가지고 와 서 (복사) 해독&명령자에게 줌 @ 해독&명령자 - 명령을 해석한 다음 (명령 가 지고 오는 사람 / 모니터 / 계산 기) 에게 명령을 내림 @계산기 - 해독&명령자의 지시에 따라 계산을 하고 결과를 말해줌 모니터 - 출력하라는 명령을 받으면 0,1을 보고 숫자를 출력해줌 2014-11-09 디자이너를 위한 SW원리 이해 56
- 57. 숙련된 조교의 시 범 2014-11-09 디자이너를 위한 SW원리 이해 57
- 58. 실제 컴퓨터 프로그램 1) 계산기 2) 코딩해보기 2014-11-09 디자이너를 위한 SW원리 이해 58
- 59. 정리하며 2014-11-09 디자이너를위한 SW원리 이해 59
- 60. 소감 나누기 2014-11-09디자이너를 위한 SW원리 이해 60
Editor's Notes
- #3 [5분]
- #4 [5분]
- #5 [10분] 각 사람당 종이 한 장을 줍니다. 2) 2분의 시간 동안 종이에는 자신을 나타내는 ‘형용사’ 또는 ‘명사’ 단어 1개를 적고 (‘센티한’ ‘엄청난’ ‘도전하는’ ‘아이’ 등등) 자신을 30초 동안 소개할 수 있게 준비시킵니다. [ 그 종이 들고 발표할 것 ] 3) 5개의 테이블 발표 순서를 정해서 30초동안 발표하게 합니다. Ex) 이름, 나이, 왜왔는지, 뭘 기대하는지 등등
- #6 [5분] 4주간의 과정 소개 (각 차시별 목적과 활동 간략하게 소개하기)
- #7 [5분] 이 수업이 끝나면 당신들이 어떤것들을 할 수 있다. 하지만 (큰일날소리) 이것들을 기대해서는 안된다. 이제 시작이고 계속해서 노력하고 공부해야 한다. 이번 수업은 토양을 다지는 수업이다~
- #8 [25분] 왜 소통이 안되는가? – 서로의 대한 이해 부족
- #9 [25분] - 이런 경우가 많다.
- #10 [25분] -[5분] 개발자 암걸리게 하는 영상 (전체화면으로 보기) [개발자가 많이 듣는 말] 흔히 있는 일이다. http://guravia.tistory.com/192
- #11 [25분] 왜 소통이 안되는가? – 서로의 대한 이해 부족 [디자이너가 많이 듣는]
- #12 [25분] 왜 소통이 안되는가? – 서로의 대한 이해 부족 [디자이너가 많이 듣는]
- #13 [25분] 정리) 왜 sw를 알아야 하는가? 1. 개발자와의 소통을 위해 SW를 알아야 한다.
- #14 [25분]
- #15 [25분] 정리) 왜 sw를 알아야 하는가? 2. SW산업의 발전 – SW디자인 수요가 늘어남 – SW디자인 잘 하려면 – SW동작방식에 대한 기본적인 이해가 있어야함. (특히 웹)
- #16 [5분]
- #17 [규칙 설명 5분] [상세한 설명/활동지는 활동1 첨부파일 참고] [시작하면 음악 15분간 틀어주기]
- #18 미션이 끝나고 확인하는 부분
- #19 미션이 끝나고 확인하는 부분
- #20 우리가 지금까지 뭘 한걸까? 이걸 왜 했지?
- #21 컴퓨터의 동작 원리를 체험해 본 것이다. 하나하나씩 우리가 한 것들을 생각하면서 컴퓨터의 동작 원리를 알아보자.
- #22 미션지를 받은것 = 프로그램을 실행 한것이다.
- #23 도서관에서 책을 가지고 왔었는데 도서관은 = 하드디스크이다. 여러 책이 있었던것 처럼 여러가지 파일과 프로그램들이 저장되어 있다.
- #29 http://cs.kangwon.ac.kr/~ysmoon/courses/2005_2.5/ic/05.pdf http://it.donga.com/3416/
- #30 컴퓨터에게 줄 수 있는 단 2가지의 신호 0과 1
- #31 현재 컴퓨터의 가장 일반적인 모형임. 프로그램은 순서를 따라 한번에 하나 씩 실행되는 명령어로 구성된다. 프로그램은 컴퓨터가 접근할 수 있는 저장영역에 놓여지며, 하나의 명령어를 갖고 와서 실행하고, 이어 다음 명령어를 가지고 오는 식으로 차례대로 수행된다.
- #33 메모리 관련 1) (0과 1로 정보를 저장한다) http://blog.skhynix.com/119
- #34 메모리 관련 http://blog.skhynix.com/119
- #35 메모리 관련 http://blog.skhynix.com/119
- #36 메모리 관련 http://blog.skhynix.com/119
- #37 강의 참고 내용 http://recipes.egloos.com/viewer/4982170
- #42 [5분]
- #45 C, java같은 고급언어들이 많지만 우리는 쉽게 우리가 만든 프로그래밍언어인 ‘넥스트’를 사용할 것이다.
- #46 C, java같은 고급언어들이 많지만 우리는 쉽게 우리가 만든 프로그래밍언어인 ‘넥스트’를 사용할 것이다.
- #47 C, java같은 고급언어들이 많지만 우리는 쉽게 우리가 만든 프로그래밍언어인 ‘넥스트’를 사용할 것이다.
- #48 C, java같은 고급언어들이 많지만 우리는 쉽게 우리가 만든 프로그래밍언어인 ‘넥스트’를 사용할 것이다.
- #49 C, java같은 고급언어들이 많지만 우리는 쉽게 우리가 만든 프로그래밍언어인 ‘넥스트’를 사용할 것이다.
- #50 C, java같은 고급언어들이 많지만 우리는 쉽게 우리가 만든 프로그래밍언어인 ‘넥스트’를 사용할 것이다.
- #51 C, java같은 고급언어들이 많지만 우리는 쉽게 우리가 만든 프로그래밍언어인 ‘넥스트’를 사용할 것이다.
- #52 C, java같은 고급언어들이 많지만 우리는 쉽게 우리가 만든 프로그래밍언어인 ‘넥스트’를 사용할 것이다.
- #57 각각의 상세규칙은 조교4명이서 따로따로 설명해주도록..
- #59 방금 한 것들은 계산기가 기본적인 예이다. 계산기 가지고 3+5 하는 결과 보여주기 랩실에 비쥬얼 스튜디오가 깔려 있다면 c나 c#으로 3+5 결과 나오게 하도록 코드 따라 치게 하기
- #60 페이지 29~40 훑으면서 한거 정리
- #61 매우 느리고 힘들다 하지만 컴퓨터는 이것을 1초에 억단위로 처리한다. 그리고 인간은 중간중간 실수를 하지만 컴퓨터는 실수하지 않는다.