이 세상을 끝내는 응용 프로그램을 개발하다

이 문장


"얄미운 Advent Calendar 2019".의 20일째 보도.

과거의 기억


컴퓨터를 처음 접했을 때 기억나세요?
기억이 잘 안 나요.
화면 왼쪽 상단의 사과 로고를 보면서'멋있어요!'책상 위에서 마우스를 움직이면 화면의 커서가 움직인다는 느낌도 들어 놀랐다.
하지만 기억을 거슬러 올라가면 어떤 체험이든 흐릿하게 느껴진다
나중에 만든 기억처럼 사실은 다른 사람의 기억이죠
그런 불안에 사로잡히다.
무엇에 감동했는지 기억만 나지만 어떤 기억도 확실하지 않다.
그렇게 불안정한 먼 옛날의 기억 속에서 단 한 가지만 똑똑히 기억된다.
닫다.
컴퓨터가 끝날 때 하는 짓이야.
지금까지 수많은 열린 창문이 트리거 하나만 끌고 하나씩 닫혔다.
그리고 모든 창이 닫히면 다음 순간 컴퓨터의 화면 자체가 어두워진다.
어릴 적 나는 그곳에서 무서움과 공포를 느꼈다.
'컴백무'라고 생각하진 않지만 세상도 컴퓨터처럼 언젠가는 갑자기 꺼지겠지.
그 황홀한 공포감을 품고 나는 내가 지금까지 살았다고 생각한다.
그래서?오늘 당장 세상을 닫고 싶어요.

이번에 만든 거.


세상을 닫는 응용 프로그램입니다.
오른쪽에서 왼쪽으로 흐르며 시원하게 끝내자.
입출력 정의는 다음과 같습니다.
지금 세상
종말을 향해 나아가다
이번에는 현재의 세계를 표현하는 것으로'현실의 사진'을 사용한다.
그 다음으로'곧 끝날 세상'을 표현하고 싶어서 마스크 R-CNN이라는 기술로 물체 식별을 하기로 했다.
이것은 이미지에서 물체를 검출하고 차단할 수 있는 기술로 특정한 물체를 이미지 처리하려고 할 때 유용하다.

※ 이미지는 https://github.com/matterport/Mask_RCNN
인상으로 삼다
이미지→물체로 분해→물체 사라짐→세계의 종결
이런 느낌.
나는 동창회에 참가할 수 없다.
그 가게가 사라졌으니까.
내일까지 왜 가위바위보 졌는지 생각 안 해도 돼.
내일 다시 오지 않을 거야.
광고 달력도 아쉽지만 오늘 끝납니다.

완성


(이전에는 이 줄에 URL이 있었지만 서버가 정지되어 이동하지 않았습니다.)

작업 단계

  • 어떤 트위터 계정에서 회원으로 이미지를 보냅니다.
  • 잠깐만
  • (서버가 중지되어 이동하지 않음)

    예상 결과


    기분 좋으면 세상이 끝이야.

    어떻게


    분석부


    트위터에서 이미지를 추출한 후 Mask R-CNN으로 분석합니다.
    나는 아래의 자료고를 보면서 했다.
    matterport/Mask_RCNN
    샘플과 같이 MS COCO의 학습된 모델을 직접 사용합니다.
    
    # コード中のsunnydayというのはこのアプリのコードネーム
    
    class ImageExecutor:
        def __init__(self):
            self.model = None
    
        def load_model(self):
            from sunnyday_bot.mask_rcnn_lib.executor import get_model
    
            self.model = get_model()
        def analyze_image(self, sunnyday_object):
            from sunnyday_bot.mask_rcnn_lib.executor import detect_image
    
            if not self.model:
                self.load_model()
    
            return detect_image(sunnyday_object['image_url'], self.model)
    
    결과를 다음 방법으로 Parse 및 Json 형식으로 저장소에 저장합니다.
    
        def parse_result(self, result):
            parse = {}
            output_array = []
    
            for v in result['masks']['verts']:
                new_array = []
                for d in v:
                    for pt in d:
                        new_array.append(pt)
                output_array.append(new_array)
    
            parse['points'] = json.dumps(result['result']['rois'], cls=NumpyEncoder)
            parse['verts'] = json.dumps(output_array, cls=NumpyEncoder)
    
            return parse
    
    parse 뒤의 "verts"물체 모양의 마스크 부분을 포착
    점은 객체를 둘러싼 사각형 부분입니다.
    API 서버는 이 정보를 프론트에 돌려주기만 하면 된다.

    현관


    보아야 할 곳이 많지 않다.
    캔버스에 삐걱삐걱 쓰는 것은 타이머로 움직이는 삐걱삐걱 스타일이다.
    랜덤으로 타이머 시간을 설정해'물건이 점점 사라지는'모습을 표현한다.
    
          const rects = res['points'].map((e, index) => {
            timers.push(100 + this.getRandomInt(100))
            return {
              x: e[1] * scale,
              y: e[0] * scale,
              height: (e[2] - e[0]) * scale,
              width: (e[3] - e[1]) * scale,
            }
          });
          let blackRects = [];
          const halfTime = maxTimer / 2;
    
          this.generateBlackRects(halfTime, halfTime - 80, 50, res, scale, blackRects);
          this.generateBlackRects(halfTime - 80, halfTime - 120, 20, res, scale, blackRects);
          this.generateBlackRects(halfTime - 120, halfTime - 140, 20, res, scale, blackRects);
          this.generateBlackRects(halfTime - 140, halfTime - 150, 100, res, scale, blackRects);
    
          const verts = res['verts'].map((e, index) => {
            return e.map((e2) => {
              return e2 * scale;
            });
          });
    
    절차는 다음과 같다.
    부팅

    API에서 이미지 및 좌표 가져오기

    타이머 시작

    소음으로 물체를 덮다

    물체를 검은색으로 칠하다

    소음 제거(검은색 칠)

    사각형의 검은 물체를 끈적끈적하게 붙였다

    시간이 되면 오류 메시지가 표시됩니다.
    소음은 React Konva 이 창고에 노이즈 필터가 있어서 이걸 사용했습니다.
            <Rect
              filters={[Konva.Filters.Noise]}
              noise={1}
              x={this.props.x}
              y={this.props.y}
              opacity={this.state.noiseOpacity}
              width={this.props.width}
              height={this.props.height}
              fill={this.state.color}
              ref={node => {
                this.rect = node;
              }}
            />
    
    종료 시 표시되는 패밀리 바람 제어 대화 상자가 사용됩니다NES.css.

    세계의 미래


    기술과 과학으로 우리는 성공적으로 세계를 끝냈다.
    하지만 한 세상이 끝난 후 몰래 F5 버튼을 눌렀다
    브라우저의 다시 불러오기 버튼을 누르면... 어때요?
    너는 새로운 세상이 또 시작되고 조금씩 시간이 걸리는 것을 볼 수 있을 것이다.
    화면 속의 세계는 줄곧 이 점을 반복하고 있다. 아마도 컴퓨터의 수명일 것이다. AWS에 등록된 신용카드가 만료되기 전에
    같은 처리를 끊임없이 반복하다.
    한편, 현실 세계, 시간과 광고 달력은 미래의 한 방향으로 나아간다.
    내일, 21일 "얄미운 Advent Calendar 2019".@ampersand 선생님!

    좋은 웹페이지 즐겨찾기