HyperTheme Designer

HyperTheme is a browser-based editor for animated HyperSpin themes. Build layouts on a visual canvas, organize media as layers, and control motion from a timeline.

What you build

HyperTheme supports themes for systems, games, collections, and shared fallback layouts. Each project combines media, layer settings, and animations.

Typical project elements include:

• Background images and video
• System and game logos, plus other game media
• Text and metadata fields
• Shapes and visual effects
• Audio layers
• Timed animations

Main workspace

Four regions support the core workflow:

Region	Purpose
Library and Layers	Upload assets, select layers, and set stacking order
Canvas	Position, resize, rotate, and preview theme elements
Properties	Enter exact values and configure the selected layer
Timeline	Arrange animations and control playback

See Interface Overview for a guided tour of every region.

Project setup

The Create Project screen defines the project before editing begins.

• Select Theme as the project type.
• Enter a clear project name.
• Choose the theme type.
• Filter by system when the theme belongs to one platform.
• Choose a collection when building a collection-specific theme.
• Add a description and tags for later organization.
• Select Save to create the project.

Core features

Visual editing

• Drag assets from the Library onto the canvas.
• Use selection handles for position, scale, and rotation.
• Enter exact values in the Properties panel.
• Add grid overlays for alignment.

Animation

• Add movement, scale, rotation, opacity, and preset effects.
• Arrange timing on a visual timeline.
• Adjust duration, delay, easing, looping, and yoyo behavior.
• Preview the full theme from the playback controls.

Asset and layer management

• Upload images, audio, and video.
• Import layered PSD files.
• Group related layers.
• Reorder layers to control front-to-back placement.
• Hide layers during detailed editing.

Theme tools

• Add metadata-driven text and images.
• Build layouts for different aspect ratios.
• Capture canvas screenshots.
• Undo and redo editing actions.
• Publish completed themes.

Requirements

• A current desktop browser
• An internet connection
• A mouse or trackpad for canvas editing
• Source media prepared at suitable dimensions

Start here

Follow the Quick Start Guide to create a project, add an asset, and build a first animation.

For help with an existing project, open the Troubleshooting Guide.