post list

2014년 8월 31일 일요일

SKNode글 추가 SKPhysicsBody 에 대해서


노드는 옵션으로 물리 몸체(physics body)가질 수 있습니다.

일단  skphysicsbody reference 입니다. 참고 하시고

Tasks


Creating Volume-based Physics Bodies


Creating Edge-based Physics Bodies


Defining How Forces Affect a Physics Body


Defining a Body’s Physical Properties


Working with Collisions and Contacts


Applying Forces and Impulses to a Physics Body


Inspecting the Physics Body’s Position and Velocity


Reading the Physics Body’s Node

  •    node  property

Determining Which Joints Are Connected to a Physics Body


기본적으로 물리몸체는 body를 할당하는 걸로 시작합니다. 

노드 객체가 생성된 상태에서 

클래스 메소드인  


요따위 것들로  바디를 할당합니다.  

여기서 다른건 사용하기 쉬운데 제일 복잡하면서 효율적인 path를 사용하는 
법을 좀 알보겠습니다. 

CGFloat offsetX = self.crocodile.frame.size.width * self.crocodile.anchorPoint.x;
CGFloat offsetY = self.crocodile.frame.size.height * self.crocodile.anchorPoint.y;
 
CGMutablePathRef path = CGPathCreateMutable();
CGPathMoveToPoint(path, NULL, 47 - offsetX, 77 - offsetY);
CGPathAddLineToPoint(path, NULL, 5 - offsetX, 51 - offsetY);
CGPathAddLineToPoint(path, NULL, 7 - offsetX, 2 - offsetY);
CGPathAddLineToPoint(path, NULL, 78 - offsetX, 2 - offsetY);
CGPathAddLineToPoint(path, NULL, 102 - offsetX, 21 - offsetY);
 
CGPathCloseSubpath(path);
 
self.crocodile.physicsBody = [SKPhysicsBody bodyWithPolygonFromPath:path];

[self.crocodile skt_attachDebugFrameFromPath:path color:[SKColor redColor]];
CGPathRelease(path);
출처 :http://www.raywenderlich.com/

tc_cut_the-rope_debug
출처 :http://www.raywenderlich.com/

이렇게 빨간 색으로 그려진 것 처럼 path를 이용해서 물리몸체를 할당 할수 있습니다. 
원래 빨간 색선은 나타나지 않으나  
위에 처럼 빨간선을 보기 위해선 
[self.crocodile skt_attachDebugFrameFromPath:path color:[SKColor redColor]]; 
이게 필요합니다. 
먼저 라이브러리를 추가 해야 하구요 

이건 사용법과 설명

Note: You may have noticed a call to skt_attachDebugFrameFromPath: for most of the physics bodies. This is a method from SKNode+SKTDebugDraw, which is part of a group of Sprite Kit utilities developed by Razeware. This particular method helps with debugging physics bodies. To turn it on, openSKNode+SKTDebugDraw.m and change the line BOOL SKTDebugDrawEnabled = NO; to BOOL SKTDebugDrawEnabled = YES;. This will draw a shape that represents your physics body. Don’t forget to turn it off when you’re done!

라이브러리 파일

body를 할당하면 자동으로 중력의 영향을 받기 시작합니다. 

중력 크기 바꾸기 
scene.physicsworld.gravity = CGVectorMake( 0.0 , -9.8);

중력 영향 안 받기 
프로퍼티 affectedByGravity 를 바꿉니다.
node.physicsworld.affectedByGravity = NO;
이렇게 

물리 시뮬레이션 끄기 
프로퍼티 dynamic 값을 no로 설정 

무게 설정
프로퍼티 mass 값 설정 (단위 ,kg)


스프라이트 킷 렌더링 루프 


따라서,
지속적으로 확인 해야 하고  변화를 주어야 하는  코드는 
위의 세개의 메소드에 적어주면 됩니다. 

저 세개의 메소드는  계속 반복하며 돌아 갑니다. 


physicsbody의 핵심은 아마도 충돌과 접촉 이겠죠 
할 이야기가 많아서 다음글에......






스프라이트 킷(spriteKit)의 클래스들 2. 노드 넣기(SKNode)


스프라잍트 킷에 표시되는  물체. 배경  등등이 바로 노드 라는 것입니다.

다음은  SKNode class reference 입니다. 참고하시고

Tasks


Creating a New Node


Inspecting the Node’s Position


Setting a Node’s Scaling and Rotation


Inspecting a Node’s Visibility


Determining Whether a Node Supports User Interaction


Working with Node Trees


Naming Nodes


Running Actions


Adding Physics to a Node


Converting To and From the Node’s Coordinate System


