자바스크립트 140자 데모 모음

4 weeks ago 11

  • Dwitter.net은 140자 이내의 JavaScript 코드로 시각적 데모를 작성하고 공유할 수 있는 플랫폼
  • 각 게시물은 ‘dweet’이라 불리며, 코드와 함께 즉시 실행되는 그래픽 애니메이션을 표시
  • 인기 게시물에는 ‘Solar Orbit’, ‘Flight Over Destroyed City’, ‘Parallax Pines’ 등 창의적인 시각 효과가 포함
  • 사용자들은 댓글, 리믹스, 해시태그를 통해 상호작용하며, 코드의 변형과 재창작이 활발히 이루어짐
  • 짧은 코드로 복잡한 시각 효과를 구현하는 창의적 프로그래밍 실험의 장으로 기능

Dwitter.net 개요

  • Dwitter.net은 140자 제한의 JavaScript 코드로 시각적 데모를 제작하는 웹 플랫폼
    • 각 데모는 ‘dweet’이라 불리며, 브라우저에서 즉시 실행되는 애니메이션 그래픽을 생성
    • 사용자는 로그인 후 새 dweet을 작성하거나 기존 작품을 리믹스(remix) 가능
  • 사이트는 hot, new, top(주/월/년/전체) 등 다양한 정렬 기준으로 인기 콘텐츠를 탐색할 수 있음
  • 각 dweet에는 공유, 전체화면, 신고, 댓글 기능이 포함되어 있음

대표 dweet 사례

  • “Bubble universe colour expansion” 은 다채로운 색상과 명확한 시각 효과로 평가받음
    • 댓글에서 “A whole universe!”와 같은 반응이 달림
  • “Ants! 🐜” 는 짧은 코드로 개미 무리를 표현한 작품으로, “god level dweetage!” 등의 찬사를 받음
  • “Trees, shadows, hills.” 는 나무와 그림자, 언덕을 묘사한 애니메이션으로, “Amazing stuff!”라는 반응을 얻음
  • “Flight Over Destroyed City ✈️” 는 파괴된 도시 위를 나는 비행 장면을 구현
    • 댓글에서 “i love the smell of sulfur and uranium in the morning” 등 유머러스한 반응이 이어짐
  • “Solar Orbit ☀️🌘” 는 행성 궤도를 140바이트 내에 구현해 “How did you fit a whole planetary system in 140 BYTES OF JAVASCRIPT!?!?”라는 놀라움을 유발

커뮤니티 활동과 리믹스 문화

  • 각 dweet는 다른 사용자의 코드 기반으로 리믹스될 수 있으며, 원본 링크가 명시됨
  • 댓글에는 기술적 피드백, 감상, 유머가 혼합되어 활발한 커뮤니티 분위기를 형성
  • 해시태그 기능을 통해 #space, #galaxy, #lighting, #scene 등 주제별 탐색이 가능

기술적 특징

  • 대부분의 코드가 eval(unescape(escape...)) 형태로 압축되어 있으며, 140자 제한 내에서 최대한의 시각 효과를 구현
  • 코드 내에서는 캔버스 API를 활용한 도형, 색상, 움직임 표현이 중심
  • 각 dweet는 코드 길이(예: “// 136/140”)가 명시되어 있어, 최적화와 압축 기술이 중요한 요소로 작용

창의적 프로그래밍 실험의 장

  • Dwitter는 코드 골프(code golf)시각 예술을 결합한 형태로, 개발자 간 창의력 경쟁을 촉진
  • 단순한 코드로 복잡한 시각적 결과를 만들어내는 과정이 프로그래밍 미학으로 평가됨
  • 플랫폼은 예술적 표현과 기술적 압축의 경계를 탐구하는 실험 공간으로 기능

Read Entire Article