Giter Club home page Giter Club logo

supervision's Introduction

Super Vision

  • AI Super Resolution 기반 저화질 사진,영상 복원

개요

Super Vision이라는 프로젝트 이름은 사전상의 의미로 대단한, 굉장히 좋은이라는 의미를 가진 Super와 시야라는 의미의 Vision에서 영감을 얻어 만든 이름입니다.

위와 같은 의미에 걸맞게 저화질의 사진, 영상을 고화질로 변환하는 서비스의 제공을 목적으로 합니다.

팀 소개

팀 명 : 코라밸 (Code + Life + Balance : 삶과 코딩의 균형을 추구하는 팀)


박성건 (팀장)
Backend & AI


김기솔
Frontend


박상우
Backend


성아영
Frontend


신동호
AI


천민우 (부팀장)
Frontend

주요 기능

  • AI Super Resolution 기반 체험형 웹 애플리케이션
    • 기술을 처음 접하는 사람도 쉽게 이해할 수 있도록 웹 페이지 구성
  • 이미지 Super Resolution 기능 체험
    • 사용자가 이미지를 제공하여 결과물을 보며 기능을 체험할 수 있음
  • 자동으로 이미지의 객체를 탐지하여 자른 부분을 Super Resolution 필터를 적용하여 제공
    • 추가적인 기능으로 사용자가 제공한 이미지에서 객체를 추출하여 해당 부분에 대한 Super Resolution 필터를 적용한 결과를 제공
  • 실시간 스트리밍에 Super Resolution을 적용하여 결과물 확인
    • 사용자의 웹 캠 스트림에 실시간으로 Super Resolution 필터를 적용하여 확인할 수 있음

주요 기술

Frontend

  • React
  • Typescript
  • WebRTC

Backend

  • Python Flask
  • socket.io
  • Tensorflow
  • Redis

CI/CD

  • Jenkins

아키텍처 다이어그램

아키텍쳐 다이어그램

프론트엔드 프로토타입

프로토타입

프론트엔드 컴포넌트 구조

frontend
  ├── node_modules
  ├── public
  └── src
      ├── app
      ├── Assets
      ├── Components
      │   ├── Bars
      │   ├── Cards
      │   ├── Commons
      │   ├── Dialog
      │   ├── Home
      │   ├── Introduction
      │   └── TechDemos
      ├── feature
      ├── router
      ├── Layout
      ├── Pages
      │   ├── Home
      │   ├── Introduction
      │   └── TechDemos
      │         ├── ImageFilter
      │         └── WebcamFilter
      ├── Router
      └── Theme

API 명세서

이미지 필터

  • URL : baseURL/image
  • Method : POST
  • Request Body
{ "image" : 이미지 파일 }
  • Request Content-Type : multipart/form-data
  • Response
{
	"sr_upscaled" : AI Super Resolution upscaled base64 이미지 문자열,
	"normal_upscaled" : 일반 필터 upscaled base64 이미지 문자열,
	"sr_vmaf_score" : AI Super Resolution VMAF 점수,
	"normal_vmaf_score" : 일반 필터 VMAF 점수
}

객체 탐지

  • URL : baseURL/detect
  • Method : POST
  • Request Body
{ "image" : 이미지 파일 }
  • Request Content-Type : multipart/form-data
  • Response
[
    {
        "class": "person",
        "score": "0.98354924",
        "x1": "224.0",
        "x2": "355.0",
        "y1": "189.0",
        "y2": "467.0"
    },
    {
        "class": "person",
        "score": "0.98132306",
        "x1": "529.0",
        "x2": "618.0",
        "y1": "199.0",
        "y2": "467.0"
    },
    ...
]

객체 탐지 후 단일 이미지 크롭 및 Super Resolution Upscale

  • URL : baseURL/crop
  • Method : POST
  • Request Body
{
  "coor": {
    "class": "person",
    "score": "0.98132306",
    "x1": "529.0",
    "x2": "618.0",
    "y1": "199.0",
    "y2": "467.0"
  }
}
  • Request Content-Type : default (application/x-www-form-urlencoded)
  • Response
{
	"cropped" : base64 크롭된 이미지 문자열,
	"sr_upscaled" : AI Super Resolution upscaled base64 이미지 문자열,
	"normal_upscaled" : 일반 필터 upscaled base64 이미지 문자열,
	"sr_vmaf_score" : AI Super Resolution VMAF 점수,
	"normal_vmaf_score" : 일반 필터 VMAF 점수
}

객체 탐지 후 다중 이미지 크롭 및 Super Resolution Upscale

  • URL : baseURL/crop-set
  • Method : POST
  • Request Body
{
	"list" : [
    {
        "class": "person",
        "score": "0.98354924",
        "x1": "224.0",
        "x2": "355.0",
        "y1": "189.0",
        "y2": "467.0"
    },
    {
        "class": "person",
        "score": "0.98132306",
        "x1": "529.0",
        "x2": "618.0",
        "y1": "199.0",
        "y2": "467.0"
    },
    ...
]
}
  • Request Content-Type : default (application/x-www-form-urlencoded)
  • Response
[
	{"cropped_upscaled" : cropped upscaled base64 이미지 문자열}, ...
]

주요 화면

메인 페이지

메인페이지

이미지 필터

이미지필터

이미지 다운로드

다운로드

객체 탐지 기능 이미지 필터

디텍팅필터

웹 캠 필터

웹캠필터

기술 소개 페이지

기술설명

퀵 스타트 페이지

퀵스타트

가중치 파일 설정

https://drive.google.com/drive/folders/1Z5L-8fIg8W8J2q9PpJCRhaV4ge3n9GiU?usp=sharing

다운로드 받은 폴더를 backend/flask 디렉터리에 위치시킨다

supervision's People

Contributors

kimkisol avatar magpie1000 avatar rudy0103 avatar sangwoo420 avatar sdh98429 avatar sungayoung avatar

Stargazers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.