Determining If a Point Lies in a Node


Performing Node Intersections


Storing Custom Node Data




노드는 각각 physicsBody를 가질 수 있으며  이것 들은  physicsWorld에 의해 컨트롤 됩니다.

노드에는 여러 가지가 있습니다.

1. SKSpriteNode :  텍스쳐로 표현 되는 노드입니다.  직접 포토샾 같은 걸로 그림을 그려서  만들수 있는 노드 입니다.

2. SKLabelNode : 글자를 표시 하는 노드 입니다.  글자색도 지정할수 있고 글자체도 가능

3.   SKVideoNode: 비디오를 재생해주는 노드 입니다.

4. SKShapeNode : 직접 코어 그래픽스를 이용해서 도형 을 그릴수 있습니다.

5. SKEmitterNode; 파티클 이미터를 추가할수 있습니다.  쉽게 말해 특수효과 입니다.

6. SKCropNode :  마스크를 이용해서 노드를 잘라 낼수 있습니다.

마스크란?   포토샾이나 그래픽 공부하면 자세히 배우는데
                예를 들어 제대로 된 그림이 있습니다.  거기에 마스크를 씌웁니다.
               그럼 그림이 투명해 집니다. 마스크에 흰색을 칠하면 칠한 부분만  그림이
               보입니다.   요딴 개념을 사용해서 노드를 잘라냅니다.

7.  SKEffectNode : 코어 이미지 필터를 자식노드에 적용 합니다.
                           우리가  스마트폰 카메라 어플 쓸때 사용하는 필터랑 비슷한 겁니다.


SKNode reference 문서가 양이 너무 많아 다 설명하진 못하고 중요하다 생각하는것만 몇개 설명합니다.


노드를 투명 하게 만들고 싶을때
alpha 값을 변화 시키면 됩니다.   0: 투명

노드 이미지를 뒤집고 싶을때

xScale 을 사용합니다. 기본값 1.0
 여기에 -1.0을 넣으면 이미지가 뒤집힙니다.

sknode.xScale = fabs(sknode.xScale) * -1; 이렇게

당연히 yScale도 마찬가지

노드 숨기기
hidden 에  yes대입합니다.


이름 지정하기
sknode.name = @" 이름 ";
이름은 왠만 하면 지정합니다. 그냥  안써도.

노드들이 겹치네 ???

zPosition 에 값을 다르게 주면 됩니다.   값이 높으면 위로 올라옴


그리고 SKSpriteNode 에 관한거  
가장 많이 쓰는 노드니까 요거에 관한거 몇개 더

초기화 하기

Initializing a New Sprite



+는 클래스메소드  - 는 인스턴스 메소드 입니다.
 차이는   간단하게  인스턴스 메소드는 객체를 생성하고 사용하는 메소드
클래스 메소드는  객체 생성 없이 사용하는 메소드입니다.

사이즈 지정하기 

sknode.size = cgsizemake( 100, 100);   // 요딴식으로

중간에 노드의 이미지를 변경하고 싶다.

sknode.texture  요기에 변경하고 싶은 이미지 넣기

위치를 잡을때 기준이 되는 포인트 바꾸기

sknode.anchorPoint 값을 변경해 주면됨  기본값은 (0.5,0.5)  <- 노드중심


physicsBody이는 지금 적으려고 했는데 양이 너무 많아서 다음글에서 ....






2014년 8월 30일 토요일

스프라이트 킷(spriteKit)의 클래스들 1. 화면(Scene)띄우기



첫번째로 SKScene, SKView 에 관한 내용 입니다.

우리의 목적은  스프라이트 킷의 기본적인 내용들을 살펴 볼 것이므로

필요한것만 알아 볼것입니다.  그래서 깊게 들어가지 않습니다.


일단  스프라이트 킷을 선택 해서  프로잭트를 만듭니다.

알아서 기본적인것들을 다 세팅 해주네요

여기서  우리가 신경 쓸 부분은
ViewController.m 부분입니다.

여기서 viewDidLoad: 메소드 부분이 중요합니다.


1. skview 클래스는 uiview클래스의 하위 클래스 이므로 그냥 skview를 선언하고 있습니다.
거기에  viewcontroller의 view를 skview로 대입하고 있네요

2. showFPS는  현재 FPS(frame per second)를 띄워줍니다.
3. showNodeCount =yes 는 자동으로 노드의 개수를 세어줍니다.
    2,3 번 2개는 개발 할때 도움이 되는 것이므로  개발할때는 그대로두고 나중에 지웁니다.

4. skcene 을 선언하고  만들어져있는 scene을 대입합니다.
5.  scene 의 크기를 지정해 줍니다.   현재 설정은  scene이 skview를 모두 채웁니다.

