Workspace Docs #1
There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,93 @@ | ||
|
|
||
|
|
||
|
|
||
| # Quickstart | ||
|
|
||
| ## Start With a Prompt (4 mins) | ||
|
Collaborator
There was a problem hiding this comment. What is (4 mins) here? time to read this page? Or time to generate the app?
Collaborator
Author
There was a problem hiding this comment. Time to generate an app, i'll see if i will keep it or not. idea is to show other methods being longer.
Collaborator
There was a problem hiding this comment. ok, no worries. I was thinking that it is not always 4 minutes because mostly it depends on app complexity. |
||
|
|
||
| Dreamflow's AI-powered app generation allows you to create fully functional, production-ready applications from simple text or image descriptions. Simply describe what you want to build, and Dreamflow Agent will generate the entire app structure, UI components, and functionality for you. | ||
|
|
||
| Ready to create your app? Simply: | ||
|
|
||
| 1. Open Dreamflow and click the textbox that says "Start with a prompt..." | ||
| 2. Enter your app description and wait for the Agent to generate your complete app. | ||
| 3. Review and customize the generated project in the [workspace](#). | ||
|
|
||
|
|
||
| The Agent will create all the necessary screens, components, and functionality based on your description, giving you a fully functional app that you can further customize and deploy. | ||
|
|
||
|
|
||
| <div style={{ | ||
|
Collaborator
There was a problem hiding this comment. I think it would be more impactful to demo an app that’s widely relatable — the kind of apps used by thousands, if not millions, such as a Fitness Tracker, Expense Tracker, Super App, Stock Market app, Language Learning app, Hotel Finder app, Dating app, or Last-Minute Delivery app. Showing that these can be generated with just a simple prompt (instead of needing a large team) would really highlight the true power of Dreamflow. Also, in the last slide of the arcade, there are overflow errors, which might leave a slightly low impression.
Collaborator
Author
There was a problem hiding this comment. Updated with a music streaming app instead!
Collaborator
There was a problem hiding this comment. Looks really great now! thanks! |
||
| position: 'relative', | ||
| paddingBottom: 'calc(56.67989417989418% + 41px)', // Ensures the aspect ratio plus additional padding | ||
| height: 0, | ||
| width: '100%' | ||
| }}> | ||
| <iframe | ||
| src="https://demo.arcade.software/pkh6dsSwozFhyAZUW9IU?embed&show_copy_link=true" | ||
| title="Projects - FlutterFlow" | ||
| style={{ | ||
| position: 'absolute', | ||
| top: 0, | ||
| left: 0, | ||
| width: '100%', | ||
| height: '100%', | ||
| colorScheme: 'light' | ||
| }} | ||
| frameBorder="0" | ||
| loading="lazy" | ||
| webkitAllowFullScreen | ||
| mozAllowFullScreen | ||
| allowFullScreen | ||
| allow="clipboard-write"> | ||
| </iframe> | ||
| </div> | ||
|
|
||
| ***Prompt used:** Build a sleek music streaming app like Spotify, with a dark theme, album art grids, a bottom navigation bar (Home, Search, Library) and a clean now-playing screen with controls and progress bar.* | ||
|
|
||
| ### Sample Prompts | ||
|
|
||
| Here are some prompts that we've used recently while chatting with the agent. | ||
PoojaB26 marked this conversation as resolved.
Show resolved
Hide resolved
|
||
|
|
||
| #### A habit tracker | ||
|
|
||
| **Prompt** | ||
|
|
||
| Build the main screen for a habit tracking app. Prepopulate with common habits, and then show the tasks for today on this main screen. Make the app look modern and whimsical. | ||
|
|
||
|
|
||
| **Duration / Cost**: 161 seconds / 2.51 credits | ||
|
|
||
| **Next steps** | ||
| - Let the user enter their own habits | ||
| - Give the user reminders for their habits, even when the app is not running. | ||
| - Allow the user to share their habit progress with others (through the share sheet of the mobile OS) | ||
|
|
||
|
|
||
| #### Asteroids game | ||
|
|
||
| **Prompt** | ||
|
|
||
| Replace the main screen with an implementation of the classic game of Asteroids. Make this look and work the same as the original arcade game. Make sure that it has keyboard controls, mouse controls, and touch controls. Store the high-score locally. | ||
|
|
||
| **Duration / Cost** : 183 seconds / 2.30 credits | ||
|
|
||
| **Next steps** | ||
| - Give the game a start screen (with instructions) | ||
| - Give the game an end screen (with a leaderboard) | ||
| - Store a leaderboard of highscores on a server | ||
|
|
||
|
|
||
|
|
||
| #### Chat app | ||
|
|
||
| **Prompt** | ||
|
|
||
| Build a small chat app (store the data locally for now) where users can chat with their friends. Make the app look modern and familiar, but also give it some unique twists. | ||
|
|
||
| **Duration / Cost** : 313 seconds / 4.42 credits | ||
|
|
||
| **Next steps** | ||
| - Make the chats clustered when folks are close to each other | ||
| - Store the chat data in a cloud database | ||
| - Show a notification when a message arrives when the app is not active | ||
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,40 @@ | ||
|
|
||
|
|
||
| # Welcome | ||
|
|
||
| Dreamflow is ... | ||
|
|
||
|
|
||
| ## Create Account | ||
|
|
||
|
|
||
| create an account... | ||
|
|
||
|
|
||
| ## Build First Project | ||
|
|
||
| <div style={{ | ||
| position: 'relative', | ||
| paddingBottom: 'calc(56.67989417989418% + 41px)', // Ensures the aspect ratio plus additional padding | ||
| height: 0, | ||
| width: '100%' | ||
| }}> | ||
| <iframe | ||
| src="https://demo.arcade.software/5Lbea4PqYYhwyNItSuND?embed&show_copy_link=true" | ||
| title="Projects - FlutterFlow" | ||
| style={{ | ||
| position: 'absolute', | ||
| top: 0, | ||
| left: 0, | ||
| width: '100%', | ||
| height: '100%', | ||
| colorScheme: 'light' | ||
| }} | ||
| frameBorder="0" | ||
|
There was a problem hiding this comment. This file correctly uses 'frameBorder' with camelCase, which is the proper React/JSX syntax. The other files should follow this pattern. |
||
| loading="lazy" | ||
| webkitAllowFullScreen | ||
| mozAllowFullScreen | ||
| allowFullScreen | ||
| allow="clipboard-write"> | ||
| </iframe> | ||
| </div> | ||
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -74,7 +74,7 @@ Dreamflow is a visual development environment that lets you build mobile, web, a | |
|
|
||
| <p></p> | ||
|
|
||
| <div class="video-container"><iframe src="https://www.youtube.com/embed/GpXjU-ieAKU?si=moIEUUGry24CdSJN" title="YouTube video player" frameBorder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe></div> | ||
|
|
||
|
|
||
|
|
||
|
|
@@ -149,11 +149,11 @@ Discover additional tools and references to enhance your Dreamflow development e | |
|
|
||
| ## Still Have Problems? | ||
|
|
||
| <!-- If you're still experiencing issues or need additional help, here are some resources to get you back on track: | ||
|
|
||
| - **[Submit Bug Report](#)** - Report bugs or issues you've encountered | ||
| - **[Community Forum](https://community.flutterflow.io)** - Ask questions and get help from the community | ||
| - **[Reddit Community](https://www.reddit.com/r/FlutterFlow/)** - Join discussions on Reddit | ||
| - **[Documentation Bug](https://github.com/FlutterFlow/flutterflow-documentation/issues)** - Report documentation issues | ||
| - **[Contribute to Documentation](https://github.com/FlutterFlow/flutterflow-documentation?tab=readme-ov-file#how-to-contribute)** - Contribution guidelines for contributing to the FlutterFlow documentation site. | ||
| - **[FlutterFlow Support](mailto:[email protected])** - Get direct support from the FlutterFlow support team. --> | ||
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
you can review this but the other sections I will add with https://linear.app/flutterflow/issue/DEVR-1080/quickstart later. whatever's done, let's review that.