Design
If you follow the link above, a walkthrough of the prototype will load which will demonstrate the transitions between the different screens. The transitions are usually based on a button or clicking on the tab at the top.
Blues and Yellows
This page is the main home screen/welcome page when you first visit the website. Here is a short description of the website's purpose and the login/create account buttons. Clicking on "Get Started" will take you to the login page.
This page is the login page that prompts the user for a username and password. Additionally, if the user needs to create an account rather than login there is an easy transition button for that. Typing in info and clicking "login" will take the user to the home page and if they need to create an account there is a button for that, "Sign Up", that will take them to that screen.
This page is the create account page that prompts the user for a username and password creation. Clicking "Sign Up" will take the user to the home page.
This is the Home Page and the initial view when someone first creates an account -- prompting them to update their profile. The user can navigate to the other pages by clicking on the tabs across the top.
This is the profile page where the individual is prompted to fill out their information for other users to view. Clicking save after updating the info will take the user back to the home page.
This is the settings page where the user can update their password or log out of their account or even delete their account if they want to. Clicking on "Log out" will take the user to the welcome page. Clicking on the tabs at the top will transition them to that specific page.
This is the messaging page where users of the app will chat with each other to form study groups. Click on the tabs on the top to reach another page.
This is an example of a completed profile of a student who is a potential user of this website. Clicking "message" will take the user to the messaging page. Clicking "next" will take the user to the next match. Clicking "back" will take them to the previous match.
This is an example of the home page viewing a partially formed group. Our website will allow students to form groups and thus when two people decide to group together, other users will see the group as an option to message rather than just the individual people. Clicking "message" will take the user to the messaging page. Clicking "next" will take the user to the next match. Clicking "back" will take them to the previous match.
This is the resources page specifically on the tips page. Our website will have study tips and suggestions for the students to use if they need it. Clicking on the left tab bar will take the users to the other pages on the resource page, while the tabs across the top will take them to the other pages.
This is the resources page specifically on the external resources page. Our website will have links to scheduling services such as When2Meet.com and more found in this tab for users to use. Clicking on the left tab bar will take the users to the other pages on the resource page, while the tabs across the top will take them to the other pages.
This is the resources page specifically on the external grade calculator page. Our website will have a table where users can input their grade percentages to calculate their grade in the course they’re studying for. Clicking on the left tab bar will take the users to the other pages on the resource page, while the tabs across the top will take them to the other pages.