6.  현재 표시할 scene을 앞에 선언한 scene으로 정합니다.

기본적으로 따로 수정할 것들이 없습니다.  적혀있는 그대로 쓰면 됩니다.


그러나

게임 스크린이 가로형인 게임을 만들때는 좀 이야기가 달라집니다.

여기서
portrait가 세로로 세웠을때
landscape 가 눕혔을때 입니다.
여기서  portrait 체크를 지워줍니다.



Myscene.m 에서 코드를 추가 합니다. 

그리고 어떻게 되는 지 확인해 봅시다.
 simulator 는 iphone 4inch로



콘솔창에는 세로 사이즈가  찍혀 나옵니다.




이렇게 해주면 해결 됩니다.

viewWillLayoutSubviews 메소드를 새로만들고 viewDidLoad에 있던거 옮긴겁니다.

제대로 나오고 있습니다.

마지막으로 계층구조

스프라이트킷 계층 구조



2014년 8월 24일 일요일

iOS7 스프라이트 킷 프로그래밍에 대해 (about spriteKit)


스프라이트 킷은   물리엔진은 물론   2차원 게임을 만드는데 모든것을 제공하는 프레임워크입니다..

우리가 2차원 게임을 만들때 고려해야할 것이 모바일 게임 엔진인데

모바일 게임 엔진은 대표적으로

cocos2d
cocos2d-x
유니티

이렇게 있는데

cocos2d 는 ios환경에서 개발합니다.
물론  objective-c를 사용합니다


cocos2d-x 는 멀티플랫폼으로  개발 가능하고 c++/luna 등등을 사용합니다.

이렇게 2개는 무료입니다.   사용법이 다소 어렵다고

유니티는  유료이고  사용법이 쉽다고 합니다.
디자이너도 개발언어를 몰라도 사용이 가능하다고 합니다.

이것들 말고  apple에서 자체 개발해서 제공하는 게 바로 spriteKit입니다.

spriteKit은  ios용 게임만 만들 수 있습니다.

ios8이 공개 되면서 spriteKite이 좀 더 발전할것 같습니다.

스프라이트 킷은

skview, SKScene , SKNode 가 꼭 포함되어야 합니다.

각 skscene 은 SKPhysicsWorld 클래스를 통해서 물리 세계를 가집니다.
이때 skNode들이 SKPhysicsBody 클래스를 통해  물리몸체로 연결되면
물리 세계의 영향을 받습니다.
이를 통해  충돌등의 물리 현상을 단순히 메소드만 사용하여 구현 가능합니다.

자세한건  각 클래스의 reference 문서를 참조하세요

또한, 파티클 이미터를 사용해서 각종 특수효과를 만들수 있습니다.
xcode는 자체적으로 편집기를 가지고 있습니다.

sknode는 skAction 클래스를 통해  액션을 수행할수 있고
액션을 통해서  에니메이션  움직임 등을 표현 할수 있습니다.

skTransition 클래스를 이용하여 게임을 다른화면으로 전환 가능 합니다.


다음글 부터  각각의 클래스에 대해 자세하게 설명 들어갑니다.









2014년 8월 23일 토요일

xcode에서 텍스쳐 아틀라스 사용하기 (how to use texture atlas)


이번에는 텍스쳐 아틀라스를 사용하는 법을 알아 보겠습니다.



저는 요즘 나루토에 꽂혀있슴으로  나루토 에니메이션을 만들어 보도록 하겠습니다.

나루토 이미지 zip파일

나루토 이미지 파일을 받고   텍스쳐 아틀라스로 만들어 줍니다.

텍스쳐 아틀라스 만드는 법은 여기 링크로..
텍스쳐 아틀라스 만들기 글



텍스쳐 아틀라스 이름은

naruto_stand.atlas 로 하겠스빈다.


xcode5기준

spriteKit 템플릿 으로  프로젝트 를 생성해 줍니다.



텍스쳐 아틀라스를 추가하고  세팅까지 해줍니다.



저기서  Spaceship.png 따위는 지워줍니다. 


그리고 naruto_aniMyScene.m 안에 소스들도 아래 사진처럼 지워줍니다. 


클래스 확장을 해서
프로퍼티로 배열을 선언 합니다.

나루토 노드를 생성해주는 메소드를 작성합니다.


에니메이션을 생성하는 메소드를 작성합니다.

이제  initWithsize 메소드에   아래 소스를 작성합니다.


나루토가 역동적으로 움직이는 것을 확인 할수 있습니다.


이상 텍스쳐 아틀라스로 에니메이션 만들기 였습니다.


