build3 / lsoa Goto Github PK

Just need to bootstrapify this one

"Enhancement: Constructs should show up in the Observation interface in increasing order from left to right (and if they happen to span two topic areas (e.g., Length and Volume) then the order of these in the construct map should determine order of the "tags" in the Obs interface"

Probably just need to give these alphabetical sort order in the Django model...

It needs to be moved to use Bootstrap 4 classes instead of F7 classes

"Auto-grouping. The Grouping-maker is very good. Rich is wanting the teachers to see the auto grouper ("give me random groups of 3", which makes 3-somes with 4-somes with remainders) - and see that they can do this easily and then adjust to avoid bad pairings (these 2 kids can't work together)."

Single-page dashboard view, where teachers can:

• immediately take a picture or video to associate with the capture
• write freeform notes
• select "learning constructs", which are similar to checkboxes (toggleable, multi-select). These "constructs" are the standards-like vocabulary that the project uses to help teachers identify and describe students' ways of thinking. The interface should provide a way to tag an observation with one or more construct levels (the little button things in the proof of concept), as well as to see a more complete description of the levels as a reference, in some natural way (maybe a little "i" or "?" icon). FYI: The constructs are actually BETWEEN ways of thinking & standards (they're ways of understanding curricular ideas).
• select a student, multiple students, or pre-set groups of students that the observation corresponds to
• maybe a "previous observation" button to edit (or delete) the immediately previous observation in case the user made a mistake

Add a float left fa-star or something for the start chart at the bottom of the observation screen

"SECURE SERVER. I'm not sure whether the current app is stored in a way that complies with our IRB, but as soon as teachers are using it to take pictures and video of students, we have to have it secure"

"Title. We fought about whether this would be required, and we think NO. But as we have visualizations (like the star chart), it will be important to have the option for more memorable names… [LOWER PRIORITY]"

This will need to be added to the Observation model, the ObservationForm form, and to the UI itself.

When you click on "use previous observation", load in either the previous video or the previous ORIGINAL image onto the frame (so you could re-annotate it)

1. Each observation has a many to many relationship with both groups and students
2. Each observation may have one or more pieces of media attached to it (audio, picture, video)
3. Each observation may be tagged with any number of constructs
4. Observations can be flagged as "needing further processing" to gently nudge teacher to review the note later to elaborate
5. Each observation would have one text field for "collection notes" (notes taken during the observation/collection phase) and another text field for "processing notes" (notes taken during post-class processing), as well as the time that both are filled out/edited

"Fix the dots on the carousel that shows the examples of learning constructs"

"BUG/ UI inconsistency. Between Chrome and Safari. In Chrome, the Learning Construct examples div has a border, in Safari not."

Could we use a hidden checkbox and just make that button change colors or something to indicate whether or not it's selected?

It no longer fits on a single page in my Chrome DevTools' iPad size. I just want to make sure on the real thing it actually fits. We can test with Safari in the iOS emulator in XCode or with a real iPad

Using the Django admin interface, as well as built-in Django group permissions (and likely a framework like django-guardian for object-level ownership), allow:

• Administrators can manage teachers (a user type), classes, groups, students
• Teachers can manage their own classes, groups, students
• All changes/past historical items are logged (via a "changes" table, indicating past/new values, time of change, and who made the change - probably use django-reversion for that)

After a teacher logs in, there's a need to SET UP the Observation interface – the teacher needs to choose the class they're working with, and narrow the CONSTRUCT levels to a manageable set that is relevant for the kinds of artifacts they're expecting to see in this session. They may also want to choose an existing set of groups (imagine their desks are moved around the classroom into sets of 4-5 like tables) or make the student-selection pane a non-grouped version.

This recently broke - did you change it to use select2 or something?

"The drag and drop UI exists for creating new groupings, and actually will work already with editing, but there is no place to click "Edit" on a group right now."

I think this just means that the group editor needs to use a Django Form under the hood so that you can provide it with an initial kwarg value. That way you can edit existing groups just as easily as you can make new ones.

"BUG: Try the following sequence. Take a photo. Enable drawing. Draw. Reset the media space. Take a photo. Then, the buttons will be in a state that suggests drawing is enabled, but drawing will not work until you press "clear drawing" (which might just actually be performing the WORK of "enable drawing")"

