본문 바로가기
chatGPT와 인공지능AI

노션AI vs chatGPT

반응형
노션에서 노션AI가 나왔다구?

노션이 뭐여?
아시는 분은 이미 아시는 문서 관리 어플리케이션인데요.
윈도우나 스마트폰에서도 사용가능합니다.
특히 크레이가 개인적으로 아주 애용하는 어플리케이션입니다.


특히 트리 구조로 내용을 정리할 수 있어서 매우 편리하고
전용 어플리케이션을 사용해도 되지만, 웹에서도 바로 사용가능합니다.

노션 홈페이지는 아래와 같은데요.
구글로 로그인해서 쉽게 가입할 수 있습니다.

https://www.notion.so/

뭐 노션을 사용하는 방법은 인터넷에 엄청나게 많은 글들이 있기 때문에
여기서 그 내용을 다시 답습하려는 것은 아니구요.

 

노션AI, 인공지능을 말하려 합니다.

 

노션 AI란게 새롭게 나왔다고 해서 개발자로서의 약간의 사용 경험을 공유해 드리려고 하는데요.
요새 chatGPT 가 엄청나게 인기몰이를 하는 가운데, 갑자기 등장한 다크호스일까요?
(확인해보니 노션AI는 chatGPT 3 모델을 기반으로 사용한다고 하네요)

방식은 chatGPT와 똑같이 글로 물어보면 인공지능이 답변을 하는 방식인데요.
한글로 물어봐도 답변을 잘 해 줍니다.

이를테면 아래와 같이 글로 문의하면,

"토익 시험 성적을 올리기 위한 방법을 20가지로 요약해 주세요"

아래와 같이 답변을 쫙 해줍니다. 와우~!
마치 요새 유행하는 chatGPT 처럼 말이지요.

1. 영어로 생활하기: 영어로 생활을 하며, 일상적인 대화, 글쓰기, 듣기 등의 연습을 통해 
   영어 실력을 향상시킬 수 있습니다.
2. 회화 연습: 영어 회화를 자주 연습하면, 듣기, 말하기 능력을 함께 향상 시킬 수 있습니다.
3. 책 읽기: 영어 책을 읽으면, 단어, 문법, 표현력 등이 향상됩니다.
4. 전문 영어 학습 지원 프로그램 이용: TOEIC 시험 준비를 위해 제공되는 온라인 학습 자료를 
   이용하여, 전문적인 영어 학습을 할 수 있습니다.
5. 인강, 교재 이용: TOEIC 시험 준비를 위해 제공되는 인강이나 교재를 활용하여, 
   토익 문제 유형과 패턴에 대한 이해를 높일 수 있습니다.
6. 영어 드라마, 영화, 유튜브 시청: 영어 드라마, 영화, 유튜브를 통해 
   영어 청취 연습을 할 수 있습니다.
7. 영어 노래 듣기: 영어 노래를 듣고 가사를 보며, 발음, 억양, 악센트 등을 연습 할 수 있습니다.
8. 무료 영어 교육 사이트 이용: 무료 영어 교육 사이트를 이용하여, 영어 단어, 문법, 발음 등을 
   학습할 수 있습니다.
9. 단어 암기: TOEIC 시험에서 가장 중요한 것은 영어 단어입니다. 
   단어장을 만들어 암기하거나, 단어 학습 앱을 활용하여, 효율적으로 단어를 암기할 수 있습니다.
10. 모의고사 풀이: TOEIC 모의고사를 풀이하여, 시험 느낌을 익히고, 
   문제풀이 능력을 향상시킬 수 있습니다.
11. 시간 분배: TOEIC 시험에서 시간 분배는 매우 중요합니다. 
   문제 유형에 따라 시간을 효율적으로 분배하며, 시험에 임해야 합니다.
12. 문제풀이 전략: TOEIC 시험에서는 문제풀이 전략이 매우 중요합니다. 
   각 유형에 맞는 문제풀이 전략을 익히고, 시험에서 적용해야 합니다.
13. 문장 구조 파악: 문장 구조를 파악하면, 문제를 더 쉽게 풀 수 있습니다. 
   문장 구조에 대한 이해를 높이는 것이 필수적입니다.
14. 발음과 억양: 영어 시험에서는 발음과 억양이 매우 중요합니다. 
   영어 발음과 억양을 연습하여, 듣기, 말하기 능력을 향상시켜야 합니다.
15. 토익 스터디 그룹 참여: 토익 스터디 그룹에 참여하여, 문제풀이, 회화 연습 등을 
   함께 할 수 있습니다.
16. 토익 시험 정보 파악: 토익 시험 유형과 패턴, 출제 경향 등을 파악하여, 
   문제풀이 전략을 세울 수 있습니다.
