learningequality / ka-lite

KA Lite: lightweight web server for serving core Khan Academy content (videos and exercises) without needing internet connectivity
https://learningequality.org/ka-lite/
Other
458 stars 305 forks source link

Place in topic tree not clear to end user during navigation #2486

Closed rtibbles closed 9 years ago

rtibbles commented 9 years ago

Issue raised by @noemigerber.

Give teachers a way to see their position in the topic tree, as a whole, rather than just their local place, as seen here: image

@66eli77 @jtamiace flagging you guys to get some design chops in here.

jamalex commented 9 years ago

Old app for reference: http://www.connactnow.org/teaching/tool/index.html

66eli77 commented 9 years ago

this is my attempt to visualize Richard's idea he talked about this morning topic_bar_ui_1

66eli77 commented 9 years ago

another one topic_bar_ui_2

noemigerber commented 9 years ago

Thanks for preparing these visualisations so quickly, @66eli77! If I understood correctly yesterday, the second is an example of the breadcrumb trail, right? It is useful to see an example of it, and it is useful to see one's exact location in the topic tree this way. I still wonder though if teachers would benefit more from seeing the topic tree more explicitly. The first example (with the 'tabs' of the various options down the side of the list of resources) is nice in that it gives more of an overview of what the other folder options on that level of the topic tree are. This is only showing one level of the topic tree though (and then the content within this) - would it be possible to show two levels? (e.g. Primary level, and subject?) This may take up more space, and it would be useful to see an example. I believe @jamalex described yet another option towards the end of the call yesterday, though I'm not sure anymore what exactly this was. Would it be possible to see an example of that too?

jamalex commented 9 years ago

Hi @noemigerber! I may have been mentioning the "knowledge map" feature of KA Lite, which you can see here: http://demo.learningequality.org/exercisedashboard/

While it's not feasible to implement this for Connect.Teaching for this phase of development, we're interested in enabling custom knowledge maps in the future.

66eli77 commented 9 years ago

Hi @noemigerber, this is the new sidebar mockup with maximum three levels unfolding. This will work best if your file structure wasn't too deep. topic_bar_ui_4-1 topic_bar_ui_4-2 topic_bar_ui_4-3

noemigerber commented 9 years ago

Hi @jamalex, ah yes, now I remember that you mentioned this as a (in the far) future option. And seeing it, I understand why. ;) It looks very interesting and impressive! Thanks again for the quick new mockup, @66eli77, it's nice to see! Yes, I've tried to make sure that our content hierarchy has as few layers as possible, so the max it has is 3. There are only 2 'top-level' folders ("Professional development" and "Teaching and learning material"), so if that would be displayed on another screen, then the sidebar could even just have 2 levels. So, what would happen if you would open a document or video from this unfolded sidebar? Would the sidebar then partially or fully disappear? If so, if you would press the 'back' button, would you return to the unfolded sidebar as you last left it? Also, is it a problem if not all levels have the same number of sub-levels? I.e., under "Teaching and Learning materials", there are the following folders and sub-folders: -P1-5 --Maths --English --... -P6-8 --Maths --English --... -Teaching and learning aids (for a full content hierarchy, see the 'tablet content hierarchy' doc on Google Docs - though I will likely send a small edit asap!)

So, the "P1-5" folder and the "P6-8" folder each have several sub-folders, but the "teaching and learning aids" folder does not have any sub-folders. Does this pose any technical problems? Or does this simply mean that there would be one less level that will be unfolded before teachers see the resources in that folder? Please let me know if any of this is not clear!

noemigerber commented 9 years ago

Hi all, I have another question: What information about the individual resources will be displayed? In the mock-ups above, an icon is shown for what type of resource it is, and the title is displayed. Would it be possible to show other information, such as the description, the organisation, the language, or other metadata that might be useful? I'm curious about what the options might be.

Also, would it be possible for you to share the icon you use for videos with me somehow? It would be great to use the same icon in the teacher training modules, so teachers know what icon to look for when they are asked to watch a video. If it's not possible to share it, I'll try to re-create it somehow.

noemigerber commented 9 years ago

PS: Related to showing more information - would it be possible for the last unfolding bar (i.e. the one at the very right) to be wider than it is now, to show more info? Or is there a reason it is as narrow as the others?

rtibbles commented 9 years ago

Hi @noemigerber - the content can have as many (or as few) sublevels as you like. The topic tree will expand out to show more sublevels when they are present, but otherwise will simply not display any more. In the case that you did want to create an incredibly deep topic tree, we will probably limit to displaying 2 or 3 panes of topic data at once, so as not to overwhelm the user with too much content.

We could include the additional information in the navigation bar, but the concern is about making it too cluttered. One of the disadvantages of tablets is the lack of a 'hover' function which would allow us to show extra information as a preview before someone committed to clicking. Happy to brainstorm what will be most useful for end users.

The icons for each of the content types are in this folder: https://drive.google.com/folderview?id=0B5Yden0CvWYHZlhldG9LTm5zX1k&usp=sharing

We could make the final bar displayed larger to show more information, my main concern always being putting too much on the screen at once and creating info clutter for the end user. We can continue to iterate on this as we get more of the research results from UNICEF and UPortal as well.

noemigerber commented 9 years ago

Hi @rtibbles, thanks for the icons, they're very useful! Yes, good point about making sure the view is not too cluttered - and shame that there is not 'hover' function. Yes, I'm also curious to find out more from UNICEF's experience, especially with the UPortal, about what is most useful to the end user. Looking forward to brainstorming about this more too!

rtibbles commented 9 years ago

Flagging @adphuong to contribute to the discussion too!

66eli77 commented 9 years ago

