diff --git a/doc/proposals/2025/gsoc/idea_SyedAbdullah_ai-ui-designer.md b/doc/proposals/2025/gsoc/idea_SyedAbdullah_ai-ui-designer.md new file mode 100644 index 00000000..9fab8e5e --- /dev/null +++ b/doc/proposals/2025/gsoc/idea_SyedAbdullah_ai-ui-designer.md @@ -0,0 +1,45 @@ +### Initial Idea Submission + +Full Name: Syed Abdullah +University name: University of Engineering and Technology, Taxila +Program you are enrolled in (Degree & Major/Minor): Graduate Software Engineer +Expected graduation date: I am an early stage developer and new to open source. + +Project Title: AI-Powered Dynamic UI Generator from API Responses + + +Relevant issues: #617 +##About me +Hi, I'm Syed Abdullah, a passionate Software Engineer with over 2 years of experience building scalable and modern software solutions. +I'm a full-stack developer comfortable working across both frontend and backend, using C#, .NET Core, React, Flutter, and more. I'm also a beginner-level open-source contributor, continuously learning and giving back to the community. + +Idea description: +The goal of this project is to enhance API Dash by developing an AI-driven agent that automatically transforms API responses (e.g., JSON, XML) into intuitive, dynamic UI components like tables, cards, charts, and forms. +This eliminates the manual process of UI creation and helps developers interact with and visualize data effortlessly. + +#### Key Features: +- Parse and understand API response structures in real-time. +- Automatically generate a corresponding UI schema/model (component layout). +- Render live previews of the generated UI in the app. +- Support customization: layout templates, filters, pagination, sorting, styles. +- Export the UI code (Flutter widgets or HTML/CSS snippets) for integration in web or mobile apps. +- Extensible system with support for plugins or future rendering engines (React, Vue, etc.). + +#### Approach: +1. **Phase 1** – Build a response parser module that: + - Parses JSON/XML structures. + - Outputs a layout schema representing UI components. + +2. **Phase 2** – Implement a dynamic UI renderer: + - Converts the layout schema into interactive Flutter or Web UI. + - Allows live preview inside API Dash. + +3. **Phase 3** – Add customization tools: + - Enable field selection, styling options, responsive layouts. + - Add filtering/sorting controls in tables, date pickers, etc. + +4. **Phase 4** – Code export and integration: + - One-click export to Flutter widgets or reusable HTML/CSS components. + - Optionally support importing layout templates. + +This is my initial idea, kindly give me feedback on the idea and shall I move forward with the POC and all. Looking forward. Thanks \ No newline at end of file