17. 전략적으로 공부하기: 토익 시험에 대한 전략을 세우고, 계획적으로 공부하면, 
   효율적으로 성적을 향상시킬 수 있습니다.
18. 글쓰기 연습: 글쓰기는 토익 시험에서 매우 중요한 요소입니다. 
   글쓰기 연습을 통해, 적절한 표현력과 문장 구조를 익힐 수 있습니다.
19. 실전 모의고사 참여: 실전 모의고사를 참여하면, 시험을 더욱 익숙하게 응시할 수 있습니다.
20. 자신의 실력 파악하기: 자신의 영어 실력을 파악하고, 
   부족한 부분을 개선할 수 있는 방법을 찾아 공부해야 합니다.

 

노션AI, 코딩도 가능한가?

 

chatGPT는 프로그램 코딩도 가능한데요.
노션 AI도 코딩이 가능하다고 해서 시도해 보았습니다.

3차원 그래픽을 다루는 자바스크립트, three.js  를 대상으로 우선 가볍게 문의해보았는데요.

크레이 : "three.js 를 활용한 기본 예제를 만들어 주세요"

노션AI 가 답변을 하는데 마치 강좌를 보는 줄 알았습니다 ㅎ..
참고로 제목/본문 등 글시 크기가 다 적절하게 크기 조정해 나옵니다.

노션AI 인공지능의 코딩 결과


HTML 파일 생성

먼저, HTML 파일을 생성합니다.

<!DOCTYPE html>
<html>
   <head>
      <meta charset="utf-8">
      <title>Three.js Cube Example</title>
      <style>
         body {
            margin: 0;
            overflow: hidden;
         }
         canvas {
            width: 100%;
            height: 100%;
         }
      </style>
   </head>
   <body>
      <script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/110/three.min.js"></script>
      <script src="cube.js"></script>
   </body>
</html>

위 코드는 three.js와 우리가 작성할 자바스크립트 파일인 cube.js를 로드하는 기본적인 HTML 파일입니다.

자바스크립트 파일 생성

다음으로, cube.js 파일을 생성합니다. 이 파일은 우리가 만들 3D 큐브를 정의하고 그릴 수 있게 해줍니다.

var scene = new THREE.Scene();
var camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 1000 );

var renderer = new THREE.WebGLRenderer();
renderer.setSize( window.innerWidth, window.innerHeight );
document.body.appendChild( renderer.domElement );

var geometry = new THREE.BoxGeometry();
var material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
var cube = new THREE.Mesh( geometry, material );
scene.add( cube );

camera.position.z = 5;

function animate() {
   requestAnimationFrame( animate );
   cube.rotation.x += 0.01;
   cube.rotation.y += 0.01;
   renderer.render( scene, camera );
}
animate();

위 코드에서는 큐브를 생성하고, 씬에 추가하고, 회전시키는 등의 작업을 수행합니다. animate 함수는 애니메이션을 렌더링합니다.

실행

이제 파일을 저장하고 HTML 파일을 열어보면, 화면에 3D 큐브가 나타납니다. 큐브를 회전시키면서 확인해보세요!

결론

이번 예제에서는 three.js를 이용하여 3D 큐브를 만들어 보았습니다. 이것은 three.js를 활용하여 3D 그래픽을 구현하는 데 있어서 기본적인 예제입니다. three.js는 이외에도 다양한 기능을 제공하므로, 관심이 있다면 더 많은 자료를 찾아보시길 바랍니다.


여기까지가 노션AI가 작성한 글입니다. 정리도 아주 깔끔하더라구요.

실행도 해봤는데 3차원 공간에서 큐브가 회전하는 잘 작동하는 소스입니다.
참고로 chatGPT 로 동일한 실험을 해본 적이 있었는데 chatGPT는 소스 1개에 모두 통으로 작성해주었는데
노션 AI는 소스를 HTML과 자바스크립트 2개로 분할해 주더군요.

이어서 2번째, "광원을 추가해 달라고" 요청했는데요.
이번에는 자바스크립트 부분만 수정해서 소스를 전달해 주더라구요.

노션AI


var scene = new THREE.Scene();
var camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 1000 );

var renderer = new THREE.WebGLRenderer();
renderer.setSize( window.innerWidth, window.innerHeight );
document.body.appendChild( renderer.domElement );

var geometry = new THREE.BoxGeometry();
var material = new THREE.MeshPhongMaterial( { color: 0x00ff00 } );
var cube = new THREE.Mesh( geometry, material );
scene.add( cube );

var light = new THREE.PointLight( 0xffffff, 1, 100 );
light.position.set( 0, 0, 10 );
scene.add( light );

camera.position.z = 5;

