Design
Here are the designs for each of the major screens of the web application and of the mobile application. Please note that these are subject to change in response to Dr. Valafar's preferences.
- Image carousel details follow in the Log In Page examples
Basic Log In Page for the Delta Web App. Components include:
-
Image carousel on left half of screen
-
Login in credential fields
-
Sign in button to submit credentials
-
Link to Registration page for users without accounts
Another example of types of images that will rotate in the carousel.
-
The carousel will display an assortment of people doing various activities to subtly reinforce the base function of the app. That is to track biometric data.
-
Images will have uniform size format. For purposes of this proto-type they are not.
-
Examples of the types of images that will rotate around the image carousel, presented in a continuous stream.
-
Images depict various activities or behaviors people engage in, close-ups of the types of app users, the outdoors or landscapes, or anything that implies an activity or behavior.
-
Expectation is that Delta will be used by a diverse pool of users.
-
Some want to track biometrics to change behaviors; others want to use it as a research platform; and some may use it for community.
-
Images will have uniform size format
-
Cycle through the images using a fixed time
-
Images will flow in a seamless manner, perhaps with fade in or out effects, to aid the transition. Goal is to minimize clashing elements, or at least the stark contrast between some elements in the carousel. For example, a simple fade in and out effect between an image of a person exercising in the bright outdoors and group of people enjoying the night life.
-
Home screen. Two sections "At a Glance" and "Detailed View".
-
"At a Glance" should be very graphical. Detailed view can have more information.
-
"Detailed view" Allows scrollable thru "Today", "This Week", and "Total" categories. More information is offered for each category than "At a Glance" view.
-
Can search a data as well and see info for that day.
- Simple Profile Page
- Will allow for editing fields
- Page for Downloading Data
- Here you just upload the file.
- If it is a recognized file type, proceed to next step. else, flash error.
- On this page you add more on the file.
- This page allows a user to check their entries and add a description to their data.
- Community Page #1
- Shows all of your uploads.
- If you click on an upload, it will give more info, see Community Page (Personal, Detail).
- Community Page #2, Detailing an uploaded data set.
- Detailing an uploaded model looks the same.
- The "See More" links to the model detail page, which is the same as this page.
- Community page for followed users.
- Note that posts are sorted in order of date published.
