{"id":51038917,"url":"https://github.com/bernaferrari/vectorforge","last_synced_at":"2026-06-22T09:01:21.993Z","repository":{"id":364224299,"uuid":"1266972458","full_name":"bernaferrari/vectorforge","owner":"bernaferrari","description":null,"archived":false,"fork":false,"pushed_at":"2026-06-12T05:50:46.000Z","size":889,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2026-06-12T07:19:30.727Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/bernaferrari.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2026-06-12T05:39:31.000Z","updated_at":"2026-06-12T05:50:49.000Z","dependencies_parsed_at":null,"dependency_job_id":null,"html_url":"https://github.com/bernaferrari/vectorforge","commit_stats":null,"previous_names":["bernaferrari/vectorforge"],"tags_count":null,"template":false,"template_full_name":null,"purl":"pkg:github/bernaferrari/vectorforge","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bernaferrari%2Fvectorforge","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bernaferrari%2Fvectorforge/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bernaferrari%2Fvectorforge/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bernaferrari%2Fvectorforge/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/bernaferrari","download_url":"https://codeload.github.com/bernaferrari/vectorforge/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bernaferrari%2Fvectorforge/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":34641636,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-26T15:22:16.424Z","status":"online","status_checked_at":"2026-06-22T02:00:06.391Z","response_time":106,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2026-06-22T09:01:20.573Z","updated_at":"2026-06-22T09:01:21.984Z","avatar_url":"https://github.com/bernaferrari.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# VectorForge\n\n\u003cp align=\"center\"\u003e\n  \u003cstrong\u003eVectorForge turns SVG icons into animated extruded 3D assets.\u003c/strong\u003e\n\u003c/p\u003e\n\nVectorForge is a browser-based 3D motion editor for SVG paths and Material\nSymbols. It gives designers and engineers one focused workspace for choosing an\nicon, shaping its extrusion, tuning materials, animating motion, and exporting a\nruntime-ready result.\n\nInstead of moving between separate SVG, 3D, and motion tools, VectorForge keeps\nthe core workflow in three synchronized surfaces:\n\n- **Viewport** - inspect the 3D icon, drag to rotate, nudge the view, and use\n  direct transform controls.\n- **Inspector** - adjust fill, finish, extrusion, bevel, transform, lighting,\n  and layer settings.\n- **Timeline** - build shape sequences, transitions, property tracks,\n  keyframes, easing, and playback.\n\nEverything runs locally in a Next.js app. The editor state is plain React and\nThree.js data, and exports target web handoff, GLB assets, WebM recordings, and\nAndroid Filament reference code.\n\n## Why VectorForge\n\nSmall 3D app icons sit in an awkward place. SVG tools are great for paths, video\ntools are built for timelines, and full 3D suites are heavy for icon-sized\nassets.\n\nVectorForge is built for that middle step. Start with an SVG or Material Symbol,\nextrude it, make it feel tactile, animate the useful parts, then hand off an\nasset and implementation reference without rebuilding the motion from scratch.\n\n## Features\n\n- **SVG extrusion** - Convert SVG paths into bounded Three.js geometry with\n  safe depth, bevel, and crown settings.\n- **Material Symbols picker** - Search and import Google Material Symbols, with\n  support for slash/unslash wipe pairs.\n- **3D viewport** - Rotate by dragging, reset the view, use orientation nudges,\n  and manipulate transforms with a viewport gizmo.\n- **Timeline editor** - Create shape clips, transitions, property rows,\n  keyframes, easing curves, snapping, zooming, and contextual actions.\n- **Inspector controls** - Edit static values without accidentally creating\n  animation data; add keyframes only when a property should animate.\n- **Color and finish tools** - Use solid colors, mesh gradients, lighting, and\n  finish presets such as glass, gel, metal, and cut styles.\n- **Layer editing** - Select icon layers, override visibility, and tune\n  per-layer behavior for multi-path symbols.\n- **Export workflow** - Record WebM, export GLB-oriented assets, and copy React\n  Three Fiber or Android Filament starter code.\n\n## Get Started\n\nRequires [pnpm](https://pnpm.io/).\n\n```bash\ngit clone https://github.com/bernaferrari/vectorforge\ncd vectorforge\npnpm install\npnpm dev\n```\n\nOpen [http://localhost:3000](http://localhost:3000).\n\n## Architecture\n\n```text\napp/\n  page.tsx                    Editor entry point\n  layout.tsx                  App shell, fonts, and providers\n  globals.css                 Tailwind theme tokens\n\ncomponents/3d/\n  SvgCanvas.tsx               Three.js viewport boundary\n  SvgModelBuilder.ts          Builds renderable icon groups\n  SvgShapeGeometry.ts         SVG-to-extruded-geometry pipeline\n  StraightSkeleton.ts         Medial roof geometry for cut finishes\n  MaterialPresets.ts          Three.js material presets and shaders\n  TransformGizmo*.ts          Direct transform controls\n\ncomponents/editor/\n  AppLayout.tsx               Editor composition\n  EditorModel.ts              Shared editor data model\n  ShapeSequenceModel.ts       Shape clips and transitions\n  TimelineModel.ts            Time, tracks, keyframes, and interpolation\n  FinishRegistry.ts           Finish labels, previews, and defaults\n  Export*.tsx/ts              Export UI, snapshots, and code templates\n\ncomponents/editor/timeline/\n  Timeline.tsx                Timeline shell\n  useTimelineController.ts    Timeline state and interactions\n  ShapePickerContent.tsx      Symbol, preset, and upload picker\n  Timeline*                  Tracks, clips, rows, keyframes, and menus\n\ncomponents/ui/\n  button/dialog/tabs/...      shadcn-style primitives\n  color-picker.tsx            Solid and mesh color picker\n\nlib/\n  drag-events.ts              Shared pointer drag helpers\n  utils.ts                    Tailwind class merging\n```\n\n## Export Targets\n\nVectorForge currently supports:\n\n- **WebM recording** for quick motion previews.\n- **GLB export** for 3D asset handoff.\n- **React Three Fiber snippets** for web implementation reference.\n- **Android Filament snippets** for loading the exported GLB in an Android app.\n\nThe Android sample expects exported assets at:\n\n```text\napp/src/main/assets/exports/icon.glb\n```\n\n## Product Principles\n\n- Keep the viewport, inspector, and timeline in sync.\n- Do not create animation data from ordinary static edits.\n- Keep controls compact enough for repeated production use.\n- Prefer pure model helpers for timeline math, geometry safety, color editing,\n  and material state.\n- Keep exported materials close to standard glTF PBR fields whenever possible.\n\n## Status\n\nVectorForge is an active editor prototype moving toward a polished production\nworkflow. The current focus is geometry reliability, intuitive timeline editing,\nclean exports, and keeping the UI compact without hiding important controls.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbernaferrari%2Fvectorforge","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbernaferrari%2Fvectorforge","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbernaferrari%2Fvectorforge/lists"}