function animate() {
   requestAnimationFrame( animate );
   cube.rotation.x += 0.01;
   cube.rotation.y += 0.01;
   renderer.render( scene, camera );
}
animate();

위 코드에서 광원을 추가하여, 큐브에 광원이 비추도록 변경하였습니다. THREE.MeshPhongMaterial을 사용하여 광원의 조명을 적용할 수 있습니다.


오! 이 정도면 코딩 분야에서 chatGPT 하고 맞먹어도 될만할 수준인걸? 하는 생각이 들었지요 :)
다음 질의는 "위 소스에서 각 큐브의 회전 속도를 2배 빠르게 해줘" 입니다.

노션AI


이번 소스에서는 three.js 라이브러리를 사용해 3D 큐브를 만드는 방법을 설명합니다. 사용자가 요청한 속도를 2배 빠르게 하는 방법은 큐브를 회전시키는 코드에서 각도 증가량을 두 배로 늘리는 것입니다. 따라서 cube.rotation.x += 0.02;cube.rotation.y += 0.02;로 변경하면 됩니다.

var scene = new THREE.Scene();
var camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);

var renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);

var geometry = new THREE.BoxGeometry();
var material = new THREE.MeshPhongMaterial({ color: 0x00ff00 });
var cube = new THREE.Mesh(geometry, material);
scene.add(cube);

var light = new THREE.PointLight(0xffffff, 1, 100);
light.position.set(0, 0, 10);
scene.add(light);

camera.position.z = 5;

function animate() {
  requestAnimationFrame(animate);
  cube.rotation.x += 0.02;
  cube.rotation.y += 0.02;
  renderer.render(scene, camera);
}
animate();

생각지도 못하게 노션에서 이런 서비스가 나오다니 흥미진진하더라구요.
참고로 노션AI와 무관하게 노션은 크레이의 애용하는 툴입니다 :)

여기까지 실험한 최종 소스는 아래 URL에서 확인하실 수 있는데요.

http://dreamplan7.cafe24.com/notion/sample1.html

사실 이후에도 몇가지를 더 어려운 과제를 테스트했는데 노션AI가 감당을 못하는지 멈춰서 작동은 하지 않는 것을 보긴 했습니다.

아래와 같은 내용이었지요 :)
크레이가 좀 무리한 요구를 했나 봅니다 ㅎㅎ

"큐브를 가로 3개, 세로 3개, 높이 3개로 나누어서 각각 회전하도록 해주세요."

노션AI는 무제한인가? 유료 회원만.

현재 노션AI는 개인 사용자에게 무료로 20회를 제공하는데요.
chatGPT 는 현재 무제한인 것에 비하면 좀 쩨쩨(?)할 수도 있지만,
노션AI 유료 버전은 10달러로 chatGPT유료 버전의 절반 가격이라는 점이 장점이랄까요?
대신 노션의 특장점, 문서 정리 기능 때문에 따로 내용 정리를 할 필요가 없는 것이 유리한 부분입니다.
chatGPT 로 만든 코드를 활용하려면 그 때마다 어딘가에 정리를 잘 해 놓아야 하지요.
chatGPT 가 접속이 안되면 아예 전에 만들었던 소스를 볼 수가 없더라구요.

 

chatGPT와 성능 비교

 

다만 코딩 부분은 성능 면에서 chatGPT(3.5)보다는 좀 떨어지는 것 같습니다.
노션AI와 비교하기 위해 chatGPT 에서도 비슷한 실험을 했는데요.

앞의 과정들을 모두 소화하면서도,
큐브를 가로 3개, 세로 3개, 높이 3개로 분리해달라는 요청과,
각 큐브가 서로 다르게 랜덤으로 회전하는 부분,
그리고 각각의 색상을 다르게 해달라는 요청까지도 처리를 완료하였습니다.

chatGPT 인공지능의 코딩결과

chatGPT로 생성한 결과는 아래와 같은데요.
크레이가 원한대로 작성이 된 것을 볼 수 있습니다.

http://dreamplan7.cafe24.com/notion/sample2.html

하지만 뭐.. chatGPT 도 더 이상 무리한 요구는 듣지를 못하더라구요.
작성하다 중간에 끊기고 continue 명령도 듣지를 않는데
크레이 요구가 좀 심했지요 :)

"바닥에 5만큼 떨어진 위치에 가로100, 세로100, 높이 1 의 바닥 큐브를 생성하고 각 큐브에 물리 속성을 부여해, 바닥으로 떨어지게 해 주세요."

chatGPT의 전매 특허, 도망가기 스킬을 시전하더라구요 ㅎㅎ

