Nuze

Put yourself in the news!

Work in Progress...

I'm currently playing around with this project as a way to learn more about video capture, animation, Svelte, and video production. Feel free to follow along or fork for your own learning.

Goals

A customizable replica of the CNN interface, including:

• animations
• transitions
• sound effects
• multi-user video chat

Installation

Clone the repo, npm install, npm run dev and open a browser to localhost:3000.

Developing with Svelte

I'm using Vite for the development environment and build setup. Svelte's .svelte files and syntax are incredibly intuitive, but refer to the official documentation for advanced examples and API reference.

Feature (Todo?) List

• [-] Layout
  • [-] Lower third
    • [-] Headline Block
      • Animated Headline transitions
      • Headline text squeezes to fit container
      • Animated Byline and Tagline
    • [-] Logo Block
      • Live market data *
      • Rotate times and stocks
      • Hide stocks when market is closed
      • Controllable "Live" indicator
    • News Ticker
      • Animated, loops when content ends
      • Program Title with animated highlight
  • [-] Video
    • Size and layout transitions
    • Multiple layouts
    • Download recordings
    • [-] Webcam
      • Multiple connections *
      • Background replacement
      • Live view
    • Identifier
      • Works with 1-3 lines of data
      • Includes live local time
      • Animated in an out
• [-] Controls
  • [-] Basic
    • Edit ticker text
    • All non-ticker text editable
    • Control camera activity
  • Advanced
    • Orchestration with manual and/or timed transitions
    • Multiple views and user roles *
    • Synced display across connections *

* indicates a feature that needs a server to support it, which will be phase-2 once all client-only features are completed