본문 바로가기

전체 글159

파이썬을 이용한 리듬게임 만들기 앞서 종합 아케이드 게임기를 만들며 리듬게임을 만들어 보았다. 사실 그렇게 완성도도 높지 않고 아직 허술하지만 팀원과 함께 만들면서 재미도 있었고, 많은 노력이 들어갔던 만큼 완성했을 때 뿌듯함도 있었다. 그런데 노래선택을 할 수 없고, 메인 창이 없어서 되돌아가기도 못하기 때문에 그렇게 완성도 있는 작품이라고 하기엔 조금 허술한 점이 있다. 먼저 가장 핵심이 되는 노트가 내려오는 타이밍은 파이썬의 라이브러리인 librosa를 사용했다. 이 라이브러리를 사용하면 음악의 특징을 뽑아내서 템포에 맞춰 노트를 생성하는게 가능하다. 여기서 추가로 음의 변화에 따라 노트를 생성하고 싶었는데 라이브러리에 미숙한 탓인지 실패했다. 다음은 내가 코드를 작성했던 순서이다. 1. 노트가 내려오는 트랙 그리기 2. 노트 클.. 2023. 6. 21.
라즈베리 파이를 이용한 게임기 만들기 드디어 어제 종강을 했다. 그동안 기말 프로젝트 때문에 시간도 없고 블로그도 안쓴지 너무 오래되어서 이번 기말 프로젝트로 만들었던 게임기를 포스팅해보려 한다. 하드웨어는 라즈베리파이와 스크린을 이용해 화면을 구성했고 스피커를 달아 사운드를 추가했다.. 또 게임기의 핵심인 컨트롤러는 3D 프린터를 이용해 외관을 구성하고 내부는 버튼, 조이스틱, LED 로 꾸몄다. 처음엔 위 사진처럼 빵판을 이용해서 사용하려 했는데 자꾸 선이 빠지기도 하고, 갑자기 발표 전날에 빵판 한 줄이 먹통이 되는 바람에 급하게 납땜을 했다. 또 라즈베리파이 특성상 아날로그 입력이 안되는데, 교수님이 만드신 X-bot 엣지보드를 이용해 조이스틱의 아날로그 입력을 가능하게 했다. 다음은 게임 알고리즘인데, 테트리스와 리듬게임의 이미지는.. 2023. 6. 21.
팩맨 컨셉 PPT 템플릿 곧 있을 기말 프로젝트 발표를 하기 위해 PPT를 만들었다. 그런데 욕심이 과했던 탓인지 디자인에 너무 꽂혀 3시간이 넘도록 PPT를 만들었는데 그 결과가 매우 만족스러워서 시간을 투자한 보람이 매우매우 있었다 ㅋㅋㅋ 그래서 제가 힘들게 만든 피피티를 공유하려고 블로그에 올리려합니다! 주제가 아케이드 게임이다보니 옛날 게임처럼 만들어 보려고 했는데 너무 팩맨만 있는 것 같기도 하고 암튼 동영상 먼저 봐주세요 ^^ 아 폰트는 여기 랑 여기에서 다운 받았습니다. 못찾으시는 분들 있을까봐 파일 올려놓을게요 암튼 템플릿이라고 하기에도 좀 그렇지만 힘들게 만들었다고 자랑할겸 올려놓은 PPT 입니다 가져가실 분 가져가세요~~~ 2023. 5. 24.
포켓몬 MBTI Test 만들기 요즘 과제에 치이고 알바도 하느라 블로그를 안쓴지 오래된 것 같은데 나름 짬짬히 이것저것 만들긴 했다. 한 번에 포스팅하려니 막막해서 그중 하나인 mbti 테스트 먼저 포스팅 하려한다. + 아직 디자인은 완성되지 않았는데 포켓몬 세상을 컨셉으로 잡았다 ㅋ mbti 테스트의 기본 알고리즘은 E와 I, N과 S 등 4가지 클래스의 성향을 판단하기 위해 질문이 필요하다. 따라서 각 클래스의 질문은 홀수여야 하고, 어떤 성향이 더 큰지 비교하여 출력한다. 완성 사이트 starlit-frangollo-737871.netlify.app 이렇게 된다면 결과는 각각 2번씩 선택된 ESTP가 출력된다. 여기서 또 문제가 생겼는데 질문을 어떻게 해야할지 문제였다. 그런데 GPT한테 간단히 설명하고 질문지를 만들어달라고 요.. 2023. 5. 12.
Chat GPT API를 이용한 오늘 뭐입지? 만들기 GPT API를 이용해 오늘 입을 옷을 추천해주는 AI를 만들어 보았다. 사실 내가 한것보다 조코딩 님의 강의를 따라한거라고 봐도 되겠지만 아무튼 다 만들고 나니 뿌듯함도 있었다. 미리보기 이 사이트를 만들며 가장 어려웠던 점은 백과 프론트의 연결이였다. 나는 GET과 POST 방식에 대해서도 잘 몰랐었고, 어떻게 프론트와 백을 연결하는지 잘 알아보지 않아서 어려움이 조금 있었다. 아무튼 서론은 여기까지 하고 사이트에 대한 리뷰를 해보려한다. 먼저 해당 사이트 링크는 https://jaehwis-pj.pages.dev/ 이며 동작 원리, 사용된 API, 배포까지의 과정을 간단하게 포스팅하겠다. ※ CHAT GPT API 사용법에 대한 자세한 글은 여기에 있으니 참조바람 작동방식 Chat GPT API 연.. 2023. 4. 3.
Chat GPT API 사용법 며칠 전 유튜버 조코딩 님이 chat gpt를 이용한 챗도지 만들기를 실시간 강의로 하신 적이 있었다. 나도 GPT API를 사용해보고 싶었는데 어떻게 해야 할지 감을 못 잡고 있던 차에 좋은 강의가 있어 바로 들어가서 따라해 봤다. 강의는 정말 초보자도 따라만 하면 될 정도로 쉬웠고 잘 가르쳐 주셔서 쉽게 이해할 수 있었다. 이 글을 읽어도 이해가 가질 않는다면 조코딩님의 강의를 듣는것을 적극 추천한다. 아 시작하기에 앞서 api에 대한기초내용은 이전 글에 포스팅해놓았으니 참고하면 좋을 것 같다. 그리고 백엔드는 node.js 프론트는 html, css, js만 사용했다. API KEY 발급 가장 중요한 KEY는 GPT 홈페이지에서 발급 받을 수 있으며 삭제도 가능하다. 하지만 처음 발급 때 보여주는 .. 2023. 3. 27.
Weather site 만들기 openweather API를 이용해 날씨 정보를 얻을 수 있는 웹사이트를 만들어 보았다. 사실 API를 사용하는 것에 익숙해지기 위해 시작한 프로젝트였지만 하다보니 쓸데없이 디자인에 꽂혀서 시간을 다 쓴것 같다.. ㅋㅋ 그래도 눈이 내리는 애니메이션과 같은 효과도 찾아볼 수 있었고, API의 사용 등 여러 웹을 풍부하게 만들어주는 방법을 익힌 것 같다. 아 그리고 이번에 만든 사이트를 netilfy에 업로드 했었는데 작년 10월에 만들었던 티스토리 클론 코딩 했던 걸 보게 되었다. 그땐 저 정도만 했어도 동네방네 자랑하고 다녔었는데 지금 보니 정말 내가 저걸 왜 자랑하고 다녔을까 하는 창피한 기분도 들고 나름 많이 성장한 것 같아 뿌듯함도 느낄 수 있었다.미리보기 weather API에서 받은 날씨 데.. 2023. 3. 19.
(JavaScipt) OpenWeatherAPI 사용법 API(Application Programming Interface) 란 : 클라이언트의 요청을 서버에게 가져다 주며 서버에서 요청에 맞는 데이터를 클라이언트에 가져다 주는 역할을 한다. 쉽게 말해서 식당의 '웨이터'로 많이 표현한다. 클라이언트(손님)이 원하는 음식(데이터)을 주문하면 웨이터(API)가 주방(서버)에 알려준다. 이게 API의 정의이며 역할이다. 사실 나는 누가 물어보면 저런 이론적인 대답을 할 수 있었기 때문에 API에 대해 잘 알고있다고 생각했고, 실제로 친구와 '게시판' 을 만들어보며 기초적인 API를 구현해 보기도 했었다. 그런데 이번에 날씨를 제공하는 OpenWeatherAPI를 사용해보며 그동안 내가 너무 쉽게 생각하고 있다는 생각을 했다. 암튼 이번 포스팅은 API의 설명보다.. 2023. 3. 17.
(Java Scipt) 아날로그 시계 만들기 처음 아날로그 시계를 만들기 시작할 때에는 그동안 다중 타이머를 만들었던 것과 날짜 계산기를 만들었던 것을 생각하며 쉽겠지 하며 시작했는데 사실 쉬웠다 ㅋ 아 문자열 포매팅 방법을 몰라 애를 먹었던 기억이 있지만, js에서는 포매팅을 할 때 `${변수명}`을 쓴다는 걸 알았다. 아 그리고 바늘이 회전할 때 transform - origin을 이용해서 회전축을 설정했다. 내가 만들었던 아날로그 시계의 알고리즘은 아래와 같다.현재 시간을 변수에 담아 현재 시, 분, 초를 추출html로 만들었던 바늘도 js에서 변수로 지정시계는 60조각으로 나누어져 있기 때문에 1분에 6도라는 결과가 나옴따라서 분, 초침은 * 6을 해서 각도를 지정시침은 24시간이 아닌 12시간으로 나누어져 있기 때문에 if문으로 오전과 오.. 2023. 3. 13.

티스토리툴바