twc-010 / A study by Syafril · not client work

Little Worlds: Little Worlds

An independent scene editor with four locally hosted Kitbitz CC0 illustrations. Add and duplicate pieces, move and resize layers, adjust depth and visibility, choose daylight or sunset, and export the composed PNG.

Actual desktop capture of the Little Worlds demonstration.

At a glance

Headline type
Young Serif
Reading type
DM Sans
Try this interaction
Four local Kitbitz CC0 illustrations
Field paper#f4f0e5
Forest#264636
Meadow#acc2a1
Ochre#f2d36a
A schematic of the implemented composition.

WHAT IS HERE / WHAT COMES NEXT

Know what you are choosing.

Illustrated creative tools, education and playful visual editors.

Working in this demo

  • Fifty-step undo/redo with grouped slider edits and scoped keyboard shortcuts
  • Browser drafts with validated JSON backup and selective restore
  • Four local Kitbitz CC0 illustrations
  • Up to twelve editable, ordered layers
  • Daylight/sunset and real PNG export

This tool includes a working workspace and its own component book. Its controls operate on local state.

Production integrations to discuss

  • Larger licensed asset libraries, project persistence and import workflows require separate development.

Exports are generated in your browser. No account, cloud storage or external service is connected.

1 implemented pages in this theme

See the visual page index

A limit to plan around

A bounded scene study with four assets and twelve layers, not a full illustration library or cloud editor. Export before leaving the page.

Delivery & customization

Page scope, brand assets, content, handover, hosting, costs and support are discussed in a consultation before work begins. The demo is a reference for that conversation.

Prepare a brief for this direction

The idea

A small illustrated place should feel assembled by hand. The layer list exposes how the scene is made, with keyboard alternatives for every spatial action.

Visual language

Field paper, forest ink, meadow green and ochre sunlight. An original landscape frame surrounds expressive CC0 tree, grass and stone illustrations.

Typography

Young Serif, a heavy, friendly old-style, brings a picture-book voice to the title; DM Sans handles dense layer controls, and mono labels identify scene dimensions.

Layout & composition

A piece/layer library, a landscape canvas and a position inspector. The canvas leads on mobile, followed by a two-column layer list and full keyboard controls.

Motion & interaction

No automatic floating scenery. A change to position, scale, lighting or layer order updates the scene directly.

Under the surface

SVG composes local transparent WebP illustrations; Canvas exports the same coordinates as a 1000 × 700 PNG. Illustration sources are Kitbitz Nature and Ruins kits under CC0; the scene, editor and background are original.

Designed for everyone

Select a layer by name, use labeled sliders or arrow buttons, and change order with explicit forward/backward actions. No drag-only operation is required.

Inside the experience

  • Fifty-step undo/redo with grouped slider edits and scoped keyboard shortcuts
  • Browser drafts with validated JSON backup and selective restore
  • Four local Kitbitz CC0 illustrations
  • Up to twelve editable, ordered layers
  • Daylight/sunset and real PNG export
  • An independent component book

A good fit for

  • Illustrated creative tools, education and playful visual editors.

Across screens

Actual desktop capture of the Little Worlds demonstration.
Actual desktop capture of the Little Worlds demonstration.
Actual mobile capture of the Little Worlds demonstration.
Actual mobile capture of the Little Worlds demonstration.

A different perspective