A Wireflow is a schematic of how your software application will work, specifically how screens and tasks are connected. It shows choices the user is presented with, and documents the results of user decisions. Lucidchart is a diagramming tool that works with other Google apps, and allows remote collaboration with your team mates.
You can get Lucidchart by going to your Stony Brook email account and selecting the grid icon in the upper right (where you access Google Drive). Scroll down to the bottom of the apps palette and choose “More from Apps Marketplace”. Search for Lucidchart, install it into your suite of Google apps, and launch it.
You can choose to start with a blank document, or you can edit a template (choose More Templates from the top banner). Lucidchart has a “Wireflow Example” template under the category of Design UI & Layouts > Flowchart. You can edit the template by dragging items like text, connectors, and flowchart shapes from the widget palette on the left to your document to visualize how your user will experience your application. Add your team mates as Collaborators under the “Share” menu. Save as you go.
Make sure your document fits the view by choosing View > Zoom to Content. When you are done, you can publish your flowchart by choosing Share > Publish. Choose Single page (PDF/Image) from the drop-down menu in the resulting dialog, and choose PNG for the file format and Screen Zoom (view) for the resolution. Upload the .png file to your team’s web site, and email the URL to your client, and CC your team mates and the instructor. Put “Wireflow” in the subject line.
Note that your app may have both mobile (client) and desktop (admin) versions, in which case a separate wireflow for each may be needed.
Here’s an example of a wireflow from the SBU Parking app, “SpeedySpot”:
https://xsrv.mm.cs.stonybrook.edu/c4g/wireflows/speedyspot_wireflow.png