xcode 에서 텍스쳐 아틀라스 만들기(How to create Texture atlas)



게임을 개발하다 보면 에니메이션을 사용한다거나  여러 노드를 추가 하면서
이미지를 매우 많이 사용하게 됩니다.
이럴때 많은 이미지파일을 개별적으로 추가 할경우  불필요한 메모리를 많이 잡아먹는데
이때 해결책이  이미지를 모두 모아 한장의 시트지로 만들어줍니다.
이 한장의 시트지를 스프라이트 시트(Sprite Sheet) 또는 텍스쳐 아틀라스(Texture atlas)라고 부릅니다.

이 텍스쳐 아틀라스를 만들기 위해선 Zwoptex, texturepacker 등등의
texture atlas generator를 사용하는데 대부분 유료 이거나  받기 복잡합니다.

만든 후
사용하는 것도 드럽게 귀찮아요


 그러나 xcode에서는 쉽게 texture atlas를 만들 수 있습니다. 사용도 쉬움

1. 새폴더를 생성합니다.
          이때 이름을  영어로  적고 뒤에  .atlas 만 붙여 줍니다.
           그리고  이미지를 넣어줍니다.

메모리 아낀다고 한 게임에 들어가는 이미지를 모두 한 시트에 집어 넣기 보다는
관련있는  이미지 끼리 모아 텍스쳐 아틀라스를 만들어 쓰는 것을 권장합니다. 


2. xcode5를 켠후  폴더 자체를 드래그 해서 프로젝트에 추가 시켜 줍니다.




3. 끝 


비록 이미지가 텍스쳐 아틀라스 안에 들어가 있는 상태라도 
개별적으로 추가한 이미지 쓰듯이 쓸 수도 있습니다. 



이미지 확장자는 png 로 하세요 
그외에는 안써봄  jpg 이런거 넣어서 오류나면 나도 모름 
ios에는 png가 잘 맞습니다. 

아틀라스 이름과 이미지 이름도  왠만하면 같게 하세요 ~~~
happyOri.atlas 라면   
이미지이름은  
happyOri001.png
happyOri002.png
.
.
.
happyOri010.png
위에 사진은... 만들기 귀찮아서 그냥.. 


텍스쳐 아틀라스 사용 할때 주의할점 

1.텍스쳐 아틀라스 만들때  폴더이름과  경로명에 어느 곳에도  한글이 들어가서는
안됩니다. 꼭!! 확인하세요

아주 큰 오류가 떠서  답이 없습니다.

2. 빌드 세팅을 해줘야 합니다.
     Build Settings 으로 들어가서  검색창에  sprite라고 치면
Enable Texture Atlas Generation 이 뜨는데 요거  Yes 해줘야 됩니다.

기본값은 NO입니다.


/*
 xcode6에서는
Build Settings 에서 SPRITEKIT_TEXTURE_ATLAS_OUTPUT 으로 변경 되었습니다. 
*/





텍스쳐 아틀라스 사용 법은 다음 글에서 ~~~

2014년 8월 21일 목요일

엔지니어 초청 구글나이트 후기 (구글 취업 관련 정보 & 구글 코리아 문화 & 구글 엔지니어 )


구글 코리아 본사에서 이번에는  엔지니어 대상으로  구글 나이트 행사를 진행했습니다.
초대메일 받고 갔다 왔음  
역삼역 2번 출구에 내리면 바로 보이는 건물  22층에 구글 코리아 본사가 있습니다.





자유 롭게 음식과 음료를 가져다 먹을 수도 있고  

행사 진행은 

오후 7시 부터 9시까지
product manager 의 인사말과 
엔지니어 분들의 기술강연
구글 채용설명
구글 엔지니어와의 대화 및 Q&A 순으로 진행 되었어요






내용을 요약하면

구글은 엔지니어가 갑.

구글의 윗선에서는  방향만 제시를 합니다.
엔지니어들은 그 방향에 따라 프로젝트를 제안하게 되고
채택이 됬을 때 팀이 만들어져프로젝트화 되어 일을 진행합니다.

프로젝트를 통해 제작된 소스등 결과물은 본인이 오너가 되어  계속 관리를 하게 됩니다.
따라서 엔지니어는 코드에 대한 주인 의식을 가지고 있으며
지속적으로 엔지니어들간 리뷰를 통해 코드를 계속 다듬어 나가는 방식입니다.

구글에서 엔지니어들이 중요하게 생각하는 능력은
technology 가 아닌
deep understand , insight 그리고  technical leadership 입니다.

구글의 주인은 엔지니어이며  면접도 엔지니어가 하고  디자인도 하고 다합니다.

