Sorcerii

A connected creative studio for organizing website projects, planning pages and crafting websites and graphics. Distinctive product design across a visual library, editing workspace and property inspectors.

One studio for connected creative work

Sorcerii is an independent creative platform bringing website projects, graphic composition and a dedicated video workspace into one interface. The design connects the overview of a project to the detail of making it: a project library, page planning, a website editor and a graphics canvas. The supplied captures document the website and graphics workflows, with video presented as a workspace entry point.

The challenge: make complexity navigable

Creative work changes scale constantly. A designer moves from organizing projects to planning a page, then into individual elements and their properties. Sorcerii gives those levels distinct spaces while maintaining a consistent shell. The goal is to make the current task clear without making the larger project difficult to find.

A recognizable workspace

Rounded inset surfaces, sculpted panel edges and restrained monochrome controls give the application its own character. Light and dark library views retain the same layout, project previews and primary controls. In light mode, a soft multicolor background adds atmosphere around the work; in dark mode, neutral surfaces make the project imagery more prominent.

From project library to page structure

The Website Studio presents projects as visual cards with names, page counts and section counts. Grid and list controls sit alongside search, while project creation is separated as a prominent action. The planning view turns a page into an ordered outline—Header, Hero, Trust Bar and Services Overview—with a place for copy and notes. It makes content structure part of the design process rather than something added after the layout.

Bay Four: a practical website direction

The auto shop theme is the lead image for this case study. Its bold “Fixed right. Back to it.” headline, yellow service buttons and workshop photography establish a confident, useful direction for a repair business. Navigation answers concrete customer questions: what the shop fixes, who is doing the work, how the process works and where to find it. A clear service request action anchors the composition.

Controls that stay close to the work

The website editor keeps the preview central and places selected-element properties in a right-hand inspector. Desktop, tablet and mobile options, dimensions, layout, spacing and padding controls expose familiar design decisions in a consistent location. The screenshot shows the selected navigation component and its inspector together, making the connection between the visual element and its settings explicit.

A second medium, a shared design language

The graphics workspace uses an artboard, object selection bounds, a tool rail and a property inspector. The “Everyday. Made better.” composition demonstrates typography, a product silhouette and a promotional panel in a single editable scene. Color and geometry controls support precise changes while the canvas remains the visual focus. The application identity carries across without forcing website and graphic tasks into identical layouts.

What this project demonstrates

Sorcerii demonstrates product interface design across multiple levels of a creative workflow: organizing, planning, composing and inspecting. The work pairs a distinctive visual system with practical information hierarchy and task-specific controls. For a client, that translates into the ability to shape a connected application experience rather than only an isolated screen. This is a self-initiated product case study based on the supplied application captures; no adoption, conversion or commercial performance results are claimed.