Inspiration
I built FlowSync to explore a practical problem many teams face: having a project goal is easy, but turning that goal into a clear, actionable plan is often difficult. Teams can have ideas and deadlines, yet still struggle with scattered tasks, unclear priorities, and limited visibility into progress.
The project began as a SaaS-style frontend concept and evolved during Build Week into a functional workspace focused on a more specific product problem: transforming natural-language project goals into structured, actionable workflows.
What it does
FlowSync helps users transform project goals into organized workflows.
Users can:
- Create a workspace and project
- Describe a project goal in natural language
- Generate a relevant structured workflow
- Manage task statuses
- Track progress based on actual task completion
- Return to their workspace and continue where they left off
The workflow is designed to reflect the user's actual goal rather than displaying the same generic task list for every project. A website project, event, advertisement, or academic assignment should produce different types of tasks.
The core product loop is:
Create a project → Describe the goal → Generate a relevant workflow → Manage tasks → Track progress.
How we built it
FlowSync was built as a React and Vite application using reusable components, client-side state management, persistent project and task data, responsive layouts, theme preferences, and interactive workflow management.
The project was originally started before Build Week as a SaaS frontend concept. During the Build Week Submission Period, the project was significantly developed into its current product experience, including the core project-to-workflow loop, goal-relevant task generation, task management, progress tracking, persistence, workspace behavior, and UI refinement.
Codex was used as part of the development workflow to help inspect the existing codebase, implement and refine functionality, identify issues, and iterate on the product. GPT-5.6 was used to help reason through product decisions, workflow design, implementation strategy, debugging, and refinement.
The focus was on improving an existing project rather than rebuilding it from scratch.
Challenges we ran into
One of the biggest challenges was making workflow generation meaningful instead of simply displaying a fixed template.
A website project should produce development-related tasks, while an event or marketing project should produce a completely different workflow. Designing a reliable first version of goal-relevant workflow generation without building a full AI platform was an important product and engineering challenge.
Another challenge was preserving user data correctly. Projects, generated tasks, task statuses, and progress needed to remain available when users navigated away, returned to their workspace, or refreshed the application.
Because the project already existed before Build Week, another challenge was improving and extending the existing application without breaking its existing routes, components, and functionality.
Accomplishments we're proud of
We are proud that FlowSync evolved from a SaaS-style frontend concept into a functional workspace centered around a real product loop.
The project now connects project creation, natural-language goals, relevant workflow generation, task management, progress tracking, persistence, user-specific workspace data, and responsive UI into one experience.
We are especially proud of turning an existing project into a more focused product rather than starting over with a completely new application.
What we learned
Through building FlowSync, we learned how important it is to connect the interface to a real product purpose.
We strengthened our experience with React architecture, state management, persistence, responsive UI design, workflow modeling, and building an interactive product flow rather than only creating static screens.
We also learned that extending an existing codebase requires careful inspection and incremental changes. The challenge is not only building new features but also preserving existing functionality while evolving the product.
What's next for FlowSync
The next step for FlowSync is to make workflow generation more intelligent and flexible through deeper AI integration.
Future improvements could include more advanced goal understanding, smarter task prioritization, improved deadline planning, adaptive workflows, and collaboration features that allow teams to work together inside the same workspace.
Built With
- css3
- framer-motion
- javascript
- react
- react-router
- redux-toolkit
- vite
Log in or sign up for Devpost to join the conversation.