(저작권 문제로 인하여 소스코드 제공은 10월 11일 공개예정)
여러 아이콘을 조합하여 만들어진 그림을 AI가 분석하여 하나의 문장을 만들어주고, 네 개의 그림을 만들어 기승전결 이야기를 만들어 한글을 보다 재미있게 배울 수 있는 교육 플랫폼입니다.
초간단 사용법! 드래그만 할 줄 안다면 당신은 곧 만능 이야기꾼!!
응? 만들어진 그림과 이야기가 너무 좋다고?? 걱정마! 캡쳐 기능이 모든 것을 저장해준다구!!
프레임워크 사용하지 않음
Vanilla JavaScript
UI 디자인 프로그램 : Figma
담당자 : 김태현, 심찬인
getBoundingClientRect()
함수의 top
, bottom
, left
, right
좌표를 사용하여 드롭 범위 설정Canvas API
를 사용한 캡쳐 기능 구현v-movable
기능과 충돌하는 상황 발생 => 필요한 요소가 아닌 <body>
를 통채로 캡쳐<canvas>
태그 요소 정보의 크기조절 및 Vuex
저장하여 마지막 페이지에 표시할 예정기본 제공하는 라이브러리 외 핵심 기능 구현에 사용한 라이브러리가 있다면 작성해주세요.
예시 ) VR/AR 라이브러리, 애니메이션 라이브러리, 텍스트/사진/동영상 지원, 편집 라이브러리 등