AI-integrated 2D/3D
hybrid workflow
hybrid workflow
Project Overview:
Developed an innovative AI-integrated 2D/3D hybrid pipeline to create dynamic 6-stage house construction progress visuals—a key feature for a collaborative game mechanic. This workflow ensured artistic consistency while reducing production time by 70% compared to traditional 3D rendering methods.
Developed an innovative AI-integrated 2D/3D hybrid pipeline to create dynamic 6-stage house construction progress visuals—a key feature for a collaborative game mechanic. This workflow ensured artistic consistency while reducing production time by 70% compared to traditional 3D rendering methods.
Game Feature Context:
The system visualizes player progression through phased construction—from bare ground to a fully renovated, landscaped "Dream House." Instead of a standard progress bar, players see their collective efforts (via game challenges) physically shape the environment, fostering collaboration and engagement. Successfully completing challenges unlocks the "Dream House of the Month" reward.
The system visualizes player progression through phased construction—from bare ground to a fully renovated, landscaped "Dream House." Instead of a standard progress bar, players see their collective efforts (via game challenges) physically shape the environment, fostering collaboration and engagement. Successfully completing challenges unlocks the "Dream House of the Month" reward.
Key Contributions:
Streamlined asset creation with AI-assisted style-consistent 2D concepting & 3D modeling integration.
Designed a modular, scalable system for seamless transitions between construction phases.
Enabled rapid iteration for thematic variations (e.g., modern, rustic) without sacrificing visual cohesion.
Streamlined asset creation with AI-assisted style-consistent 2D concepting & 3D modeling integration.
Designed a modular, scalable system for seamless transitions between construction phases.
Enabled rapid iteration for thematic variations (e.g., modern, rustic) without sacrificing visual cohesion.
^ Made by Our UI/UX Team ^
Workflow
The Challenge:
Traditional pipelines (full 2D illustration or end-to-end 3D modeling/texturing/rendering) proved prohibitively time-intensive for creating 6-phase construction visuals while maintaining strict style/structural consistency.
Traditional pipelines (full 2D illustration or end-to-end 3D modeling/texturing/rendering) proved prohibitively time-intensive for creating 6-phase construction visuals while maintaining strict style/structural consistency.
My Solution:
A proprietary 3-stage hybrid workflow leveraging AI to accelerate production without sacrificing artistic control, specifically overcoming AI’s industry-wide limitations in structural coherence and style consistency:
A proprietary 3-stage hybrid workflow leveraging AI to accelerate production without sacrificing artistic control, specifically overcoming AI’s industry-wide limitations in structural coherence and style consistency:
1. AI-Guided Concept Generation:
Used Adobe Firefly with style and structural reference images to generate base concepts, enforcing consistent architecture and visual language.
Used Adobe Firefly with style and structural reference images to generate base concepts, enforcing consistent architecture and visual language.
2. 3D-to-2D Asset Bridging:
Created simplified 3D blockouts for key structures → Imported into Substance 3D Viewer to generate perspective-accurate 2D art with unified lighting/texturing.
Created simplified 3D blockouts for key structures → Imported into Substance 3D Viewer to generate perspective-accurate 2D art with unified lighting/texturing.
3. AI-Assisted Composition & Unification:
Assembled elements in Photoshop → Used Generative Fill to seamlessly blend components, add environmental details, and ensure holistic visual cohesion.
Assembled elements in Photoshop → Used Generative Fill to seamlessly blend components, add environmental details, and ensure holistic visual cohesion.
Firefly (Style) → 3D Blockout → Substance 3D Viewer (2D Output) → Photoshop (AI Assembly)
2D Concept Generation & Refinement
The workflow begins in Adobe Firefly, where initial concepts are generated using dual-reference control:
1. Structure Reference images constrain architectural forms and spatial composition
2. Style Reference images enforce environmental atmosphere and artistic cohesion
1. Structure Reference images constrain architectural forms and spatial composition
2. Style Reference images enforce environmental atmosphere and artistic cohesion
Artists then curate high-value elements from multiple Firefly outputs, selectively extracting preferred components (e.g., structure designs, forground soil, foliage). These elements are composited into a base image, after which Photoshop's Generative Fill intelligently blends harsh edges, harmonizes lighting/textures, and creates organic transitions between assets. This hybrid approach merges AI efficiency with artistic direction, overcoming common AI limitations through structured input and targeted refinement.
3D-Assisted Asset Generation:
For structurally complex elements requiring perspective accuracy (e.g., cranes, scaffolding, construction materials), I employed a 3D-anchored workflow to prevent AI distortion:
Model & Assemble
- Created simplified parametric 3D meshes in modeling software
- Exported to Substance 3D Viewer with a background plate for scene context
Real-Time Visualization
- Adjusted scale, camera angles, and dynamic lighting/shadow in real-time
Model & Assemble
- Created simplified parametric 3D meshes in modeling software
- Exported to Substance 3D Viewer with a background plate for scene context
Real-Time Visualization
- Adjusted scale, camera angles, and dynamic lighting/shadow in real-time
AI-Assisted Rendering
- Generated style-consistent 2D outputs via prompts
- Exported with transparency + baked shadows for seamless compositing
- Generated style-consistent 2D outputs via prompts
- Exported with transparency + baked shadows for seamless compositing
This hybrid approach ensured perspective fidelity for recurring assets across all 6 construction phases, while maintaining stylistic cohesion with Firefly-generated elements during Photoshop assembly.
Monthly Dream House Series