"Enhancement: If you choose to set up groupings / students during the setup sequence you should return to the setup screen with your prior choices showing (this may be corrected when we have memory of your "last choice" on this screen)."

"On the grouping maker – leaving some margin on the right & left will avoid accidental gestures that might switch the current app on an iPad"

"It's important to be able to get back to the observation screen when you've gone to the star chart."

"Bug. when running on a computer that is NOT emulating an iPad- where most everything works, but selecting constructs from the "palette" in the observation-collection screen does not work."

"Enhancement: RE: video notes - When a video note is added, it displaces the construct definition listing (shoving it off the screen to the bottom). I would prefer it if the text notes area became smaller to compensate for the video's size. That area already scrolls nicely, so it would work, i think."

I think this also was a WebRTC-era bug and can be closed, but adding here for tracking just in case.

"BUG: When selecting grouping, "Individuals" always ends up selected first, however it doesn't appear selected to the end user (if you select a different group, then select Individuals, it shows up)"

I think this might be a consequence of the select2 widget?

For example, "whole class discussion" is a good context tag. Right now, this turns into 3 tags because a space is a delimiter. The solution of using underscores or even dashes is non-optimal because these aren't on the ipad front keyboard.

This issue would lower in importance if context tags could ONLY be added on a separate screen (and the setup screen was just selecting among existing controlled-vocabulary tags).

"It's important to be able to go back to the setup screen to adjust something (e.g., the constructs on the palette, if you found a level that you'd forgotten to include; or e.g,. The date, if you realize you're going to do stuff that is from other days)."

I think these should also be selectable on the observation page as things you can tag an observation with. Right now if you pick a bunch of tags in the setup screen, they are applied to all of your observations. I think this should be toggle-able just like the learning construct sublevels are. Right now the tags aren't even visible on the screen on the observation page.

"students and name collisions. We had some ideas about how to avoid this and to make it sensible to the teachers who are dealing with multiple Joe Smiths in and trying to figure out which is theirs… But would also love to have your thinking…"

"Edit last observation. - this doesn't work in the current app – I told them it was a placeholder for a future edit-observation screen. This is where the TITLE thing came up – maybe it's most common that people add that there. And maybe that screen should also be where we go from the Star Chart when you select an observation."

They currently show up as tool tips on mouseover in the Computer interface (if you have a mouse). This doesn't work on iPad since you can't "mouse over" anything.

Original Ask: "A suggested addition to the Construct browser on the Setup Screen. This was a hit, btw. (I should say, in case I don't write an intro here, that the WHOLE DEMO had great "hits") But Rich is worried that teachers will need access to the examples even here. There was an idea of making a way to see the example as a further LEVEL of unpacking (selective view) even though selection of the checkbox is still at the sub level level – So examples would hide-show below the selectable level, and be just for getting more information. (Not sure if this is clear…)"

Graphs and charts related to the tagged/categorized data collection. See wireframes/mockups

"BUG: on coming to the context hierarchy right after login, the accordion is not mouse-able. Per email, there is an error in the JavaScript Console that seems like it might be the culprit. If you hit "SUBMIT" then you are told you need Constructs, and the accordion becomes active to the mouse. NOTE: for debugging it could help to know that the Context Tags entry is also not working in the first visit, but it too begins to work after the initial submission fails."

