Communicate with interpreter team to see if their system can be integrated into our tutorial system.

As a client, I would like to create a cohesive interpreter tutorial system so that the tutorial can feel more hands on for the new users.

Interactive? Guided? Textbook-ish?

As a user, I need a comprehensive but approachable tutorial format so that I can learn the language and its benefits effectively.

Create html pages for this section of the tutorial: add the content, link the pages together with the next and previous buttons, add link to the pages in the side navigation and front-page menu, etc.

Tutorial pages should include the sidenav, section title, section content, and interactive content.

--> to be split into individual sections for each assignee once sections are determined during group meeting.

Things like "try writing a simple pipeline" --> follow formatting of beginner coding tutorial websites like Codecademy (i.e. in length and in style).

Create html pages for this section of the tutorial: add the content, link the pages together with the next and previous buttons, add link to the pages in the side navigation and front-page menu, etc.

As a group, we need to recognize the persisting problems across all of our group members so that we can prioritize these as main revision goals.

Very low priority, and dependent on menu page being finished. May not happen this sprint—is not part of MVP

As a developer I want to understand the basics of how the interpreter works so that I can integrate it properly into the tutorial web pages

Window magnifier - as you zoom out, content on the left half of the page doesn't extend all the way to the interpreter
The content should start below the hamburger; the hamburger shouldn't cover any text when you scroll down

See if their interpreter is at a level where we can use it for our tutorial.

As a developer, I need to create a general layout of the new tutorial so that I know what outline I need to follow.

A catch-all place for feedback collected during a user testing session, which can later be broken into separate issues.

Bugs

Main content and side nav icon doesn't move

Reviewer: Monica Acosta
Reproduction:

1. Go to Iterator title page
2. Click on side navigation icon

Code snippet indentation level

Reviewer: Grace Breckenridge
Repro steps: check all code snippets
Additional comments: We want indentation to be 4 spaces

Suggestions

• Code snippet colors clashes with background color; make background plain, to do that make editor and output white, make background of text the background color of the editor
• Text color in side nav the same as the background color of the editor
• Next links on final section pages should go to next section; maybe pro
• Font-weight on Next and Previous buttons to light, hard to read
• Make tutorial solutions hidden
• On each tutorial interpreter page, have a brief introduction to what the page wants to accomplish
• "rather than add-ons.," typo
• The Interpreter is called "Coconut Editor", but in the tutorial content we refer to the interpreter
• Button that pastes sample code into interpreter input
• Don't make assumptions in the wording (e.g. "This might be familiar")
• Define "cookiebox" in iterator_p1 (perhaps by renaming x cookie box)
• For pipeline_p2, list functions for people to try pipelines on
• Home page not menu, but rather gives a description of Coconut and link to the menu page
• Give direction to user on the home page so they know where they're going (e.g. "to start click next," "look in the side nav for tutorial")
• Try rewriting iterator_p1 without a list iterator so that we won't get error
• Don't close side nav when going to a new page
• Page transition smoother so page reload is undetectable
• In-line code snippets
• Load previous code into next page's interpreter

suggestions

• pipe operators have documentation on the tutorial, but it doesn't feel like there should be documentation, maybe use a different code block to denote (distinction between what to read/type in the interpereter)
• recursive factorial intro, maybe explain why show the final product? Notice something interesting.

As a developer, I need to have a set number of things to respond to and look out for as I go through the tutorial so that my group can easy reconcile all of our opinions.

As a group member, I need to know which section to work towards revising.

See if there's a better way to deal with how code is formatted and highlighted in html (add a background to the code snippets section)

Input:
x = iter(["chocolate chip", "oatmeal raisin", "sugar"])
x.next()

Output:
AttributeError: 'list_iterator' object has no attribute 'next'

We get the same error with generators (AttributeError: 'generator' object has no attribute 'next')

Create html pages for this section of the tutorial: add the content, link the pages together with the next and previous buttons, add link to the pages in the side navigation and front-page menu, etc.

Right now the sidenav is only moving content over if it has been split into the right and left sections. On the section title pages, when the page is not split, that is not working.

• Main content and side nav icon doesn't move
• Go to Iterator title page
• Click on side navigation icon
• Code snippet indentation level
• Repro steps: check all code snippets
• Additional comments: We want indentation to be 4 spaces
• Code snippet colors clashes with background color; make background plain, to do that make editor and output white, make background of text the background color of the editor
• Text color in side nav the same as the background color of the editor
• Next links on final section pages should go to next section; maybe pro
• Font-weight on Next and Previous buttons to light, hard to read
• Make tutorial solutions hidden
• On each tutorial interpreter page, have a brief introduction to what the page wants to accomplish
• "rather than add-ons.," typo
• The Interpreter is called "Coconut Editor", but in the tutorial content we refer to the interpreter
• Button that pastes sample code into interpreter input
• Don't make assumptions in the wording (e.g. "This might be familiar")
• Define "cookiebox" in iterator_p1 (perhaps by renaming x cookie box)
• For pipeline_p2, list functions for people to try pipelines on
• Home page not menu, but rather gives a description of Coconut and link to the menu page
• Give direction to user on the home page so they know where they're going (e.g. "to start click next," "look in the side nav for tutorial")
• Try rewriting iterator_p1 without a list iterator so that we won't get error
• Don't close side nav when going to a new page
• Page transition smoother so page reload is undetectable
• In-line code snippets
• Load previous code into next page's interpreter
• suggestions
• pipe operators have documentation on the tutorial, but it doesn't feel like there should be documentation, maybe use a different code block to denote (distinction between what to read/type in the interpereter)
• recursive factorial intro, maybe explain why show the final product? Notice something interesting.

Create html pages for this section of the tutorial: add the content, link the pages together with the next and previous buttons, add link to the pages in the side navigation and front-page menu, etc.