Hi @noemigerber, thank you for your feedback, based on that, we designed a new sidebar UI that allows the user to see more detail but still be able to mange the cluttering problem topic_bar_ui_9

noemigerber commented 9 years ago

FYI, I updated the tablet content hierarchy - see my note in discussion #2397!

noemigerber commented 9 years ago

Also, thanks @66eli77 for the quick new suggestion - it's a nice idea to make the extra information collapse. This doesn't show the description of the resource, though, and I think the description would be one of the most useful types of metadata to show. My concern is especially for resources that have very similar titles, which will be very difficult to distinguish between without a description. (This relates to both the collapsing details, and the current absence of the description in the details).

We have 2 types of resources in particular that have very similar titles. These are both from EDC (Education Development Center), and are called: The Learning Village, and RABEA (radio-based education for all). 'The Learning Village' is a set of 480 half-hour radio programmes for P1-P4 (120 lessons per grade) - and each programme is accompanied by a lesson plan (PDF). RABEA is a set of 240 half-hour lessons (for beginner, intermediate and advanced level users). Not all of these files are (or will be) on the tablet, but there are already many on the tablet, and we will keep most of them, as they are excellent resources tailored to South Sudan. Below is a screenshot of some of these files on the current tablet - as you can see the titles are very similar, and only thanks to the description can you know what each contains. So, especially for these resources, it will be necessary to see the description immediately, otherwise users will not know which of the many files is most relevant to them. This makes the option of collapsing the info less useful, unfortunately, since it would be quite tedious to click through a long list of 'Learning Village' files to find the one with the right content for the user. What suggestions would you have for this issue? And what would a display look like that would include a description?

screenshot_2014-10-17-22-04-03

rtibbles commented 9 years ago

I think my suggestion would be to make the extra information flexible. Display a description if there is one, if not, fall back to other meta data.

@adphuong came up with another design that might also be more suited to displaying the description.

66eli77 commented 9 years ago

I think this the 'another design' @rtibbles refer to topic_bar_ui_8

66eli77 commented 9 years ago

this might be a better solution then my previous mockup, showing part of the description for each entry so user can have a better idea about the content. Once they click on one of the entry, the sidebar will slide aside and the content will show up on the white space along with all the metadata and full description. topic_bar_ui_14

noemigerber commented 9 years ago

Hi @66eli77 and all, many thanks for this, and sorry for my silence. It was good to see the demo today as well! (which looks very similar or the same as the last mockup that Eli sent, correct?) I just had 2 questions: It's very useful to see the title, description and icon for each resource. Is it also possible to add the organisation (source/author) for each resource? It would be very useful to see this too. All content providers have asked to be given credit, and clearly displaying their name with the resource details would be very helpful for this purpose. The other question is related to the 'topics' button - on the call last week we discussed adding an icon of some sort to more visually show what the button stands for. @rtibbles had some suggestions on this. Could we explore some of those suggestions?

noemigerber commented 9 years ago

Hi all! I also just thought of something I've not thought of at all so far: What will the 'welcome' (i.e. first) screen look like? The current app has a welcome screen with some logos as well - would it be possible to add the logos of the content providers somewhere for this software too? If so, where would you suggest that this best be placed?

noemigerber commented 9 years ago

Hi all! Another question about the demo: I noticed that not everything is in alphabetical order - this is true for the topics in the sidebar nav (e.g. under "teaching and learning material", P3, P4 etc. are not in order), as well as for the order of the resources in the most right-hand navigation bar. I just wanted to check that these will be in alphabetical order eventually? (we had discussed this a while ago in this discussion: #2397, so I suppose it's still planned?)

rtibbles commented 9 years ago

Thanks for pointing this out! I will have to check that the import script is properly ordering things.

noemigerber commented 9 years ago

Hi @66eli77, I have 2 questions. During the call on Tuesday we spoke about the possibility of making the last (i.e. most right-hand) column in the sidebar wider, so that perhaps more individual content items would be visible in the list. Would it be possible to see a mock-up of this? Also, can we see a mock-up of a sidebar that includes the 'organisation' metadata (i.e. the name of the organisation) along with the title and description of each content item? We at War Child have discussed the possibility of only including this information once the user opens a content item (a suggestion that was made on the call on Tuesday), but we still prefer including the information with the content item titles and descriptions in the content list. This would be useful since we are working with content from a number of sources/organisations. Many thanks!

66eli77 commented 9 years ago

Hi @noemigerber Yeah, we can definitely add the org info. below is the mock-up with org info showing only inside the wider last column(width changed from 300px to 400px) screen shot 2014-10-30 at 6 43 04 pm

noemigerber commented 9 years ago

Thanks for this mock-up, @66eli77! The wider last column looks good (there are so many more resources visible in the list now!), as does adding the org info. The org info isn't showing for all resources (that have metadata) though - is this because it's a mock-up, or does it have to do with the length of the descriptions? (since it seems that only resources with descriptions that are 2 lines long do not have the org info displayed)

66eli77 commented 9 years ago

Hi @noemigerber I notice the content metadata you sent to us does not have org info for every content. So the idea is to only show the org info when it's available. Sorry for the confusion about the length of the descriptions, it's a coincident. The last column will show full description and the org info as long as it's available.

noemigerber commented 9 years ago

Hi @66eli77, aha, thanks for the clarification! That sounds good! I'm surprised though to hear that not all metadata that I sent has org info, as I have been including it everywhere, as far as I can remember. Do you remember which items you checked that are missing the info? Or do you have a quick way of checking where the info is missing? I would have to open each item individually using http://www.jsoneditoronline.org/ to see whether or not it has the org info.