SG Blocks
Visual software creation, built for the future.
- Category
- Visual Programming · Workflow Automation · Developer Tools
- Role
- Product vision · Platform architecture · Block system design
- Status
- Functional Prototype
- Timeline
- 2026 — active development
The Opportunity
Turning an idea into working software still requires fluency in tooling, syntax and architecture. A visual workspace can let product thinkers express logic directly, while still producing code an engineer can read and own.
The Product Concept
A canvas where triggers, conditions, actions, data and integrations are placed as categorised blocks and connected into a workflow. The workspace mirrors that structure back as generated TypeScript so the visual model and the code never drift apart.
My Role
Product vision, platform architecture, block-system design, UX/UI direction and frontend development.
Product Process
- 01
Opportunity identification
- 02
Concept definition
- 03
User journey planning
- 04
Information architecture
- 05
Interface design
- 06
AI-assisted development
- 07
Responsive implementation
- 08
Testing and iteration
- 09
Deployment preparation
Key Features
Visual builder
Drag, drop and connect blocks into a readable workflow instead of writing boilerplate.
Categorised block library
Triggers, actions, conditions, data, loops and functions grouped into a searchable palette.
Code generation
Concept for turning the visual workflow into production-shaped TypeScript.
Scalable systems
Designed so a small automation and a larger business system share the same grammar.
Challenges and Decisions
Readable at scale
A workflow has to stay understandable as it grows, so layout, grouping and colour carry meaning.
Visual model and code parity
The generated code must reflect exactly what the canvas describes, with no hidden behaviour.
What I Learned
- · A block library is a design system: naming and categories decide whether people can build.
- · Showing generated code alongside the canvas builds trust faster than hiding it.
Current Status and Next Steps
The primary portfolio visual represents the intended professional product direction of SG Blocks. The currently implemented prototype demonstrates the visual workspace, categorised block library, drag-and-drop interaction and early SG-specific workflow blocks, while advanced code generation, deployment and integration capabilities remain under development.
Related Project
ShapGenius Ecosystem
A growing ecosystem of AI-assisted SaaS concepts designed to help individuals, creators and businesses discover opportunities, make better decisions and build practical digital solutions.