In digital product development, speed from design to implementation is no longer an advantage—it's a necessity. This documentation shares how AI is actively leveraged in design-to-development processes across various project contexts. From situations without visual design, complex system integration needs, to development within small teams, we found that AI can accelerate cross-functional workflows. This approach not only speeds up production but also expands how we understand design, experimentation, validation, and development as an integrated whole.
Role
Process
Output
Across various projects we've worked on, the main challenge is often similar: how to produce quality products within tight timeframes and limited resources.
One example was building a content management system (CMS) at Ruang Murid. This project started without visual references like Figma. Engineers had to work from scratch with limited time, while the design team lacked bandwidth to prepare redesigns. In such conditions, bottlenecks typically occur early where processes stall because designs don't exist.
In another project, we faced integration challenges across various institutional HR management platforms. These platforms originally stood alone, with different designs and functions. When attempting to unify them, the challenge emerged: how to build an integrated system without redesigning everything from scratch?
Meanwhile, in projects run with lean team formations, efficiency pressure intensified. Every member was required not only to work in one role but also to switch contexts quickly: from research, design, validation, to implementation.
Across all these contexts, one common thread emerged: AI became a practical solution to fill gaps and accelerate production cycles.
Afnizar - CMS Development Without Design Foundation: At the start of CMS development at Ruang Murid, the project began without visual design support like Figma or other design files. Engineers were tasked with building the system from scratch without design artifact references, due to tight deadlines and high workloads across various initiatives. The design team lacked capacity for complete redesign in Figma format.
Mezki - HR Platform Integration: Institutions and bureaus under the Ministry of Education had separate HR management systems that weren't integrated. This created many applications/platforms, leading to an initiative to integrate these platforms into a single unified system for activities like monitoring and employee evaluation.
Arvie - Lean Team Efficiency: In challenging economic conditions with increasingly lean teams, the need to produce digital products—systems, software, and user experiences—quickly became urgent. Efficiency is no longer an advantage but a necessity, yet opportunities remain for end-to-end design and development service providers where every team member must master multiple roles and work smarter.
Team experimented using different AI tools with different utilities
Rather than replacing the role of designers or engineers, AI acts as an accelerator: speeding up exploration, supporting decision-making, and reducing technical barriers early in the process
Claude Chat: Similar to ChatGPT, but with stronger abstraction capabilities, making it especially helpful for design and programming tasks—even extending to technical documentation.
Claude Code: Here, the workflow becomes truly integrated with AI through “embedded” tools like this. You can see, in real time, what changes will be made and the AI’s thought process—while always staying in control, whether making manual adjustments or modifying what the AI produces.
Despite every project has different nature, these are the common process structure we can implement on various context:
1. Setup & Initial Understanding
2. Requirement Gathering & Brainstorming
3. AI-Powered Prototyping
4. Design Iteration & UI Strengthening
5. Implementation & Final Development
Effective Multi-AI Approach: Use multiple AI tools—ChatGPT and Claude Chat for completing requirements and design, then request implementation prompts per feature for Claude Code (or Copilot, Cursor, etc.)
AI is most effective when used after direction and needs are understood collectively. Skipping UX exploration can hinder, not accelerate, processes.
The most important skill isn't just creating prompts, but structuring problems clearly. AI needs structure, and that structure must come from humans controlling AI.
Direct design in code can accelerate development, but visual exploration remains important. The combination of UX exploration and modular implementation proves most effective.
AI is a work partner, not a replacement, but a partner that can add speed, expand exploration space, and help small teams go further.
Success depends on problem clarity, not just tool proficiency. Teams that effectively leverage AI are those that quickly agree on shared goals, structure problems clearly, and use AI to execute solutions rather than blindly search for direction.
AI enables more fluid frameworks as it can assist across various stages/processes, becoming an active thinking partner while keeping final decisions with designers.
