Create content for 'Instructions / How to Use' page

[RobThePM]

I can work on the content for instructions. This will probably be texts and screenshots on a page, but I'm also probably going to do a video or something if we can embed that into the page as well.

Also, we don't necessarily need a separate page for this; it can be added to the home page, about us page, or some other page if you guys prefer. Although I think it makes sense to have it be it's own page. Maybe the text and screenshots can be it's own page and the video can be on the home page. Open to opinions.

[RobThePM]

My estimate is that I will be able to finish this issue by 4/1.

[cheshire137]

I'm also probably going to do a video or something if we can embed that into the page as well.

Yep, we can certainly embed a video from, say, YouTube on a page!

I like the idea of having a separate Help page that has these instructions.

[RobThePM]

I agree with naming it the Help page rather than Instructions or How to Use

[RobThePM]

Here's a first pass on the content for the instructions. I think it would be nice to have 'two columns'; the step is written on the left and the corresponding picture is shown on the right. I'll get new pictures when the web app is more complete. I might also make the pictures closer to the same size so that it's uniform. I'm also planning to make instructional videos.

--- Concept Layout ---

--- Content ---

How to use the Team Planner (no Battletags)

1. Go to https://overwatch-team-comps.herokuapp.com/user.

2. Select the map.

3. Click on the Composition Name field and give your plan a name.

4. Click on the Player field. Click 'Add new player'.

5. Type the player's name. Click the checkbox or hit 'Enter'.

6. Click on the first Hero field.

7. Select the hero that player will play on that point. The other Hero fields will automatically populate with the same hero. You may change any of the selections.

8. Repeat this process until you have added all team members and made all hero selections. Note that duplicate heroes on the same point will be highlighted in red.

9. To share your saved plan, click on 'Share this composition'. This will direct you to a snapshot of your team plan. Use the URL to share.

How to use the Hero Pool
(pictures to be added later when web app is more complete)

1. Go to https://overwatch-team-comps.herokuapp.com/.
2. Click on 'Sign in with Battle.net'.
3. Allow permissions. You will be redirected back to the Team Planner.
4. Click on Hero Pool (https://overwatch-team-comps.herokuapp.com/user/hero-pool).
5. Rank your skill level with each hero.
   The Overwatch Planning Tool uses the skill rankings from competitive mode to provide a common understanding of "how good you are with each hero". For example, if you play Junkrat in competitive mode and consistently reach Diamond rank, then your skill level with Junkrat is probably at Diamond. So then in the Hero Pool page you would go to Junkrat and select Diamond as your skill level.
6. Your hero skill levels will be shown in the Team Planner when your Battletag is added to a Player field. For more details, see below for instructions on 'How to use the Team Planner (with Battletags)'.

How to use the Team Planner (with Battletags)
(pictures to be added later when web app is more complete)

1. Each team member must sign in and specify their hero preferences on their Hero Preferences page (https://overwatch-team-comps.herokuapp.com/user/hero-pool).
2. Go to the Team Planner page (https://overwatch-team-comps.herokuapp.com/user).
3. Select the map.
4. Click on the Composition Name field and give your plan a name.
5. Click on the Player field.
6. Click 'Add new player'.
7. Type the player's name. Click the checkbox or hit 'Enter'.
8. Click on the gear icon.
9. Add their Battletag.
10. Click on the first Hero field.
11. Heroes will be shown in order of skill. The player's best heroes will be shown at the top and their worst heroes will be shown at the bottom.
12. Select the hero that player will play on that point. The other Hero fields will automatically populate with the same hero. You may change any of the selections.
13. Repeat this process until you have added all team members and made all hero selections.
14. To share your saved plan, click on 'Share this composition'. This will direct you to a snapshot of your team plan. Use the URL to share.

[RobThePM]

i think i might update this so that it's not in steps, exactly. i might just do sections in a certain order (ill show later)