JGomez0357 / Team-Fwiends

0 stars 0 forks source link

Application Design #3

Open JGomez0357 opened 2 months ago

JGomez0357 commented 2 months ago

For this milestone your group will work out in detail the design of your app. You will use a diagramming tool like PencilLinks to an external site., figmaLinks to an external site., justinmindLinks to an external site., balsamiqLinks to an external site., mockflow.comLinks to an external site., or just your favorite paint program . If you are building a game or other widget-free app then a paint program will be easier to use.

Your design should include: Screens and Dialogs:

Create an image for each major screen and dialog in your app. Show all widgets in their proper placement. Name each screen and provide text explaining how actions on one screen lead to other screens. Widget-Free Apps:

Include diagrams for all major ‘areas’. Provide animation stills detailing common animations Use storyboards if they are more relevant to your game. Goals of the Design: Usability: Think about the usability of your app. Simulate how a user might interact with it. A common method is to print the screens on sheets of paper of the correct size and shuffle them as you pretend to use the app.

Efficiency: Save time by making changes now. Adding or deleting a screen is much easier at this stage than after you’ve written the code.

igotchu730 commented 1 month ago

Tool Used: draw.io, Adobe Illustrator

1 Screen: Upload Page Action: User clicks on the plus (+), the User knows what files they want to upload. This will prompt the file explorer to open.

2 Screen: Generate Link Page Action: After the user is prompted to their file explorer and selects their files for upload, the files will be uploaded. The file names will be displayed along with the file size. Here, the user is able to remove any files if they wish. Users will also be able to set the expiration time of the link before the files are permanently deleted. Finally, the user can click on “Generate Link” and the app will generate a sharable link. Clicking “reset” will take the user back to the main page.

3 Screen: Share Page Action: The user is informed that the share link containing the files they uploaded is ready to be shared, “Your share link is ready.” The user clicks on ‘Copy’ which will copy the URL containing their files and they can give/share with whomever they want by pasting/providing the link to their desired recipients. The user can click on ‘Reset’ which will redirect them to the upload page from which they started.

4 Screen: Preview/Download Page Action: Any recipient of the shared link will be able to preview, select, and download any files within the shared link. Multiple files will be zipped before download. If the link is just a single file, the file is automatically previewed, and will not be zipped.

Design_about Screen: About Us Page Action: Clicking “About Us” will bring the user to a new page with simple text explaining our site.

Flowchart

Uplo_Flowchart