Tutorial Draft

[cdrice26]

Overview

This is the text I'm planning to put in the tutorial, I'll also have screenshots added once the search bar and charts are implemented. I'm thinking I'll just put this in a standard modal container, with "next" and "exit" buttons, where each screen is a section on the UI. I'm thinking each section will have a "help" button that will take you to the corresponding screen of the tutorial as well.

Tutorial

Meal Plan Info

Before you can start planning your meals, you need to input some basic data about your meal plan. Fill out the fields as follows:

• Start Date: Enter the date that you want your planned meals to start on. This could be the start date of the next semester, today, or whatever date you want to plan from.
• End Date: Enter the date that you want your planned meals to end on. Generally you will want this to be the day you move out at the end of the semester.
• Dining Dollars Discount: Check this if you use the Dining Dollars plan, with the discount.
• Account for 1-Week Break: Check this if your plan timeframe includes Fall or Spring break and you will not be on campus during that break. It will subtract one of each weekday from your total cost.
• Starting Balance: Enter the amount of money you will have in your meal plan account on the day you entered for "Start Date".

Available Meals

This is where you can start planning your meals. There's a table of Messiah's most common meals readily available, and it can be sorted by clicking the button in the top right and searched using the search bar. Click the "+" button to add a meal to your queue. If the meal you want to add isn't in the table, click "Custom meal", fill out the meal details, and then click "Add". Your custom meal will now show in the meals table and will stay there every time you use the app until you remove it. If at any time you want to change or remove the custom meal, simply click on its title in the table and an editor will pop up with the option to delete as well.

Meal Queue

This is essentially your staging area for meals you want to add to certain days. Once you've selected a group of meals from the Available Meals table, you will see them in this table. You can remove individual meals from here by clicking the "-" button, or you can clear the whole queue by clicking "Clear meal queue". When you have the right meals in your queue, you can add all the meals in the queue to certain days of the week by selecting the days at the bottom of the section, then clicking "Add meals to selected days".

Day Editor

Here you can see the meals you've added to each day and remove any you need to. The bar across the top will show the number of meals on each day, and you can click on a day to see the meals themselves and remove them by clicking the "-" button in the table. This section also displays some stats for each day:

• Total for One ____day: The total cost to get all the meals on that day once.
• Number of ____days: The number of times that day occurs in your timeframe.
• Total of All ____days: The total cost to get all the meals on that day times the number of times that day occurs in your timeframe.

Results

Here you can see some stats of your meal plan and some graphs of it as well. The following stats are displayed:

• Starting Balance: The amount you entered for "Starting Balance" in the Meal Plan Info section.
• Weekly Total: The amount of money you would spend in a full week if you followed your plan.
• Grand Total: The total amount of money you would spend between your chosen start and end dates if you followed your plan.
• You will also see how much money you have left at the end or how much you went over your starting balance.

Many of these stats can also be seen in the bar at the bottom of the screen. There are also two graphs of your meal plan. The first is a bar graph that shows how much you spend on each day, with each meal having its own color. This helps you gauge where your money is going. The second is a line graph that shows how much money you will have spent on a given week and when you will run out of money if you are overplanning.

[nickslick03]

I really like the idea of having question buttons in the corner of each section! Perhaps for the beginning tutorial, we have simplified versions of each description (3 sentances max) so as not to overwhelm the user and then the help buttons contain the full explanation. What do you think?

[cdrice26]

I'm less sure about this...not being able to get the concise version back could annoy users, and there may be some cases where users would only read the short version at first, use the app incorrectly (for instance, by filling out the date fields wrong), and then get an incorrect result, or misinterpret a result. I see what you're saying about not overwhelming the user, but I think we're probably better off just trying to shrink the tutorial as it is and just use it as opposed to only showing part of it on the first run. Another possibility would be to bold or italicize key points. I could still see a version of your idea working if done right, but it's hard to define "right" when we're the app creators and we don't know what will or will not be confusing to members of our target userbase. What do you think about this?

[nickslick03]

Honestly it's hard to say until we have someone else test our app. I think the version in the google doc is good for now, I was thinking I'd show Dr. Weaver our app sometime this summer since I'm in the area and we'll get meals occasionally, but it's hard for either of us to say since we made it, as you pointed out. Another idea I have is a "show more/show less" hyperlink which displays a more detailed explanation or more options that are secondary e.g. sorting and clear meal queue.

[cdrice26]

Tutorial is now merged, updated version of this content is now in the app itself, so closing this issue.