노션AI는 횟수 제한으로 사실 많은 실험을 할 수는 없었는데요.
노션AI도 아마 앞으로 성능이 점점 더 좋아질 것으로 예상합니다.
chatGPT 또한 마찬가지일 테구요.
나중에 구글에서 출시할 바드는 어떻게 나오게 될지 또한 기대가 되는군요.


현 시점에서 낸 결론을 요약하면 아래와 같은데요.
어디까지나 크레이의 독자적인 관점이고 코딩 부분에 대해서만 제한된 내용입니다.
이 또한 언제든지 바뀌거나 역전될 수도 있는 부분임을 밝힙니다.

  노션AI ( chatGPT 3 기반 ) chatGPT 3.5
코딩 능력 기초 샘플 소스 제공 및 수정 능력.
하지만 점점 무리한 요구를 하면 답변을 못한다.
기초 샘플 소스 제공 및 수정 능력
노션AI보다 약간 우수.
역시 무리한 요구를 하면 Network Error 도망가기 스킬을 시전한다.
문서 정리 문서 정리 도구의 최강자.
인공지능으로 작성되는 소스도 마찬가지로 제목/설명 부분도 글씨 크기가 다르게 정리되어 나온다.
매번 chatGPT에 로그인해서 과거 소르를 찾으려면 고생, 따로 정리해야 한다.
무료 사용 현재 20회 무료 현재 무제한. 서버사용량이 많을 때만 저녁 즈음에 접속이 안된다
유료 월 사용 비용 ( 무제한 ) 10달러 20달러

마지막으로 노션 AI에게 직접 물어본 "노션AI와 chatGPT를 비교하는 글을 작성해 주세요"라는 답변에 대한 내용입니다. 너무 깔끔하지요? :)

노션AI


노션AI와 chatGPT 비교

노션AI와 chatGPT는 각각 다른 분야에서 활용되는 인공지능 기술입니다. 노션AI는 업무 자동화와 콘텐츠 생성에 활용되는 반면, chatGPT는 자연어 이해와 생성에 주로 활용됩니다.

노션AI

노션AI는 노션에서 제공하는 인공지능 기술로, 업무 자동화와 콘텐츠 생성에 활용됩니다. 예를 들어, 노션AI를 이용하면 일정 등록 시 제목과 내용을 입력하지 않아도 자동으로 입력할 수 있습니다. 또한, 노션AI를 이용하면 간단한 키워드만으로도 해당 문서의 내용을 검색할 수 있습니다. 이러한 기능을 통해 업무 효율성을 높일 수 있습니다.

노션AI는 또한 고객 서비스나 의료 분야에서도 활용될 수 있습니다. 예를 들어, 고객 문의에 빠르게 대응하기 위해 노션AI를 활용하여 자동으로 답변을 생성할 수 있습니다. 또한, 의료 분야에서는 환자의 진료 기록을 자동으로 작성하는 데에도 활용될 수 있습니다.

chatGPT

chatGPT는 OpenAI에서 개발한 자연어 이해와 생성 기술로, 주로 챗봇과 같은 대화형 인터페이스에서 사용됩니다. chatGPT는 대용량의 자연어 데이터를 학습하여, 자연스러운 대화를 생성할 수 있습니다. 이러한 기술은 고객 서비스나 의료 분야에서 활용될 수 있습니다.

예를 들어, 고객 서비스 분야에서는 chatGPT를 이용하여 자동으로 고객 문의에 답변할 수 있습니다. 또한, chatGPT를 이용하여 의료 분야에서 환자와 자연스럽게 대화하면서 진단을 내릴 수 있습니다. 이러한 기술은 고객 만족도를 높이는 데에 큰 역할을 할 수 있습니다.

노션AI와 chatGPT의 차이점

노션AI와 chatGPT는 각각 다른 분야에서 활용되는 인공지능 기술입니다. 노션AI는 업무 자동화와 콘텐츠 생성에, chatGPT는 자연어 이해와 생성에 주로 활용됩니다. 따라서, 노션AI는 업무 효율성을 높이는 데에 활용되고, chatGPT는 대화형 인터페이스에서 자연스러운 대화를 생성하는 데에 활용됩니다.

하지만, 최근에는 노션에서도 chatGPT와 같은 자연어 생성 기술을 도입하고 있습니다. 이러한 기술을 이용하면, 노션에서 새로운 문서를 작성하거나 편집할 때, chatGPT가 자동으로 내용을 생성해 줄 수 있습니다. 이러한 기술의 도입으로 노션은 더욱 더 편리하고 유용한 툴로 발전하고 있습니다.


이상, 크레이가 조사한 내용이었습니다!
흥미거리나 도움이 되셨는지요:)

오늘도 방문해주시고 내용 잘 읽어주시는 모든 분들께 역시 감사드립니다.
공감과 구독은 크레이의 블로그 활동에 원동력입니다!

반응형