제일 마음에드는 건  회사원이지만 본인만의 벤처를 합니다.

프로젝트를 정할때는  risk taking이 큰 프로젝트를 진행 하며
기본  1billion idea 프로젝트를 한다고 합니다.

결정은 데이터를 기반으로 합니다.

구글 코리아에 있는  직업 분야는 크게 3가지로 나뉘며
engineer,  manager , pm 입니다.
그렇지만 이 세 직업군은 경계가 불문명하고
모두 본인이 잘하는걸 찾아서 일을 합니다.

본인의 일정은 자기가 정하고   자유로운 만큼 책임도 큽니다.

사수 부사수 개념이 없고   멘토 멘티 개념은 있습니다.

입사를 하면 3개월을 noogler 로 생활하며 이때는 미국 구글에 가서 생활을 하고
알아서 비행기타고 알아서 호텔잡고 생활 합니다.
이때는 실수도 봐주고  많은 걸 바라지 않습니다.

googler가 되면 한사람의 엔지니어로서 생활을 시작합니다.
구글 엔지니어는 구글안에 있는 모든 소스를 다 볼수 있습니다.
인프라가 매우 잘 구축 되어 있어  개발 환경이 매우 좋고
소스를 테스트 할때도   아주 쉽게   수 천대의 컴퓨터를  개인이 돌리며 개발이 가능합니다.

구글 코리아 내에서는 서로 존중해주는 문화가 자리 잡혀 있고

강제적인 회식 같은  강압적인 기업문화가 없고
하기 싫으면 안합니다. 


구글 채용 관련

상시 채용하며  한국의 다른 대기업처럼 한꺼번에 진행하는 공채는 없습니다.

google.com/jobs 를 치면 현재 채용하는 직업군과  office 를 확인할수 있고
이력서도 여기서 냅니다.
인턴도 여기서 뽑습니다.

이력서는 영문 이력서를 추천 하는데
docs.google.com/templates
여기가면 받을수 있습니다.
pdf파일로 만들어서 보내면 됩니다.

이력서를 넣으면  2주 안에 전화가 오는데
안오면 떨어진거

전화 인터뷰 -  온사이트 인터뷰
순으로 진행되고

대체로 총 45일 - 57 일정도 걸린다고 합니다.

전화 인터뷰 이상을 진행하고 불합격 할경우
개인마다 4가지 항목에 대해  리포트를 작성해 줍니다.

불합격해도 지원은 계속 가능하지만  이전점수가 1년간 남기 때문에
1년내에 다시 지원을 할 경우 점수를 이전점수와 평균을 냅니다.
1년 후에는 이전 점수가 사라집니다.

전화인터뷰

구글의 엔지니어중 한명이 전화를 하면 집에서 컴퓨터를 사용하여
google docs 를 통해 코딩을 합니다.
45분간 진행

이때 외국인 엔지니어가 전화를 하면 졸지에 영어면접을 진행할수도...

합격을 할경우

온사이트 인터뷰

인터뷰의 하이라이트입니다. 가장많이 떨어지는 단계라고  합니다.

회사에 나가서 인터뷰를 진행하는데
엔지니어 4명과 인터뷰를 합니다. 각각 45분정도.
중간에  구글의 자랑인  밥도 같이 먹으며 세미 인터뷰진행

다시 인터뷰 진행.

이때는
코딩을 컴퓨터로 하지 않습니다. 무조건 손코딩!! 합니다.


인터뷰를 마치면  4명의 엔지니어가 작성한  자료를 보며
8명의 구글러가 리뷰를 합니다.

그리고 합격


구글에서 보는건

프로그래밍 언어 능력
시스템 디자인, 아키텍쳐
문제 해결능력
인성

이정도로 봅니다.

이력서에서
토익 토플 따위 공인 영어 성적은 보지 않고 
대학교도 안봅니다. 
따라서 고졸도 합격 가능하고 실제 합격한 사람도 있답니다.

그리고 기술면접의 문제 난이도는
컴공과  2,3 학년 전공 시험 수준이라고 합니다.

그리고  퍼즐문제 같은 IQ테스트 식의 문제는 내지 않습니다.  


온사이트 인터뷰 기술면접 재연 영상


재연 영상에 나오는 문제같이 쉬운 문제는 안나온다고 합니다.
실제 문제는 좀더 복잡한데

실제 출제 됬던 문제들은

what is google technical interview questions

요렇게 치면 찾을 수 있을 듯

어쨌든 영어로 쳐야 나옵니다.

세줄요약
구글은 엔지니어가 갑
영어는 의사소통이 중요
손코딩 연습을 하자