Skip to content

Web app for creating animated illustrations with 3D JavaScript engine Zdog

License

Notifications You must be signed in to change notification settings

oriane212/zdog-ui

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

14 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Zdog UI

A real-time editor for creating simple 3D web illustrations using Zdog (a pseudo-3D JavaScript engine for canvas and SVG).

How to use

Go to Zdog UI web app (desktop only).

Use UI controls to add shapes, edit shape and canvas properties, and add animation.

Grab the code snippets (HTML and JavaScript) generated for your Zdog illustration!

Features

Canvas

  • dimensions
  • fallback text
  • background color

Zdog Illustration

  • Rotate (x, y, z)
  • Drag Rotate
  • Animate (continuous spin, ease in/out)

Zdog Shape classes

  • Box
  • Cone
  • Cylinder
  • Ellipse
  • Hemisphere
  • Polygon
  • Rectangle
  • Rounded Rectangle
  • Group

Zdog Shape properties

  • Fill
  • Faces (color and visibility)
  • Stroke
  • Translate (x, y, z)
  • Rotate (x, y, z)
  • Dimensions (width, height, depth, length, radius, diameter)
  • Sides

In progress

More Zdog API to support:

  • SVG Illustration
  • Anchor
  • Shape
  • Zoom
  • Scale
  • Centered
  • OnDrag

UI features

  • Copy/duplicate shape layers
  • Edit shape layer name
  • More customizable animation
  • Customizable onDrag