The UI should allow creating groups of size 2, 3, 4, 5 (that's probably enough). Roster is then divided randomly into groups of this size, with extras creating groups of size 1 more. Then the grouping should be manually editable with the same interface that the current all-manual grouping maker uses.

"Interface for administrators to upload CSV of roster of classes"

Background for Julie:

Imagine that multiple teachers are using this application and most of the time, they are teaching their own class, but sometimes they will teach another teacher's class. That's the gist of the login-to-course-selection flow.

As teachers are on-boarding, they (or an administrator) will have CSVs (or probably more likely Excel files, but if it can only be CSV that's probably fine) of their class rosters. Right now I have Student, Course, and CourseStudent (autogenerated) as the data model, where Courses have names and Students have first_name, last_name, and nickname. See #25 for why we probably need to add some additional fields to this. On one hand, we can add all kinds of student information here, but on the other hand ideally we'd have the Principle of Least Data here (https://www.linkedin.com/pulse/principle-least-data-mark-nunnikhoven/). Ultimately we probably do need something to deduplicate. Maybe consider adding grade_level to both Course and Student, as well as maybe external_id to Student, so that the school can load some kind of student id in that field?

All in all I think we can solve a couple of problems here - I think we can solve the multi-year issue by only showing students in a class where student.grade == course.grade, and I think we can solve the duplicate student issue via the external_id field. If that sounds like a fair solution, then I think making those modifications to some of these queries as well as adding a new top navbar item to Create New Course would be super helpful, where, aside from other form elements, it uses django-import-export to load in a CSV file, add students that don't exist yet, add the course itself, then add the students to the course.

"Enhancement: When video media are captured (at least, on my ipad), they PLAY. If it is possible to not auto-run/auto-play them after capture, that would be great. This applies both to the main observation and to the Video note."

This might have been a holdover from the old webRTC UI... investigate.

Move the check boxes a bit further in from the edge in the construct hierarchy selection. This isnt just for aesthetics - it seems harder to select when there is less margin to the left of the checkbox.

"when you go BACK to the setup screen, your Learning Construct Levels and your Context Tags are lost"

By adding the Navbar to the Observation Screen, I can get rid of the bottom floating buttons on the left + Add a "Current Class" button to the top navbar IF the request.session['observation'] is set to true (or something similar).

"Potentially change the Notes to be a "drawer" so that it's really just a button that slides the note entry view out from the middle so you can still replay the video/see the picture and see the learning constructs selected"

"Date. This should probably be up on the front screen rather than in the observation app. It could default to the current date, but it should be editable (as people will, we think, take pictures from their phone of physical artifacts that might have been from a while ago)."

"Making it clear when something has been submitted (like a status bubble to know that a thing is being uploaded, success, etc.) Right now, you just have faith"

Can probably use the Django messages framework to do this. I've often used toastr to get these to work as floating alerts without having to fiddle with making them fit in the layout

"UI Wise, it is common to want to have a space in one's tag, and this now makes a new tag. I think ideally spaces would be allowed, with RETUN making a new one."

"A suggested addition to the Construct browser on the Setup Screen. This was a hit, btw. (I should say, in case I don't write an intro here, that the WHOLE DEMO had great "hits") But Rich is worried that teachers will need access to the examples even here. There was an idea of making a way to see the example as a further LEVEL of unpacking (selective view) even though selection of the checkbox is still at the sub level level – So examples would hide-show below the selectable level, and be just for getting more information. (Not sure if this is clear…)"

I think we could do this via like an AJAX modal? What do you think @androbwebb ?

"BUG/ADJUSTMENT REQUEST. For UI/UX, it's probably better to have a bit more space between the construct selection buttons and the video capture button row. They are immediately on top of each other now."

"Requiring things to be part of an observation. I think the team was unified in wanting at least 1 student to be selected, and at least one Construct level button selected"

Because "Submit" and "Use Last Sample" are both types of submissions, we may want to opt out of using Django Form Fields' required attribute here. However, if the "Use Last Sample" button behavior can be accomplished without the form submission flow getting all the way to form.valid or form.clean, then maybe we can actually use the native Django Form validation/required fields.

Right now you can just make observations without students or without selecting learning constructs. It's not the end of the world, so I'm marking it as low-priority.

" A BIG AREA of work – viewing and visualizing existing observations in different filters/configurations, etc. I think the group got a clear sense that flexibly visualizing and analyzing the set of collected observations was where a huge amount of the payoff was. (Hooray!) So this is a giant area for specifications & envisioning screens"
I think we should figure out what this means via a discussion first, then prototype a couple ways to look at them

See Corey's comment below on the "dot plot". I imagine that this will be similar to the star chart today, where you can select a start date/end date and a course from dropdowns at the top, which cause the page to reload and the graph to re-render.

"Data Marking wise, it is ideal for this to be a pretty CONTROLLED VOCABULARY – the team was thinking, for this reason, that it might be better to make adding a tag a bit harder to do (like adding a grouping maybe). So that on the main screen you're just choosing between existing tags or choosing to go to a screen where tag-invention can happen."

Maybe like GitHub labels? You can assign labels to issues but to manage your labels you go to a separate screen (and there you get to color code them, which could be a cool easy feature to add as well?)